/* The Mac has its own quiet, dark wallpaper, distinct from the painted world. */
:root{--mac-wallpaper:radial-gradient(ellipse at 12% 110%,#44445f 0,transparent 52%),radial-gradient(ellipse at 44% 115%,#254c58 0,transparent 62%),radial-gradient(ellipse at 0% 0%,#1e3549 0,transparent 62%),linear-gradient(125deg,#111e30,#101a28 68%,#0c1521)}
#panel-dialog{background:#698588;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#24272c}
#panel-dialog button{font-family:inherit;cursor:pointer}
#panel-dialog .mac-menubar{height:30px;flex:none;display:flex;align-items:center;gap:18px;padding:0 100px 0 14px;background:#f6f8f2cc;backdrop-filter:blur(24px);font-size:11px;border-bottom:1px solid #ffffff66;z-index:1000}
.mac-mark{border:0;background:none;font-weight:800;font-size:16px;padding:0}.mac-location{margin-left:auto;opacity:.65}.mac-menubar time{white-space:nowrap;font-variant-numeric:tabular-nums}
#panel-dialog .dialog-close{top:3px;right:7px;width:auto;height:24px;border-radius:5px;background:transparent;font-size:11px;z-index:1001;padding:0 8px;color:#30373b}
#panel-dialog .dialog-close:hover{background:#ffffff66}
.desktop-space{position:relative;flex:1;min-height:0;overflow:hidden;background:var(--mac-wallpaper);isolation:isolate}
.desktop-space:before{content:'';position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,#07111b30);pointer-events:none}
.desktop-shortcuts{position:absolute;right:16px;top:20px;display:grid;gap:15px;z-index:0}
.desktop-shortcut{display:flex;flex-direction:column;align-items:center;gap:6px;width:86px;border:0;border-radius:6px;background:none;color:white;font-size:11px;text-shadow:0 1px 4px #000;padding:6px}
.desktop-shortcut:hover,.desktop-shortcut:focus-visible{background:#ffffff30}
.app-icon{display:grid;place-items:center;width:46px;height:46px;border-radius:11px;font-size:30px;font-weight:500;color:white;text-shadow:none;background:linear-gradient(#58b7ee,#2876d4);box-shadow:inset 0 0 0 1px #ffffff60,0 3px 7px #0003;line-height:1}
.icon-projects{border-radius:4px 7px 7px 7px;height:35px;margin:8px 0 3px;background:linear-gradient(#8edcff,#49a5dc);position:relative;color:transparent}
.icon-projects:before{content:'';position:absolute;top:-5px;left:0;width:20px;height:6px;background:#8edcff;border-radius:4px 4px 0 0}
.icon-about{background:linear-gradient(#d4dce5,#8a9bac);font-size:23px}.icon-contact{background:linear-gradient(#62c4ee,#0878cc);font-size:31px}.icon-notes{background:linear-gradient(#f6cc4b 0 25%,#fff9df 25%);color:#8b8370;padding-top:9px}.icon-music{background:linear-gradient(#fb6385,#d82958)}.icon-games{background:linear-gradient(#aa88df,#6843a1);font-size:36px}.icon-meta{background:linear-gradient(#8ebdc3,#426f93)}
.mac-dock{position:absolute;bottom:9px;left:50%;transform:translateX(-50%);z-index:1000;display:flex;align-items:center;gap:8px;max-width:calc(100% - 20px);padding:7px 9px 5px;border:1px solid #ffffff70;border-radius:17px;background:#b8c9df38;backdrop-filter:blur(24px) saturate(1.4);box-shadow:0 5px 18px #14252b40}
.dock-app{border:0;background:none;padding:0 2px 3px;position:relative;transition:transform .18s cubic-bezier(.2,0,0,1)}.dock-app>span:last-child{position:absolute;bottom:60px;left:50%;transform:translateX(-50%);padding:5px 9px;border-radius:6px;color:#20262b;background:#fffffff0;opacity:0;pointer-events:none;font-size:12px}.dock-app:hover{transform:translateY(-4px)}.dock-app:hover>span:last-child,.dock-app:focus-visible>span:last-child{opacity:1}.dock-divider{height:38px;width:1px;background:#ffffff65}.mac-dock:not(:has(.restore-app)) .dock-divider{display:none}.minimized-apps{display:flex;gap:5px;max-width:200px;overflow-x:auto}.restore-app{border:1px solid #ffffff70;border-radius:6px;background:#f0f2efbb;color:#343b3d;min-height:38px;font-size:10px;max-width:76px;padding:4px 7px}
.window-layer{position:absolute;inset:0 0 78px;pointer-events:none}.mac-window{position:absolute;display:flex;flex-direction:column;width:min(760px,calc(100% - 120px));height:calc(100% - 34px);min-height:150px;max-width:100%;max-height:100%;border-radius:10px;background:#f9fafb;overflow:hidden;box-shadow:0 12px 30px #12232b33,0 0 0 1px #24363d30;pointer-events:auto;animation:window-in .22s cubic-bezier(.2,0,0,1)}.mac-window[hidden]{display:none}.mac-window.focused{box-shadow:0 18px 44px #10212b55,0 0 0 1px #263e4c50}.mac-window.maximized{inset:0!important;width:100%;height:100%;border-radius:0}
.window-titlebar{height:37px;flex:none;display:flex;align-items:center;justify-content:center;position:relative;background:linear-gradient(#f4f5f6,#e5e7ea);border-bottom:1px solid #ced1d5;user-select:none;touch-action:none;cursor:grab;font-size:12px;font-weight:600;color:#73777c}.focused .window-titlebar{color:#31363b}.traffic-lights{position:absolute;left:12px;display:flex;gap:8px}.traffic-lights button{width:13px;height:13px;border-radius:50%;border:1px solid #0002;padding:0;font:11px/10px -apple-system,sans-serif;color:transparent;background:#c9cdd0}.focused .window-close{background:#ff6058}.focused .window-minimize{background:#ffbd2e}.focused .window-maximize{background:#28c840}.traffic-lights:hover button,.traffic-lights button:focus-visible{color:#333a}.traffic-lights button:after{content:'';position:absolute;inset:-4px}.traffic-lights button{position:relative}
.mac-window .app-content{padding:24px 28px 32px;background:#fafbfc;color:#2c3138;flex:1;min-height:0;overflow:auto}.mac-window .app-content h2{font:600 clamp(22px,2.7vw,32px)/1.15 -apple-system,BlinkMacSystemFont,sans-serif;letter-spacing:-.035em;margin:8px 0 18px}.mac-window .app-content h3{font:600 19px/1.3 -apple-system,BlinkMacSystemFont,sans-serif}.mac-window .app-content p{font:14px/1.65 -apple-system,BlinkMacSystemFont,sans-serif;color:#59616b}.mac-window .app-content .dialog-eyebrow{font-size:10px;color:#79818c;letter-spacing:.08em}.mac-window .app-content.browser-view{padding:0;overflow:hidden}.mac-window .browser-toolbar{background:#f5f6f7;padding:7px 10px;gap:10px}.mac-window .browser-toolbar button{background:#e6e9ed;font-size:11px}.mac-window .app-content .browser-toolbar h2{font-size:12px;margin:0;letter-spacing:0}.mac-window .browser-help{background:#eef0f3;color:#6b7580}.mac-window .song-title{font:500 15px/1.3 -apple-system,sans-serif;color:#303640}.mac-window .song-artist{font-size:12px}.mac-window .song-list a:hover{background:#edf0f4}.mac-window .song-list li{border-color:#e1e4e8}.mac-window .game-card{background:#fff;border-color:#e0e4e9}.mac-window .game-card-title{font:600 16px/1.3 -apple-system,sans-serif;color:#343b44}.mac-window .game-card-blurb{color:#68717b}.mac-window .game-card img{height:80px}.mac-window .game-list{margin-top:18px;gap:12px}.mac-window .app-content .game-title{color:#fff6df;font:24px/1.15 Georgia,serif;margin:0}.mac-window .app-content .game-how{color:#dfe5d6;font:13px/1.5 -apple-system,sans-serif;margin:5px 0 12px}.mac-window .app-content .game-rotate{color:#c9d2bf;font-size:11px}.game-pause{position:absolute;top:28px;right:10px;border:0;border-radius:5px;padding:4px 7px;background:#18251dbb;color:white;font-size:10px}.game-pause[hidden]{display:none}
@keyframes window-in{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
@media(max-width:700px){#panel-dialog .mac-menubar{gap:10px;padding-left:9px}.mac-location{display:none}.mac-menubar time{margin-left:auto;font-size:10px}.desktop-shortcuts{top:18px;right:8px;gap:12px}.mac-window{inset:7px!important;width:calc(100% - 14px);height:calc(100% - 14px)}.mac-window .app-content{padding:18px 16px}.window-titlebar{height:39px}.traffic-lights{gap:12px}.traffic-lights button{width:16px;height:16px}.mac-dock{gap:5px;padding:6px;border-radius:13px}.mac-dock .app-icon{width:38px;height:38px;font-size:26px}.window-layer{bottom:66px}.minimized-apps{max-width:110px}.mac-window .app-content h2{font-size:24px}}
@media(max-height:500px){#panel-dialog .mac-menubar{height:24px}.mac-dock{bottom:3px;padding:3px 6px}.mac-dock .app-icon{height:28px;width:28px;font-size:21px;border-radius:7px}.window-layer{bottom:44px}.window-titlebar{height:27px}.mac-window{top:3px!important;height:calc(100% - 6px)}.mac-window .app-content .game-title{font-size:17px}.mac-window .app-content .game-how{font-size:11px;margin:3px}.game-play{padding:6px 20px}.game-overlay{padding:8px 5%}.mac-window .browser-toolbar{padding:3px 8px}.mac-window .browser-toolbar h2{display:none}}
@media(prefers-reduced-motion:reduce){.mac-window{animation:none}.dock-app{transition:none}.dock-app:hover{transform:none}}
#panel-dialog .mac-menubar{align-self:stretch;width:100%;margin:0;box-sizing:border-box;justify-content:flex-start}
/* The resting screen previews the same wallpaper and desktop language. */
.desk-scene .mac-screen{background:var(--mac-wallpaper);padding:0;font-family:-apple-system,BlinkMacSystemFont,sans-serif}
.mac-screen .screen-orb{display:none}.mac-screen .screen-time{position:absolute;inset:0 0 auto;margin:0;padding:2% 3%;background:#f6f8f2ce;color:#34424a;font-size:clamp(6px,.75cqh,10px);letter-spacing:.03em;font-family:inherit}
.desk-scene .screen-greeting{position:absolute;bottom:5%;left:50%;transform:translateX(-50%);padding:3% 5%;border:1px solid #fff7;border-radius:8px;background:#eff3edbf;backdrop-filter:blur(6px);color:#283b43;white-space:nowrap;font:600 clamp(9px,1.2cqh,16px)/1.2 -apple-system,sans-serif;text-shadow:none}
.desk-scene .screen-actions{position:absolute;right:4%;top:18%;display:flex;flex-direction:column;gap:8px}.desk-scene .screen-actions button{padding:4px 6px;min-height:0;background:#f4f7eddb;color:#33444c;font-family:inherit;font-size:clamp(7px,1cqh,12px);border-radius:4px}.mac-screen .screen-foot{position:absolute;right:5%;bottom:28%;font:600 clamp(7px,.9cqh,11px)/1.3 -apple-system,sans-serif;color:white;text-shadow:0 1px 3px #000}
@media(max-height:500px){.desktop-shortcuts{grid-template-columns:repeat(4,76px);gap:8px;right:12px;top:16px}.desktop-shortcut{width:76px}#panel-dialog:has(.game-view) .dialog-close{top:1px;right:7px;width:auto;height:22px;font-size:10px;padding:0 8px;white-space:nowrap}}
@media(pointer:coarse) and (max-height:500px){.mac-window{left:6px!important;width:calc(100% - 12px)}}
/* Instructions belong to the game window, not tiny text painted into a canvas. */
.game-stage{position:relative}.game-tools{display:flex;align-items:center;justify-content:space-between;gap:12px;flex:none;color:#b8c8bf;font:11px/1.4 -apple-system,sans-serif}.game-tools button{background:#ffffff12;color:#fff6df;border:1px solid #ffffff35;border-radius:5px;padding:5px 9px;font:600 11px/1.3 -apple-system,sans-serif}.game-instructions{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;background:#20352d;color:#f7f4e9;overflow:hidden}.game-instructions[hidden]{display:none}.instructions-body{padding:22px 28px 12px;overflow:auto;flex:1;min-height:0}.instructions-heading{display:flex;align-items:center;gap:18px}.instructions-heading img{width:72px;height:66px;object-fit:contain}.instructions-eyebrow{font:700 10px/1.4 -apple-system,sans-serif;text-transform:uppercase;letter-spacing:.12em;color:#ddbd7c}.mac-window .app-content .instructions-heading h3{font:600 22px/1.2 -apple-system,sans-serif;margin:5px 0;color:#fff6df}.mac-window .app-content .instructions-goal{color:#f1eddf;font-size:14px;line-height:1.5;margin:15px 0}.instructions-controls{display:grid;grid-template-columns:1fr 1fr;gap:10px 24px;margin:16px 0}.instructions-controls>div{border-top:1px solid #ffffff20;padding-top:10px}.instructions-controls dt{display:flex;gap:4px;flex-wrap:wrap}.instructions-controls kbd{border:1px solid #d2dace70;border-bottom-width:3px;background:#e3ebdf15;border-radius:4px;padding:2px 6px;color:#fff;font:600 11px/1.4 -apple-system,sans-serif}.instructions-controls dd{margin:6px 0 0;font:12px/1.5 -apple-system,sans-serif;color:#d3dfd5}.instructions-tips{margin:14px 0;padding-left:18px;display:grid;gap:6px;font:12px/1.5 -apple-system,sans-serif;color:#cbd9cf}.mac-window .app-content .instructions-pause{font:11px/1.5 -apple-system,sans-serif;color:#a6bbad;margin:12px 0 0}.instructions-footer{flex:none;display:flex;align-items:center;gap:14px;padding:13px 28px;background:#192c24;border-top:1px solid #ffffff20}.instructions-footer span{font:11px/1.4 -apple-system,sans-serif;color:#b4c6b8}.instructions-footer .game-play{white-space:nowrap}.game-instructions footer{margin:0;position:static;text-align:left}
@media(max-width:700px){.instructions-body{padding:16px}.instructions-heading{gap:10px}.instructions-heading img{width:50px;height:50px}.mac-window .app-content .instructions-heading h3{font-size:19px}.instructions-controls{gap:10px}.instructions-footer{padding:12px 16px;gap:10px}.game-control-summary{display:none}.game-tools{justify-content:flex-end}}
@media(max-height:500px){.game-tools{position:absolute;right:9px;top:4px;z-index:3}.game-control-summary{display:none}.game-tools button{padding:3px 6px;font-size:10px}.game-stage{padding-top:26px}.instructions-body{padding:12px 20px}.instructions-heading img{display:none}.instructions-controls{margin:10px 0}.instructions-footer{padding:7px 20px}.instructions-tips{margin:10px 0}}
/* Expanded games use the full display; Show desktop restores the Dock. */
.desktop-space:has(.mac-window.focused.maximized:not([hidden]) .game-view) .mac-dock{display:none}
.desktop-space:has(.mac-window.focused.maximized:not([hidden]) .game-view) .window-layer{bottom:0}
.mac-window.maximized:has(.game-view) .window-titlebar{height:29px}
.mac-window .game-view .browser-toolbar{padding:4px 10px}
@media(max-height:500px){.mac-window.maximized:has(.game-view){height:100%;top:0!important;left:0!important;width:100%;inset:0!important}}
.game-tools .game-hud{position:static;display:flex;gap:10px;margin-left:auto;color:#dbe5dc;font:600 10px/1.3 -apple-system,sans-serif;text-shadow:none;white-space:nowrap}
.game-tools .game-pause{position:static;white-space:nowrap}.game-tools .game-pause[hidden]{display:none}
.game-control-summary{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-height:500px){.game-tools{left:9px;justify-content:flex-end}.game-tools .game-hud{margin-right:auto;margin-left:0}}