:root{--primary:#168eb6;--secondary:#6ac84a;--accent:#087d96;--background:#b7e4f0;--text:#153e51;--panel-rgb:244,253,255;--panel-alpha:.84;--radius:20px;--border-width:1px;--blur:14px;--shadow:.14;--scale:1;--gradient:.75;--duration:220ms;--font:"Trebuchet MS","Segoe UI",sans-serif}
*{box-sizing:border-box}html{font-size:calc(16px * var(--scale));min-height:100%;background:var(--background)}body{margin:0;color:var(--text);font-family:var(--font);line-height:1.5;min-height:100vh;overflow-wrap:anywhere}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button,a{ -webkit-tap-highlight-color:transparent}button,.button{cursor:pointer;border:var(--border-width) solid rgba(46,116,134,.25);border-radius:calc(var(--radius)*.5);padding:.6rem .9rem;color:var(--text);background:linear-gradient(rgba(255,255,255,.85),rgba(225,247,248,.9));box-shadow:inset 0 1px 0 #ffffffbd;transition:filter var(--duration),transform var(--duration)}button:hover,.button:hover{filter:brightness(1.045)}button:active,.button:active{transform:translateY(1px)}button:disabled{opacity:.4;cursor:default}a{color:var(--accent)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:4px}input:not([type=range]):not([type=color]):not([type=checkbox]),select{min-width:0;width:100%;border:1px solid #8faeb8;border-radius:8px;background:#ffffffd9;padding:.65rem .8rem;color:#183c4b}input[type=range]{accent-color:var(--primary);width:100%;min-width:70px;cursor:pointer}input[type=color]{width:48px;height:34px;border:1px solid #a0c3ce;border-radius:6px;padding:3px;cursor:pointer}input[type=checkbox]{width:22px;height:22px;accent-color:var(--primary)}h1,h2,h3,p{margin-top:0}h1{font-size:2rem;line-height:1.2;letter-spacing:-1.1px;margin-bottom:0;font-weight:700}h2{font-size:1.2rem;line-height:1.35;margin-bottom:.25rem}p{margin-bottom:.6rem}a{text-decoration:none}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;top:8px;left:8px;z-index:99;background:white;padding:10px;transform:translateY(-150%)}.skip-link:focus{transform:translateY(0)}
.wallpaper{position:fixed;inset:0;z-index:-2;background:linear-gradient(180deg,rgba(109,195,237,.1),rgba(43,173,185,.12) 60%,rgba(57,150,57,.26)),radial-gradient(ellipse at 80% 8%,#e4faff 0,transparent 45%),linear-gradient(150deg,#59b6df,#9ee8e1 63%,#8ec873);background-size:cover;background-position:center}.wallpaper.has-image{background-image:linear-gradient(180deg,rgba(87,172,208,.08),rgba(25,89,66,.12)),url("assets/wallpaper.webp")}.wallpaper:after{content:"";position:absolute;inset:0;background:var(--background);opacity:calc(1 - var(--gradient))}#bubbles{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:-1}.bubble{position:absolute;bottom:-130px;border:1px solid #ffffff9c;border-radius:50%;background:radial-gradient(circle at 28% 25%,#fff9 0,#ffffff0d 16%,#ffffff03 65%,#dfffff7a 95%);box-shadow:inset -3px -5px 10px #ffffff52;will-change:transform}.desktop{width:min(1420px,94%);margin:auto}.topbar{display:flex;align-items:center;gap:1.4rem;min-height:100px;color:#163f50}.brand{display:flex;align-items:center;gap:10px;font-size:2.15rem;font-weight:bold;letter-spacing:-2px;color:#fff;text-shadow:0 2px 3px #19557755}.brand-dot{color:#d8ffc4}.brand-orb,.small-orb,.audio-orb,.browser-orb{display:grid;place-items:center;border-radius:50%;border:1px solid #ffffffca;background:radial-gradient(ellipse at 38% 20%,#ffffffea 0,transparent 40%),linear-gradient(#a6edf0,#138ebe 60%,#076c94);box-shadow:inset 0 -4px 7px #005c7d66,0 3px 10px #185a6c33;color:#fff}.brand-orb{width:43px;height:43px;font-size:2rem;font-style:italic;font-family:Georgia,serif}.topbar-note{font-size:.9rem;border-left:1px solid #fff8;padding-left:1.3rem}.topbar-right{margin-left:auto;display:flex;align-items:center;gap:1rem;font-size:.85rem}.icon-button{width:37px;height:37px;padding:0;border-radius:50%;font-size:1.25rem}.glass{background:rgba(var(--panel-rgb),var(--panel-alpha));backdrop-filter:blur(var(--blur));-webkit-backdrop-filter:blur(var(--blur));border:var(--border-width) solid #ffffffe6;box-shadow:0 18px 65px rgba(8,56,75,var(--shadow)),inset 0 1px 0 white;border-radius:var(--radius)}.app-shell{display:grid;grid-template-columns:210px minmax(0,1fr);overflow:hidden;min-height:740px}.sidebar{padding:35px 16px 24px;background:linear-gradient(#eefbfc65,#cef0f045);border-right:1px solid #78acbc33;display:flex;flex-direction:column}.sidebar-label{font-size:.75rem;letter-spacing:2px;font-weight:bold;margin:0 14px 18px;opacity:.7}.nav-item{display:flex;align-items:center;gap:13px;color:var(--text);padding:12px 16px;margin:5px 0;border:1px solid transparent;border-radius:11px;font-weight:bold;font-size:.95rem}.nav-item:hover{background:#fff8}.nav-item.active{background:linear-gradient(#fffffff2,#dff4f5cc);border-color:#fff;box-shadow:0 3px 10px #35768d16;color:var(--accent)}.nav-icon{font-size:1.65rem;line-height:1;width:26px;text-align:center;font-family:"Segoe UI Symbol",sans-serif;font-weight:normal}.nav-count{margin-left:auto;font-size:.75rem;border-radius:5px;padding:0 7px;background:#9ed1d533}.sidebar-bottom{margin-top:auto;padding:44px 14px 0;font-size:.85rem}.small-orb{width:36px;height:36px;margin-bottom:15px}.sidebar-bottom strong{display:block;font-size:.88rem}.sidebar-bottom p{margin-top:5px;opacity:.7}.version{display:block;font-size:.65rem;letter-spacing:1.3px;margin-top:45px;opacity:.6}main{min-width:0;padding:34px 38px 22px}.page-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:26px}.eyebrow{font-size:.68rem;letter-spacing:2px;font-weight:bold;color:var(--accent);margin-bottom:9px}.pill{border:1px solid #fff;border-radius:30px;padding:7px 12px;background:#ffffff88;font-size:.75rem;white-space:nowrap}.welcome-window{border:var(--border-width) solid #fff;border-radius:calc(var(--radius)*.7);overflow:hidden;background:linear-gradient(115deg,#ddf9ffda 5%,#d0f4f68c 53%,#80d8e433),linear-gradient(135deg,#b0e9f1,#71c9df);box-shadow:0 5px 20px #215b721a;position:relative}.welcome-window.has-image{background:linear-gradient(90deg,#e0f9fcf0 0%,#ddf8fa80 45%,#b9edfa00 78%),url("assets/wallpaper.webp") center 55%/cover}.window-strip{display:flex;align-items:center;justify-content:space-between;padding:9px 16px;border-bottom:1px solid #fff8;background:#f3ffff5c;font-size:.69rem;letter-spacing:.5px}.window-dots{letter-spacing:3px;color:#2d77854d}.welcome-content{padding:32px 30px 35px}.overline{font-size:.66rem;letter-spacing:2.5px;color:var(--accent);font-weight:bold}.welcome-content h2{font-size:clamp(1.7rem,2.7vw,2.5rem);line-height:1.15;letter-spacing:-1.2px;margin:11px 0 13px;max-width:500px}.welcome-content p{font-size:.9rem;margin-bottom:23px}.button{display:inline-flex;align-items:center;justify-content:center;gap:18px;font-size:.88rem;font-weight:bold}.primary{color:#fff;border-color:#158fa4;background:linear-gradient(#46b8ce,#1292b3 49%,#0b85a7 51%,#20a7c0);text-shadow:0 1px 1px #17677c;box-shadow:inset 0 1px 0 #b9f3ff,0 3px 6px #08799b30}.welcome-bottom{display:flex;justify-content:space-between;gap:20px;background:#e9fded86;border-top:1px solid #fff9;padding:10px 17px;font-size:.7rem}.welcome-bottom span:last-child{font-size:.62rem;letter-spacing:1.5px}.home-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:16px;margin-top:22px}.card{background:rgba(var(--panel-rgb),.74);border:var(--border-width) solid #fff;border-radius:calc(var(--radius)*.65);padding:20px;box-shadow:0 3px 12px rgba(37,102,118,calc(var(--shadow)*.4));min-width:0}.card-label{display:flex;justify-content:space-between;gap:8px;font-size:.63rem;letter-spacing:1px;font-weight:bold}.card-label span:last-child{font-weight:normal;letter-spacing:0}.sound-title{display:flex;align-items:center;gap:13px;margin-top:18px}.audio-orb{width:47px;height:47px;flex-shrink:0;font-size:2.1rem}.sound-title h2{font-size:1.13rem}.sound-title p,.destination-card p{font-size:.79rem;margin:0;opacity:.78}.sound-controls{display:flex;align-items:center;gap:11px;margin:18px 0 14px}.round-play{width:34px;height:34px;border-radius:50%;padding:0;flex-shrink:0;color:var(--accent);font-size:.8rem}.volume-label{font-size:0;flex:1}.sound-controls output{font-size:.7rem;min-width:30px}.sound-profiles{display:flex;gap:6px}.sound-profiles button{padding:3px 9px;font-size:.7rem;flex:1}.sound-profiles button[aria-pressed=true]{background:#d6eff0;border-color:#72b6c4;color:var(--accent)}.destination-card{display:flex;flex-direction:column;align-items:flex-start;color:var(--text);transition:transform var(--duration),background var(--duration)}.destination-card:hover{transform:translateY(-3px);background:#fffffff0}.destination-card h2{font-size:1.05rem;margin-top:15px}.tile-icon{display:grid;place-items:center;width:45px;height:42px;border-radius:12px;font-size:1.8rem;color:white;border:1px solid #fff;box-shadow:inset 0 2px 2px #fff9,0 3px 8px #21708722}.game-icon{background:linear-gradient(#c4eb89,#6db542 50%,#47a247 51%,#8dc855)}.settings-icon{background:linear-gradient(#b7e9f6,#74bad7 50%,#408dad 51%,#77c0d8)}.text-link{display:block;font-size:.75rem;color:var(--accent);font-weight:bold;margin:13px 0 19px}.subtle-tag{font-size:.58rem;letter-spacing:1px;opacity:.7;margin-top:auto}.palette{display:flex;margin-top:auto;gap:6px}.palette i{width:14px;height:14px;background:#58b6d6;border:1px solid #fff;border-radius:50%}.palette i:nth-child(2){background:#89c954}.palette i:nth-child(3){background:#98d7d3}.palette i:nth-child(4){background:#e6bd7a}.home-footer,.desktop-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:.7rem}.home-footer{margin-top:22px;opacity:.9}.text-button{border:0;background:none;padding:4px;box-shadow:none;color:var(--accent);font-size:inherit}.desktop-footer{padding:19px 3px;color:#173d49}.desktop-footer span:first-child span{padding:0 9px}
.empty-intro{text-align:center;margin:50px 0 30px}.empty-intro .tile-icon{margin:0 auto 20px;width:65px;height:60px;font-size:2.5rem}.empty-intro h2{font-size:1.6rem}.empty-intro p{opacity:.8}.game-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.game-placeholder{border:1px dashed #71abb88a;border-radius:var(--radius);padding:38px 20px;text-align:center;background:#ffffff2b;color:var(--accent);font-size:.85rem}.game-placeholder span{display:block;font-size:1.8rem;opacity:.5;margin-bottom:14px}.library-note{font-size:.8rem;text-align:center;margin:26px 0;opacity:.8}code{background:#daeef1;border-radius:4px;padding:2px 5px}.game-entry{text-align:left;min-height:150px}.game-entry strong{display:block;font-size:1.2rem}.game-entry p{margin-top:10px}.player-toolbar{display:flex;justify-content:space-between;gap:15px;margin:25px 0 12px}iframe{display:block;width:100%;border:0;background:#fff;min-height:450px}.browser-window{border:1px solid #fff;border-radius:calc(var(--radius)*.65);overflow:hidden;background:#fff8}.browser-toolbar{display:flex;align-items:center;gap:8px;background:#d8edf1aa;padding:12px}.browser-actions{display:flex;gap:5px}.browser-toolbar button{padding:5px 10px;min-height:38px}#address-form{display:flex;gap:6px;flex:1;min-width:0}#address-form input{padding:6px 10px}#browser-status{font-size:.78rem;margin:0;padding:9px 14px;border-bottom:1px solid #acd3dc88}#browser-start{text-align:center;padding:75px 20px}.browser-orb{height:80px;width:80px;margin:0 auto 23px;font-size:3.8rem}#browser-start h2{font-size:1.8rem}#browser-start p{max-width:450px;margin:0 auto 22px}.browser-explanation{font-size:.78rem;margin-top:25px!important;opacity:.75}#embed-help{padding:14px;display:flex;justify-content:space-between;align-items:center;gap:14px;background:#f1f8ea;font-size:.78rem}#embed-help button{font-size:.8rem}.browser-footnote{font-size:.78rem;opacity:.8;margin-top:16px}.browser-footnote a{text-decoration:underline}.preset-card{margin-bottom:20px}.preset-card p{font-size:.87rem;opacity:.75}.presets{display:flex;flex-wrap:wrap;gap:9px;margin-top:15px}.preset{display:flex;align-items:center;gap:7px;font-size:.8rem}.preset-swatch{width:16px;height:16px;border:1px solid white;border-radius:50%}.settings-group{border:1px solid #fff;border-radius:calc(var(--radius)*.6);background:#ffffff70;margin-bottom:14px;overflow:hidden}.settings-group summary{padding:17px 20px;font-size:1rem;font-weight:bold;cursor:pointer}.settings-group summary::marker{color:var(--accent)}.settings-content{padding:0 20px 20px}.setting-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(150px,.8fr);align-items:center;gap:25px;border-top:1px solid #9cbbc433;padding:14px 0}.setting-row label{font-size:.9rem;font-weight:bold}.setting-row small{display:block;font-size:.76rem;font-weight:normal;opacity:.78;margin-top:3px}.setting-control{display:flex;justify-content:flex-end;align-items:center;gap:12px;min-width:0}.setting-control output{min-width:45px;text-align:right;font-size:.8rem}.setting-row.wide{grid-template-columns:1fr}.setting-row.wide .setting-control{width:100%}.reset-section{font-size:.77rem;margin-top:8px}.settings-footer{display:flex;justify-content:space-between;align-items:center;gap:15px;margin:25px 0;font-size:.8rem}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);padding:12px 20px;border:1px solid #fff;border-radius:12px;background:#153e51;color:#fff;z-index:10;max-width:90%;font-size:.85rem;box-shadow:0 5px 25px #153e5133}.noscript{position:fixed;bottom:10px;background:#fff;padding:20px}.low-power .glass{backdrop-filter:none;-webkit-backdrop-filter:none}.low-power .bubble{box-shadow:none}.low-power .card,.low-power .welcome-window{box-shadow:none}.reduced-motion *{transition:none!important;scroll-behavior:auto!important}
@media(min-width:1550px){.topbar{min-height:125px}.app-shell{min-height:790px}main{padding:40px}.welcome-content{padding:42px 35px 45px}}
@media(max-width:1100px){.app-shell{grid-template-columns:170px 1fr}.sidebar{padding:28px 10px}.nav-item{padding:12px 10px}.sidebar-label{font-size:.65rem;margin-left:10px}main{padding:28px 25px}.home-grid{gap:12px;grid-template-columns:1.2fr 1fr}.home-grid .destination-card:last-child{grid-column:1/-1;display:grid;grid-template-columns:45px 1fr auto;gap:18px;align-items:center}.home-grid .destination-card:last-child h2{margin-top:0}.home-grid .destination-card:last-child .text-link{margin:6px 0 0}.page-heading .pill{display:none}.topbar-note{display:none}}
@media(max-width:720px){.desktop{width:94%}.topbar{min-height:78px}.topbar-right{font-size:.75rem;gap:10px}#network-state{display:none}.app-shell{display:block;min-height:650px}.sidebar{padding:8px;border-right:0;border-bottom:1px solid #78acbc33}.sidebar-label,.sidebar-bottom{display:none}.sidebar nav{display:grid;grid-template-columns:repeat(4,1fr);gap:3px}.nav-item{display:flex;flex-direction:column;gap:4px;padding:8px 4px;font-size:.72rem;margin:0}.nav-icon{font-size:1.3rem}.nav-count{display:none}main{padding:25px 17px}.page-heading{margin-bottom:20px}h1{font-size:1.6rem}.welcome-content{padding:26px 20px 28px}.welcome-content h2{font-size:1.85rem}.welcome-content p{font-size:.83rem}.welcome-bottom{font-size:.65rem}.welcome-bottom span:last-child{display:none}.home-grid{grid-template-columns:1fr}.home-grid .destination-card,.home-grid .destination-card:last-child{display:grid;grid-template-columns:45px 1fr;gap:16px;align-items:center;grid-column:auto}.destination-card h2{margin-top:0}.destination-card .text-link{margin-bottom:0}.destination-card .subtle-tag,.destination-card .palette{display:none}.home-footer{align-items:flex-start;flex-direction:column;font-size:.74rem}.desktop-footer{font-size:.65rem}.game-grid{grid-template-columns:1fr}.game-placeholder{padding:20px}.browser-toolbar{flex-wrap:wrap}#address-form{flex-basis:calc(100% - 50px);order:2}.browser-actions{flex:1}#browser-start{padding:40px 18px}#embed-help{align-items:flex-start;flex-direction:column}.setting-row{gap:12px;grid-template-columns:1fr}.setting-control{justify-content:flex-start}.setting-control input[type=color]{width:100%}.settings-content{padding:0 14px 14px}.settings-footer{flex-direction:column;align-items:flex-start}.empty-intro{margin-top:30px}.empty-intro h2{font-size:1.4rem}.empty-intro p{font-size:.9rem}iframe{min-height:400px}}
/* Shared colors feed the actual controls, including user-made palettes. */
.primary{background-color:var(--primary);background-image:linear-gradient(#ffffff55,#ffffff08 49%,#00000012 51%,#ffffff18)}
.game-icon{background-color:var(--secondary);background-image:linear-gradient(#ffffff88,#ffffff00 49%,#00000018 51%,#ffffff22)}
.settings-icon{background-color:var(--primary);background-image:linear-gradient(#ffffff88,#ffffff00 49%,#00000018 51%,#ffffff22)}
.brand-orb,.small-orb,.audio-orb,.browser-orb{background-color:var(--primary);background-image:radial-gradient(ellipse at 38% 20%,#ffffffea 0,transparent 40%),linear-gradient(#ffffff66,#ffffff00 60%,#00000033)}
.eyebrow,.overline,.version,.window-strip,.welcome-bottom,.welcome-bottom span:last-child,.card-label,.subtle-tag,.desktop-footer{font-size:.75rem}
.sidebar-label{font-size:.75rem}.sound-title p,.destination-card p,.text-link,.sound-profiles button,.home-footer{font-size:.875rem}.destination-card h2{font-size:1.1rem}
.setting-control output{flex:0 0 4rem;white-space:nowrap}.sound-controls output{white-space:nowrap}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
