:root{color:#16343d;font-synthesis:none;text-rendering:optimizelegibility;--bg:#eafbf2;--text:#16343d;--text-strong:#203e46;--text-muted:#56727a;--text-subtle:#627a81;--text-label:#2e5059;--link:#1a7a49;--accent:#1f8f57;--accent-dark:#0f4a30;--accent-strong:#22a866;--accent-soft:#2bb473;--accent-rgb:31, 143, 87;--border:#bfdfcf;--border-input:#b9d9c9;--border-strong:#a9cebc;--border-faint:#d3e8de;--border-promise:#c2e1d2;--surface:#f7fdfa;--surface-alt:#eefaf4;--surface-hover:#d8f2e5;--surface-highlight:#dff4ea;--surface-preview:#eef9f3;--surface-stage:#cfe9dc;--danger:#8a3c47;--danger-text:#9b3f4a;--warning-border:#d4a900;--warning-bg:#ffde456b;--shadow:22, 52, 61;--shadow-alt:42, 48, 44;background:#eafbf2;font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{min-width:320px;min-height:100dvh;margin:0}button,input,select{font:inherit}button,label{-webkit-tap-highlight-color:transparent}button:focus-visible,label:focus-within,.studio-link:focus-visible{outline:3px solid var(--accent-strong);outline-offset:3px}.app-shell{flex-direction:column;min-height:100dvh;display:flex}.topbar{min-height:72px;padding:env(safe-area-inset-top) 28px 0;border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;display:flex}.topbar-actions{align-items:center;gap:18px;display:flex}.brand{color:inherit;align-items:center;gap:10px;font-weight:720;text-decoration:none;display:flex}.brand small{color:#5c747b;font-weight:550}.brand-mark{color:#fff;background:var(--accent-dark);border-radius:11px;place-items:center;width:38px;height:38px;display:grid;overflow:hidden}.brand-mark img{width:100%;height:100%;display:block}.privacy-note{color:var(--text-muted);align-items:center;gap:7px;font-size:14px;display:flex}.welcome{grid-template-columns:minmax(0,1.4fr) minmax(260px,.6fr);align-items:center;gap:56px;width:min(1180px,100% - 48px);min-height:calc(100dvh - 116px);margin:auto;display:grid}.kicker{color:var(--accent);letter-spacing:.08em;text-transform:uppercase;margin:0 0 16px;font-size:12px;font-weight:750}h1{letter-spacing:-.065em;max-width:760px;margin:0;font-size:clamp(52px,7vw,92px);font-weight:780;line-height:.92}.intro{max-width:580px;color:var(--text-muted);margin:24px 0;font-size:clamp(18px,1.8vw,22px);line-height:1.45}.promise{border:1px solid var(--border-promise);background:var(--border-promise);border-radius:15px;gap:1px;display:grid;overflow:hidden}.promise span{background:var(--surface);align-items:center;gap:12px;padding:20px;display:flex}.promise svg{color:var(--accent)}.welcome-actions{flex-wrap:wrap;gap:10px;display:flex}.pick-images-button{font-weight:720}.dropzone{text-align:center;border:2px dashed var(--border-strong);background:var(--surface);color:var(--text-muted);border-radius:16px;flex-direction:column;grid-column:1/-1;align-items:center;gap:10px;margin-top:8px;padding:28px;transition:border-color .16s,background .16s;display:flex}.dropzone.drag-active{border-color:var(--accent);background:var(--surface-highlight)}.dropzone strong{color:var(--text-strong)}.primary-button,.save-button,.secondary-button,.tool-button{cursor:pointer;white-space:nowrap;border:0;justify-content:center;align-items:center;gap:9px;transition:transform .16s,background .16s,opacity .16s;display:inline-flex}.primary-button,.save-button{color:#fff;background:var(--accent-dark);border-radius:10px;padding:15px 20px;font-weight:720}.primary-button:active,.save-button:active,.secondary-button:active,.tool-button:active{transform:translateY(1px)}.primary-button input,.tool-button input,.secondary-button input{display:none}.primary-button.compact,.save-button.compact{padding:11px 15px}button:disabled{cursor:not-allowed;opacity:.42}.workspace{flex:1;grid-template-rows:auto minmax(0,1fr);grid-template-columns:210px minmax(0,1fr);min-height:0;display:grid}.toolbar{border-right:1px solid var(--border);background:var(--surface);flex-direction:column;grid-row:1/3;align-items:stretch;gap:8px;min-height:0;padding:16px 12px;display:flex;overflow-y:auto}.tool-button,.secondary-button{color:var(--text-label);border:1px solid var(--border-input);background:0 0;border-radius:9px;padding:10px 13px}.studio-link{font-weight:700;text-decoration:none}.tool-button{flex:none;justify-content:flex-start}.tool-button:hover,.tool-button.active,.secondary-button:hover{background:var(--surface-hover)}.danger-tool{color:var(--danger)}.tray-bar{border-bottom:1px solid var(--border);background:var(--surface);grid-column:2}.tray-meta{color:var(--text-subtle);justify-content:space-between;align-items:center;gap:16px;padding:12px 24px 4px;font-size:13px;display:flex}.tray-meta strong{color:var(--text-strong)}.tray-meta-actions{align-items:center;gap:10px;display:flex}.workspace-grid{grid-column:2;grid-template-columns:minmax(0,1fr) auto;min-height:0;display:grid}.stage-column{flex-direction:column;min-width:0;min-height:0;display:flex}.image-tray{background:var(--surface);flex:none;gap:12px;padding:6px 24px 14px;display:flex;overflow-x:auto}.image-thumbnail{border:1px solid var(--border-input);background:#fff;border-radius:10px;flex:none;width:108px;overflow:hidden}.image-thumbnail.active{border-color:var(--accent);box-shadow:0 0 0 2px rgba(var(--accent-rgb), .18)}.thumbnail-preview{background:var(--surface-preview);cursor:pointer;border:0;place-items:center;width:100%;height:78px;padding:0;display:grid}.thumbnail-preview img{object-fit:cover;width:100%;height:100%;display:block}.thumbnail-heic-badge{letter-spacing:.04em;color:var(--text-muted);font-size:11px;font-weight:750}.thumbnail-name{color:var(--text-muted);text-overflow:ellipsis;white-space:nowrap;padding:5px 6px 0;font-size:10px;display:block;overflow:hidden}.thumbnail-status{color:var(--accent);padding:0 6px 5px;font-size:10px;font-weight:700;display:block}.thumbnail-status.error{color:var(--danger-text)}.thumbnail-actions{border-top:1px solid var(--border-input);grid-template-columns:repeat(2,1fr);display:grid}.thumbnail-actions button{border:0;border-right:1px solid var(--border-faint);color:#2e606a;cursor:pointer;background:#fff;place-items:center;height:28px;display:grid}.thumbnail-actions button:last-child{border-right:0}.thumbnail-actions button:hover{background:var(--surface-hover)}.add-more-thumbnail{border:1px dashed var(--border-strong);width:108px;height:78px;color:var(--text-muted);cursor:pointer;background:0 0;border-radius:10px;flex:none;place-items:center;display:grid}.add-more-thumbnail:hover{background:var(--surface-hover)}.add-more-thumbnail input{display:none}.status-line{color:var(--text-subtle);margin:0;padding:10px 24px 0;font-size:13px}.image-stage{background:var(--surface-stage);flex:1;place-items:center;min-height:0;padding:36px;display:grid;overflow:auto}.stage-empty{color:var(--text-muted);text-align:center}.image-wrap{width:max-content;max-width:100%;box-shadow:0 24px 60px rgba(var(--shadow-alt), .16);margin:0 auto;position:relative}.image-wrap.cropping{cursor:crosshair;touch-action:none}.stage-image{background:#fff;max-width:100%;height:auto;max-height:calc(100dvh - 260px);display:block}.crop-selection{z-index:2;border:2px solid var(--accent);background:rgba(var(--accent-rgb), .16);pointer-events:none;position:absolute}.settings-panel{background:var(--surface);border-left:0 solid var(--border);width:0;transition:width .24s;overflow:hidden}.settings-panel.open{border-left-width:1px;width:360px;padding:26px}.panel-heading{justify-content:space-between;align-items:start;min-width:308px;display:flex}.panel-heading h2{letter-spacing:-.035em;margin:0;font-size:26px}.settings-panel>p{min-width:308px;color:var(--text-muted);line-height:1.55}.icon-button{border:1px solid var(--border-input);cursor:pointer;background:0 0;border-radius:9px;place-items:center;width:34px;height:34px;font-size:22px;display:grid}.legal-note{font-size:12px}.error-message{font-weight:650;color:var(--danger-text)!important}.edit-panel{gap:12px;min-width:308px;display:grid}.edit-panel label,.field-label{color:var(--text-label);font-size:13px;font-weight:720}.edit-panel select,.edit-panel input[type=number],.edit-panel input[type=text]{border:1px solid var(--border-strong);width:100%;color:var(--text);background:#fff;border-radius:9px;padding:11px 12px}.edit-panel select:focus,.edit-panel input:focus{outline:3px solid rgba(var(--accent-rgb), .3);border-color:var(--accent)}.range-row{gap:6px;display:grid}.range-row .range-value{color:var(--text-muted);font-size:12px;font-weight:550}.range-row input[type=range]{width:100%;accent-color:var(--accent)}.dimension-row{grid-template-columns:1fr 1fr;gap:10px;display:grid}.aspect-lock{color:var(--text-label);cursor:pointer;align-items:center;gap:8px;font-weight:680;display:flex}.aspect-lock input{width:18px;height:18px;accent-color:var(--accent);margin:0}.preset-row{flex-wrap:wrap;gap:8px;display:flex}.format-choice{border:1px solid var(--border-input);width:100%;color:var(--text-label);text-align:left;cursor:pointer;background:#fff;border-radius:9px;align-items:center;gap:12px;padding:13px;display:flex}.format-choice:hover,.format-choice.active{border-color:var(--accent);background:var(--surface-highlight)}.tool-instruction{color:var(--text-muted);line-height:1.55}.secure-note{border:1px solid var(--border-strong);background:var(--bg);border-radius:9px;align-items:flex-start;gap:9px;padding:13px;font-size:13px;display:flex;color:var(--text-label)!important}.secure-note svg{flex:none;margin-top:2px}.crop-actions,.apply-actions{gap:10px;margin-top:4px;display:flex}.result-summary{border:1px solid var(--border-input);background:var(--surface-alt);color:var(--text-label);border-radius:9px;padding:13px;font-size:13px;line-height:1.5}.result-summary strong{color:var(--text-strong)}footer{border-top:1px solid var(--border);color:#647c83;justify-content:space-between;align-items:center;gap:20px;min-height:44px;padding:0 28px;font-size:12px;display:flex}footer span{align-items:center;gap:7px;display:flex}footer nav{gap:16px;display:flex}footer a,.legal-page a{color:var(--link);font-weight:700}.legal-page{width:min(850px,100% - 48px);margin:0 auto;padding:32px 0 72px}.legal-page>.brand{width:max-content}.legal-page article{margin-top:72px}.legal-page h1{max-width:none;font-size:clamp(44px,8vw,76px)}.legal-page section{margin-top:42px}.legal-page h2{letter-spacing:-.025em;margin:0 0 12px;font-size:clamp(20px,3vw,26px)}.legal-page p{color:#506f77;margin:0 0 12px;line-height:1.7}.legal-back{margin-top:42px;display:inline-block}@media (width<=760px){.topbar{min-height:64px;padding:env(safe-area-inset-top) 12px 0;gap:8px}.topbar .brand{gap:7px;min-width:0;font-size:14px}.topbar .brand-mark{flex:none;width:34px;height:34px}.topbar-actions{gap:6px}.topbar-actions .secondary-button{padding:8px 9px;font-size:12px}.brand small,.privacy-note{display:none}.welcome{grid-template-columns:1fr;align-content:center;gap:40px;width:min(100% - 32px,560px);min-height:calc(100dvh - 108px);padding:50px 0}.welcome-actions{display:grid}.welcome-actions>label{width:100%}h1{font-size:clamp(48px,16vw,72px)}.intro{margin:24px 0}.workspace{flex-direction:column;display:flex}.toolbar{scroll-snap-type:x proximity;border-right:0;border-bottom:1px solid var(--border);flex-direction:row;align-items:center;min-height:74px;padding:8px 10px;overflow:auto hidden}.tool-button{scroll-snap-align:start;flex-direction:column;justify-content:center;gap:4px;min-width:58px;min-height:56px;padding:7px 6px;font-size:10px;line-height:1.1}.tool-button svg{width:21px;height:21px}.tray-meta{flex-wrap:wrap;gap:10px;padding:8px 14px 4px}.tray-meta .secondary-button span{display:none}.image-tray{padding:6px 14px 12px}.image-stage{padding:12px 10px 22px}.workspace-grid{display:block;position:relative}.settings-panel{z-index:10;border-left:0;border-top:0 solid var(--border);width:100%;max-height:0;transition:max-height .24s;position:fixed;inset:auto 0 0}.settings-panel.open{width:100%;max-height:76dvh;padding:24px 18px max(20px, env(safe-area-inset-bottom));box-shadow:0 -18px 50px rgba(var(--shadow), .18);border-top-width:1px;border-radius:20px 20px 0 0;overflow:auto}.settings-panel.open:before{content:"";background:var(--border-strong);border-radius:999px;width:42px;height:4px;margin:-12px auto 16px;display:block}.panel-heading{z-index:1;background:var(--surface);margin:0 -2px 8px;padding:8px 2px 10px;position:sticky;top:-24px}.panel-heading,.settings-panel>p,.edit-panel{min-width:0}footer{flex-direction:column;align-items:flex-start;gap:6px;padding:10px 16px}.legal-page{width:min(100% - 32px,850px);padding-top:20px}.legal-page article{margin-top:52px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}
