@import url('controls.css');
@font-face{font-family:Tahoma;src:url('assets/tahoma.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}@font-face{font-family:Tahoma;src:url('assets/tahoma-bold.woff2') format('woff2');font-style:normal;font-weight:700;font-display:swap}
html,body{width:100%;height:100%;overflow:hidden}body{background-position:center;background-size:cover;font-family:Tahoma,Arial,sans-serif}button,input,textarea{font-family:Tahoma,Arial,sans-serif}button{cursor:default}.icons{padding:28px 0 0 24px;grid-template-columns:120px;grid-auto-rows:120px;gap:10px}.icons button{padding:16px 6px 8px;gap:6px}.icons button.selected{outline:none;background:rgba(49,106,197,.5);border:1px dotted #ffffff80}.icons button:hover:not(.selected){background:rgba(49,106,197,.22)}.icons img.icon{width:64px;height:64px}.desktop-selection{position:absolute;pointer-events:none;border:1px dotted #ffffff80;background:rgba(49,106,197,.15);z-index:6}.icons.is-freeform{display:block;pointer-events:none;width:100%;height:calc(100% - 30px);padding:0}.icons.is-freeform>button{position:absolute;pointer-events:auto}.icons button.dragging{opacity:.7}
/* Boot artwork: preserve the original flag, replace the personal wordmark. */
.xp-brand{position:relative;width:200px;height:162px;flex-shrink:0;text-align:left}.xp-brand-inner{width:200px;height:162px;position:absolute;left:0;top:0;transform-origin:top left}.brand-flag{position:absolute;top:0;left:0;width:200px;height:100px;overflow:hidden}.brand-flag img{display:block;width:200px;height:162px;max-width:none;object-fit:fill}.brand-name{position:absolute;left:2px;top:94px;font:700 46px/1 Arial,sans-serif;letter-spacing:-3px;color:white}.brand-name span{font:400 30px/1 Arial,sans-serif;letter-spacing:-1px;vertical-align:top;margin-left:4px;color:#df5828}.brand-edition{position:absolute;top:139px;left:8px;font:italic 13px/1 Arial,sans-serif;color:white;white-space:nowrap}.boot-center{width:336px;display:flex;align-items:center;flex-direction:column}.boot-center .xp-brand{width:336px;height:272px;margin:0 0 48px}.boot-center .xp-brand-inner{transform:scale(1.68)}#boot{background:#000}.boot-loader{width:174px;height:22px;border:2px solid #b2b2b2;border-radius:6px;padding:2px 0;margin:0;overflow:hidden;transform:scale(1.06);background:black}.boot-loader>span{display:flex;width:33px;height:100%;gap:3px;background:none;animation:xp-loader 2.2s steps(17) infinite;position:static}.boot-loader i{display:block;flex:0 0 9px;height:100%;background:linear-gradient(#2838c7,#5979ef 17%,#869ef3 32%,#869ef3 45%,#5979ef 59%,#2838c7)}@keyframes xp-loader{from{transform:translateX(-33.5px)}to{transform:translateX(170.5px)}}#boot-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}#boot footer{padding:0;bottom:48px;left:100px;right:100px;font-size:16px;line-height:1.4}.boot-wordmark{height:32px;width:auto;object-fit:contain}#skip-boot{right:0;bottom:50px;color:#777;background:none;border:0;padding:5px;font-size:11px!important}
/* XP login: each side is anchored to the centre divider. */
#login{border:0;background:#002d99;overflow:hidden}#login:before{content:"";position:absolute;inset:100px 0;background:#587cdb}#login:after{content:"";position:absolute;top:100px;left:0;width:100%;height:3px;background:linear-gradient(90deg,transparent,#bad7f8,transparent,transparent);pointer-events:none}.login-middle{inset:100px 0;position:absolute;width:100%;max-width:none;min-height:0;transform:none;display:block}.login-middle:before{content:"";position:absolute;top:20%;bottom:20%;left:50%;width:2px;transform:translateX(-50%);background:linear-gradient(transparent,#bad7f8 40%,#bad7f8 60%,transparent);opacity:.35}.login-middle:after{content:"";position:absolute;bottom:0;left:0;width:100%;height:3px;background:linear-gradient(90deg,transparent,#f8953d,transparent,transparent)}.login-brand{position:absolute;left:50%;top:45%;width:auto;min-height:0;display:flex;align-items:flex-end;padding:0;border:0;transform:translate(calc(-100% - 53px),-50%)}.login-brand .xp-brand{margin:0;width:200px;height:162px}.login-brand p{font:400 19px Tahoma;letter-spacing:.25px;white-space:nowrap;position:relative;right:28px;margin:12px 0 0}.login-user{position:absolute;left:50%;top:45%;transform:translate(53px,-50%);padding:0}.login-user>button{min-width:260px;display:flex;align-items:flex-start;gap:14px;padding:10px 18px 10px 10px;border:1px solid transparent;border-radius:6px;background:transparent;color:white;box-shadow:none;margin:20px 0}.login-user>button:hover{border-color:#bad7f888;background:linear-gradient(90deg,#113fa6,#194db8 40%,#587cdb)}.login-user>button>span+span{margin-top:11px;text-align:left}.user-tile{height:70px;width:70px;min-width:70px;border:3px solid white;border-radius:3px;font-size:44px;display:grid;place-items:center}.login-user>button:hover .user-tile{border-color:#fdbd32}.login-user strong{font:500 26px/1 Tahoma;letter-spacing:.25px;display:block}.login-user small{font:bold 13px/1.2 Tahoma;color:navy;display:block;margin-top:3px}.login-user label{position:absolute;left:11px;top:calc(100% - 8px);font:10px Tahoma;opacity:.8;white-space:nowrap}#login footer{height:100px;bottom:0;padding:0;left:50px;right:50px}#login footer .restart{position:absolute;left:0;bottom:35px;font:16px Tahoma;background:none;border:0;display:flex;align-items:center;padding:0;color:#eff1ed}#login footer .restart img{width:32px;height:32px;opacity:.8;margin-right:8px}#login footer>span{position:absolute;right:0;bottom:30px;font:14px/1.5 Tahoma}#welcome-transition{background:#587cdb;border-top:100px solid #002d99;border-bottom:100px solid #002d99}#welcome-transition em{font:bold italic 48px Tahoma;text-shadow:1px 1px 3px #000a;letter-spacing:.3px}
/* Pixel controls and accurately proportioned Explorer chrome. */
.window{border:2px solid #284ffd;border-top-width:1.5px;border-radius:8px 8px 0 0;box-shadow:1px 1px 6px #0008;padding:0}.window:not(.focused-window){border-color:#3d7bff}.titlebar{background:linear-gradient(#0997ff,#0053ee 8%,#0050ee 40%,#06f 88%,#06f 93%,#005bff 95%,#003dd7 96%,#003dd7);height:30px;min-height:30px;max-height:30px;border-radius:6px 6px 0 0;font:700 13px 'Trebuchet MS',Tahoma,sans-serif;text-shadow:1px 1px #0f1089;padding:3px 4px 3px 3px;gap:0;touch-action:none;flex-shrink:0;border:0}.titlebar>span{display:flex;align-items:center;gap:5px;padding-left:2px;min-width:0;font-size:13px;white-space:nowrap;overflow:hidden}.titlebar>span img{height:16px;width:16px;object-fit:contain}.window:not(.focused-window)>.titlebar{background:linear-gradient(#7eaaf4,#7898de 15%,#6e91d8 90%,#5b81ce)}.controls{gap:0;margin:0;flex-shrink:0}.controls button{height:21px;width:21px;min-width:21px;min-height:21px;margin-left:2px;border:0!important;padding:0!important;background-color:#0050ee!important;background-position:center!important;background-size:21px 21px!important;background-repeat:no-repeat!important;border-radius:3px!important;box-shadow:none!important;font-size:0!important;text-shadow:none}.controls button:after,.controls button:before{display:none!important}.window:not(.focused-window)>.titlebar .controls{opacity:.75}.ref-menubar{height:22px;min-height:22px;max-height:22px;padding:0;gap:0;background:#ece9d8;border-bottom:1px solid #d4d0c8}.ref-menubar button{font:11px Tahoma;padding:0 12px;height:21px;min-height:0;line-height:21px;border:0;border-radius:0}.ref-menubar img{height:22px;width:40px;object-fit:fill;margin:0}.ref-toolbar{height:48px;min-height:48px;max-height:48px;gap:0;padding:0 4px;background:#ece9d8;border:0}.ref-toolbar button{height:40px;padding:6px 8px;font:11px Tahoma;gap:5px;border:1.5px solid transparent;border-radius:5px}.ref-toolbar button img{height:25px;width:25px}.ref-toolbar button:disabled{opacity:.5;filter:none}.ref-toolbar button:hover:not(:disabled){background:#e4e0d0;border-color:#c4bfa8}.ref-address{height:32px;min-height:32px;background:#ece9d8;padding:0 4px 4px;gap:4px;font:11px Tahoma}.ref-address>div{height:22px;border:1px solid #d4d0c8;box-shadow:none}.ref-address>span:first-child{padding-left:0;color:#7f7c73}.ref-address>img{height:20px;width:20px;filter:grayscale(1);opacity:.6}.ref-address>div img{height:14px;width:14px}.ref-address>div small{height:18px;border:1px outset #ece9d8;background:#ece9d8;color:#999;padding:0 3px}.status{height:23px;min-height:23px;font:11px Tahoma;background:#ece9d8;box-shadow:inset 0 1px #fff,inset 0 2px #aca899;border:0;padding:4px 6px 1px}.window-resizer{position:absolute;right:0;bottom:0;width:14px;height:14px;cursor:nwse-resize;z-index:5;touch-action:none;background:repeating-linear-gradient(135deg,transparent 0 2px,#aca899 2px 3px,transparent 3px 4px);clip-path:polygon(100% 0,100% 100%,0 100%)}.maximized>.window-resizer{display:none}
#about{width:804px;height:632px;top:29px;left:calc(50% - 527px)}.ref-about{background:linear-gradient(135deg,#5964c1,#7186dc);padding:0;min-height:0;overflow:hidden;flex:1}.ref-about>aside{width:190px;min-width:190px;max-width:190px;height:100%;background:linear-gradient(#748aff,#4057d3);padding:20px 10px 14px;border-right:1px solid #ffffffb0;overflow:auto}.ref-about details{width:100%;border:0;border-radius:5px 5px 0 0;margin:0 0 14px;background:#c2d4ec}.ref-about summary{height:23px;padding:4px 10px;font:bold 11px Tahoma;letter-spacing:.2px;background:linear-gradient(90deg,#fff,#f0f0ff 50%,#c2d4ec);color:#0c327d;border-radius:5px 5px 0 0;list-style:none;position:relative}.ref-about summary:after{content:'⌃';display:grid;place-items:center;position:absolute;right:8px;top:5px;width:13px;height:13px;border-radius:50%;border:1px solid #a1b5c7;background:#f4f8fb;font-size:12px}.ref-about details:not([open]) summary:after{content:'⌄'}.ref-about details:first-child summary{background:linear-gradient(90deg,#054394,#0484fb);color:white}.ref-side-list{padding:5px 10px;border:1.5px solid white;border-top:0;display:block}.ref-side-list button{padding:0;min-height:16px;font:10px/14px Tahoma;color:#0c327d;gap:6px;width:100%}.ref-side-list button img{width:13px;height:13px}.ref-about article{padding:24px 36px;overflow-y:auto;font-family:Tahoma;flex:1;min-width:0}.ref-about article h1{font:bold 30px/1 Tahoma;letter-spacing:.5px;margin:0 0 24px;text-shadow:1px 1px #000}.about-row{gap:0;margin:0 0 18px;display:flex;align-items:flex-start}.about-row>div:last-child{padding-left:30px}.about-row p{font:15.5px/1.35 Tahoma;text-shadow:1px 1px #000;margin:0 0 18px}.about-row .ref-avatar,.about-illustration{width:60px;height:60px;min-width:60px;font-size:42px}.bio-pending{font-size:13px!important;color:#dde7ff!important}.inline-about{color:white;text-decoration:underline}
/* Actual taskbar palette; the tray chevron is a separate sprite. */
.taskbar{height:30px;min-height:30px;background:linear-gradient(#1f62db 0,#3d8aff 4%,#3983ed 9%,#2362d5 18%,#225dd7 84%,#174cbb 100%)!important;border:0;padding:0;box-shadow:inset 0 1px #5299ff;gap:0}.start,.start img{width:94px!important;height:30px!important;min-width:94px;padding:0!important;margin:0!important;border:0;border-radius:0;background:none}.start:hover{filter:brightness(1.15)}#tasks{margin:0 4px;gap:1px;flex:1;min-width:0;overflow:hidden}.task{display:flex;align-items:center;height:26px;min-height:26px;max-width:168px;min-width:36px;flex:1 1 168px;padding:0 10px;font:11px Tahoma;border:1px solid #1868c0;border-bottom-color:#145aa8;border-right-color:#14589e;border-radius:3px;background:linear-gradient(#42a0ef,#368ee8 45%,#3484d6);box-shadow:inset 1px 0 #5d98f573,inset 0 1px 1px #ffffff47;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-shadow:1px 1px #0004}.task.active{background:linear-gradient(0deg,#1a5a99,#1f6bb8);box-shadow:inset 1px 1px 1px #0006;border-color:#0f3d70}.task img{width:15px;height:15px;margin:0 6px 0 0;flex-shrink:0}.task-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.task.attention{background:linear-gradient(#f0ad45,#d47312 17%);border-color:#c46c0a}.tray{height:30px;min-height:30px;flex-shrink:0;gap:6px;padding:0 12px 0 4px;background:url('icons/reference/tray.webp') left top/100% 30px no-repeat;border:0;box-shadow:none;margin:0}.tray button{padding:0;min-height:0;width:16px;height:20px;display:grid;place-items:center;background:none;border:0}.tray img{width:16px;height:16px}.tray #clock-button{width:auto;margin-left:6px;font:11px Tahoma;white-space:nowrap}.tray #tray-more{font-size:0!important;width:19px;height:20px;margin:0 1px 0 -6px;background:url('assets/tray-chevron.webp') 0 0/19px 60px no-repeat}.tray #tray-more[aria-expanded=true]{background-image:url('assets/tray-chevron-open.webp')}.tray #tray-more:hover{background-position:0 -20px}.tray #tray-more:active{background-position:0 -40px}#volume-panel{position:fixed;bottom:33px;right:70px;width:84px;padding:10px 9px;background:#ece9d8;border:1px solid #aca899;box-shadow:2px 2px 3px #0004;z-index:25000;font:11px Tahoma;text-align:center}#master-volume{writing-mode:vertical-lr;direction:rtl;display:block;width:25px;height:110px;margin:12px auto;accent-color:#488ae1}#volume-panel label{display:flex;gap:4px;align-items:center}#master-mute{margin:0}#xp-balloon{position:fixed;right:80px;bottom:52px;z-index:23000;background:#ffffe1;color:black;border:1px solid black;border-radius:7px;width:310px;padding:10px 13px;font:11px/1.4 Tahoma;box-shadow:2px 2px 2px #0006}#xp-balloon:after{content:'';position:absolute;right:20px;bottom:-19px;border-style:solid;border-width:0 19px 19px 0;border-color:transparent #ffffe1 transparent transparent;filter:drop-shadow(0 1px black)}#xp-balloon strong{font-size:12px;display:flex;align-items:center;gap:8px}#xp-balloon strong img{width:16px;height:16px}#xp-balloon p{margin:7px 0}#xp-balloon small{color:#666;font-size:10px}#balloon-close{position:absolute;right:4px;top:4px;border:1px solid #ddd;border-radius:3px;background:transparent;color:#777;padding:0;width:16px;height:16px}
#start-menu{width:335px;height:455px;bottom:30px;border:1px solid #0005;border-radius:5px 5px 0 0;box-shadow:0 -2px 8px #0006,2px 4px 10px #0006}.start-profile{height:51px;min-height:51px;padding:5px 8px;gap:8px;background:linear-gradient(#1868ce,#0e60cb 20%,#1b6cd3 47%,#297ae0 65%,#4791eb);border-bottom:2px solid #eea546}.start-profile strong{font:bold 13.5px Tahoma;letter-spacing:.5px;text-shadow:1px 1px 2px #0009}.start-columns{height:356px;grid-template-columns:52% 48%}.start-programs{padding:0;display:flex;flex-direction:column}.start-programs>button{flex:1;min-height:0;height:auto;padding:4px 8px;font:12px Tahoma;gap:7px}.start-programs>button:first-child,.start-programs>button:nth-child(2){height:auto}.start-programs>button img,.start-programs .start-app-icon{width:30px;height:30px;flex-shrink:0}.start-programs>hr{height:1px;margin:0;background:linear-gradient(90deg,transparent,#d2d2d2,transparent);border:0}.start-programs .all-programs-button{flex:0 0 35px;margin:0;height:35px}.all-programs-button img{width:18px!important;height:18px!important}.start-places{padding:0;display:flex;flex-direction:column;background:#d2e5fa}.start-places>button{flex:1 1 0;min-height:35px;height:auto;padding:4px 7px 4px 9px;font:11.5px Tahoma;gap:7px}.start-places>button img{height:25px;width:25px}.start-places>button:nth-child(-n+4){font-weight:bold}.start-places>hr{height:1px;margin:0;border:0;background:linear-gradient(90deg,transparent,#a1c4fc,transparent)}#start-menu footer{height:46px;padding:0 7px;gap:12px;border-top:1px solid #0005;background:linear-gradient(#428ee9,#297ae0 35%,#1b6cd3 53%,#1164cf 68%,#1868ce)}#start-menu footer button{font:12.5px Tahoma;gap:6px;padding:0}#start-menu footer img{height:24px;width:24px}.crt-overlay{opacity:1!important;z-index:40000;background:repeating-linear-gradient(0deg,#00000015 0 1px,transparent 1px 2px),repeating-linear-gradient(90deg,#0000000a 0 1px,transparent 1px 2px);pointer-events:none}body:not(.crt-enabled) .crt-overlay{display:none}.no-motion .boot-loader>span{animation:none}
@media(max-width:700px){.icons{padding:18px 0 0 12px;grid-template-columns:120px;grid-auto-rows:120px}.icons button{width:120px;height:120px}.icons .icon{width:64px;height:64px}#login:before,.login-middle{inset:80px 0}#login:after{top:80px}.login-middle:before{left:50%;top:50%;bottom:auto;height:2px;width:75%;max-width:280px;background:linear-gradient(90deg,transparent,#bad7f8 40%,#bad7f8 60%,transparent)}.login-brand{left:50%;top:50%;transform:translate(-50%,calc(-100% - 40px));align-items:center}.login-brand p{font-size:15px;right:auto;margin:0}.login-user{left:50%;top:50%;transform:translate(-50%,42px)}.login-user>button{margin:0;min-width:240px;padding:10px;gap:12px}.login-user label{top:100%;left:10px}#login footer{height:80px;left:15px;right:15px}#login footer .restart{font-size:11px;bottom:28px}#login footer .restart img{width:24px;height:24px}#login footer>span{font-size:10px;bottom:25px;max-width:48%}.boot-center .xp-brand{width:268px;height:217px;margin-bottom:38px}.boot-center .xp-brand-inner{transform:scale(1.34)}#boot footer{left:20px;right:20px;bottom:30px;font-size:11px}.boot-wordmark{height:26px}#welcome-transition{border-top-width:80px;border-bottom-width:80px}.ref-about>aside{display:none}.ref-about article{padding:24px}.about-row{flex-direction:row}.about-row>div:last-child{padding-left:15px}.about-row .ref-avatar,.about-illustration{width:44px;height:44px;min-width:44px;font-size:32px}.ref-toolbar button{padding:5px;font-size:10px}.tray{gap:5px;padding-right:7px}.tray #tray-help,.tray #quick-start{display:none}.task{padding:0 7px}.task .task-label{display:none}.task img{margin:0}.task{justify-content:center}.window-resizer{display:none}#xp-balloon{right:8px;width:min(310px,calc(100vw - 16px))}#start-menu{max-height:calc(100dvh - 30px)}#games-list{left:72%;max-width:calc(100vw - 125px)}}
@media(max-height:600px){#start-menu{height:min(455px,calc(100dvh - 30px))}.start-columns{height:calc(100% - 97px)}.start-columns button{min-height:0}.start-programs>button img,.start-programs .start-app-icon,.start-places>button img{width:21px;height:21px}.login-brand .xp-brand{transform:scale(.8);transform-origin:bottom right;margin-top:-32px}}
.ref-about{background-image:url('assets/about-background.webp');background-position:bottom;background-repeat:no-repeat;background-size:cover}.window.maximized .controls button[data-action=max]{position:relative}.window.maximized .controls button[data-action=max]:after{content:'';display:block!important;position:absolute;width:8px;height:7px;left:5px;top:7px;border:1px solid white;border-top-width:2px;background:#347bef;box-shadow:3px -3px 0 -1px #347bef,3px -3px 0 0 white}.ref-toolbar #contact-save[hidden]{display:none!important}#contact .ref-toolbar{gap:0}#contact .ref-toolbar button{padding:6px 7px}#contact .outlook-compose p{font-size:10px}#contact .ref-toolbar button:nth-of-type(n+3){padding:6px}
.brand-name{top:102px}.brand-edition{top:147px}
