@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--accent:#d0efbd;--glass:rgba(24,31,30,.72)}*{box-sizing:border-box}body{margin:0;background:#101d24;color:#fff;font-family:'DM Sans',Arial,sans-serif;overflow-x:hidden;min-height:100vh}.landscape,.shade{position:fixed;inset:0;pointer-events:none}.landscape{background:radial-gradient(ellipse at 72% 34%,#bdac8f 0,#6c9198 26%,#2a5264 54%,#122d3c 90%)}.sun{position:absolute;left:72%;top:27%;width:6vw;height:6vw;background:#f5dfad;border-radius:50%;box-shadow:0 0 100px #ebcf9c88}.ridge{position:absolute;inset:30% -5% 0;background:#28535d;clip-path:polygon(0 75%,12% 58%,22% 67%,43% 10%,52% 38%,60% 22%,77% 65%,90% 33%,100% 58%,100% 100%,0 100%)}.far{opacity:.75}.near{inset:48% -10% -10%;background:linear-gradient(120deg,#122d34,#214347);clip-path:polygon(0 45%,18% 67%,36% 34%,49% 62%,63% 28%,72% 45%,87% 10%,100% 28%,100% 100%,0 100%)}.shade{background:linear-gradient(90deg,#08131899,transparent 80%),linear-gradient(0deg,#081215 0%,#081215b0 28%,transparent 72%)}header{height:110px;padding:0 5.4%;display:flex;align-items:center;gap:70px;position:relative;z-index:1}.brand{color:white;text-decoration:none;font-size:27px;letter-spacing:-1.3px;font-weight:700}.brand span{font-weight:400;color:#d5e1da}.brand small{font-size:10px;margin-left:9px;letter-spacing:2px}nav{display:flex;gap:12px}button{font:inherit;color:inherit;border:0;cursor:pointer;background:none}nav button{padding:12px 23px;border-radius:28px;color:#d5dedd}nav button.active{background:#ffffff20;color:#fff}.status{margin-left:auto;display:flex;align-items:center;gap:23px;font-size:16px}.status button{font-size:24px}.status .avatar{width:37px;height:37px;border-radius:50%;background:#c9d8bd;color:#263b31;font-size:16px}main{position:relative;padding:0 5.4% 90px;min-height:calc(100vh - 180px)}.hero{padding-top:9vh;max-width:650px;min-height:43vh}.eyebrow{font-size:11px;letter-spacing:3px;color:#d6e2dc;font-weight:600;display:flex;gap:12px;align-items:center}.eyebrow:before{content:'';width:23px;height:1px;background:#d6e2dc}h1{font-size:clamp(40px,4.6vw,88px);letter-spacing:-3px;font-weight:500;line-height:1.08;margin:22px 0}p{color:#c1ced0;line-height:1.65;font-size:16px}.hero p{max-width:400px;margin-bottom:24px}.primary,.secondary{border-radius:30px;padding:13px 24px;background:#e7efdf;color:#1b3027;font-weight:600;font-size:14px}.secondary{background:#ffffff17;color:white;margin-left:10px}.section-title{display:flex;justify-content:space-between;align-items:center;margin:20px 0}.section-title h2{font-size:18px;font-weight:500;margin:0}.section-title span{color:#a8b8b9;font-size:12px}.app-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:20px}.app-tile{padding:0;text-align:left;border-radius:17px;transition:transform .16s}.app-art{height:clamp(88px,10.3vw,180px);border-radius:17px;display:flex;align-items:center;justify-content:center;position:relative;box-shadow:inset 0 0 0 1px #ffffff14;overflow:hidden;font-size:clamp(22px,2.7vw,48px);font-weight:700;letter-spacing:-1px;background:var(--bg)}.app-tile .label{display:flex;justify-content:space-between;font-size:13px;padding:13px 3px;color:#dce3df}.label small{font-size:10px;color:#aebeb7}.netflix{color:#e50914;font-family:Arial;font-stretch:condensed}.youtube{color:#fff}.play-logo{display:inline-flex;align-items:center;justify-content:center;border-radius:12px;background:#f02b30;width:53px;height:36px;font-size:20px;margin-right:8px}.plex{color:#edb840}.spotify{color:#1ed760}.app-tile:focus-visible,.app-tile:hover{transform:translateY(-6px) scale(1.025)}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #e2f7ce;outline-offset:5px}.app-tile:focus-visible{outline:0}.app-tile:focus-visible .app-art{outline:3px solid white;outline-offset:5px}.ambient-note{position:absolute;right:5.4%;top:31vh;text-align:right;color:#dae3df;font-size:12px;line-height:1.8}.ambient-note small{display:block;color:#bbcec8;font-size:10px;letter-spacing:2px}.quick-row{display:flex;gap:12px;margin-top:26px}.quick-row button{border:1px solid #ffffff19;background:#ffffff08;border-radius:24px;padding:10px 18px;font-size:12px;color:#c2d0ca}footer{position:fixed;bottom:0;left:0;right:0;height:58px;background:#091315bb;display:flex;align-items:center;justify-content:space-between;padding:0 5.4%;font-size:9px;letter-spacing:1.6px;color:#90a49e;z-index:2}footer b{margin-left:12px;color:#c9d6d0;font-weight:400}footer i{display:inline-block;background:#cbe6b4;width:5px;height:5px;border-radius:50%;margin-right:9px}footer em{font-style:normal;margin:0 17px}.page-head{padding:5vh 0 28px}.page-head h1{font-size:48px;margin:15px 0}.toolbar{display:flex;gap:10px;margin-bottom:28px;align-items:center}.toolbar input{background:#ffffff15;border:1px solid #ffffff22;border-radius:24px;padding:13px 20px;color:white;font:inherit;width:280px}.chip{padding:10px 18px;border-radius:22px;background:#ffffff0e;font-size:13px}.chip.selected{background:#d3e4c5;color:#1b3027}.library{row-gap:26px}.settings-layout{display:grid;grid-template-columns:250px 1fr;gap:35px;max-width:1100px}.settings-menu{display:flex;flex-direction:column;gap:8px}.settings-menu button{text-align:left;padding:17px;border-radius:13px;color:#b9cac3}.settings-menu .selected{background:#ffffff16;color:white}.panel{background:var(--glass);border:1px solid #ffffff16;border-radius:23px;padding:30px}.panel h2{font-size:24px;font-weight:500;margin-top:0}.setting-row{display:flex;justify-content:space-between;align-items:center;padding:18px 0;border-bottom:1px solid #ffffff10;gap:25px}.setting-row:last-child{border-bottom:0}.setting-row p{font-size:12px;margin:5px 0 0}.setting-row button{border-radius:20px;background:#ffffff13;padding:10px 15px;font-size:13px}.muted{color:#97b1a5;font-size:12px}.switch{min-width:64px}.switch.on{background:#c6e0b5;color:#223a2c}#overlay:empty{display:none}#overlay{position:fixed;inset:0;background:#07101499;z-index:4;display:flex;align-items:center;justify-content:center;padding:30px}.dialog{background:#192b2c;border:1px solid #ffffff20;box-shadow:0 35px 100px #0006;border-radius:28px;padding:35px;width:520px;max-height:90vh;overflow:auto}.dialog h2{font-size:28px;letter-spacing:-.6px;margin:14px 0}.dialog p{font-size:14px}.dialog .close{float:right;background:#ffffff10;border-radius:50%;width:32px;height:32px}.control-panel{margin-left:auto;margin-right:2vw;width:420px}.control-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.control-grid button{background:#ffffff0d;border-radius:16px;padding:22px;text-align:left;font-size:16px}.control-grid small{display:block;color:#a6bcb0;margin-top:7px;font-size:11px}.range{width:100%;accent-color:#c6e0b5;margin:20px 0}.demo-screen{height:180px;background:radial-gradient(ellipse at 50% 100%,#6b8774,#183330 70%);border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:25px}.dialog-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:25px}#toast{position:fixed;bottom:85px;left:50%;transform:translateX(-50%);z-index:9;background:#dcebd4;color:#203329;border-radius:24px;padding:13px 23px;font-size:13px;opacity:0;pointer-events:none;transition:opacity .2s}#toast.show{opacity:1}body.dusk .landscape{filter:hue-rotate(30deg) saturate(.65)}body.reduce *{transition:none!important;animation:none!important}@media(min-width:1600px){header{height:140px}.hero{padding-top:10vh}.hero p{font-size:20px;max-width:490px}.section-title h2{font-size:23px}.app-tile .label{font-size:17px}.quick-row button{font-size:15px}.eyebrow{font-size:14px}footer{height:70px;font-size:11px}}@media(max-width:800px){header{padding:0 6%;gap:20px;height:85px}.brand{font-size:23px}.brand small{display:none}nav{gap:0}nav button{padding:10px;font-size:12px}.status{gap:10px}#clock{display:none}.hero{padding-top:5vh;min-height:340px}h1{letter-spacing:-2px}.app-grid{grid-template-columns:repeat(3,1fr);gap:16px}.app-art{height:100px}.ambient-note{display:none}footer>span:first-child,footer>span:last-child{display:none}footer{justify-content:center;font-size:8px;letter-spacing:0}.settings-layout{grid-template-columns:1fr}.settings-menu{flex-direction:row;overflow:auto}.settings-menu button{white-space:nowrap}.panel{padding:22px}.toolbar{flex-wrap:wrap}.toolbar input{width:100%}.control-panel{margin:auto}.quick-row{flex-wrap:wrap}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* Remote-first personalisation and an unobstructed ambient landscape. */
.favourites-dialog{width:650px}.favourite-list{display:flex;flex-direction:column;gap:6px}.favourite-row{display:flex;align-items:center;gap:12px;border-radius:12px;padding:10px;background:#ffffff07}.favourite-number{width:24px;color:#91aca0;font-size:12px}.favourite-name{flex:1}.favourite-row button{width:38px;height:38px;border-radius:10px;background:#ffffff12;font-size:19px}.favourite-row button:disabled{opacity:.2;cursor:default}.ambient-active header,.ambient-active main,.ambient-active footer{visibility:hidden}.ambient-active .shade{opacity:.28}.ambient-active #overlay{background:transparent;padding:0}.ambient-view{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center;text-align:center}.ambient-clock{font-size:clamp(64px,9vw,160px);font-weight:400;letter-spacing:-6px;text-shadow:0 4px 40px #11252b50}.ambient-view p{color:#eef4ee;font-size:16px;letter-spacing:4px}.ambient-exit{position:absolute;bottom:7vh;padding:13px 24px;border-radius:30px;background:#142b3280;color:#eef4ee;font-size:12px}.ambient-exit:focus-visible{outline:1px solid #ffffff50;outline-offset:4px}.app-tile:focus-visible .label{color:#fff;font-weight:600}.app-tile:focus-visible .app-art{box-shadow:0 14px 35px #0005}.app-tile{scroll-margin:120px}button,input,a{scroll-margin:100px}@media(max-width:600px){.favourite-row{gap:6px;padding:8px}.favourite-name{font-size:13px}.favourite-row button{width:30px}.favourites-dialog{padding:22px}.ambient-clock{letter-spacing:-3px}}
