@import url("https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap");
*,*::before,*::after{box-sizing:border-box}
:root{--bg:#0c0c0e;--panel:#121214;--raised:#1a1a1d;--line:#2a2a2e;--ink:#f3f0ea;--muted:#969398;--blue:#8da2ff;--blue-bright:#a9b7ff;--blue-soft:rgba(141,162,255,.14);--header:62px;--rail:76px;--panel-w:290px}
html,body{margin:0;width:100%;height:100%;overflow:hidden}body{background:var(--bg);color:var(--ink);font:13px/1.45 Manrope,system-ui,sans-serif}button,input,select{font:inherit;color:inherit}button{border:0}.app-shell{height:100%;display:flex;flex-direction:column}
.topbar{height:var(--header);min-height:var(--header);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 16px 0 18px;background:#101012;border-bottom:1px solid var(--line);z-index:20}.brand{display:inline-flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;width:max-content;font-size:15px;font-weight:700}.brand b{color:var(--muted);font-weight:500}.wcu-wink{width:27px;height:27px;border:1px solid var(--blue);border-radius:50%;position:relative;display:block;transform:rotate(-4deg)}.wcu-wink i{position:absolute;width:8px;height:4px;border-top:1px solid var(--blue);border-radius:50%;left:6px;top:7px;transform:rotate(15deg)}.wcu-wink::after{content:"";position:absolute;width:3px;height:3px;background:var(--blue);border-radius:50%;right:6px;top:7px}.wcu-wink b{position:absolute;left:10px;top:9px;color:var(--blue);font:500 10px/1 "DM Mono",monospace}.project-title-wrap{display:flex;align-items:center;gap:8px}.save-state{width:7px;height:7px;border-radius:50%;background:#73e0a2}.save-state.dirty{background:#ffc46b}.project-name{width:210px;text-align:center;border:1px solid transparent;border-radius:6px;background:transparent;padding:6px;font-weight:600}.project-name:focus,.project-name:hover{outline:0;border-color:var(--line);background:var(--raised)}.top-actions{justify-self:end;display:flex;gap:7px}.button{height:34px;border:1px solid #3a3a3f;border-radius:7px;background:#202023;padding:0 12px;cursor:pointer;font-size:11px;font-weight:600}.button:hover{background:#29292d}.button.primary{color:#0c1020;background:var(--blue);border-color:var(--blue)}.button.primary:hover{background:var(--blue-bright)}.button:disabled{opacity:.35;cursor:default}
.workspace{display:grid;grid-template-columns:var(--rail) var(--panel-w) minmax(0,1fr);min-height:0;flex:1}.rail{background:#0f0f11;border-right:1px solid var(--line);padding:8px 6px;display:flex;flex-direction:column;gap:5px}.rail-button{height:61px;border-radius:7px;background:transparent;color:var(--muted);cursor:pointer;font-size:9px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px}.rail-button span{font:500 18px/1 "DM Mono",monospace}.rail-button:hover,.rail-button.active{color:var(--ink);background:var(--raised)}.rail-button.active span{color:var(--blue)}.panel{background:#141416;border-right:1px solid var(--line);overflow:auto;padding:20px 16px}.panel-section{display:none}.panel-section.active{display:block}.eyebrow{margin:0;color:var(--blue);font:500 9px "DM Mono",monospace;text-transform:uppercase;letter-spacing:.15em}.panel h2{margin:5px 0 18px;font-size:24px;letter-spacing:-.04em}.size-row select{width:100%;height:36px;border:1px solid var(--line);border-radius:6px;background:#0d0d0f;padding:0 8px;font-size:11px}.template-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:16px}.template-card{background:transparent;color:var(--muted);text-align:left;cursor:pointer;padding:0}.template-card i{height:112px;display:grid;place-items:center;border:1px solid var(--line);border-radius:5px;background:white;overflow:hidden}.template-card span{display:block;margin-top:5px;font-size:10px}.template-card:hover i{outline:2px solid var(--blue)}.template-card.blank i::after{content:"+";color:#aaa;font-size:26px}.template-card.bold i{background:#1a1f1d;color:#bbf451}.template-card.editorial i{background:#eee8dc;color:#261d17}.template-card.launch i{background:#ff735b;color:#27100b}.template-card b{font-size:13px;line-height:.9;letter-spacing:-.06em}.add-text{display:block;width:100%;background:#1b1b1e;border:1px solid var(--line);border-radius:7px;margin-bottom:8px;text-align:left;padding:12px;cursor:pointer}.add-text:hover{border-color:var(--blue)}.add-text.heading{font-size:20px;font-weight:800}.add-text.subheading{font-size:15px;font-weight:600}.add-text.body-copy{font-size:11px}.panel-help{color:#6f6d73;font-size:10px;line-height:1.55;margin-top:16px}.element-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.element-grid button{height:94px;border:1px solid var(--line);border-radius:7px;background:#1a1a1d;color:var(--muted);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;cursor:pointer;font-size:9px}.element-grid button:hover{border-color:var(--blue);color:var(--ink)}.shape{display:block;width:38px;height:30px;background:var(--blue)}.shape.circle{width:32px;height:32px;border-radius:50%}.shape.line{height:2px}.shape.pill{height:20px;border-radius:99px}.upload-zone{height:110px;border:1px dashed #46464d;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;cursor:pointer}.upload-zone:hover{border-color:var(--blue);background:var(--blue-soft)}.upload-zone b{font-size:11px}.upload-zone span{font-size:9px;color:var(--muted);margin-top:4px}.upload-list{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}.upload-list button{height:92px;padding:0;border-radius:6px;overflow:hidden;background:#222;cursor:pointer}.upload-list img{width:100%;height:100%;object-fit:cover}.layer-list{display:flex;flex-direction:column-reverse;gap:6px}.layer-item{height:46px;border:1px solid var(--line);border-radius:6px;background:#1a1a1d;padding:0 8px;display:grid;grid-template-columns:20px 1fr auto;align-items:center;gap:6px;cursor:pointer}.layer-item.active{border-color:var(--blue);background:var(--blue-soft)}.layer-item span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px}.layer-item button{background:transparent;color:var(--muted);cursor:pointer}.layer-handle{color:#5f5d63;font-size:12px}
.editor{min-width:0;display:grid;grid-template-rows:48px minmax(0,1fr) 38px;background:#202024}.contextbar{background:#151517;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 14px;color:var(--muted)}.selection-controls{display:flex;align-items:center;gap:10px;width:100%}.selection-controls label{display:flex;align-items:center;gap:5px;font-size:9px}.selection-controls input[type=color]{width:28px;height:28px;padding:2px;border:1px solid var(--line);border-radius:5px;background:#111}.selection-controls select,.selection-controls input[type=number]{height:28px;border:1px solid var(--line);border-radius:5px;background:#0e0e10;padding:0 6px;font-size:10px}.selection-controls input[type=number]{width:55px}.selection-controls input[type=range]{width:80px;accent-color:var(--blue)}.compact{width:28px;height:28px;border-radius:5px;background:#252529;cursor:pointer}.compact:hover{background:#323238}.compact.danger{margin-left:auto;color:#ff8070;font-size:18px}.pasteboard{min-height:0;overflow:auto;display:grid;place-items:center;padding:60px}.artboard-wrap{transform-origin:center}.artboard{width:1080px;height:1080px;background:white;position:relative;overflow:hidden;box-shadow:0 18px 55px rgba(0,0,0,.35);outline:none;touch-action:none}.design-element{position:absolute;user-select:none;touch-action:none;cursor:move;transform-origin:center}.design-element.selected{outline:2px solid var(--blue);outline-offset:2px}.design-element.selected::after{content:"";position:absolute;width:12px;height:12px;right:-8px;bottom:-8px;border:2px solid white;border-radius:50%;background:var(--blue);box-shadow:0 0 0 1px var(--blue);cursor:nwse-resize}.design-text{white-space:pre-wrap;line-height:1.05;min-width:30px;min-height:20px}.design-text[contenteditable=true]{cursor:text;user-select:text;outline:2px dashed var(--blue)}.design-shape{min-width:15px;min-height:15px}.design-image{object-fit:cover}.statusbar{height:38px;background:#151517;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 13px;color:#77757b;font:9px "DM Mono",monospace}.zoom-controls{display:flex;align-items:center;gap:7px}.zoom-controls button{width:24px;height:24px;border-radius:4px;background:#242428;cursor:pointer}.zoom-controls input{width:100px;accent-color:var(--blue)}.zoom-controls span{width:34px}.toast{position:fixed;z-index:100;left:50%;bottom:18px;transform:translate(-50%,10px);padding:9px 13px;border:1px solid #444;border-radius:7px;background:#1b1b1e;opacity:0;pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:900px){:root{--panel-w:240px}.brand>b,.top-actions .ghost{display:none}.project-name{width:140px}.pasteboard{padding:30px}}
@media(max-width:700px){:root{--rail:58px;--panel-w:0px}.panel{display:none}.workspace{grid-template-columns:var(--rail) minmax(0,1fr)}.rail-button{font-size:0}.rail-button span{font-size:20px}.topbar{grid-template-columns:auto 1fr auto}.brand>span:last-child{display:none}.project-title-wrap{justify-content:center}.selection-controls label:not(:first-child),.selection-controls .text-only{display:none}.pasteboard{padding:20px}}