/* Original cream frame by default; desktop themes are explicit visitor choices. */
:root{--frame:#f5efd9;--frame-light:#fffdf0;--frame-dark:#bcb59f;--title:#f5efd9;--title-text:#151b11;--control:#f5efd9;--control-light:#182011;--control-dark:#bcb59f;--control-ink:#172011;--toolbar:#f5efd9;--toolbar-ink:#172011;--toolbar-light:#fffdf0;--toolbar-dark:#bcb59f;--selected:#e4ddc4}
[data-theme=xp]{--frame:#2366dc;--frame-light:#78b6ff;--frame-dark:#123b97;--title:#1256cd;--title-text:#fff;--control:#357bea;--control-light:#b2d9ff;--control-dark:#103c97;--control-ink:#fff;--toolbar:#ece9d8;--toolbar-ink:#172331;--toolbar-light:#fffdf2;--toolbar-dark:#99998f;--selected:#d4e1f8}
.window-wrap{filter:drop-shadow(6px 6px 0 rgb(8 16 8 / 22%));transition:none}
.pixel-window{position:relative;border:4px solid #070c0a;border-radius:0;padding:4px;background:var(--frame);box-shadow:inset 2px 2px var(--frame-light),inset -2px -2px var(--frame-dark);clip-path:none}
.titlebar{height:36px;padding:2px 4px 5px 6px;background:var(--title);color:var(--title-text);box-shadow:inset 0 2px var(--frame-light),inset 0 -2px var(--frame-dark)}
.app-name{font-size:18px;white-space:nowrap;text-shadow:none}[data-theme=xp] .app-name{text-shadow:2px 2px var(--frame-dark)}
.window-controls{gap:4px}.window-controls button{width:27px;height:27px;border:2px solid var(--control-light);background:var(--control);color:var(--control-ink);box-shadow:inset 2px 2px var(--frame-light),inset -2px -2px var(--control-dark),1px 1px var(--frame-dark)}
.window-controls .min-icon{background:var(--control-ink)}.window-controls .max-icon{border-color:var(--control-ink)}
.close-icon{display:block;position:relative;width:14px;height:14px;font-size:0;transform:none;background:transparent;clip-path:none}.close-icon:before{content:'';position:absolute;left:0;top:0;width:2px;height:2px;background:var(--control-ink);box-shadow:12px 0 var(--control-ink),2px 2px var(--control-ink),10px 2px var(--control-ink),4px 4px var(--control-ink),8px 4px var(--control-ink),6px 6px var(--control-ink),4px 8px var(--control-ink),8px 8px var(--control-ink),2px 10px var(--control-ink),10px 10px var(--control-ink),0 12px var(--control-ink),12px 12px var(--control-ink)}
[data-theme=xp] #close-window{background:#de533c;border-color:#ffdbc1;box-shadow:inset 2px 2px #ff9876,inset -2px -2px #9c291d,1px 1px #123b97}
.theme-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:7px 8px;background:var(--toolbar);color:var(--toolbar-ink);box-shadow:inset 0 2px var(--toolbar-light),inset 0 -2px var(--toolbar-dark)}
.theme-label{font:10px var(--pixel);margin-right:3px}.theme-toolbar button{font:11px var(--pixel);padding:6px 8px 5px;background:var(--toolbar);color:var(--toolbar-ink);border:1px solid var(--toolbar-dark);box-shadow:inset 1px 1px var(--toolbar-light),1px 1px var(--toolbar-dark);white-space:nowrap}
.theme-toolbar button[aria-pressed=true]{background:var(--selected);box-shadow:inset 2px 2px var(--toolbar-dark);border-color:var(--toolbar-ink)}
.theme-toolbar button:focus-visible{outline:2px dashed var(--toolbar-ink);outline-offset:2px}
.window-content{margin:4px 0 0;border:2px solid #09120c;padding:14px 18px 10px;box-shadow:inset 2px 2px #26352b}
.window-wrap.minimized .pixel-window{padding-bottom:4px}.window-wrap.minimized .theme-toolbar{display:none}
.pixel-dialog{border-color:var(--frame);box-shadow:0 0 0 3px #070c0a,6px 6px rgb(8 16 8 / 22%)}.dialog-titlebar{background:var(--title);color:var(--title-text);border-bottom-color:var(--frame-dark);box-shadow:inset 0 2px var(--frame-light)}.dialog-close{background:var(--control);border-color:var(--control-light);color:var(--control-ink);box-shadow:inset -2px -2px var(--control-dark)}
[data-theme="95"]{--frame:#c0c0c0;--frame-light:#fff;--frame-dark:#808080;--title:#000080;--title-text:#fff;--control:#c0c0c0;--control-light:#fff;--control-dark:#808080;--control-ink:#080808;--toolbar:#c0c0c0;--toolbar-ink:#101010;--toolbar-light:#fff;--toolbar-dark:#808080;--selected:#dedede}
[data-theme="95"] .pixel-window{clip-path:none;box-shadow:inset 2px 2px #fff,inset -2px -2px #808080}
[data-theme="95"] .titlebar{box-shadow:none;height:33px;padding:3px 4px 3px 7px}.app-name img{image-rendering:pixelated}
[data-theme="95"] .app-name{text-shadow:none}
[data-theme="mac"]{--frame:#dddcd6;--frame-light:#fff;--frame-dark:#777770;--title:#f6f5ef;--title-text:#111;--control:#dddcd6;--control-light:#fff;--control-dark:#888;--control-ink:#111;--toolbar:#eeede7;--toolbar-ink:#111;--toolbar-light:#fff;--toolbar-dark:#999;--selected:#cecec7}
[data-theme="mac"] .titlebar{display:grid;grid-template-columns:88px 1fr 88px;position:relative;height:35px;padding:2px 6px;background:#e8e7e2;border:0;border-bottom:1px solid #adada6;box-shadow:inset 0 2px #fff}
[data-theme="mac"] .app-name{grid-column:2;grid-row:1;justify-self:center;justify-content:center;background:transparent;padding:2px 8px;text-shadow:none;z-index:1;font-size:16px}
[data-theme="mac"] .window-controls{grid-column:1;grid-row:1;gap:7px;background:transparent;padding:2px;z-index:2}
[data-theme="mac"] .window-controls button{width:18px;height:18px;border:1px solid #0003;border-radius:50%;box-shadow:inset 0 1px #fff5;padding:0}
[data-theme="mac"] #close-window{background:#ff6058}[data-theme="mac"] #minimize{background:#ffbd2e}[data-theme="mac"] #maximize{background:#28c840}
[data-theme="mac"] .window-controls button>span{opacity:0}[data-theme="mac"] .window-controls:hover button>span,[data-theme="mac"] .window-controls button:focus-visible>span{opacity:.7}
[data-theme="mac"] .dialog-close{background:#ff6058;border:1px solid #0003;border-radius:50%;width:22px;height:22px;font-size:18px;box-shadow:inset 0 1px #fff5}
[data-theme="mac"] #close-window{order:-1}.window-controls button:active{box-shadow:inset 2px 2px var(--control-dark)}
[data-theme="mac"] .min-icon{width:8px;height:2px;margin:0;align-self:center}[data-theme="mac"] .max-icon{width:8px;height:8px;border-width:1px}[data-theme="mac"] .close-icon{width:8px;height:8px;clip-path:none;background:transparent;border:0;font:14px/8px 'Courier New',monospace}
[data-theme="mac"] .theme-toolbar{justify-content:center;border-bottom:2px solid #111}
[data-theme="mac"] .close-icon:before{display:none}
@media(max-width:470px){.pixel-window{padding:4px;border-width:4px}.titlebar{height:33px;padding-left:4px}.app-name{font-size:14px;gap:4px}.app-name img{width:16px;height:16px}.window-controls button{width:23px;height:23px}.theme-toolbar{padding:6px 4px;gap:4px}.theme-label{font-size:8px;margin:0}.theme-toolbar button{font-size:9px;padding:6px 5px}.window-content{padding:12px 10px 10px}[data-theme="mac"] .titlebar{grid-template-columns:70px 1fr 10px;padding:2px 3px}[data-theme="mac"] .app-name{font-size:13px;padding:2px 3px}[data-theme="mac"] .app-name img{display:none}[data-theme="mac"] .window-controls{gap:3px}}
/* A small rainbow wheel sits directly beside minimize in every desktop shell. */
.titlebar,[data-theme="95"] .titlebar,[data-theme="mac"] .titlebar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px;height:36px;padding:4px 6px;border:0}
.app-name{grid-column:1;grid-row:1;min-width:0}.window-controls{grid-column:2;grid-row:1}
.window-controls{align-items:center}
#theme-toggle{width:24px;height:24px;padding:2px;border:0;border-radius:50%;background:transparent;box-shadow:none;display:grid;place-items:center}
#theme-toggle .rainbow-wheel{display:block;width:20px;height:20px;border-radius:50%;opacity:1;background:conic-gradient(#ff4b55 0deg 45deg,#ff9b36 45deg 90deg,#ffe543 90deg 135deg,#63d94d 135deg 180deg,#38cfd4 180deg 225deg,#4588ff 225deg 270deg,#8e5ce5 270deg 315deg,#eb59b8 315deg 360deg);box-shadow:inset 0 0 0 1px #0003;animation:rainbow-spin 4s linear infinite}
#theme-toggle:focus-visible{outline:2px dashed var(--title-text);outline-offset:2px}
[data-theme="mac"] .titlebar{grid-template-columns:minmax(0,1fr) auto}[data-theme="mac"] .window-controls{grid-column:2}[data-theme="mac"] .app-name{grid-column:1;justify-self:start;padding:0}
.window-controls,[data-theme="mac"] .window-controls{display:grid;grid-template-columns:24px repeat(3,27px);grid-auto-rows:27px;gap:4px;padding:0;align-items:center;justify-items:center}
[data-theme="mac"] #close-window{order:0}
@keyframes rainbow-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){#theme-toggle .rainbow-wheel{animation:none}}
@media(max-width:470px){.window-controls,[data-theme="mac"] .window-controls{grid-template-columns:24px repeat(3,23px);grid-auto-rows:24px}}