:root{font-family:IBM Plex Sans,sans-serif;color:#101923;background:#f6f7f5}*{box-sizing:border-box}body{margin:0}.app{display:grid;grid-template-columns:360px 1fr;min-height:100vh}.sidebar{background:#fff;border-right:1px solid #e5e7e4;padding:28px 30px;display:flex;flex-direction:column;gap:18px}.workspace{min-width:0;display:flex;flex-direction:column;padding:28px 48px}.brand{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:700;letter-spacing:.12em;border-bottom:1px solid #eceeeb;padding-bottom:24px}.brand small{display:block;color:#a1a8a5;font:10px IBM Plex Sans,sans-serif;letter-spacing:.1em;margin-top:2px}.brand-mark,.logo-dot{display:grid;place-items:center;background:#101923;color:#fff;border-radius:50%;font-weight:700}.brand-mark{width:28px;height:28px}.site-logo{display:block;width:166px;height:61px;object-fit:contain;object-position:left center}.side-head{display:flex;align-items:start;justify-content:space-between;padding:8px 0 12px}.kicker,.field label,.format,.save{font:10px IBM Plex Sans,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#858e8b}.side-head h1{font-size:30px;letter-spacing:-.06em;margin:6px 0 0}.save{color:#42a879;background:#ebf8f0;padding:6px 8px;border-radius:20px}.field{display:flex;flex-direction:column;gap:8px}.field label{color:#65706c}.field input,.field textarea{font:14px IBM Plex Sans,sans-serif;border:1px solid #dfe4e1;border-radius:5px;padding:10px;background:#fbfcfb;resize:vertical;outline:none}.field input:focus,.field textarea:focus{border-color:#899c95}.setting-line{display:flex;align-items:center;justify-content:space-between}.switch{width:34px;height:20px;padding:0;border:0;border-radius:20px;background:#d5dbd7;position:relative;cursor:pointer}.switch:after{content:"";position:absolute;width:14px;height:14px;left:3px;top:3px;border-radius:50%;background:#fff;transition:.2s}.switch.on{background:#101923}.switch.on:after{transform:translate(14px)}.hidden{display:none!important}.choices{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.choice{font:11px IBM Plex Sans,sans-serif;background:#fff;border:1px solid #e2e6e3;border-radius:5px;padding:8px 4px;color:#65706c}.choice.active{border-color:#101923;color:#101923;box-shadow:inset 0 0 0 1px #101923}.preview{display:block;width:30px;height:30px;margin:0 auto 6px;background:#d8ddda;border-radius:3px}.split-i{background:linear-gradient(90deg,#747c79 50%,#d8ddda 50%)}.top-i{background:linear-gradient(#747c79 55%,#d8ddda 55%)}.min-i{background:linear-gradient(135deg,#747c79 50%,#d8ddda 50%)}.swatches{display:flex;flex-wrap:wrap;gap:9px}.swatch{width:25px;height:25px;border-radius:50%;background:var(--swatch);border:2px solid #fff;box-shadow:0 0 0 1px #dfe4e1;cursor:pointer;flex:0 0 25px}.swatch.selected{box-shadow:0 0 0 2px #101923}.photos{display:flex;flex-wrap:wrap;gap:8px}.photo{width:50px;height:50px;border:0;border-radius:5px;background-size:cover;background-position:center;cursor:pointer;opacity:.7;flex:0 0 50px}.photo.selected{outline:2px solid #101923;outline-offset:2px;opacity:1}.upload{display:grid;place-items:center;background:#f2f4f2;border:1px dashed #b9c1bd;color:#74807b;font-size:22px}.upload input{display:none}.logo-choices{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.logo-choice{height:42px;background:#fff;border:1px solid #e2e6e3;border-radius:5px;padding:5px;cursor:pointer}.logo-choice img{width:100%;height:100%;object-fit:contain}.logo-choice.selected{border-color:#101923;box-shadow:inset 0 0 0 1px #101923}.logo-size{display:flex;gap:6px}.logo-size-choice{flex:1;padding:7px 4px;border:1px solid #e2e6e3;border-radius:5px;background:#fff;color:#65706c;font:11px IBM Plex Sans,sans-serif;cursor:pointer}.logo-size-choice.active{border-color:#101923;color:#101923;box-shadow:inset 0 0 0 1px #101923}.color-picker{display:flex;align-items:center;gap:9px;border:1px solid #dfe4e1;border-radius:5px;padding:6px 9px;color:#65706c;font:12px IBM Plex Sans,sans-serif;cursor:pointer}.color-picker input{width:26px;height:26px;padding:0;border:0;background:transparent;cursor:pointer}.color-picker b{margin-left:auto;font:10px IBM Plex Sans,sans-serif;font-weight:400}.action-button{display:flex;align-items:center;justify-content:center;gap:6px;height:40px;border-radius:5px;font:500 13px IBM Plex Sans,sans-serif;cursor:pointer}.secondary{background:#fff;border:1px solid #d9dfdb;color:#101923}.primary{border:0;background:#101923;color:#fff}.workspace-toolbar{display:flex;align-items:center;justify-content:space-between;gap:24px;width:100%}#download,#trim{padding:0 24px;white-space:nowrap}#trim{flex:0 0 auto}.workspace header{display:flex;justify-content:space-between;color:#65706c;font-size:13px}.status-dot{display:inline-block;background:#42a879;width:7px;height:7px;border-radius:50%;margin-right:7px}.format span{padding:0 6px;color:#c1c7c4}.format-switcher{display:flex;justify-content:flex-start}.format-switcher>div{display:flex;gap:7px}.format-choice{display:flex;flex-direction:column;justify-content:center;gap:0;height:40px;min-width:92px;padding:3px 14px;border:1px solid #dfe4e1;border-radius:5px;background:#fff;color:#65706c;cursor:pointer}.format-choice strong{font:500 12px IBM Plex Sans,sans-serif}.format-choice small{font:10px IBM Plex Sans,sans-serif}.format-choice.active{border-color:#101923;color:#101923;box-shadow:inset 0 0 0 1px #101923}.canvas-wrap{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:24px 30px 16px}.post{width:min(70vw,540px);aspect-ratio:4 / 5;background:var(--theme);position:relative;overflow:hidden;display:grid;box-shadow:0 20px 60px #10192314}.post-photo{background-size:cover;background-position:center}.post-copy{padding:38px;display:flex;flex-direction:column}.post-eyebrow{font:11px IBM Plex Sans,sans-serif;letter-spacing:.1em;margin:0 0 auto;color:#87908d}.post-title{font:500 clamp(32px,4.6vw,60px) / .98 "IBM Plex Sans",sans-serif;letter-spacing:-.06em;max-width:470px;margin:0;color:#fff}.post-footer{display:flex;align-items:center;gap:9px;margin-top:38px;color:#fff;font:11px IBM Plex Sans,sans-serif}.logo-dot{width:24px;height:24px}.post-no{margin-left:auto;opacity:.6}.post:not(.split) .post-title,.post:not(.split) .post-footer,.post:not(.split) .post-eyebrow{color:#101923}.post.top{grid-template-rows:48% 52%}.post.top .post-copy{padding:34px 42px}.post.minimal{grid-template-rows:42% 58%;background:#fff}.post.minimal .post-copy{padding:35px 42px}.post.minimal .post-title{font-family:IBM Plex Sans,sans-serif;font-weight:500}.post .post-title,.post .post-eyebrow,.post .post-footer{color:var(--ink)!important}.post .logo-dot{background:var(--ink);color:var(--theme)}.post .logo-dot img{width:18px;height:18px;object-fit:contain}.post-logo{width:min(120px,42%);height:30px;object-fit:contain;object-position:left center;margin-bottom:auto}.post-logo.small{width:min(90px,35%);height:24px}.post-logo.large{width:min(150px,42%);height:34px}.post.minimal .post-logo{filter:none}.post-body{margin:16px 0 0;max-width:470px;font:400 clamp(16px,2vw,24px) / 1.2 "IBM Plex Sans",sans-serif;letter-spacing:-.02em}.post-disclaimer{margin:24px 0 0;max-width:470px;font:10px/1.35 IBM Plex Sans,sans-serif;letter-spacing:.04em;opacity:.7}.post .post-body,.post .post-disclaimer{color:var(--ink)!important}.app,.app input,.app textarea,.app button,.kicker,.field label,.format,.save,.post-eyebrow,.post-footer,.hint{font-family:IBM Plex Sans,sans-serif}.material-symbols-outlined{display:inline-block;font-family:Material Symbols Outlined;font-style:normal;font-weight:400;font-size:18px;line-height:1;letter-spacing:normal;text-transform:none;white-space:nowrap;word-wrap:normal;direction:ltr;font-feature-settings:"liga";-webkit-font-feature-settings:"liga";-webkit-font-smoothing:antialiased;vertical-align:middle}.action-button .material-symbols-outlined{flex:0 0 auto}.upload .material-symbols-outlined{font-size:22px}.post .post-title{font-size:clamp(28px,3.8vw,48px)}.hint{text-align:center;color:#a4aca8;font:11px IBM Plex Sans,sans-serif;letter-spacing:.05em}@media(max-width:850px){.app{grid-template-columns:1fr}.sidebar{border-right:0;border-bottom:1px solid #e5e7e4}.workspace{padding:24px}.canvas-wrap{padding:25px 0}.post{width:min(88vw,520px)}}@media(max-width:600px){.workspace-toolbar{align-items:stretch;flex-wrap:wrap;gap:10px}.format-switcher{align-items:center;width:100%}.format-switcher>div{width:100%}.format-choice{flex:1;min-width:0;padding:3px 6px}#download{margin-left:auto}}
