@font-face{font-family:Studio Serif;src:url("assets/serif.woff2") format("woff2");font-display:swap}
:root{color-scheme:dark;--ink:#f2ebdf;--muted:#c7b9a7;--panel:#251c18;--line:#655046;--accent:#f6b58b;--serif:"Studio Serif",Georgia,serif}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(ellipse at 20% 0%,#38231e,#191411 63%);color:var(--ink);font:15px/1.55 system-ui,sans-serif}
.masthead,main{max-width:1400px;margin:auto;padding-inline:clamp(18px,5vw,72px)}
.masthead{height:76px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid #ffffff20}
.brand{color:inherit;text-decoration:none;font-size:1.25rem;font-weight:800;letter-spacing:-.045em}
.brand span,.eyebrow{color:var(--accent)}
.preview-label{font-size:.78rem;border:1px solid var(--line);border-radius:50px;padding:10px 16px;color:var(--ink);text-decoration:none}
.intro{padding-block:clamp(32px,5vw,68px) 26px}
.eyebrow{letter-spacing:.16em;font-size:.72rem;font-weight:750}
h1,h2{font-family:var(--serif);font-weight:400;margin:0}
h1{font-size:clamp(4rem,9vw,9rem);line-height:.82;letter-spacing:-.03em}
h1 em{color:#f5be9a;font-weight:400}
.intro>p:last-child{max-width:44ch;color:var(--muted);margin:24px 0 0}
.workspace{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:16px;align-items:start;padding-bottom:50px}
.panel,.results{min-width:0;background:#251c18;border:1px solid var(--line);border-radius:14px;padding:clamp(15px,3vw,28px)}
.brand-panel{margin-bottom:16px;padding-block:14px}
.brand-panel>summary{display:flex;align-items:center;justify-content:space-between;gap:14px;list-style:none;cursor:pointer;min-height:44px}
.brand-panel>summary::-webkit-details-marker{display:none}
.brand-panel>summary strong{font-family:var(--serif);font-size:1.65rem;font-weight:400;line-height:1.1;display:block}
.brand-panel>summary small{display:block;color:var(--muted);margin-top:.28em;overflow-wrap:anywhere}
.brand-toggle{width:.65em;height:.65em;border:solid var(--accent);border-width:0 1px 1px 0;transform:rotate(45deg);margin:0 .3em .3em 0;flex:none}
.brand-panel[open] .brand-toggle{transform:rotate(225deg);margin-bottom:0}
.brand-panel form{max-width:750px;padding-top:8px}
.billing-content{max-width:660px;padding-top:5px}
.billing-content progress{width:100%;height:8px;accent-color:var(--accent);margin-top:12px}
.billing-content .secondary{padding-inline:8px}
#account-form{max-width:440px}
.account-modes{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:8px}
.brand-panel input[type=color]{height:44px;padding:4px}
.brand-logo-row:not([hidden]){display:flex;gap:12px;align-items:center;margin-top:10px}
.brand-logo-row img{width:90px;height:58px;object-fit:contain;padding:8px;background:#1c1613;border-radius:7px;border:1px solid var(--line)}
h2{font-size:clamp(2.1rem,4vw,3.25rem);line-height:1;margin-bottom:16px}
label,legend{display:block;font-weight:700;font-size:.82rem;margin:12px 0 6px}
label small,.note,#dimensions{color:var(--muted);font-size:.75rem;font-weight:400}
input,textarea,select,button{font:inherit}
input,textarea,select{width:100%;min-width:0;padding:10px;border:1px solid var(--line);border-radius:7px;background:#1c1613;color:var(--ink)}
textarea{resize:vertical}
input[type=file]{font-size:.77rem}
input::file-selector-button{border:0;border-radius:4px;margin-right:6px;padding:6px 8px;background:#efdfd0;color:#201712;cursor:pointer}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:8px}
button{cursor:pointer;min-height:44px;border-radius:8px}
.primary,.secondary{width:100%;margin-top:16px;font-weight:700}
.primary{background:var(--accent);color:#231610;border:0;display:flex;justify-content:space-between;align-items:center;padding:0 14px}
.secondary{background:#322520;color:var(--ink);border:1px solid var(--line)}
.note{margin:10px 0 0}
.check{display:flex;align-items:center;gap:8px;color:var(--muted);font-weight:500;min-height:32px}
.check[hidden]{display:none}
.check input{width:16px;height:16px;flex:none;accent-color:var(--accent)}
.photo-tools{margin:0 0 14px}
.photo-tools label{margin-top:0}
.focus-controls{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:12px;margin:-3px 0 14px;align-items:center}
.focus-controls[hidden],.text-button[hidden]{display:none}
.focus-controls label{grid-column:1 / -1;margin:0}
.focus-controls input{accent-color:var(--accent);padding:0;border:0;background:none;min-height:44px}
.text-button{padding:0;border:0;background:none;color:var(--accent);font-size:.83rem;text-underline-offset:.2em;text-decoration:underline}
.text-button:disabled{opacity:.6;cursor:default}
.status:not(:empty){padding:.55em .85em;background:#1c1613;border-radius:6px;color:var(--ink)}
.status:empty{margin:0}
.overlay-editor{margin-top:12px;font-size:.84rem}
.overlay-editor summary{padding-block:7px;cursor:pointer;color:var(--ink)}
fieldset{padding:0;border:0;margin:0 0 12px;min-width:0}
.editions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.editions button{background:#322520;color:var(--ink);border:1px solid var(--line);font-size:.83rem;padding:5px}
.editions button[aria-pressed=true]{color:#251712;background:var(--accent);border-color:var(--accent)}
.result-head{display:flex;justify-content:space-between;gap:8px;align-items:baseline;flex-wrap:wrap}
.result-head h2{margin:0}
.canvas-stage{background:radial-gradient(ellipse,#5b4035,#221a16 76%);border-radius:10px;display:grid;place-items:center;padding:15px;min-height:220px}
canvas{display:block;width:auto;max-width:100%;height:auto;max-height:500px;box-shadow:0 12px 32px #100a}
.caption{grid-column:1 / -1}
.caption textarea{min-height:130px}
:focus-visible{outline:2px solid #ffd2b2;outline-offset:3px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@media(max-width:720px){.workspace{grid-template-columns:1fr}.masthead{height:58px}h1{font-size:clamp(2.75rem,13vw,5rem);line-height:.9}canvas{max-height:440px}.caption{grid-column:auto}}
@media(max-width:420px){.brand-fields{grid-template-columns:1fr}}
