/* Color mode is independent of the wallpaper/accent theme. Dark is the default. */
:root{color-scheme:dark;--pc-bg:#101317;--pc-surface:#191e23;--pc-raised:#252c33;--pc-text:#e0e5e8;--pc-muted:#9eabb4;--pc-line:#3b4650;--pc-hover:#2b3842;--pc-input:#0d1115;--pc-link:#adc7d8}
:root[data-mode=light]{color-scheme:light;--pc-bg:#fff;--pc-surface:#f2f4f6;--pc-raised:#e2e7eb;--pc-text:#182128;--pc-muted:#536573;--pc-line:#b5c0c9;--pc-hover:#dce7ed;--pc-input:#fff;--pc-link:#285471}
:root[data-theme=graphite]{--wallpaper:url('/static/img/desktop/midnight.svg');--wallpaper-filter:grayscale(1) brightness(.6);--aero:67 78 89;--theme-color:#566572;--theme-deep:#080c11}

.app-window,.app-window:not(.is-active){background:linear-gradient(118deg,#74818b65,#1c252eef 22%,#34424dc9 49%,#10171df2 72%,#4d5b6570);border-color:#06090d;box-shadow:inset 0 0 0 1px #8b9aa54d,0 9px 24px #0009}
.app-window.is-active{background:linear-gradient(118deg,#8e9da572,rgb(var(--aero) / .65) 18%,#28343ddb 48%,#0f171ef2 74%,#63717d80);box-shadow:inset 0 0 0 1px #b6c3ca66,0 12px 30px #000b}
.window-title{color:#f0f3f5;text-shadow:0 1px 2px #000}
.window-content{background:var(--pc-bg);color:var(--pc-text);border-color:#05080c;box-shadow:0 0 0 1px #85939c5c}
.window-controls button{background:linear-gradient(#8999a76b,#41515e9c 45%,#17232ddd 50%,#536574ad);box-shadow:inset 0 0 0 1px #bfced43d}
.window-controls button:last-child{background:linear-gradient(#a77570,#78524e 43%,#4c2725 50%,#85544e)}
.window-controls [data-window-action=minimize]:before,.window-controls [data-window-action=close]:before,.window-controls [data-window-action=close]:after{background:#edf2f5}
.window-controls [data-window-action=maximize]:before{border-color:#edf2f5}
.taskbar{background:linear-gradient(#55616b9c,#252f37e6 45%,#080d12f5 49%,#1c252eef);border-top-color:#6675807a}
.task-button{background:linear-gradient(#71838e48,#45535e40 44%,#101820cb 49%,#35434e6e);border-color:#6577838a}

.desktop-wordmark{left:50%;top:50%;right:auto;width:220px;height:220px;transform:translate(-50%,-50%);text-align:center;color:#c7d2d949;font-size:44px;line-height:1;letter-spacing:-.035em}
.desktop-wordmark>img{display:block;width:100%;height:100%;margin:0;object-fit:contain;mix-blend-mode:screen;opacity:.25}
.desktop-wordmark>span{position:absolute;top:100%;left:0;width:100%;margin-top:12px}
.start-button{display:grid;place-items:center;padding:0;line-height:1;flex-shrink:0}
.start-button img{display:block;width:30px;height:30px;margin:0;transform:none;object-fit:contain}
/* Fifteen shortcuts share equal cells across two columns on taller desktops. */
.desktop-shortcuts{grid-template-rows:repeat(8,76px);grid-auto-columns:74px;gap:2px}
.desktop-shortcut{width:74px;min-height:74px;gap:3px;padding:5px 2px;text-decoration:none}
.desktop-shortcut svg{width:40px;height:40px}.desktop-shortcut span{font-size:11px;line-height:14px}
.app-row svg{width:40px;height:40px}.start-apps svg{width:28px;height:28px}
:root[data-mode=light] .desktop-wallpaper{background-image:linear-gradient(#ffffffdf,#f6f8faed),var(--wallpaper);filter:none;background-color:#f6f7f8}
:root[data-mode=light] .desktop-wallpaper:after{opacity:.12}
:root[data-mode=light] .desktop-wordmark{color:#303c464f}
:root[data-mode=light] .desktop-wordmark>img{filter:invert(1) grayscale(1);mix-blend-mode:multiply;opacity:.20}
:root[data-mode=light] .desktop-shortcut span{color:#17232d;text-shadow:0 1px 1px #fff}
:root[data-mode=light] .gadget-date,:root[data-mode=light] .desktop-caption{color:#334654;text-shadow:none}

.computer-shell,.explorer,.explorer-sidebar,.welcome-main,.appearance-panel{background:var(--pc-bg);color:var(--pc-text)}
.window-toolbar,.explorer-commandbar,.welcome-status,.notes-toolbar,.notes-status,.embedded-toolbar{background:linear-gradient(var(--pc-raised),var(--pc-surface));color:var(--pc-text);border-color:var(--pc-line)}
.address-bar,.explorer-search input,.start-search input{background:var(--pc-input);color:var(--pc-text);border-color:var(--pc-line)}
.explorer-commandbar button,.explorer-commandbar a,.embedded-toolbar a,.welcome-status>a,.welcome-status small{color:var(--pc-text)}
.explorer-sidebar{border-color:var(--pc-line)}
.explorer-sidebar h3,.explorer-sidebar button{color:var(--pc-text)}
.explorer-sidebar button[data-app=welcome]{background:var(--pc-hover);border-color:var(--pc-line)}
.explorer-sidebar hr{border-color:var(--pc-line)}
.explorer-sidebar>a{color:var(--pc-link)}
.welcome-banner{background:linear-gradient(110deg,var(--pc-surface),var(--pc-raised));border-color:var(--pc-line)}
.welcome-banner h1,.welcome-apps h2,.appearance-heading h1{color:var(--pc-text)}
.welcome-banner small,.app-row small{color:var(--pc-muted)}
.welcome-apps h2:after{background:var(--pc-line)}
.app-row{color:var(--pc-text)}
.app-row:hover,.explorer-sidebar button:hover{background:var(--pc-hover);border-color:var(--pc-line);box-shadow:none}
.welcome-banner>img,.profile-orb{background:transparent;border:0;box-shadow:none}
:root[data-mode=light] .welcome-banner>img{filter:invert(1)}
.notes-area{background:var(--pc-bg);color:var(--pc-text)}
.notes-status,.embedded-toolbar,.embedded-toolbar a{color:var(--pc-muted)}
.start-left{background:var(--pc-bg);color:var(--pc-text);border-color:var(--pc-line)}
.start-apps{background:var(--pc-bg)}
.start-profile-button{display:block;width:100%;padding:0;border:0;background:transparent;color:inherit;font:inherit;text-shadow:inherit;text-align:center}
.start-profile-button .profile-orb{display:block;margin:0 auto 7px}
.start-profile-button:hover{background:#c4d8e31a;border-radius:4px}
.start-footer button{display:flex;align-items:center;justify-content:center;gap:7px;min-height:28px;line-height:1;text-align:center}
.start-footer .shutdown-label{margin:0;font:inherit;line-height:1;color:inherit}
.shutdown-icon{display:block;width:14px;height:14px;flex-shrink:0;color:inherit}
.system-tray button[data-action=replay-room]{display:grid;place-items:center;width:26px;height:26px;padding:0;line-height:1}
.system-tray .shutdown-icon{width:16px;height:16px}
.profile-entry{min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:14px;padding:32px 24px;color:var(--pc-text);background:var(--pc-bg)}
.profile-entry>svg{width:56px;height:56px;flex-shrink:0}.profile-entry h1{font:400 21px/1.2 var(--system-font);margin:0}.profile-entry p{font-size:12px;line-height:1.7;max-width:300px;margin:0;color:var(--pc-muted)}
.profile-sign-in,.profile-retry{font:12px var(--system-font);color:var(--pc-text);background:linear-gradient(var(--pc-raised),var(--pc-surface));border:1px solid var(--pc-line);border-radius:3px;padding:8px 24px;text-decoration:none}
.profile-sign-in:hover,.profile-retry:hover{background:var(--pc-hover);border-color:var(--pc-link)}
.start-apps button{color:var(--pc-text)}.start-apps button:hover{background:var(--pc-hover);border-color:var(--pc-line)}
.start-search{background:var(--pc-surface);border-color:var(--pc-line)}
.media-controls,.video-list{background:var(--pc-surface);color:var(--pc-text);border-color:var(--pc-line)}
.media-track,.media-track small,.master-volume output,.video-list>span,.video-list button{color:var(--pc-text)}
.media-player,.media-tabs,.media-art,.sound-mixer{background:var(--pc-bg);color:var(--pc-text)}
.media-tabs strong,.media-art h2,.media-art p,.sound-mixer span{color:var(--pc-text)}
.sound-presets button{color:var(--pc-muted);border-color:var(--pc-line)}
.sound-presets button[aria-pressed=true]{color:var(--pc-text);background:var(--pc-hover);border-color:var(--pc-link)}
.media-tabs a{margin-left:auto;color:var(--pc-muted);text-decoration:none}
.media-tabs a:hover{color:var(--pc-text);text-decoration:underline}
.media-player .video-list{min-height:90px;max-height:174px;border-bottom:1px solid var(--pc-line);padding:4px 13px}
.media-player .video-list button{padding:8px 2px;font:11px/1.4 var(--system-font);border-bottom:1px solid var(--pc-line);cursor:pointer}
.media-player .video-list button:last-child{border-bottom:0}
.media-player .video-list button:hover,.media-player .video-list button:focus-visible{background:var(--pc-hover)}
.media-art:has(iframe){display:block;padding:0;min-height:190px}
.media-art iframe{width:100%;height:100%;min-height:190px}

.appearance-heading{margin-bottom:20px}.appearance-heading h1{margin:0;font-size:18px}
.appearance-heading>svg{width:36px;height:36px}
.theme-choice{background:var(--pc-surface);border-color:var(--pc-line);gap:7px;padding:8px}
.theme-choice strong{color:var(--pc-text);margin:2px 3px 3px}
.theme-choice:hover,.theme-choice[aria-pressed=true]{background:var(--pc-hover);border-color:var(--pc-link);box-shadow:none}
.theme-preview{border-color:var(--pc-line)}.theme-choice .theme-preview i{background:linear-gradient(#435360 12px,var(--pc-bg) 12px);border-color:var(--pc-line)}
.theme-check{bottom:10px;right:13px;color:var(--pc-text)}
.mode-switch{display:flex;gap:8px;margin-bottom:22px}
.mode-switch button{display:flex;align-items:center;justify-content:center;gap:9px;flex:1;padding:10px;border:1px solid var(--pc-line);border-radius:3px;background:var(--pc-surface);color:var(--pc-text);font:12px var(--system-font)}
.mode-switch button[aria-pressed=true]{background:var(--pc-hover);border-color:var(--pc-link);box-shadow:inset 0 0 0 1px var(--pc-link)}
.mode-swatch{width:15px;height:15px;border:1px solid #7e8b94;border-radius:50%;background:#080b0f}.mode-swatch--light{background:#fff}
@media(max-height:620px){.desktop-shortcuts{grid-template-rows:repeat(5,76px)}}
@media(max-height:510px){.desktop-shortcuts{grid-template-rows:repeat(4,76px)}}
@media(max-width:640px){.desktop-shortcuts{grid-template-rows:repeat(4,76px)}.desktop-wordmark{width:164px;height:164px;font-size:32px}.theme-check{bottom:10px}.appearance-panel{padding:20px 17px}}

/* A small Explorer folder with a live Google Docs shortcut. */
.guide-folder{height:100%;display:flex;flex-direction:column;background:var(--pc-bg)}
.guide-folder-body{display:flex;flex:1;min-height:0;overflow:auto}
.guide-folder .explorer-sidebar{width:145px;flex-shrink:0;padding:16px 9px}
.guide-folder .explorer-sidebar [aria-current=page]{background:var(--pc-hover);border-color:var(--pc-line)}
.guide-file-list{flex:1;min-width:0;padding:0 12px}
.guide-file-columns{display:grid;grid-template-columns:1fr 120px;gap:8px;border-bottom:1px solid var(--pc-line);padding:9px 6px;font:11px var(--system-font);color:var(--pc-muted)}
.guide-file{display:flex;align-items:center;width:100%;gap:9px;padding:10px 6px;margin-top:4px;background:transparent;border:1px solid transparent;border-radius:3px;color:var(--pc-text);font:12px var(--system-font);text-align:left}
.guide-file>svg{width:24px;height:24px;flex-shrink:0}.guide-file>span{flex:1}.guide-file>small{width:112px;color:var(--pc-muted);font-size:11px}
.guide-file:hover,.guide-file:focus-visible{background:var(--pc-hover);border-color:var(--pc-line)}
.guide-folder-status{padding:8px 14px;border-top:1px solid var(--pc-line);background:var(--pc-surface);font:11px var(--system-font);color:var(--pc-muted)}
.system-sounds-setting{display:flex;align-items:center;gap:8px;margin-top:20px;color:var(--pc-muted);font:12px var(--system-font)}
.system-sounds-setting input{accent-color:var(--pc-link)}
@media(max-width:640px){.guide-folder .explorer-sidebar{display:none}.guide-file-columns{grid-template-columns:1fr 110px}.guide-file>small{width:104px}.guide-file{font-size:12px}}

.guide-file{text-decoration:none}.guide-folder .explorer-sidebar button[data-app=welcome]{background:transparent;border-color:transparent}
.text-file{height:100%;display:flex;flex-direction:column;background:var(--pc-bg);color:var(--pc-text)}
.text-file-content{display:block;flex:1;min-height:0;width:100%;resize:none;border:0;outline-offset:-2px;padding:18px;background:var(--pc-bg);color:var(--pc-text);font:13px/1.6 Consolas,'Courier New',monospace;white-space:pre;overflow:auto;tab-size:4;text-transform:none;letter-spacing:normal;word-spacing:normal}
.text-file-error{margin:0;padding:10px 14px;font:12px var(--system-font);color:var(--pc-text)}
.image-file-viewer{height:100%;display:flex;flex-direction:column;background:var(--pc-bg);color:var(--pc-text)}
.image-file-stage{flex:1;min-width:0;min-height:0;padding:14px;overflow:hidden}
.image-file-stage img{display:block;width:100%;height:100%;object-fit:contain}
.guide-file>span{min-width:0;overflow-wrap:anywhere}