:root{--paper: #f3efe6;--paper-2: #faf7f2;--desk: #e4ddd0;--ink: #1c1915;--muted: #6f675c;--line: #d9d1c3;--navy: #10284f;--navy-2: #1a3c72;--gold: #a67c3d;--gold-2: #e7d3a4;--good: #1f6a45;--warn: #8a5a12;--danger: #8e2438;--shadow: 0 18px 50px rgba(28, 25, 21, .12);font-family:Outfit,sans-serif;color:var(--ink);background:var(--desk);font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%}body{background:var(--desk)}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}h1,h2,h3{font-weight:560;letter-spacing:-.03em;margin:0}h1{font-size:40px;line-height:1.05;max-width:16ch}p{margin:0}.app{min-height:100vh}.topbar{height:64px;display:flex;align-items:center;justify-content:space-between;padding:0 22px;border-bottom:1px solid var(--line);background:#faf7f2;position:sticky;top:0;z-index:5}.mark{border:0;background:transparent;text-align:left;padding:0}.mark span{font-family:Fraunces,serif;font-size:22px;font-weight:560;display:block}.mark small{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;font-size:11px}nav{display:flex;gap:6px}.nav,.quiet,.primary,.text-btn,.chip,.layer{border-radius:999px;border:1px solid transparent}.nav{background:transparent;padding:8px 12px;color:var(--muted);white-space:nowrap}.nav.on{color:var(--ink);background:#fff;border-color:var(--line)}.primary,.quiet,.text-btn,.chip{padding:9px 14px;border-color:var(--line);background:#fff}.primary{background:var(--navy);color:var(--paper);border-color:var(--navy)}.primary:disabled{opacity:.6}.text-btn{background:transparent;border-color:transparent;color:var(--navy);padding-inline:8px}.chip.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}.main{min-height:calc(100vh - 64px)}.editor-main{height:calc(100vh - 64px)}.page{padding:28px 32px 64px;display:grid;gap:28px}.page.narrow{max-width:820px}.hero{display:flex;justify-content:space-between;gap:32px;align-items:end}.eyebrow{letter-spacing:.14em;text-transform:uppercase;font-size:11px;color:var(--gold);margin-bottom:8px}.lede,.note,.meta,.empty{color:var(--muted);line-height:1.5}.lede{max-width:62ch;margin-top:12px}.hero-actions,.row-gap,.chip-row,.toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:12px}.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}.card{background:var(--paper-2);border:1px solid var(--line);border-radius:16px;overflow:hidden;display:flex;flex-direction:column}.card-body{padding:12px 14px 14px;display:grid;gap:8px}.card-body h3{font-size:18px}.card-body p,.file-row span,.origin{color:var(--muted);font-size:13px}.mini{overflow:hidden;background:#d7d0c4;position:relative}.badge{display:inline-flex;width:max-content;border-radius:999px;padding:3px 8px;font-size:11px;letter-spacing:.04em;text-transform:uppercase;background:var(--gold-2);color:#5c4316}.badge.editable{background:#d9efe3;color:var(--good)}.badge.preview{background:#ece7de;color:var(--muted)}.file-list,.version-list{display:grid;gap:8px}.file-row{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:12px 14px;background:var(--paper-2);border:1px solid var(--line);border-radius:12px}.file-row strong,.file-row span{display:block}.file-btn{position:relative;overflow:hidden;display:inline-flex}.file-btn input{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;cursor:pointer}.toolbar input,.stack input,.stack select,.stack textarea,.side-head input,.name{width:100%;border:1px solid var(--line);background:#fff;border-radius:10px;padding:10px 12px}.stack{display:grid;gap:6px;font-size:13px;color:var(--muted)}.stack textarea{min-height:72px;resize:vertical}fieldset{border:1px solid var(--line);border-radius:14px;padding:12px;display:grid;gap:10px;background:#ffffff59}legend{padding:0 6px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--gold)}.advice{margin:0;padding-left:18px;color:var(--muted);display:grid;gap:6px}.compose{display:grid;grid-template-columns:minmax(320px,420px) 1fr;min-height:calc(100vh - 64px)}.compose-form,.compose-preview{min-height:0}.compose-form{padding:22px;display:grid;align-content:start;gap:12px;background:var(--paper);border-right:1px solid var(--line);max-height:calc(100vh - 64px);overflow:auto}.compose-form h1{font-size:32px}.compose-preview{background:#ddd4c6;display:grid;grid-template-rows:auto 1fr}.preview-bar,.editor-bar,.editor-foot{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:10px 14px}.preview-scroll,.stage-scroll{overflow:auto;padding:28px}.sample{justify-self:start}.guide article{display:grid;gap:8px;padding-top:8px;border-top:1px solid var(--line)}.guide h2{font-size:22px}.brand-grid,.swatches{display:grid;gap:12px}.swatches{grid-template-columns:repeat(3,1fr)}.swatches label{display:grid;gap:6px;font-size:13px;color:var(--muted)}.boot{min-height:100vh;display:grid;place-items:center;font-family:Fraunces,serif;font-size:28px}.toasts{position:fixed;left:50%;bottom:18px;transform:translate(-50%);display:grid;gap:8px;z-index:20}.toast{background:var(--ink);color:var(--paper);padding:10px 14px;border-radius:999px;max-width:520px}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#1c191559;display:grid;place-items:center;z-index:30;padding:24px}.dialog{width:min(560px,100%);background:var(--paper-2);border-radius:18px;padding:22px;display:grid;gap:12px;box-shadow:var(--shadow)}.dialog h2{font-size:28px;max-width:none}.export-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.editor{height:calc(100vh - 64px);display:grid;grid-template-rows:auto auto 1fr auto;background:var(--desk)}.editor-bar,.editor-foot,.film{background:var(--paper-2);border-bottom:1px solid var(--line)}.editor-bar{flex-wrap:nowrap;overflow:auto}.editor-foot{border-bottom:0;border-top:1px solid var(--line);flex-wrap:wrap}.film{display:flex;gap:8px;padding:8px 14px;overflow:auto}.name{font-size:16px;max-width:280px}.editor-body{min-height:0;display:grid;grid-template-columns:280px 1fr 300px}.side,.props{background:var(--paper-2);overflow:auto;min-height:0}.side{border-right:1px solid var(--line);display:grid;grid-template-rows:auto 1fr auto}.props{border-left:1px solid var(--line);padding:14px;display:grid;align-content:start;gap:10px}.props h2{font-size:22px}.side-head{display:grid;grid-template-columns:auto 1fr;gap:8px;padding:10px}.layers{overflow:auto;padding:0 8px 8px;display:grid;align-content:start;gap:4px}.layer{width:100%;text-align:left;border-radius:10px;background:transparent;display:flex;justify-content:space-between;gap:8px;padding:8px 10px}.layer.on{background:#fff;border-color:var(--line)}.layer small{color:var(--muted)}.quick-fields{border-top:1px solid var(--line);padding:10px;display:grid;gap:8px;max-height:42%;overflow:auto}.stage-scroll{min-width:0}.stage-frame{position:relative;margin:auto}.scaled{position:absolute;top:0;left:0;transform-origin:top left}.artboard{position:relative;overflow:hidden;box-shadow:var(--shadow)}.artboard-overlay{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.el{position:absolute;overflow:hidden}.text-el{overflow:hidden;cursor:grab}.photo-empty{width:100%;height:100%;display:grid;place-items:center;background:repeating-linear-gradient(135deg,#ffffff14 0,#ffffff14 8px,#ffffff05 8px,#ffffff05 16px);color:#fffc;border:1px dashed rgba(255,255,255,.35);font-size:14px;letter-spacing:.08em;text-transform:uppercase}.reference{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:fill;opacity:.72;pointer-events:none}.chrome{position:absolute;border:1.5px solid #c9842a;pointer-events:auto;cursor:move}.handle{position:absolute;width:10px;height:10px;background:#fff;border:1.5px solid #c9842a;border-radius:2px;padding:0}.handle.nw{left:-6px;top:-6px;cursor:nwse-resize}.handle.ne{right:-6px;top:-6px;cursor:nesw-resize}.handle.se{right:-6px;bottom:-6px;cursor:nwse-resize}.handle.sw{left:-6px;bottom:-6px;cursor:nesw-resize}.split{display:grid;grid-template-columns:1fr 1fr;gap:8px}.check{display:flex;gap:8px;align-items:center;font-size:14px}.spacer{flex:1}.editor-foot input[type=range],.preview-bar input[type=range]{width:140px}@media(max-width:1100px){.compose{grid-template-columns:1fr}.hero{flex-direction:column;align-items:start}.editor,.editor-main{height:auto}.editor-body{grid-template-columns:1fr;grid-template-rows:minmax(460px,62vh) auto}.stage-scroll{order:-1;min-height:460px}.side{max-height:320px;border-right:0;border-top:1px solid var(--line)}.props{border-left:0;border-top:1px solid var(--line)}}
