/* Interface themes only: never filter or invert original photos, bead colors or exports. */
/* Glass surfaces stay outside photos, palette swatches and printable canvases. */
.theme-switch{position:relative;z-index:2;touch-action:manipulation}.theme-switch button{touch-action:manipulation;min-width:44px;min-height:44px!important}
:root{color-scheme:dark;--blue:#f4f2ef;--ink:#f4f2ef;--muted:#aaa49c;--line:#33312e;--paper:#080808;--green:#37372e;--surface:#141414;--subtle:#1c1b19;--control:#232323;--selected:#383530;--primary:#f4f2ef;--primary-ink:#111;--accent:#c8c3b9;--canvas-a:#202020;--canvas-b:#252525;--focus:#c4b9a4;--backdrop:#0009}
:root[data-theme="light"]{color-scheme:light;--blue:#292b27;--ink:#20221e;--muted:#62675d;--line:#d6d9cf;--paper:#f5f4f0;--green:#e0e2d7;--surface:#fff;--subtle:#f4f4ef;--control:#eceee7;--selected:#dce2d1;--primary:#292b27;--primary-ink:#fff;--accent:#525b46;--canvas-a:#e6e8e1;--canvas-b:#f7f8f3;--focus:#65774f;--backdrop:#0007}
body,.topbar{background:var(--paper);color:var(--ink)}.panel,.canvas-panel,.card,dialog{background:var(--surface);color:var(--ink)}button,input,select,textarea,.outline,.toolbar button{background:var(--control);color:var(--ink);border-radius:5px}button.primary,.primary{background:var(--primary);color:var(--primary-ink)}.topbar nav button.active,.toolbar button.selected,.filters .selected,.editor-toolbar button.selected,.crop-ratios button.selected{background:var(--selected);color:var(--ink)}.parameter-details,.upload,.notice,.settings-section,.plan,.settings-section summary{background:var(--subtle);border-color:var(--line)}.eyebrow{color:var(--accent)}.badge{background:var(--green);color:var(--ink)}.generate-bar{background:var(--surface)!important;color:var(--ink);border-color:var(--line)}.processing-dialog{border-color:var(--line)}.processing-spinner{border-color:var(--line);border-top-color:var(--primary)}.swatch.chosen{border-color:var(--primary);background:var(--selected)}.editor-tabs .selected,[data-brush].selected{background:var(--selected);color:var(--ink)}#toast{background:var(--primary);color:var(--primary-ink)}.template-card canvas{background:#f5f5ee}.panel,.canvas-panel,.card{border-radius:8px}.tools button,.dialog-head,th{background:var(--subtle);color:var(--ink)}.tools button.selected{background:var(--selected);color:var(--ink);box-shadow:inset 0 0 0 1px var(--focus)}.swatch{background:var(--control)}.canvas-viewport{background:repeating-conic-gradient(var(--canvas-a) 0% 25%,var(--canvas-b) 0% 50%) 0/22px 22px;color:var(--ink)}.dialog-head{border-color:var(--line)}dialog::backdrop,.processing-dialog::backdrop{background:var(--backdrop)}.export-options button:focus-visible,button:focus-visible,a:focus-visible{outline-color:var(--focus)}.settings-panel h1{font-family:"Songti SC","SimSun",serif;font-weight:400}.logo{color:var(--ink);font-weight:400}.editor-footer{background:var(--surface)}.editor-stage{background:var(--paper)}#cropBox [data-handle]::after{background:var(--focus)}.logo>img{width:34px;height:34px}
.theme-switch{display:inline-flex;flex-shrink:0;border:1px solid var(--line);border-radius:6px;padding:3px;gap:3px}.theme-switch button{font-size:12px;padding:6px 10px;background:transparent;min-height:34px;white-space:nowrap}.theme-switch button[aria-pressed="true"]{background:var(--primary);color:var(--primary-ink)}@media(max-width:850px){.topbar{gap:8px}.theme-switch{margin-left:auto}.theme-switch button{padding:5px 8px;min-height:34px}}

:root{--paper:#18202b;--ink:#f0f4fa;--muted:#b7c1d0;--line:#ffffff26;--surface:#263242e8;--subtle:#ffffff08;--control:#ffffff12;--selected:#c3d7fb24;--primary:#e4edfb;--primary-ink:#182537;--blue:#e4edfb;--accent:#c7d9f4;--green:#354c45;--canvas-a:#273241;--canvas-b:#2c3848;--focus:#9cc6ff;--glass-edge:#ffffff20;--glass-shadow:#060e1b35;--glass-glow:#ffffff09;--backdrop:#07101ca6}
:root[data-theme="light"]{--paper:#edf1f7;--ink:#233044;--muted:#52627a;--line:#425b7826;--surface:#ffffffdb;--subtle:#ffffff62;--control:#ffffffb8;--selected:#c9d9ec;--primary:#283e59;--primary-ink:#fff;--blue:#283e59;--accent:#415c7b;--green:#e0ece4;--canvas-a:#e4eaf1;--canvas-b:#f5f7fa;--focus:#3c6b9f;--glass-edge:#ffffffdb;--glass-shadow:#344d6c12;--glass-glow:#ffffff82;--backdrop:#192d4866}
body{background:radial-gradient(ellipse at 0 0,#7294bf24,transparent 55%),radial-gradient(ellipse at 100% 30%,#a0b5c21a,transparent 55%),var(--paper)}
.topbar{background:var(--surface);border-bottom:1px solid var(--line);box-shadow:0 1px 0 var(--glass-edge);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.panel,.canvas-panel,.card,dialog{background:linear-gradient(135deg,var(--glass-glow),transparent 65%),var(--surface);border:1px solid var(--line);border-radius:20px;box-shadow:inset 0 1px 0 var(--glass-edge),0 12px 35px var(--glass-shadow)}
.panel,.canvas-panel,dialog{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
button,input,select,textarea,.outline,.toolbar button{border:1px solid var(--line);border-radius:11px;box-shadow:inset 0 1px 0 var(--glass-edge);min-height:40px}
button{transition:background-color .16s,border-color .16s,box-shadow .16s;touch-action:manipulation}
button:hover:not(:disabled){filter:none;border-color:var(--focus);background:var(--selected)}
button:active:not(:disabled){box-shadow:inset 0 2px 5px var(--glass-shadow)}
button.primary,.primary{border-color:transparent;box-shadow:0 3px 10px var(--glass-shadow);background:var(--primary);color:var(--primary-ink)}
button.primary:hover:not(:disabled){background:var(--primary);color:var(--primary-ink);filter:brightness(.95)}
button:disabled{opacity:.55;cursor:not-allowed}.danger{color:#ffb7af}:root[data-theme="light"] .danger{color:#a52729}
.topbar nav button{border-color:transparent;box-shadow:none}.topbar nav button.active{box-shadow:inset 0 1px 0 var(--glass-edge);border-color:var(--line)}
.theme-switch{background:var(--subtle);border-radius:13px}.theme-switch button{border:0;box-shadow:none;border-radius:9px}.theme-switch button[aria-pressed="true"]{background:var(--primary);color:var(--primary-ink);box-shadow:0 2px 7px var(--glass-shadow)}
.parameter-details,.upload,.notice,.settings-section,.plan,.stock-item{border-radius:14px}.parameter-details summary{color:var(--ink);min-height:32px}
.upload{border-color:var(--line);box-shadow:inset 0 1px 0 var(--glass-edge)}.upload:hover{border-color:var(--focus)}
.source-placeholder{border-radius:13px;background:var(--subtle)}
.name-input{background:transparent;border:0;border-radius:0;box-shadow:none;min-height:32px}
.tools button.selected,.toolbar button.selected,.filters .selected,.editor-tabs .selected,.crop-ratios button.selected,[data-brush].selected{background:var(--selected);color:var(--ink);border-color:var(--focus);box-shadow:inset 0 0 0 1px var(--focus)}
.generate-bar{border-radius:18px!important;background:var(--surface)!important;box-shadow:inset 0 1px 0 var(--glass-edge),0 8px 30px var(--glass-shadow);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.dialog-head{background:var(--surface);box-shadow:none}.dialog-head .close{min-width:44px}.editor-footer{background:var(--surface)}
input[type=checkbox]{min-height:0;width:18px;height:18px;flex-shrink:0;accent-color:var(--focus);box-shadow:none}
input[type=range]{box-shadow:none;min-height:32px;background:transparent;accent-color:var(--focus)}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.swatch{border-radius:9px;min-height:40px}.swatch.chosen{border-color:var(--focus)}
.canvas-empty .pixel-icon{color:var(--accent)}.canvas-viewport{border-radius:14px}.canvas-empty h2{font-weight:650}
@media(max-width:850px){button,input:not([type=checkbox]):not([type=range]),select{min-height:44px}.panel,.canvas-panel,.card,dialog{border-radius:18px}.panel,.canvas-panel{-webkit-backdrop-filter:none;backdrop-filter:none}.topbar{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.generate-bar{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}}
@media(prefers-reduced-transparency:reduce){.panel,.canvas-panel,.card,.topbar,dialog,.generate-bar{-webkit-backdrop-filter:none;backdrop-filter:none;background:var(--paper)!important}}
@media(max-width:850px){.topbar nav button,button.small,.toolbar button,.tools button{min-height:44px}}
input::placeholder,textarea::placeholder{color:var(--muted);opacity:1}
/* Explicit controls avoid black native checkboxes in iOS embedded browsers. */
input[type=checkbox]{-webkit-appearance:none;appearance:none;display:inline-block;width:20px;height:20px;min-width:20px;padding:0!important;border:1.5px solid var(--muted);border-radius:5px;background:var(--control);vertical-align:middle;cursor:pointer}
input[type=checkbox]:checked{background-color:#3979cf;border-color:#3979cf;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m4 10 4 4 8-8' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-size:100% 100%}
input[type=checkbox]:focus-visible{outline:2px solid var(--focus);outline-offset:3px}
input[type=checkbox]:disabled{opacity:.5;cursor:not-allowed}
/* Some Chromium/Quark versions paint native menus white regardless of theme. */
select{color-scheme:light}
select option,select optgroup{background:#fff;color:#172337;-webkit-text-fill-color:#172337}
.export-options button{font-weight:600}
.export-entitlement{font-size:13px;color:var(--muted);margin:10px 0}
.download-fallback{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}.download-fallback .button{display:inline-flex;align-items:center;min-height:44px;padding:10px 14px;text-decoration:none;border-radius:11px}