:root { --freeify-action-ink: #101321; --freeify-focus: #f1d978; }
html[data-theme=light] {
  color-scheme: light;
  --freeify-bg: #f5f0e8;
  --freeify-panel: #fffdf8;
  --freeify-raised: #ece5d9;
  --freeify-text: #252a36;
  --freeify-muted: #535d6d;
  --freeify-gold: #80601d;
  --freeify-line: #beb6a7;
  --freeify-action-ink: #ffffff;
  --freeify-focus: #715014;
  --studio-teal-950: #e4dbc9;
  --studio-teal-900: #efe6d4;
  --studio-teal-800: #80601d;
  --studio-teal-100: #ece5d9;
  --suite-border-strong: #a99f8d;
  --suite-accent-strong: #80601d;
}
html { scroll-padding-top: 76px; }
body[data-studio] { padding-top: 60px; }
body[data-studio] .theme-rail { position: fixed; inset: 0 0 auto; height: 60px; z-index: 1000; display: flex; align-items: center; justify-content: flex-end; gap: 12px; padding: 8px 20px; background: var(--freeify-bg); border-bottom: 1px solid var(--freeify-line); }
body[data-studio] .theme-current { font: 400 .875rem system-ui,sans-serif; color: var(--freeify-muted); }
body[data-studio] #themeToggle { display: inline-flex; align-items: center; justify-content: center; min-width: 94px; min-height: 44px; padding: 8px 14px; border: 1px solid var(--freeify-line); border-radius: 4px; font: 600 .875rem system-ui,sans-serif; background: var(--freeify-raised); color: var(--freeify-text); box-shadow: none; cursor: pointer; }
body[data-studio] #themeToggle:hover { border-color: var(--freeify-gold); }
body[data-studio] :is(a,button,input,select,[tabindex]):focus-visible,
body[data-studio] :is(.upload,.drop):focus-within { outline-color: var(--freeify-focus); }
body[data-studio] .skip-link:focus { top: 68px; }
body[data-studio] :is(.modal,.preview-modal) { top: 60px; }
body[data-studio] .modal { backdrop-filter: none; }
body[data-studio] .modal-box { height: calc(100dvh - 96px); max-height: calc(100dvh - 96px); }
body[data-studio] .preview-box { max-height: calc(100dvh - 100px); overflow: auto; }
body[data-studio] .preview-box img { max-height: calc(100dvh - 190px); }
@media(max-width:620px) {
  body[data-studio] .theme-rail { padding-right: 12px; }
  body[data-studio=collage] .toolbar { top: 60px; }
  body[data-studio=collage][data-tools-open=true] .studio-tools-toggle-button { top: 74px; }
}
/* Explicit surface colors: artwork, canvases and decoded file pixels are never inverted. */
html[data-theme=light] body[data-studio] :is(.freeify-intro h1 em,.freeify-tool-meta>span:first-child,.freeify-privacy strong,.settings-label,.tool-status,.freeify-tip strong,.studio-pdf-output-head #count,.freeify-tip a) { color: var(--freeify-gold); }
html[data-theme=light] body[data-studio] :is(.freeify-tool:hover,.drop:hover,.global-controls label,.toolbar #status,.status:not(:empty),.notice,.studio-pdf-output-head #count) { background: var(--freeify-raised); color: var(--freeify-muted); }
html[data-theme=light] body[data-studio] :is(.toolbar .settings input,.toolbar input[type=number]) { background: #fffdf8; color: var(--freeify-text); border-color: var(--freeify-line); }
html[data-theme=light] body[data-studio] :is(.toolbar button,.toolbar select,.toolbar .upload,.page .controls button,.modal-actions button,#modalDone,#closePreview):hover { background: #e0d4bd; color: var(--freeify-text); }
html[data-theme=light] body[data-studio] :is(.toolbar #preview,#download,.tool-shell #convert.primary) { background: var(--freeify-gold); color: var(--freeify-action-ink); border-color: var(--freeify-gold); }
html[data-theme=light] body[data-studio] :is(.toolbar #preview,#download):hover:not(:disabled) { background: #654a12; color: #fff; }
html[data-theme=light] body[data-studio] #download:disabled { background: #e1dacd; color: #616573; border-color: var(--freeify-line); }
html[data-theme=light] body[data-studio] :is(.page .controls button.delete,.modal-actions #modalDelete) { background: #f7e5e5; color: #8a293b; border-color: #bb8c95; }
html[data-theme=light] body[data-studio] :is(.modal-preview,.canvas-wrap,.thumbnail) { background: #ded8ce; color: #374051; border-color: var(--freeify-line); }
html[data-theme=light] body[data-studio] :is(.tool-error) { color: #982c3c; }
html[data-theme=light] body[data-studio] .tool-shell input[type=file]::file-selector-button { background: var(--freeify-gold); color: #fff; }
html[data-theme=light] body[data-studio] .page-choice:focus-within { outline-color: var(--freeify-focus); }
@media(prefers-reduced-motion:reduce) { body[data-studio] *,body[data-studio] *::before,body[data-studio] *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; } }
