:root,[data-theme="light"]{--bg:#fff;--bg-secondary:#f7f7f5;--surface:#fff;--surface-elevated:#f4f4f2;--text-primary:#101010;--text-secondary:#696969;--border:rgba(0,0,0,.09);--brand:#ff6b00;--brand-hover:#ff7a18;--brand-soft:#fff0e5;--warning:#ffc928;--success:#22c55e;--danger:#ef4444;--on-brand:#101010;--overlay:rgba(0,0,0,.6);--background:var(--bg);--surface-secondary:var(--surface-elevated);--orange:var(--brand);--mango:var(--brand);--admin-bg:var(--bg);--admin-sidebar:var(--bg-secondary);--admin-panel:var(--surface);--admin-elevated:var(--surface-elevated);--admin-border:var(--border);--admin-text:var(--text-primary);--admin-muted:var(--text-secondary)}
[data-theme="dark"]{--bg:#090909;--bg-secondary:#0d0d0d;--surface:#121212;--surface-elevated:#181818;--text-primary:#f7f7f5;--text-secondary:#969696;--border:rgba(255,255,255,.08);--brand-soft:rgba(255,107,0,.12)}
html,body{background-color:var(--bg);color:var(--text-primary)}body :is(input,select,textarea){color:var(--text-primary);background-color:var(--surface-elevated);border-color:var(--border)}body :is(dialog,.auth-panel,.admin-panel){background:var(--surface);color:var(--text-primary)}body :is(.primary,.btn-primary,.btn-slide){color:var(--on-brand)}.appearance-control{width:38px;height:38px;min-width:38px;display:inline-grid;place-items:center;border:1px solid var(--border);background:var(--surface);color:var(--text-primary);border-radius:50%;padding:8px;cursor:pointer}.appearance-floating{position:fixed;top:14px;right:14px;z-index:80}.appearance-dialog{width:300px;max-width:calc(100vw - 24px);border:1px solid var(--border);border-radius:14px;padding:20px;color:var(--text-primary);background:var(--surface)}.appearance-dialog::backdrop{background:var(--overlay)}.appearance-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.appearance-heading h2{font-size:18px}.appearance-heading button{background:none;color:inherit;border:0;font-size:22px;cursor:pointer}.appearance-dialog>[data-theme-choice]{display:flex;align-items:center;gap:12px;padding:14px;width:100%;background:var(--surface);border:1px solid transparent;border-radius:8px;color:var(--text-primary);cursor:pointer}.appearance-dialog>[aria-pressed=true]{background:var(--brand-soft);border-color:var(--brand)}.appearance-dialog i{margin-left:auto}.appearance-dialog [aria-pressed=true] i{width:6px;height:6px;border-radius:50%;background:var(--brand)}.theme-save-status{font-size:12px;color:var(--text-secondary);line-height:1.6}.theme-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;max-width:900px;margin:32px 0}.theme-choice{padding:16px;border:1px solid var(--border);border-radius:12px;background:var(--surface);text-align:left;color:var(--text-primary);cursor:pointer}.theme-choice[aria-pressed=true]{border-color:var(--brand);box-shadow:0 0 0 2px var(--brand-soft)}.theme-choice strong,.theme-choice small{display:block;margin-top:12px}.theme-choice small{color:var(--text-secondary)}.theme-mini{height:130px;display:flex;gap:10px;padding:12px;border-radius:7px;background:#eee;color:#fff;overflow:hidden}.theme-mini>i{width:22%;background:#fff;border-radius:4px}.theme-mini>span{display:flex;gap:5px;flex:1;align-items:center}.theme-mini b{width:33%;height:60%;background:#fff;border-radius:4px;border-top:4px solid var(--brand)}.theme-mini.dark{background:#090909}.theme-mini.dark :is(i,b){background:#252525}.theme-mini.system{background:linear-gradient(90deg,#eee 50%,#090909 50%)}.theme-mini.system b:nth-child(n+2){background:#252525}@media(max-width:600px){.theme-choices{grid-template-columns:1fr}.theme-mini{height:100px}.appearance-control{width:36px;height:36px;min-width:36px}}@media(prefers-reduced-motion:no-preference){body,.panel,dialog,input,button,header,footer,aside{transition:background-color 180ms,border-color 180ms,color 180ms}}

:root{--dashboard-bg:var(--bg);--dashboard-sidebar:var(--bg-secondary);--dashboard-panel:var(--surface);--dashboard-card:var(--surface-elevated);--dashboard-hover:var(--surface-elevated);--dashboard-border:var(--border);--dashboard-text:var(--text-primary);--dashboard-muted:var(--text-secondary);--text:var(--text-primary);--muted:var(--text-secondary);--surface-hover:var(--surface-elevated);--workspace-bg:var(--bg);--black:var(--bg);--black-soft:var(--surface);--black-elevated:var(--surface-elevated);--white:var(--surface);--pure-white:var(--surface);--off-white:var(--bg-secondary);--ink-black:var(--text-primary);--soft-black:var(--text-primary);--finish-border:var(--border);--mango-orange:var(--brand);--mango-orange-hover:var(--brand-hover);--mango-orange-soft:var(--brand-soft);--orange-soft:var(--brand-soft);--orange-hover:var(--brand-hover)}
.appearance-control{color:var(--text-primary)!important;background:var(--surface)!important;line-height:1}.topbar>.appearance-control{margin-left:8px}.auth-visual{color:#f7f7f5;--text-primary:#f7f7f5;--text-secondary:#969696;--border:rgba(255,255,255,.08)}.auth-panel .top-link{display:flex;align-items:center;gap:12px}.theme-choice[aria-pressed=true]{border-color:var(--brand)}
.marketing-nav>.appearance-control{order:1;flex-shrink:0}.marketing-nav>.mobile-menu{order:2}@media(max-width:650px){.marketing-nav{gap:12px!important}.marketing-nav>.appearance-control{margin-left:0}.marketing-nav .wordmark{margin-right:auto}.marketing-nav>.mobile-menu{margin-left:0!important}.marketing-nav .mobile-language-trigger{margin-left:0!important}}
.editor-save-controls{display:flex;align-items:center;gap:5px;margin-left:auto}.editor-save-controls>span{font-size:10px;color:var(--text-secondary);max-width:220px;overflow-wrap:anywhere}.editor-save-controls .btn{min-height:30px!important;padding:5px 8px!important;font-size:10px!important}@media(max-width:650px){.editor-save-controls{flex-wrap:wrap;margin:0}.editor-save-controls>span{max-width:120px}}

/* Global close control: one visual and interaction contract across every surface. */
.close-button{--close-bg:color-mix(in srgb,var(--surface,#fff) 82%,transparent);--close-border:color-mix(in srgb,var(--text-primary,#111) 14%,transparent);--close-hover:color-mix(in srgb,var(--text-primary,#111) 9%,var(--surface,#fff));display:inline-grid!important;place-items:center!important;flex:0 0 38px;width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important;padding:0!important;border:1px solid var(--close-border)!important;border-radius:10px!important;background:var(--close-bg)!important;color:var(--text-primary,#15191d)!important;font-size:0!important;line-height:1!important;cursor:pointer;box-shadow:none!important;backdrop-filter:blur(10px);transition:background-color 170ms ease,border-color 170ms ease,color 170ms ease,transform 170ms ease!important}
.close-button svg{display:block;width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.close-button:hover{background:var(--close-hover)!important;border-color:color-mix(in srgb,var(--text-primary,#111) 25%,transparent)!important;transform:translateY(-1px)}
.close-button:active{transform:translateY(0) scale(.97)}
.close-button:focus-visible{outline:2px solid var(--brand,#168eff)!important;outline-offset:2px}
.dialog-head .close-button,.appearance-heading .close-button,.privacy-dialog header .close-button{margin-left:auto}
dialog>.close-button,.studio-dialog>.close-button,.fullscreen-close-button{position:absolute!important;z-index:20;top:max(14px,env(safe-area-inset-top))!important;right:max(14px,env(safe-area-inset-right))!important}
.fullscreen-close-button{position:fixed!important;background:rgba(8,14,21,.78)!important;border-color:rgba(255,255,255,.2)!important;color:#fff!important}
.workspace-drawer-close,.admin-drawer-close{display:none!important;position:absolute!important;z-index:5;top:14px!important;right:14px!important}
html[data-theme=dark] .close-button{--close-bg:rgba(12,22,32,.78);--close-border:rgba(210,232,247,.18);--close-hover:rgba(45,67,84,.82);color:#e9f4fb!important}
@media(max-width:767px){body.drawer-open .workspace-drawer-close,body.nav-open .admin-drawer-close{display:inline-grid!important}.workspace-sidebar:has(.workspace-drawer-close) .sidebar-brand-row,.admin-sidebar:has(.admin-drawer-close) .admin-brand{padding-right:48px}}
@media(prefers-reduced-motion:reduce){.close-button{transition:none!important}}