/* RageOS presentation never changes desktop state or the damage canvases. */
.appearance-bar{gap:12px 24px;flex-wrap:wrap;justify-content:space-between}
.os-era-setting{min-width:0}.os-era-setting select{max-width:245px}
.rageos-mark{width:18px;height:18px;flex-shrink:0;color:#b8452c;--os-logo-cut:#c5cbc4}
.site-wordmark{white-space:nowrap}

:root[data-os-era]{
  --os-panel:#c5cbc4;--os-field:#f5f4e9;--os-text:#192d28;--os-muted:#43594f;
  --os-accent:#285c4c;--os-accent-text:#fffceb;--os-title:linear-gradient(90deg,#284b40,#658473);
  --os-inactive:#758479;--os-line:#7f8c80;--os-edge:#eef2e6;
  --os-border:2px outset var(--os-edge);--os-radius:0px;--os-button-radius:0px;
  --os-shadow:1px 1px #17271e,3px 5px 8px #0004;--os-font:Tahoma,Arial,sans-serif;
  --os-bar:#b9c2b8;--os-boot:#d9ddca;--os-boot-text:#263f35;--os-logo:#b8452c;
  --os-logo-cut:var(--os-boot);--os-icon-filter:none;--os-note:#eee2ab;
}
:root[data-os-era="80s"]{
  --os-panel:#10251b;--os-field:#07180e;--os-text:#b5f3ad;--os-muted:#8ebf8b;
  --os-accent:#b5f3ad;--os-accent-text:#10251b;--os-title:#b5f3ad;
  --os-inactive:#234a2d;--os-line:#608f5d;--os-edge:#608f5d;
  --os-border:1px solid var(--os-line);--os-shadow:4px 4px #020b05;
  --os-font:'Courier New',monospace;--os-bar:#10251b;--os-boot:#07180e;
  --os-boot-text:#b5f3ad;--os-logo:#b5f3ad;--os-note:#193520;
  --os-icon-filter:grayscale(1) sepia(1) hue-rotate(55deg) saturate(.8);
}
:root[data-os-era="00s"]{
  --os-panel:#d7e0e2;--os-field:#f7fbfb;--os-text:#16383d;--os-muted:#3e656b;
  --os-accent:#166c7a;--os-accent-text:#fff;--os-title:linear-gradient(#7db8c2,#427e8d 46%,#215667 49%,#467c85);
  --os-inactive:linear-gradient(#bccdd1,#768f99);--os-line:#6b8b91;--os-edge:#f7ffff;
  --os-border:2px solid #73969e;--os-radius:9px;--os-button-radius:5px;
  --os-shadow:0 4px 14px #08282c66,inset 0 1px #fff;
  --os-bar:linear-gradient(#e6f6f5,#95bac2 48%,#618b97 49%,#aac8cd);
  --os-boot:#163e50;--os-boot-text:#e0faff;--os-logo:#83e0df;--os-note:#fff2c4;
}
:root[data-os-era="10s"]{
  --os-panel:#edf2f1;--os-field:#fff;--os-text:#203c3a;--os-muted:#4e6865;
  --os-accent:#127c83;--os-accent-text:#fff;--os-title:#127c83;--os-inactive:#839c9a;
  --os-line:#94b7b3;--os-edge:#94b7b3;--os-border:1px solid var(--os-line);
  --os-shadow:0 3px 9px #063a3440;--os-font:Arial,sans-serif;
  --os-bar:#e1eeeb;--os-boot:#127c83;--os-boot-text:#fff;--os-logo:#fff;--os-note:#ffe3ad;
}
:root[data-os-era="20s"]{
  --os-panel:#f0ede8;--os-field:#fffdf9;--os-text:#3e3947;--os-muted:#706674;
  --os-accent:#825b70;--os-accent-text:#fff;--os-title:#e2d6de;--os-inactive:#e9e3e6;
  --os-line:#c5bbc6;--os-edge:#fffafc;--os-border:1px solid #ffffffcc;
  --os-radius:11px;--os-button-radius:7px;--os-shadow:0 7px 20px #352b4652;
  --os-font:Arial,sans-serif;--os-bar:#eee8e2;--os-boot:#eee8e2;
  --os-boot-text:#514154;--os-logo:#a45e74;--os-note:#ffedd0;
}
:root[data-os-era="modern"]{
  --os-panel:#212c38;--os-field:#17212d;--os-text:#e6eef2;--os-muted:#adc0ca;
  --os-accent:#ff9879;--os-accent-text:#202b37;--os-title:linear-gradient(115deg,#354559,#283747);
  --os-inactive:#253140;--os-line:#54687c;--os-edge:#54687c;
  --os-border:1px solid #ffffff38;--os-radius:13px;--os-button-radius:8px;
  --os-shadow:0 8px 25px #02081188,inset 0 1px #ffffff16;--os-font:Arial,sans-serif;
  --os-bar:linear-gradient(115deg,#283645,#1c2835);--os-boot:#152332;
  --os-boot-text:#e8f5fa;--os-logo:#ff9879;--os-note:#465246;
}

:root[data-os-era] .desktop{background:var(--os-boot);font-family:var(--os-font)}
:root[data-os-era] .desktop :is(button,input,select,textarea){font-family:var(--os-font)}
:root[data-os-era] .desktop .desktop-window[data-window]{background:var(--os-panel);color:var(--os-text);border:var(--os-border);border-radius:var(--os-radius);box-shadow:var(--os-shadow)}
:root[data-os-era] .desktop .desktop-window[data-window]>.window-title{background:var(--os-inactive);color:var(--os-text);font-family:var(--os-font)}
:root[data-os-era] .desktop .desktop-window.active-window>.window-title{background:var(--os-title);color:var(--os-accent-text)}
:root[data-os-era="20s"] .desktop .desktop-window.active-window>.window-title,
:root[data-os-era="modern"] .desktop .desktop-window.active-window>.window-title{color:var(--os-text)}
:root[data-os-era] .desktop :is(.app-body,.window-status,.app-status,.retro-program .app-body){background:var(--os-panel);color:var(--os-text);border-color:var(--os-line);font-family:var(--os-font)}
:root[data-os-era] .desktop :is(.fake-button,.window-buttons button,.app-toolbar button,.app-body>button,.file-delete,.file-row>button:last-child,.workload-pause,.calendar-toolbar button,.damage-dialog .window-actions button,.retro-button,.calculator-keys button){background:var(--os-panel);color:var(--os-text);border:var(--os-border);border-radius:var(--os-button-radius);box-shadow:none}
:root[data-os-era] .desktop :is(.file-list,.process-list,.file-entry,.notepad-editor,.wordpad-editor,.explorer-address,.calculator-display,.calendar-grid,.retro-program input,.retro-program select){background:var(--os-field);color:var(--os-text);border-color:var(--os-line)}
:root[data-os-era] .desktop :is(.retro-note,.program-group>b,.calendar-grid>b,.start-menu-heading){color:var(--os-muted);border-color:var(--os-line)}
:root[data-os-era] .desktop .taskbar{background:var(--os-bar);color:var(--os-text);border-top:var(--os-border)}
:root[data-os-era] .desktop :is(.start-button,.taskbar-clock,.show-desktop,.taskbar-apps .taskbar-task){background:var(--os-panel);color:var(--os-text);border:var(--os-border);border-radius:var(--os-button-radius)}
:root[data-os-era] .desktop .taskbar-task[aria-pressed=true],
:root[data-os-era] .desktop .start-button[aria-expanded=true]{background:var(--os-accent);color:var(--os-accent-text)}
:root[data-os-era] .desktop .rageos-mark{color:var(--os-logo);--os-logo-cut:var(--os-panel)}
:root[data-os-era] .desktop :is(.win-start-menu,.desktop-context){background:var(--os-panel);color:var(--os-text);border:var(--os-border);border-radius:var(--os-radius);box-shadow:var(--os-shadow)}
:root[data-os-era] .desktop .start-rail{background:var(--os-title);color:var(--os-accent-text);font-family:var(--os-font);letter-spacing:.4px}
:root[data-os-era="20s"] .desktop .start-rail,
:root[data-os-era="modern"] .desktop .start-rail{color:var(--os-text)}
:root[data-os-era] .desktop :is(.win-start-menu>button,.desktop-context>button,.retro-menu-group button){color:var(--os-text)}
:root[data-os-era] .desktop :is(.win-start-menu>button,.desktop-context>button,.retro-menu-group button,.file-entry):is(:hover,:focus){background:var(--os-accent);color:var(--os-accent-text)}
:root[data-os-era] .desktop .retro-menu-group[open]>summary{background:var(--os-field)}
:root[data-os-era] .desktop .desktop-note{background:var(--os-note);color:var(--os-text)}
:root[data-os-era] .desktop .desktop-note>span{background:transparent}
:root[data-os-era] .desktop :is(.desktop-icon svg,.pixel-app-icon){filter:var(--os-icon-filter)}
:root[data-os-era] .desktop .pixel-app-icon{background:var(--os-panel);color:var(--os-text);border:var(--os-border);border-radius:var(--os-button-radius)}
:root[data-os-era] .desktop .desktop-icon:focus{border-color:var(--os-edge)}
:root[data-os-era] .desktop .desktop-icon:hover>span:last-child{background:var(--os-accent);color:var(--os-accent-text)}
:root[data-os-era] .desktop :is(button,textarea,input,select):focus-visible{outline:2px solid var(--os-logo);outline-offset:-2px}
:root[data-os-era] .desktop .progress-track>span{background:repeating-linear-gradient(90deg,var(--os-accent) 0 7px,transparent 7px 9px)}
:root[data-os-era] .desktop .internet-icon{font-style:normal;border-radius:var(--os-button-radius);text-shadow:none}
:root[data-os-era] .desktop .internet-icon:after{display:none}

/* Each era has its own wallpaper. It remains underneath every damage layer. */
:root[data-os-era="80s"] .desktop .wallpaper{background:repeating-linear-gradient(0deg,#07180e 0 3px,#0b2013 3px 4px)}
:root[data-os-era="00s"] .desktop .wallpaper{background:radial-gradient(ellipse at 25% 0,#b1e2dc,transparent 60%),linear-gradient(155deg,#5bacc0,#235970 60%,#153e50)}
:root[data-os-era="10s"] .desktop .wallpaper{background:linear-gradient(125deg,transparent 45%,#51a8a4 45% 68%,transparent 68%),linear-gradient(30deg,#195666 36%,#1b7079 36% 75%,#8dc6b6 75%)}
:root[data-os-era="20s"] .desktop .wallpaper{background:radial-gradient(ellipse at 20% 65%,#cb9c9a 0 20%,transparent 65%),radial-gradient(ellipse at 85% 20%,#a6aec6,transparent 70%),#d6c3b8}
:root[data-os-era="modern"] .desktop .wallpaper{background:radial-gradient(ellipse at 85% 75%,#1e726f,transparent 52%),radial-gradient(ellipse at 15% 10%,#565b91,transparent 58%),#152332}
:root[data-os-era]:not([data-os-era="90s"]) .wallpaper canvas{opacity:0}
:root[data-os-era="80s"] .desktop-icon{color:var(--os-text);text-shadow:0 0 3px #a0e79e66}
:root[data-os-era="80s"] .desktop .dos-terminal{color:var(--os-text)}
:root[data-os-era="80s"] .desktop .bsod-screen{background:#07180e;color:#b5f3ad}
:root[data-os-era="00s"] .desktop .bsod-screen{background:#15394d}
:root[data-os-era="10s"] .desktop .bsod-screen{background:#0f5963}
:root[data-os-era="20s"] .desktop .bsod-screen{background:#483c57}
:root[data-os-era="modern"] .desktop .bsod-screen{background:#152332}

/* Original broken-cursor boot identity, shared by all six RageOS editions. */
.boot-shutdown,.boot-splash{align-items:center;justify-content:center;flex-direction:column;gap:12px;background:var(--os-boot,#d9ddca);color:var(--os-boot-text,#263f35);font-family:var(--os-font,Tahoma,sans-serif);padding:20px 12px 52px;text-align:center}
.boot-splash:before{content:'';position:absolute;inset:0;pointer-events:none;opacity:.12;background:repeating-linear-gradient(0deg,transparent 0 27px,currentColor 27px 28px),repeating-linear-gradient(90deg,transparent 0 27px,currentColor 27px 28px);mask-image:linear-gradient(transparent,#000)}
.boot-emblem{width:96px;height:96px;max-height:24%;flex-shrink:1;color:var(--os-logo,#b8452c);position:relative;filter:drop-shadow(3px 4px 0 #0002)}
.boot-wordmark{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px}
.boot-wordmark>small{font:700 9px/1.3 'Courier New',monospace;letter-spacing:2px}
.boot-wordmark>strong{font:900 clamp(36px,6vw,68px)/1 'Courier New',monospace;letter-spacing:-4px}
.boot-wordmark>strong>span{color:var(--os-logo,#b8452c)}
.boot-wordmark>em{font-size:11px;font-style:normal;letter-spacing:1px}
.boot-tagline{position:relative;font-size:12px;margin:0;opacity:.85}
.boot-shutdown b{font:900 34px/1 'Courier New',monospace}.boot-shutdown span{font-size:12px}
.boot-start-text{position:absolute;bottom:28px;left:12px;right:12px;font-size:11px}
.boot-progress{position:absolute;bottom:0;left:0;right:0;height:12px;background:#0002;border-top:1px solid #0003;overflow:hidden}
.boot-progress>span{position:absolute;width:28%;height:100%;background:var(--os-logo,#b8452c);animation:boot-scroll .65s linear infinite}
@keyframes boot-scroll{from{left:-28%}to{left:100%}}
.boot-bios{padding:21px 22px;background:#07100c;flex-direction:column;justify-content:space-between;color:#b5d5be;font:12px 'Courier New',monospace}
.boot-bios pre{font:inherit;line-height:1.6;white-space:pre-wrap;margin:0}.boot-bios>span{font-size:10px}
:root[data-os-era="80s"] .boot-emblem{filter:none;image-rendering:pixelated}
:root[data-os-era="00s"] .boot-splash{background:radial-gradient(ellipse at 50% 5%,#458b9e,#163e50 80%)}
:root[data-os-era="20s"] .boot-splash:before,
:root[data-os-era="modern"] .boot-splash:before{background:radial-gradient(ellipse at 80% 60%,currentColor,transparent 65%);opacity:.08}
@media(max-width:580px){
  .appearance-bar{align-items:stretch;gap:8px}.appearance-bar .appearance-setting{flex:1 1 220px;justify-content:space-between}
  .appearance-setting{font-size:11px}.appearance-setting select{font-size:11px;min-width:0}
  .os-era-setting select{max-width:70%}.mobile-inventory .os-era-setting{margin-bottom:10px}
  .boot-shutdown,.boot-splash{gap:9px}.boot-wordmark>small{font-size:8px;letter-spacing:1.5px}
  .boot-bios{font-size:10px;padding:14px 12px}.boot-tagline{font-size:11px}
}
@media(max-height:500px){.boot-emblem{height:58px;width:58px}.boot-splash{gap:6px}.boot-wordmark>strong{font-size:38px}.boot-wordmark{gap:4px}}
@media(prefers-reduced-motion:reduce){.boot-progress>span{animation:none;left:36%}}