/* Final desktop finish. Shared tokens keep each native PC app in the same material family. */
:root{
  --pc-bg:#101419;--pc-surface:#1b222a;--pc-raised:#29343e;--pc-text:#e6ebf0;
  --pc-muted:#a9b3bd;--pc-line:#3b4652;--pc-hover:#2c3946;--pc-input:#0b1015;--pc-link:#c0d5e6;
  --pc-inset:inset 0 1px 3px #0005;--pc-sheen:#ffffff0d;--pc-shadow:#0005;
}
:root[data-mode=light]{
  --pc-bg:#f8fafc;--pc-surface:#edf2f6;--pc-raised:#dfe8ef;--pc-text:#1c2a36;
  --pc-muted:#586b7b;--pc-line:#bdcad5;--pc-hover:#e0ebf4;--pc-input:#fff;--pc-link:#315d7d;
  --pc-inset:inset 0 1px 3px #233c511c;--pc-sheen:#ffffffd9;--pc-shadow:#13243516;
}
:root[data-theme=graphite]{--wallpaper:url('/static/img/desktop/graphite.svg');--wallpaper-filter:none;--aero:99 111 123;--theme-color:#68798a;--theme-deep:#080d14}
.theme-preview--graphite{background-image:url('/static/img/desktop/graphite.svg');filter:none}
.desktop-wallpaper:after{background:radial-gradient(ellipse at 60% 105%,#b5d2e114,transparent 64%),linear-gradient(90deg,#03060b4d,transparent 30%,transparent 74%,#03060b4d)}
.desktop-wordmark>img{opacity:.24;filter:drop-shadow(0 2px 1px #0008) drop-shadow(0 -1px 0 #e3f0f426) drop-shadow(0 0 26px #cad8e40a)}
.desktop-shortcuts{top:12px;left:9px;column-gap:8px;row-gap:3px}
.desktop-shortcut{border-radius:4px;transition:background .13s,border-color .13s,box-shadow .13s}
.desktop-shortcut svg{filter:drop-shadow(0 2px 1px #0007) drop-shadow(0 3px 6px #0004)}
.desktop-shortcut:hover,.desktop-shortcut:focus-visible{background:linear-gradient(#e1efff1a,#bbd3ed0d);border-color:#d1e4f273;box-shadow:inset 0 1px 0 #ffffff29,inset 0 -1px 0 #ffffff0d,0 2px 8px #0002}
.desktop-shortcut:active{background:#aecbe333}
.desktop-shortcut span{letter-spacing:.005em;text-shadow:0 1px 2px #000,0 2px 6px #000}
.desktop-gadgets:before{background:linear-gradient(90deg,transparent,#060a1126)}
.clock-face{border:4px solid #8a98a4;background:radial-gradient(circle at 35% 22%,#3c4650,#161d26 58%,#080d14);box-shadow:0 0 0 1px #151c24,0 0 0 2px #c2cfdb5c,inset 0 0 0 2px #c4d4e11c,inset 0 3px 10px #000b,0 8px 18px #0006;color:#d5dfe7}
.clock-face:before{border:0;inset:6px;background:repeating-conic-gradient(#cbdce7ab 0deg 1deg,transparent 1deg 6deg),repeating-conic-gradient(#e3eef5 0deg 2deg,transparent 2deg 30deg);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 calc(100% - 4px));mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 calc(100% - 4px))}
.clock-face:after{content:'';position:absolute;inset:1px;border-radius:50%;pointer-events:none;background:linear-gradient(140deg,#ffffff16,transparent 48%,#ffffff04)}
.clock-face span{font-family:var(--system-font);font-size:10px;color:#cbd7e1}
.clock-hand{background:linear-gradient(90deg,#8fa4b5,#f2f6fa);box-shadow:1px 1px 3px #000b}
.clock-pin{background:#ecf2f7;border:2px solid #5c7082;box-shadow:0 1px 3px #0008}
.gadget-date{color:#c5cfda;font-size:11px;text-shadow:0 1px 3px #000}

/* Narrow reflective frames, with a clear active/inactive hierarchy. */
.app-window,.app-window:not(.is-active){
  border:1px solid #03060a;border-radius:7px 7px 5px 5px;
  background:linear-gradient(120deg,#c9d9e225,transparent 19%,#d5e4ee0b 39%,transparent 41%,#09121ba8 75%),#19222ac4;
  box-shadow:inset 0 0 0 1px #b8c8d338,0 10px 28px #0005;
  -webkit-backdrop-filter:blur(18px) saturate(.8);backdrop-filter:blur(18px) saturate(.8);
}
.app-window.is-active{
  background:linear-gradient(122deg,#d8e7ef4a,transparent 16%,#e2edf712 38%,transparent 40%,#0b141fa6 74%),linear-gradient(180deg,rgb(var(--aero) / .65),#111b25c4 75%);
  box-shadow:inset 0 0 0 1px #c8dce778,0 0 0 1px #8da6be29,0 20px 55px #0009,0 4px 12px #0005;
}
.window-titlebar{position:relative;isolation:isolate;height:31px;padding-left:1px;gap:7px}
.window-title{font-size:12px;color:#f2f5f8;text-shadow:0 1px 3px #000;overflow:hidden;text-overflow:ellipsis}
.app-window:not(.is-active) .window-title{color:#b1bdc8}
.window-titlebar>svg{filter:drop-shadow(0 1px 1px #0006)}
.window-controls{border-color:#020a12b3;box-shadow:0 1px 0 #ffffff21;height:21px}
.window-controls button{height:20px;background:linear-gradient(#e6f1fa2b,#bacdde0d 46%,#030b166b 50%,#a3bdd028);border-color:#050c1666;box-shadow:inset 0 0 0 1px #dbeeff30}
.window-controls button:last-child{background:linear-gradient(#e6c0b775,#b1716859 45%,#52211eed 50%,#ad6d5f94)}
.window-controls button:hover{background:linear-gradient(#c5e8ffb0,#6b99b775 46%,#1a4e77c4 50%,#97c6e780);box-shadow:inset 0 0 0 1px #d9efffad,0 0 12px #76b3e190}
.window-controls button:last-child:hover{background:linear-gradient(#eeb59e,#ba6d55 46%,#853322 50%,#cb8a67);box-shadow:inset 0 0 0 1px #ffd6c2b3,0 0 12px #da674f70}
.app-window:not(.is-active) .window-controls{opacity:.65}
.is-maximized .window-controls [data-window-action=maximize]:after{border-color:#edf2f5}
.app-window.is-maximized{border-color:#060b11;border-radius:0;background:linear-gradient(#222e3a,#101923 32px)}
.window-content{border:1px solid #060b11;box-shadow:0 0 0 1px #a8bdce42;scrollbar-width:thin;scrollbar-color:var(--pc-line) var(--pc-bg)}
#desktop button:focus-visible,#desktop a:focus-visible{outline:2px solid var(--pc-link);outline-offset:2px}
.window-titlebar:focus-visible{outline:none}
#desktop input:focus-visible,#desktop textarea:focus-visible{outline:2px solid var(--pc-link);outline-offset:-2px}

/* Explorer surfaces: recessed fields, raised toolbars, quiet content. */
.window-toolbar{height:37px;background:linear-gradient(var(--pc-raised),var(--pc-surface));padding:5px 7px;gap:6px;box-shadow:inset 0 1px 0 var(--pc-sheen)}
.address-bar,.explorer-search{height:24px;border:1px solid var(--pc-line);border-radius:2px;background:var(--pc-input);box-shadow:var(--pc-inset)}
.address-bar{padding:0 7px;gap:9px;color:var(--pc-text)}
.explorer-search{background:var(--pc-input);width:154px}
.explorer-search input{background:transparent;color:var(--pc-text);height:100%;min-width:0}
.explorer-search>span:last-child{color:var(--pc-muted)}
.navigation-buttons button{background:radial-gradient(circle at 40% 15%,#d6e8f980,#839cad59 42%,#24425cc9 52%,#7c96ac9c);border:1px solid #152a3d;box-shadow:inset 0 0 0 1px #d8edff5e,0 1px 2px #0004}
.navigation-buttons button:disabled{opacity:.40}
.explorer-commandbar{height:31px;background:linear-gradient(var(--pc-surface),var(--pc-raised) 48%,var(--pc-surface) 51%);border-top:1px solid var(--pc-sheen);border-bottom:1px solid var(--pc-line)}
.explorer-commandbar button:hover,.explorer-commandbar a:hover{background:linear-gradient(var(--pc-sheen),#00000008);border-color:var(--pc-line)}
.explorer-sidebar{width:153px;padding:15px 7px;background:linear-gradient(90deg,var(--pc-surface),var(--pc-bg));box-shadow:inset -1px 0 0 var(--pc-sheen);overflow:auto;scrollbar-width:thin}
.explorer-sidebar h3{font-size:11px;color:var(--pc-muted);margin-bottom:7px}
.explorer-sidebar button{min-height:27px;padding:3px 6px;border-radius:3px}
.explorer-sidebar button[data-app=welcome],.guide-folder .explorer-sidebar [aria-current=page]{background:linear-gradient(var(--pc-hover),var(--pc-raised));box-shadow:inset 0 1px 0 var(--pc-sheen);border-color:var(--pc-line)}
.guide-folder .explorer-sidebar button[data-app=welcome]{background:transparent;box-shadow:none;border-color:transparent}
.welcome-main{background:radial-gradient(ellipse at 85% 0%,rgb(var(--aero) / .055),transparent 62%),var(--pc-bg)}
.welcome-banner{position:relative;isolation:isolate;overflow:hidden;height:114px;min-height:114px;padding:19px 23px;background:radial-gradient(ellipse at 75% 88%,rgb(var(--aero) / .23),transparent 64%),linear-gradient(115deg,var(--pc-surface),var(--pc-bg));border-bottom:1px solid var(--pc-line);box-shadow:inset 0 1px 0 var(--pc-sheen)}
.welcome-banner h1{font:400 26px/1.2 var(--system-font);letter-spacing:-.035em;margin:5px 0 0}
.welcome-banner small{font-size:11px;letter-spacing:.02em}
.welcome-banner:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(125deg,transparent 40%,#c4ddeb06 40.2%,transparent 66%),linear-gradient(170deg,transparent 74%,#b9d5e218 74.2%,transparent 74.7%)}
.welcome-banner>.computer-illustration{position:absolute;right:9px;bottom:-2px;width:229px;height:115px;object-fit:contain;background:none;border:0;border-radius:0;padding:0;box-shadow:none;filter:drop-shadow(0 8px 5px #0004);opacity:1;pointer-events:none;user-select:none}
.welcome-banner>div{position:relative;z-index:1}
.welcome-apps{padding:16px 17px 18px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.welcome-apps h2{grid-column:1/-1;font-size:13px;color:var(--pc-link);margin:0 0 5px}
.welcome-apps h2:after{background:linear-gradient(90deg,var(--pc-line),transparent)}
.app-row{position:relative;overflow:hidden;float:none;width:auto;min-width:0;min-height:73px;gap:12px;padding:9px;border:1px solid var(--pc-line);border-radius:4px;background:linear-gradient(135deg,var(--pc-sheen),transparent 52%),var(--pc-surface);box-shadow:inset 0 1px 0 var(--pc-sheen),0 2px 4px var(--pc-shadow);transition:border-color .13s,background .13s}
.app-row svg{width:38px;height:38px;filter:drop-shadow(0 2px 2px #0005)}
.app-row>.app-emblem{display:grid;place-items:center;flex:0 0 48px;width:48px;height:48px;border:1px solid #90a9bd29;border-radius:5px;background:radial-gradient(ellipse at 50% 120%,#96b8cd26,transparent 66%),linear-gradient(145deg,#c6dce91c,#03091328 60%);box-shadow:inset 0 1px 0 #dcecf33b,inset 0 -1px 2px #0003,0 2px 4px #0002}
.app-row>.app-description{flex:1;min-width:0}
.app-row>.app-description>small{padding-right:4px}
.app-row:hover>.app-emblem{border-color:#a7c5db66;box-shadow:inset 0 1px 0 #f0faff5e,0 0 13px #b3d5ec13}
.app-row>span{font-size:12px;line-height:17px;min-width:0}
.app-row small{font-size:11px;line-height:15px;margin-top:3px}
.app-row:hover{background:linear-gradient(135deg,var(--pc-sheen),transparent),var(--pc-hover);border-color:var(--pc-link);box-shadow:inset 0 1px 0 var(--pc-sheen),0 3px 8px var(--pc-shadow)}
.welcome-apps:after{display:none}
.workspace-empty{grid-column:1/-1;font-size:12px;color:var(--pc-muted)}
.welcome-status{height:45px;background:linear-gradient(var(--pc-surface),var(--pc-bg));border-top:1px solid var(--pc-line);font-size:11px}
.welcome-status small,.welcome-status>a{font-size:11px;color:var(--pc-muted)}
.guide-file-columns{background:linear-gradient(var(--pc-surface),var(--pc-bg));margin:0 -12px;padding:9px 18px;font-size:11px}
.guide-file{min-height:49px;border-bottom-color:color-mix(in srgb,var(--pc-line),transparent 65%);border-radius:3px}
.guide-file>svg{width:30px;height:30px;filter:drop-shadow(0 1px 1px #0003)}
.guide-file:hover{box-shadow:inset 0 1px 0 var(--pc-sheen);background:linear-gradient(var(--pc-hover),var(--pc-surface))}
.notes-toolbar,.notes-status,.embedded-toolbar,.guide-folder-status{background:linear-gradient(var(--pc-surface),var(--pc-bg));box-shadow:inset 0 1px 0 var(--pc-sheen)}
.notes-area{box-shadow:inset 0 2px 7px var(--pc-shadow)}

/* A smoked-glass taskbar and Start orb complete the physical desktop shell. */
.taskbar{background:linear-gradient(180deg,#c0d3e13b 0,#62798c2b 5%,#33435291 46%,#07101cea 50%,#1d2c3be0);border-top:1px solid #bdcedf63;box-shadow:0 -1px 0 #02060c,0 -4px 20px #0004;-webkit-backdrop-filter:blur(20px) saturate(.7);backdrop-filter:blur(20px) saturate(.7)}
.start-button{position:relative;background:radial-gradient(ellipse at 50% 18%,#eaf4fa6b,transparent 52%),radial-gradient(circle at 50% 78%,#7391a6,#172f44 62%,#101822 78%);border-color:#0c1520;box-shadow:inset 0 0 0 1px #c7e1f2a3,inset 0 -3px 6px #071421,0 1px 5px #000b}
.start-button:hover,.start-button[aria-expanded=true]{box-shadow:inset 0 0 0 1px #e9f7ffd9,inset 0 -3px 6px #071421,0 0 18px #b7d7f166}
.start-button img{width:27px;height:27px;filter:drop-shadow(0 1px 1px #0008)}
.task-button{border:1px solid #a8bdcc45;border-radius:3px;background:linear-gradient(#d8e9f326,#adc5d611 45%,#02081340 49%,#5c748718);box-shadow:inset 0 1px 0 #e5f4ff17,inset 0 -1px 0 #0003;color:#d8e3ed}
.task-button:hover{border-color:#d6eaff8c;background:linear-gradient(#c4deef38,#527a9730)}
.task-button.is-active{border-color:#c7e4f599;background:linear-gradient(#d5ebf34d,#a2c4d830 45%,#20466380 50%,#81a4b868);box-shadow:inset 0 1px 0 #fff5,inset 0 -2px 0 #b5d7ed61,0 0 9px #9bc6e318}
.quick-launch{border-right-color:#d3e9f52e}
.system-tray{border-left:1px solid #07101b7a;box-shadow:inset 1px 0 0 #c1d6e41f;padding-left:10px}
.tray-time{font-variant-numeric:tabular-nums;color:#e2ebf2;text-shadow:0 1px 2px #000}
.start-menu{border-color:#070e17;background:linear-gradient(115deg,#c0d3e13a,transparent 25%,#16202cb8 70%),rgb(var(--aero) / .50);box-shadow:inset 0 0 0 1px #c7daea61,0 -10px 40px #0008;-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px)}
.start-left{border-color:#0d1722;box-shadow:0 0 0 1px #bccfe638}
.start-apps{background:linear-gradient(100deg,var(--pc-surface),var(--pc-bg))}
.start-apps button{border-radius:3px;min-height:39px}
.start-apps button:hover{background:linear-gradient(var(--pc-hover),var(--pc-surface));box-shadow:inset 0 1px 0 var(--pc-sheen);border-color:var(--pc-line)}
.start-search{border-top:1px solid var(--pc-line);background:linear-gradient(var(--pc-surface),var(--pc-bg))}
.start-search input{box-shadow:var(--pc-inset);border-radius:3px;font-style:normal}
.start-right>button,.start-right>a{border:1px solid transparent;border-radius:3px;color:#e3edf5;text-shadow:0 1px 2px #0008}
.start-right>button:hover,.start-right>a:hover{border-color:#d8e9f140;background:linear-gradient(#f1f7ff15,#bfd6e50a)}
.start-profile-button .profile-orb{background:radial-gradient(circle,#c6deed15,transparent 70%);filter:drop-shadow(0 3px 3px #0004)}
.start-footer button{border-color:#c2d9eb50;background:linear-gradient(#bdcfdd30,#12213466);box-shadow:inset 0 1px 0 #ffffff26;color:#eaf2f8}

/* App chrome inherits the finish, with native-looking edges instead of flat blocks. */
.appearance-panel{background:radial-gradient(ellipse at 90% 0%,var(--pc-sheen),transparent 55%),var(--pc-bg)}
.theme-choice{border-radius:5px;box-shadow:inset 0 1px 0 var(--pc-sheen),0 3px 8px var(--pc-shadow)}
.theme-preview{height:106px;border-radius:3px;box-shadow:inset 0 0 0 1px #ffffff12}
.theme-choice[aria-pressed=true]{border-color:var(--pc-link);box-shadow:inset 0 0 0 1px var(--pc-link),0 3px 9px var(--pc-shadow)}
.mode-switch button,.sound-settings-link{background:linear-gradient(var(--pc-raised),var(--pc-surface));box-shadow:inset 0 1px 0 var(--pc-sheen);border-color:var(--pc-line);color:var(--pc-text)}
.mode-switch button[aria-pressed=true]{background:linear-gradient(var(--pc-hover),var(--pc-surface))}
.media-tabs{background:linear-gradient(var(--pc-raised),var(--pc-surface));border-bottom:1px solid var(--pc-line)}
.media-player .video-list{background:var(--pc-bg);box-shadow:inset 0 2px 5px var(--pc-shadow)}
.media-art{background:radial-gradient(ellipse at 50% 90%,rgb(var(--aero) / .18),transparent 66%),linear-gradient(120deg,var(--pc-surface),var(--pc-bg));border-bottom:1px solid #ffffff08}
.media-orbit{position:relative;width:82px;height:82px;border-color:#b7c9d766;background:radial-gradient(circle at 35% 15%,#e9f4ff24,transparent 48%),radial-gradient(circle at 50% 90%,#6687a14a,#111d2933 65%);box-shadow:inset 0 0 0 3px #080f1a42,inset 0 1px 2px #f0f8ff7a,0 4px 12px #0003}
.media-orbit>img{mix-blend-mode:normal;width:61px;height:61px;opacity:.9;filter:drop-shadow(0 0 8px #dae8f01a)}
.media-orbit:before{inset:-6px;border:1px solid #aec6d51c;width:auto;height:auto;transform:none;border-radius:50%}
.media-art h2{font:400 17px var(--system-font);letter-spacing:.01em}
.sound-presets{background:linear-gradient(var(--pc-surface),var(--pc-bg));border-color:var(--pc-line);padding:8px 10px}
.sound-presets button{background:linear-gradient(var(--pc-sheen),transparent);box-shadow:inset 0 1px 0 var(--pc-sheen)}
.media-controls{background:linear-gradient(var(--pc-raised),var(--pc-surface) 48%,var(--pc-bg) 50%,var(--pc-surface));box-shadow:inset 0 1px 0 var(--pc-sheen);border-color:var(--pc-line)}
.media-play{color:#e5f1fc;background:radial-gradient(circle at 40% 15%,#d4e8f38c,#5f7d9466 45%,#17314ba8 54%,#829cb380);box-shadow:0 0 0 2px #a4b8c340,inset 0 1px 2px #ebf9ffb3,0 2px 5px #0004}
.sound-mixer{background:linear-gradient(var(--pc-surface),var(--pc-bg))}
.daily-app,.echo-game,.cosmetic-shop{background:radial-gradient(ellipse at 100% 0%,var(--pc-sheen),transparent 52%),var(--pc-bg)}
.daily-summary,.echo-stats{background:linear-gradient(var(--pc-sheen),transparent);border-color:var(--pc-line)}
.daily-row,.cosmetic-item{background:linear-gradient(125deg,var(--pc-sheen),transparent 60%),var(--pc-surface);box-shadow:inset 0 1px 0 var(--pc-sheen),0 2px 4px var(--pc-shadow)}
.daily-row:hover{background:linear-gradient(125deg,var(--pc-sheen),transparent),var(--pc-hover)}
:root[data-mode=light] .desktop-wordmark>img{filter:invert(1) grayscale(1);opacity:.14}
:root[data-mode=light] .app-window .window-content{border-color:#60788a;box-shadow:0 0 0 1px #f0f8ffa6}
:root[data-mode=light] .welcome-banner>.computer-illustration{filter:drop-shadow(0 6px 5px #20374720)}
:root[data-mode=light] .media-orbit>img{filter:invert(1);opacity:.65}


/* Channel rows share the same glass icon treatment as the application browser. */
.media-player .video-list{padding:5px 8px}
.media-player .video-list button{display:flex;align-items:center;gap:9px;min-height:45px;padding:7px 8px;border:1px solid transparent;border-bottom-color:var(--pc-line);border-radius:3px}
.media-player .video-list button>svg{width:29px;height:29px;flex:none;filter:drop-shadow(0 2px 2px #0003)}
.media-player .video-list button>span{min-width:0;flex:1}
.media-player .video-list button:hover,.media-player .video-list button[aria-current=true]{background:linear-gradient(115deg,var(--pc-sheen),transparent),var(--pc-hover);border-color:var(--pc-line);box-shadow:inset 0 1px 0 var(--pc-sheen)}
.media-player .video-list button[aria-current=true]{border-left-color:var(--pc-link)}
.media-art:before{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(125deg,transparent 36%,#cce4f008 36.2%,transparent 65%),radial-gradient(ellipse at 50% 115%,rgb(var(--aero) / .18),transparent 66%)}
.media-art:has(iframe):before{display:none}

/* Fine optical details use static gradients and compositor-only entrance motion. */
.window-titlebar:before{content:'';position:absolute;inset:0 -6px;z-index:-1;pointer-events:none;border-radius:6px 6px 0 0;background:linear-gradient(109deg,transparent 17%,#e1f0ff08 17.2%,#e1f0ff15 29%,transparent 29.3%,transparent 65%,#e1f0ff0e 65.2%,transparent 81%),linear-gradient(#eef6ff0c,transparent 55%,#050b122b);border-top:1px solid #e1f2ff21}
.app-window:not(.is-active) .window-titlebar:before{opacity:.4}
.window-controls button:before,.window-controls button:after{filter:drop-shadow(0 1px 1px #0009)}
.window-controls button,.navigation-buttons button,.sound-presets button,.mode-switch button{transition:box-shadow .15s,border-color .15s,filter .15s}
.window-controls button:active,.navigation-buttons button:not(:disabled):active{filter:brightness(.78)}
.window-content,.window-content *{scrollbar-width:thin;scrollbar-color:var(--pc-line) transparent}
.window-content ::selection{background:#6c8fa780;color:var(--pc-text)}
.explorer-search:focus-within,.start-search:focus-within input{border-color:var(--pc-link);box-shadow:var(--pc-inset),0 0 0 1px #a9c9df21}
.explorer-search input{font-style:normal}
.explorer-search input::placeholder,.start-search input::placeholder{color:var(--pc-muted);font-style:normal;opacity:.85}
.explorer-search>svg{width:13px;height:13px;flex:none;margin-right:6px;color:var(--pc-muted)}
.start-search{position:relative}
.start-search>.search-icon{position:absolute;width:13px;height:13px;right:14px;top:50%;transform:translateY(-50%);color:var(--pc-muted);pointer-events:none}
.app-row:before{content:'';position:absolute;inset:1px 1px 50%;border-radius:3px;pointer-events:none;background:linear-gradient(110deg,transparent 39%,#e5f1fd06 39.3%,#e5f1fd0a 62%,transparent 62.3%);opacity:.55}
.app-row:after{content:'';position:absolute;right:12px;bottom:13px;width:5px;height:5px;border-top:1px solid var(--pc-link);border-right:1px solid var(--pc-link);opacity:0;transform:translateX(-3px) rotate(45deg);transition:opacity .15s,transform .15s;pointer-events:none}
.app-row:hover:after,.app-row:focus-visible:after{opacity:.65;transform:translateX(0) rotate(45deg)}
.app-row:active{box-shadow:inset 0 2px 6px var(--pc-shadow)}
.task-button{position:relative;isolation:isolate}
.task-button:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 50% 105%,#c6e6ff46,transparent 73%);opacity:0;transition:opacity .18s}
.task-button:hover:before,.task-button.is-active:before{opacity:1}
.start-button:active{filter:brightness(.8)}
.start-profile-button{border-radius:4px;padding:4px 0 7px;background:linear-gradient(#e6f4ff08,transparent)}
.theme-choice .theme-preview i:before{content:'';position:absolute;top:2px;right:3px;width:21px;height:5px;border:1px solid #cadde865;background:linear-gradient(90deg,#c4d6e226 65%,#a06d6977 65%);border-radius:0 0 1px 1px}
.theme-choice .theme-preview i:after{content:'';position:absolute;inset:15px 4px 4px;background:linear-gradient(90deg,var(--pc-surface) 22%,var(--pc-line) 22%,var(--pc-line) 23%,transparent 23%),linear-gradient(var(--pc-raised) 5px,transparent 5px);border:1px solid var(--pc-line);opacity:.75}
.media-orbit:after{content:'';position:absolute;inset:-7px;border-radius:50%;background:conic-gradient(from 32deg,transparent 0deg 260deg,#c5dfed5e 315deg,transparent 360deg);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 1px),#000 calc(100% - 1px));mask:radial-gradient(farthest-side,transparent calc(100% - 1px),#000 calc(100% - 1px));pointer-events:none}
.media-player[data-playing=true] .media-orbit:after{animation:pc-record-turn 18s linear infinite}
.media-player input[type=range]{-webkit-appearance:none;appearance:none;background:transparent;border:0;padding:0;height:18px;cursor:pointer;accent-color:#a4bfd0}
.media-player input[type=range]::-webkit-slider-runnable-track{height:5px;border-radius:3px;background:linear-gradient(90deg,#9dbbce var(--range-fill,0%),var(--pc-input) var(--range-fill,0%));box-shadow:inset 0 1px 2px #0006,0 1px 0 var(--pc-sheen)}
.media-player input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:11px;height:15px;margin-top:-5px;border:1px solid #506b80;border-radius:3px;background:linear-gradient(90deg,#9db2c3,#e4edf4 42%,#b6cad9 48%,#809aaa);box-shadow:inset 0 0 0 1px #edf6ff66,0 1px 3px #0007}
.media-player input[type=range]::-moz-range-track{height:5px;border-radius:3px;background:var(--pc-input);box-shadow:inset 0 1px 2px #0006}
.media-player input[type=range]::-moz-range-progress{height:5px;background:#9dbbce;border-radius:3px}
.media-player input[type=range]::-moz-range-thumb{width:10px;height:14px;border:1px solid #506b80;border-radius:3px;background:linear-gradient(90deg,#9db2c3,#e4edf4 42%,#b6cad9 48%,#809aaa);box-shadow:inset 0 0 0 1px #edf6ff66,0 1px 3px #0007}
.media-player input[type=range]:hover{filter:brightness(1.12)}
:root[data-mode=light] .app-row>.app-emblem{background:linear-gradient(145deg,#fff,#dbe7ef);border-color:#b6c9d8;box-shadow:inset 0 1px 0 #fff,0 2px 3px #20374714}
@keyframes pc-window-enter{from{opacity:0;transform:translateY(5px) scale(.99)}to{opacity:1;transform:none}}
@keyframes pc-menu-enter{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@keyframes pc-record-turn{to{transform:rotate(1turn)}}
@media(prefers-reduced-motion:no-preference){.app-window{animation:pc-window-enter .18s ease-out}.start-menu{animation:pc-menu-enter .14s ease-out}}

@container(max-width:420px){.welcome-apps{grid-template-columns:1fr}.app-row{min-height:72px}.welcome-banner{padding:15px 18px}.welcome-banner>.computer-illustration{right:-5px;width:190px}.welcome-banner h1{font-size:24px}}
@container(max-width:300px){.welcome-banner>.computer-illustration{display:none}.welcome-banner{height:91px;min-height:91px;padding:15px}.welcome-apps{padding:14px 10px}.app-row>.app-emblem{display:none}.app-row{padding:9px 11px}}
@media(max-width:640px){
  .desktop-shortcuts{left:7px;column-gap:4px;row-gap:2px}
  .app-window,.app-window:not(.is-active),.app-window.is-active{border:0;border-radius:0;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
  .window-titlebar{height:35px;padding-left:7px}.window-controls{height:28px}.window-controls button{height:27px}
  .window-toolbar{padding:5px;gap:4px}.explorer-search{width:115px}.address-bar{gap:5px;font-size:11px}
  .welcome-apps{padding:15px;gap:8px}.app-row{padding:10px 12px;min-height:69px}.welcome-status{height:43px}
  .start-right{width:125px}.start-right>button,.start-right>a{padding:6px 5px}
  .theme-preview{height:83px}.media-art{min-height:150px}.system-tray{padding-left:6px}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.app-window,.app-window.is-active{background:linear-gradient(125deg,#455767,#152333 70%)}.start-menu{background:#243443}}
@media(prefers-reduced-transparency:reduce){.app-window,.app-window.is-active,.start-menu{background:#243343;-webkit-backdrop-filter:none;backdrop-filter:none}.taskbar{background:#152332;-webkit-backdrop-filter:none;backdrop-filter:none}}
@media(prefers-reduced-motion:reduce){.desktop-shortcut,.app-row{transition:none}}

/* October finish: graphite chassis, thin silver highlights and quiet burgundy accents. */
:root:not([data-mode=light]){
  --pc-bg:#111318;--pc-surface:#1c2027;--pc-raised:#2c313b;
  --pc-line:#414651;--pc-hover:#30343f;--pc-input:#0d1015;
  --pc-text:#edf0f4;--pc-muted:#b1b6c0;--pc-shadow:#0006;
}
.app-window{padding:0 6px 6px;border-radius:7px;box-shadow:0 16px 48px #0009,inset 0 0 0 1px #cad3e22b}
.app-window.is-active{box-shadow:0 20px 65px #000a,0 2px 8px #0007,inset 0 0 0 1px #e0e8f05c}
.window-titlebar{padding:0 5px 0 3px;letter-spacing:.015em}
.app-window:not(.is-active) .window-title{opacity:.76}
.window-content{border-radius:1px; background:var(--pc-bg)}
.window-content button:focus-visible,.window-content a:focus-visible,.start-menu button:focus-visible,.desktop-shortcut:focus-visible{outline:2px solid var(--pc-link);outline-offset:2px}
.window-content input:not([type=range]):focus-visible,.window-content select:focus-visible,.window-content textarea:focus-visible{outline:1px solid var(--pc-link);outline-offset:1px}
.desktop-shortcut[aria-selected=true]{background:linear-gradient(#d1dbea29,#8d9cb51a);border-color:#cbd5e36b;box-shadow:inset 0 1px 0 #fff2}
.desktop-shortcut svg{transition:filter .16s,transform .16s}
.desktop-shortcut:hover svg{filter:drop-shadow(0 3px 3px #0009) drop-shadow(0 0 5px #dbe4f21c);transform:translateY(-1px)}
.welcome-banner{background:radial-gradient(ellipse at 85% 10%,var(--pc-sheen),transparent 65%),linear-gradient(115deg,var(--pc-surface),var(--pc-bg));border-bottom:1px solid var(--pc-line)}
.welcome-apps{gap:9px;padding:16px 18px 20px;align-content:start}
.app-row{border-radius:4px;border-color:var(--pc-line);background:linear-gradient(135deg,var(--pc-sheen),transparent 60%),var(--pc-surface);box-shadow:inset 0 1px 0 var(--pc-sheen),0 2px 5px var(--pc-shadow);transition:background .16s,border-color .16s,box-shadow .16s}
.app-row:hover{border-color:var(--pc-link);background:linear-gradient(135deg,var(--pc-sheen),transparent 65%),var(--pc-hover);box-shadow:inset 0 1px 0 var(--pc-sheen),0 3px 9px var(--pc-shadow)}
.app-row small{color:var(--pc-muted);line-height:1.45}
.app-emblem{background:linear-gradient(135deg,var(--pc-raised),var(--pc-bg));border:1px solid var(--pc-line);box-shadow:inset 0 1px 0 var(--pc-sheen),0 2px 5px var(--pc-shadow)}
.explorer-sidebar{background:linear-gradient(90deg,var(--pc-surface),var(--pc-bg));border-right:1px solid var(--pc-line)}
.explorer-sidebar button:hover{background:var(--pc-hover)}
.welcome-status{background:linear-gradient(var(--pc-surface),var(--pc-bg));border-top:1px solid var(--pc-line)}
.guides-file:hover,.theme-choice:hover{border-color:var(--pc-link);box-shadow:inset 0 1px 0 var(--pc-sheen),0 3px 9px var(--pc-shadow)}
.tiers-tier-row,.tiers-pool,.tiers-result-card,.daily-row,.cosmetic-item{border-radius:4px;box-shadow:inset 0 1px 0 var(--pc-sheen),0 2px 5px var(--pc-shadow)}
.tiers-quick-choices button{border-radius:4px;background:linear-gradient(135deg,var(--pc-sheen),transparent),var(--pc-surface);box-shadow:inset 0 1px 0 var(--pc-sheen),0 3px 7px var(--pc-shadow);transition:border-color .15s,background .15s,transform .15s}
.tiers-quick-choices button:hover{transform:translateY(-2px)}
.tiers-primary{border-radius:3px;box-shadow:inset 0 1px 0 #ffffff24,0 2px 5px var(--pc-shadow)}
.tiers-member:hover,.tiers-member:focus-visible{background:var(--pc-hover);border-color:var(--pc-link)}
.tiers-support-track{box-shadow:inset 0 1px 3px #0005;border-radius:2px;overflow:hidden}
.daily-summary,.echo-stats{font-variant-numeric:tabular-nums}
.theme-choice,.cosmetic-item{transition:border-color .15s,box-shadow .15s}
.media-controls{border-top:1px solid var(--pc-line)}
.start-menu{border-radius:7px 7px 0 0;overflow:hidden}
.start-apps button{transition:background .12s,border-color .12s}
.taskbar{box-shadow:inset 0 1px 0 #e4ecf038,0 -5px 18px #0005}
.task-button{border-radius:3px}
@media(max-width:640px){.app-window{padding:0;border-radius:0}.welcome-apps{padding:12px;gap:8px}.window-titlebar{padding-left:7px}}
@media(prefers-reduced-motion:reduce){.desktop-shortcut svg,.tiers-quick-choices button{transition:none;transform:none!important}}
