:root{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif;color:#0b0b0b;background:#f3f1e7;line-height:1.55}*{box-sizing:border-box}body{margin:0}header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 4vw;border-bottom:1px solid #d9d7ce}header img{width:180px;height:auto;display:block}header>div{display:flex;align-items:center;gap:12px;font-size:13px}main{max-width:1540px;margin:auto;padding:26px 4vw}h1{font-size:30px;line-height:1.2;letter-spacing:-1px;margin:6px 0}h2{font-size:18px;overflow-wrap:anywhere;margin:8px 0}.eyebrow{font-size:12px;letter-spacing:.08em;color:#452d40;margin:0}.toolbar,.actions,.editorhead,.previewtools,.listhead{display:flex;align-items:center;justify-content:space-between;gap:10px}.actions{justify-content:flex-start;flex-wrap:wrap}.pick,button,a[download]{display:inline-block;border:1px solid transparent;border-radius:6px;background:#452d40;color:white;padding:10px 14px;font:inherit;cursor:pointer;text-decoration:none;min-height:44px}.pick{position:relative;background:#452d40;color:#f6fb9a;margin:0}.pick input{position:absolute;inset:0;width:100%;opacity:0;cursor:pointer}.quiet{background:transparent;border-color:#c8c2b9;color:#452d40;font-size:13px}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #8d6890;outline-offset:3px}.pick:focus-within{outline:3px solid #8d6890;outline-offset:3px}.muted,footer{font-size:13px;color:#68625e}.statusbar{display:flex;gap:12px;align-items:center;min-height:60px;font-size:14px;border-bottom:1px solid #d9d7ce;margin-bottom:22px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 410px;gap:26px;align-items:start}.listhead{font-size:13px;min-height:48px;margin-bottom:12px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}.card{padding:0;background:white;color:#0b0b0b;text-align:left;overflow:hidden;border:2px solid transparent;min-width:0}.card.selected{border-color:#452d40}.card img{display:block;width:100%;height:175px;object-fit:contain;background:#dedbd2}.card span{display:block;padding:8px;font-size:12px;overflow-wrap:anywhere;white-space:pre-line}.card.error{border-color:#ba6333}.card.done span{background:#f6fb9a}.empty{padding:60px 24px;text-align:center;border:1px dashed #b9b1a5;border-radius:6px;color:#68625e}.empty strong{font-size:20px;color:#452d40}aside{background:white;border-radius:8px;padding:18px}#stage{position:relative;isolation:isolate;line-height:0;user-select:none}#preview{display:block;width:100%;height:auto;background:repeating-conic-gradient(#eee 0% 25%,#ddd 0% 50%) 50%/16px 16px;pointer-events:none}#stage.protecting{touch-action:none;cursor:crosshair}#regions{position:absolute;inset:0;pointer-events:none}.region{position:absolute;border:1px dashed #ed870b;background:#ed870b14}#dragLogo{position:absolute;outline:1px dashed #f6fb9a;box-shadow:0 0 0 1px #452d40;cursor:move;touch-action:none}#draftRegion{position:absolute;border:2px solid #e36a00;background:#ff980033;pointer-events:none}.previewtools{margin:8px 0}.previewtools button{flex:1}button[aria-pressed=true]{background:#452d40;color:#f6fb9a}.editorhead h2{font-size:14px;max-width:76%;margin:0}.editorhead{margin-bottom:12px}label{display:block;margin:12px 0;font-size:14px}input[type=range],select{display:block;width:100%;min-height:38px;accent-color:#452d40}select,input:not([type=range]):not([type=checkbox]):not([type=file]){font:inherit;padding:9px;border:1px solid #aaa;border-radius:4px;background:white;width:100%;min-height:44px}.twocol{display:grid;grid-template-columns:1fr 1fr;gap:14px}.positions{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.positions button{background:#eeece6;color:#452d40;font-size:13px;padding:8px}.confirm{display:flex;gap:10px;font-size:14px;align-items:flex-start}.confirm input{width:20px;min-width:20px;height:20px}#warning{color:#92410e;font-size:13px}#next,#single,#share{margin-top:10px;width:100%}#singleDownload{display:block;text-align:center;margin-top:10px}details{border-block:1px solid #ddd6cc;padding:12px 0;font-size:13px}summary{cursor:pointer;min-height:30px}#regionList{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}fieldset{border:0;padding:0;margin-top:14px}.regioninputs{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.regioninputs label{margin:0}#export{border-top:1px solid #cdc7bd;margin-top:28px;padding-top:20px}#export select{max-width:360px}footer{margin-top:36px;border-top:1px solid #d9d7ce;padding-top:20px;max-width:900px}.login{width:min(420px,calc(100% - 32px));margin:65px auto}.login button{width:100%;margin-top:12px}#loginError{font-size:14px;color:#92410e}a[hidden],[hidden]{display:none!important}@media(max-width:850px){.workspace{grid-template-columns:1fr}.grid{grid-template-columns:repeat(3,minmax(0,1fr))}.card img{height:120px}header{padding:16px}header img{width:150px}header>div{max-width:160px}main{padding:20px 16px}.toolbar{align-items:flex-end}.toolbar .actions{gap:6px}.toolbar button,.toolbar .pick{padding:9px 10px;font-size:13px}.listhead{align-items:flex-start}.listhead button{max-width:200px}.editorhead h2{font-size:15px}aside{padding:14px}.previewtools button{font-size:13px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

/* Editing workspace: a browsable contact strip, large photo and adjacent controls. */
@media(min-width:1051px){.workspace{grid-template-columns:210px minmax(0,1fr);gap:22px}.workspace>.photo-list{position:sticky;top:16px}.grid{grid-template-columns:repeat(2,minmax(0,1fr));max-height:72vh;overflow:auto;align-content:start}.card img{height:105px}.card span{font-size:11px}.listhead{flex-direction:column;align-items:stretch;gap:10px}.listhead button{font-size:12px}.editing-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:22px}.photo-panel{position:sticky;top:16px;align-self:start}.controls label:first-child{margin-top:8px}.editorhead h2{font-size:16px}.empty{padding:30px 12px;font-size:13px}.empty strong{font-size:16px}}
@media(max-width:1050px){.workspace{grid-template-columns:1fr}.grid{display:flex;overflow:auto;gap:10px;padding-bottom:8px;max-height:230px}.card{flex:0 0 112px}.card img{height:115px}.card span{max-height:74px;overflow:hidden}.listhead{margin-bottom:6px}.editing-layout{display:block}.photo-panel{position:static}.editorhead h2{font-size:15px}}

#stage{touch-action:none}#liveLogo{display:block;width:100%;height:100%;pointer-events:none}#dragLogo{cursor:grab}#dragLogo:active{cursor:grabbing}#dragLogo::before{content:"";position:absolute;inset:-13px}.resize-handle{position:absolute;width:36px;height:36px;min-height:36px;padding:0;border:0;background:transparent;border-radius:50%;transform:translate(-50%,-50%);touch-action:none;z-index:2}.resize-handle::after{content:"";position:absolute;width:10px;height:10px;left:13px;top:13px;background:#f6fb9a;border:1px solid #452d40;border-radius:50%;box-shadow:0 0 0 1px white}.resize-handle.nw{left:0;top:0;cursor:nwse-resize}.resize-handle.ne{left:100%;top:0;cursor:nesw-resize}.resize-handle.sw{left:0;top:100%;cursor:nesw-resize}.resize-handle.se{left:100%;top:100%;cursor:nwse-resize}.gesture-hint{font-size:12px;color:#452d40;margin:12px 0 4px}#precise{margin-bottom:14px}#precise summary{font-size:13px}.photo-panel #dimensions{margin-top:5px}@media(pointer:coarse){.resize-handle{width:44px;height:44px;min-height:44px}.resize-handle::after{left:17px;top:17px}}
@media(min-width:1051px){#stage{width:min(100%,calc(70vh * var(--photo-ratio,1)));margin-inline:auto}}

.photo-filing{max-width:none;margin:32px auto 0}

#saveDialog{width:min(760px,calc(100% - 24px));max-height:92dvh;overflow:auto;border:1px solid #c8c2b9;border-radius:12px;background:#f3f1e7;padding:20px;color:#0b0b0b}#saveDialog::backdrop{background:#0009}.save-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}#saveImage{display:block;width:100%;height:auto;margin:16px 0;user-select:auto;-webkit-user-select:auto;-webkit-touch-callout:default}#saveDialog .actions>*{flex:1;text-align:center}#saveNext{margin:10px 0}#zipOptions{margin-top:20px}@media(max-width:600px){#saveDialog{padding:14px}#saveDialog .actions{flex-direction:column;align-items:stretch}}

.image-downloads{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.image-downloads a{max-width:100%;overflow-wrap:anywhere}@media(pointer:coarse){#export #saveNext{display:none}}