/* WRM XP: an everyday desktop with the warmth of a well-used studio. */
:root { --studio-paper: #fffef8; --studio-ink: #25354b; --studio-muted: #52647d; --studio-blue: #214fa0; }
.os-opening-statement { top: 48px; right: 44px; max-width: 370px; gap: 9px; opacity: 1; }
.statement-eyebrow { text-transform: none; font-size: 12px; letter-spacing: .035em; }
.desktop-xp { color: #ffe08a; font-style: italic; font-size: 19px; margin-left: 5px; }
.statement-headline { font-size: clamp(24px, 2.7vw, 38px); line-height: 1.13; font-weight: 700; letter-spacing: -.04em; text-wrap: balance; }
.statement-note { color: #f7fbff; font: 12px/1.5 Tahoma, sans-serif; text-shadow: 0 1px 3px #143c67; max-width: 260px; }
.desktop-shortcut:focus-visible { outline: 1px dotted #fafcff; outline-offset: 3px; }
.d-icon-tag[data-tag="WIP"] { color: #4a350a; background: #fff0b2; border: 1px solid #8a6c24; font: bold 8px Tahoma,sans-serif; }
.desktop-toggle { width: 34px; color: #f5f8ff; border-right: 1px solid #174793; margin-left: 3px; }
.xp-button { padding: 6px 11px; color: #223249; background: linear-gradient(#fffef7, #e9e6d9); border: 1px solid #7b879a; border-radius: 3px; box-shadow: inset 0 0 0 1px #fffdf6; font: 12px/1.25 Tahoma,sans-serif; cursor: pointer; white-space: nowrap; }
.xp-button:hover { border-color: #255bb1; box-shadow: inset 0 0 0 1px #edce7b; }
.xp-button:active { background: #dedaca; }
button:focus-visible, a:focus-visible { outline: 2px solid #c37b09; outline-offset: 3px; }
[hidden] { display: none !important; }

/* The task panes belong to the same warm, paper-and-blue XP environment. */
.os-window {
  --bg-deep: #fffef8; --bg-card: #f7f6ef; --bg-card-hover: #f0f4fa;
  --bg-surface: #f1eee3; --bg-surface-elevated: #e8edf6;
  --ink-primary: #25354b; --ink-secondary: #52647d; --ink-muted: #627087;
  --accent-cyan: #2556a0; --accent-purple: #714c99;
  --border-glass: #d7dce1; --border-glass-highlight: #b6c6df;
  --font-ui: Tahoma, 'Segoe UI', sans-serif; --font-display: Tahoma, 'Segoe UI', sans-serif;
  box-shadow: 4px 8px 22px #10274a55;
}
.os-window.active { box-shadow: 5px 12px 32px #10274a66; }
.window-titlebar { flex-shrink: 0; }
.window-body, .window-content-inner { min-height: 0; }
.window-content-inner { color: var(--studio-ink); }
.catalog-view { background: var(--studio-paper); }
.catalog-header { background: #edf2fb; padding: 23px 24px 20px; border-bottom: 1px solid #c2d0e5; }
.catalog-title-block h2 { font: bold 23px/1.2 Tahoma,sans-serif; letter-spacing: -.035em; }
.catalog-title-block p { max-width: 60ch; font: 12px/1.6 Tahoma,sans-serif; }
.catalog-filter-bar { background: #f3f1e8; gap: 5px; padding: 11px 24px; }
.catalog-chip { border-radius: 3px; border-color: #b6bdc8; background: #fffef8; color: #324a68; font-family: Tahoma,sans-serif; }
.catalog-chip.active { color: #f7fbff; background: #2859a8; border-color: #214886; }
.catalog-items-container { grid-template-columns: 1fr; gap: 0; padding: 0 24px 20px; }
.catalog-card { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 20px; padding: 22px 0; background: transparent; border: 0; border-bottom: 1px solid #d9dfe8; border-radius: 0; box-shadow: none; }
.catalog-card:hover { transform: none; background: #f2f5fa; border-color: #c1ccdc; }
.catalog-card-header { justify-content: flex-start; gap: 10px; margin-bottom: 7px; }
.catalog-card-header .d-icon-tag { position: static; background: transparent; border: 0; color: #5c6a7e; box-shadow: none; padding: 0; font-size: 10px; }
.catalog-card-title { font: bold 16px/1.3 Tahoma,sans-serif; text-transform: none; letter-spacing: -.025em; }
.catalog-card-summary { font: 12px/1.6 Tahoma,sans-serif; max-width: 56ch; }
.catalog-card-footer { flex-direction: column; align-items: flex-end; justify-content: center; gap: 10px; }
.catalog-provenance { color: #5b6b82; }
.catalog-action-btn { border: 1px solid #899cb7; color: #234e89; background: #f1f4f9; border-radius: 3px; font: 12px Tahoma,sans-serif; }
.catalog-action-btn.primary { background: #2859a8; color: #f7fbff; border: 1px solid #1c437c; }
.signal-chip { border-radius: 3px; color: #455b79; background: #eaf0fa; border-color: #c5d1e3; font: 10px Tahoma,sans-serif; }
.window-statusbar, .window-menubar { background: #ece9dc; color: #43516a; border-color: #bfc6d0; font: 11px Tahoma,sans-serif; }
.window-menubar a { color: #245299; }
.weekly-edition-view { padding: 28px; }
.weekly-featured-card { border: 0; border-bottom: 1px solid #d2dae5; border-radius: 0; background: transparent; padding: 4px 0 24px; }
.weekly-featured-card blockquote { border-left: 0; padding-left: 0; background: transparent; }

/* Reading desk: an Explorer task pane beside a genuinely readable document. */
.studio-reading-desk { display: grid; grid-template-columns: 176px minmax(0,1fr); min-height: 100%; }
.studio-task-pane { background: linear-gradient(130deg, #e0eafd, #bdd1f0); padding: 32px 20px; display: flex; flex-direction: column; align-items: flex-start; gap: 16px; color: #2a4a79; font: 12px/1.6 Tahoma,sans-serif; }
.studio-task-pane > strong { font-size: 19px; }
.studio-task-pane img { filter: drop-shadow(1px 3px 2px #36587e44); image-rendering: auto; }
.studio-stamp { margin-top: auto; padding-top: 28px; font-size: 10px; }
.studio-paper { background: var(--studio-paper); padding: 32px 32px 24px; }
.studio-kicker { color: #5a6f8d; font: 11px Tahoma,sans-serif; margin-bottom: 15px; }
.studio-paper h2, .sid-room h2 { font: bold clamp(25px, 3vw, 34px)/1.14 Tahoma,sans-serif; letter-spacing: -.045em; color: #233d67; margin: 0 0 16px; }
.studio-intro { font: 13px/1.65 Tahoma,sans-serif; color: #53657e; max-width: 52ch; margin-bottom: 23px; }
.news-source { display: grid; grid-template-columns: 25px minmax(0,1fr); gap: 14px; padding: 19px 0; border-top: 1px solid #d7dfe9; color: #28446c; text-decoration: none; }
.news-source:hover h3 { text-decoration: underline; }
.source-number { font: 12px Tahoma,sans-serif; color: #7b8ca4; padding-top: 2px; }
.news-source small { color: #61738b; font: 10px Tahoma,sans-serif; }
.news-source h3 { font: bold 16px/1.3 Tahoma,sans-serif; margin: 6px 0; letter-spacing: -.025em; }
.news-source p { font: 12px/1.6 Tahoma,sans-serif; color: #53657e; margin: 0 0 9px; }
.news-source strong { font: bold 11px Tahoma,sans-serif; color: #2254a1; }
.studio-footnote { font: 10px/1.6 Tahoma,sans-serif; color: #62738a; padding-top: 16px; border-top: 1px solid #d7dfe9; }
.studio-window .window-content-inner { overflow-y: auto; }
.sid-room { padding: 32px 40px; min-height: 100%; background: #fffef8; color: #53657e; }
.sid-nameplate { display: flex; align-items: center; gap: 13px; margin-bottom: 25px; }
.sid-avatar { width: 46px; height: 46px; background: linear-gradient(135deg,#c8deed,#638ba9); border: 2px solid #fafcff; border-radius: 4px; box-shadow: 0 0 0 1px #a5b3c5; color: #fbfeff; font: bold 27px/42px Tahoma,sans-serif; text-align: center; }
.sid-nameplate strong { display: block; font: bold 16px Tahoma,sans-serif; color: #273d5c; margin-bottom: 5px; }
.sid-nameplate div > span { font: 11px Tahoma,sans-serif; }
.sid-nameplate i { display:inline-block; background: #d89931; width:7px; height:7px; border-radius:50%; margin-right:4px; }
.sid-room > p { font: 13px/1.65 Tahoma,sans-serif; max-width: 55ch; margin: 0 0 14px; }
.sid-room .sid-status { font-size: 11px; color: #6d7787; }
.sid-alternatives { margin-top: 24px; border-top: 1px solid #d7dfe9; padding-top: 18px; }
.sid-alternatives > span { font: 11px Tahoma,sans-serif; color:#6d7787; }
.studio-tool-link { display:block; text-align:left; background:none; border:0; padding:12px 0 3px; cursor:pointer; color:#2859a8; font:12px Tahoma,sans-serif; }
.studio-tool-link small { display:block; color:#64758c; margin-top:5px; }
.studio-tool-link:hover strong { text-decoration:underline; }
.studio-recents { padding: 8px 0 10px; border-bottom: 1px solid #c8d2e1; margin-bottom: 5px; }
.recent-label { display:block; color:#586b86; font:10px Tahoma,sans-serif; padding:8px 12px; }
.recent-app { display:flex; align-items:center; gap:10px; padding:9px 12px; background:transparent; border:0; text-align:left; cursor:pointer; width:100%; color:#294977; font:12px Tahoma,sans-serif; }
.recent-app small { display:block; color:#62728b; font-size:10px; margin-top:4px; max-width:230px; }
.recent-app:hover { background:#316ac5; color:#fffef8; }
.recent-app:hover small { color:#eaf1ff; }
.start-menu-subitem { border:0; text-align:left; width:100%; font:12px Tahoma,sans-serif; }
.start-menu-items { overflow: visible; }

/* No iframe reparenting: only its existing window's presentation changes. */
.windows-container { z-index: auto; }
.experience-window-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:7px 10px; background:#ece9dc; border-bottom:1px solid #bfc6d0; flex-shrink:0; }
.experience-window-toolbar a { font:11px Tahoma,sans-serif; color:#294f8b; }
.os-window.desktop-experience { inset:0 !important; width:100% !important; height:100% !important; min-width:0; min-height:0; border:0; border-radius:0; box-shadow:none; z-index:5 !important; pointer-events:none; }
.desktop-experience > .window-titlebar, .desktop-experience > .experience-window-toolbar,
.desktop-experience .window-menubar, .desktop-experience .window-statusbar,
.desktop-experience .window-loading-bar { display:none; }
.desktop-experience .window-body, .desktop-experience .window-content-inner, .desktop-experience .window-iframe-wrap { height:100%; width:100%; flex:1; padding:0; margin:0; border:0; }
.desktop-experience iframe { width:100%; height:100%; border:0; }
.desktop-experience-controls { position:fixed; bottom:46px; right:18px; z-index:9999; display:flex; align-items:center; gap:6px; max-width:calc(100vw - 32px); padding:7px; border:1px solid #64799d; border-radius:5px; background:#ece9dc; box-shadow:2px 4px 16px #102a4955; color:#294263; }
.experience-name { font:11px Tahoma,sans-serif; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:180px; padding:0 6px; }
.desktop-resume { position:absolute; right:44px; top:190px; z-index:16; max-width:330px; white-space:normal; text-align:left; }
#desktop-icons, .os-opening-statement, #taskbar { transition: opacity 240ms ease-out, transform 240ms ease-out, visibility 240ms; }
body[data-desktop-view="immersive"] #desktop-icons,
body[data-desktop-view="immersive"] .os-opening-statement,
body[data-desktop-view="immersive"] #taskbar,
body[data-desktop-view="immersive"] #start-menu,
body[data-desktop-view="immersive"] .os-window:not(.desktop-experience) { visibility:hidden; opacity:0; pointer-events:none; }
body[data-desktop-view="immersive"] #desktop-icons { transform:translateY(9px); }
body[data-desktop-view="immersive"] .os-window.desktop-experience { pointer-events:auto; }
body[data-desktop-view="immersive"] .windows-container { bottom:0; }
body[data-desktop-view="immersive"] .desktop-experience-controls { bottom:16px; }
body[data-has-experience="true"] .os-contrast-veil { display:none; }

@media (max-width:768px) {
  .os-opening-statement { top:auto; bottom:85px; right:22px; max-width:230px; gap:6px; }
  .statement-headline { font-size:25px; }
  .statement-note { font-size:10px; max-width:210px; }
  .statement-eyebrow { font-size:10px; }
  .desktop-icons { bottom:175px; }
  .desktop-resume { top:auto; bottom:50px; right:18px; max-width:250px; }
  .desktop-experience-controls { bottom:50px; right:8px; max-width:calc(100vw - 16px); gap:4px; flex-wrap:wrap; justify-content:flex-end; }
  .experience-name { max-width:140px; }
  .xp-button { min-height:34px; padding:7px 9px; }
  .studio-reading-desk { grid-template-columns:1fr; }
  .studio-task-pane { padding:12px 20px; flex-direction:row; align-items:center; gap:12px; }
  .studio-task-pane img { width:32px; height:32px; }
  .studio-task-pane p, .studio-stamp { display:none; }
  .studio-task-pane > strong { font-size:15px; }
  .studio-paper { padding:24px 22px; }
  .sid-room { padding:25px 24px; }
  .catalog-card { grid-template-columns:1fr; gap:12px; padding:20px 0; }
  .catalog-card-footer { flex-direction:row; justify-content:space-between; align-items:center; }
  .catalog-items-container { padding:0 20px 20px; }
  .catalog-header { padding:20px; }
  .catalog-title-block h2 { font-size:20px; }
  .catalog-filter-bar { padding:10px 20px; }
  .recent-app { padding:7px 10px; }
  .recent-app small { max-width:215px; }
  .desktop-toggle { flex-shrink:0; }
}
@media (max-width:480px) {
  .experience-name { display:none; }
  .desktop-icons { gap:12px 18px; }
  .system-tray .tray-theme-label { display:none; }
}
@media (prefers-reduced-motion:reduce) {
  #desktop-icons, .os-opening-statement, #taskbar { transition:none; }
}
.native-themes { padding:20px 24px; background:#f8fafc; border-bottom:1px solid #c9d4e5; flex-shrink:0; }
.native-themes-label { font:bold 12px Tahoma,sans-serif; color:#324e76; }
.native-themes-list { display:flex; gap:10px; margin:12px 0 10px; }
.native-theme { flex:1; background:transparent; border:1px solid #cad4e2; border-radius:3px; padding:4px 4px 8px; font:11px Tahoma,sans-serif; color:#284366; cursor:pointer; }
.native-theme:hover { border-color:#2859a8; background:#e9f1ff; }
.theme-swatch { display:block; height:49px; border-radius:1px; margin-bottom:7px; background:#3561a9; }
.swatch-wrm-xp { background: url('../assets/wrm-xp/wallpapers/green-hills-mobile.png') center 55% / cover; }
.swatch-mercury { background: radial-gradient(ellipse at 55% 40%,#fafcff,#919aa9 20%,#222b3d 40%,#cbd2df 43%,#384051 52%,#0e1420 55%); }
.swatch-rain-window { background: repeating-linear-gradient(105deg,transparent 0 8px,#9eb5c72c 9px 10px,transparent 11px 22px),radial-gradient(ellipse at 70% 80%,#ca9c63,transparent 40%),#283b51; }
.swatch-northern-lights { background:linear-gradient(140deg,#0c2038 20%,#287978 40%,#70b99a 45%,#195478 54%,#243856 70%); }
.native-themes p { font:10px/1.5 Tahoma,sans-serif; color:#62738a; margin:0; }
.os-window .slot-curator-note { border-left:0; padding:0; background:transparent; font-style:normal; color:#4d6482; }
@media(max-width:768px) { .native-themes{padding:15px 20px;} .native-themes-list{gap:6px;} .theme-swatch{height:36px;} .native-theme{font-size:10px;} }
.os-window .signal-chip { color:#435b7f; background:#eaf0fa; border-color:#c5d1e3; }
.swatch-wrm-xp { background-image:url('../assets/wrm-xp/wallpapers/green-hills-desktop.png'); background-position:center 75%; }
.os-window.maximized { height:100% !important; }
@media(max-width:1024px) {
  .os-opening-statement { display:flex; }
  .os-taskbar { bottom:0; left:0; right:0; height:40px; border-radius:0; }
  .windows-container { bottom:40px; }
  .statement-headline { font-size:27px; }
}
@media(max-width:768px) {
  .os-opening-statement { bottom:100px; top:auto; }
  body[data-has-resume="true"] .os-opening-statement { bottom:140px; }
  .statement-headline { font-size:25px; }
  .window-titlebar { min-height:38px; }
  .window-controls .win-btn { width:28px; height:28px; }
  .os-taskbar { height:42px; }
  .windows-container { bottom:42px; }
  .desktop-icons { bottom:210px; }
}
.start-item.has-sub.submenu-open > .start-submenu { display:block; }
@media(max-width:768px) {
  .start-item.has-sub { position:static; }
  .start-item.has-sub > .start-submenu { left:32px; right:4px; bottom:4px; top:auto; min-width:0; max-width:none; width:auto; max-height:calc(100dvh - 65px); overflow-y:auto; z-index:2; }
}

@media(max-width:768px) { #start-menu .has-sub:not(.submenu-open) > .start-submenu { display:none; } }
@media(min-width:769px) {
  .desktop-icons { display:grid; grid-template-rows:repeat(6, 88px); grid-auto-flow:column; grid-auto-columns:78px; align-content:start; gap:12px 14px; }
}