/* Villa Fluid: a separate, native-feeling home remote. */
body.fluid-app{--glass:rgba(255,255,255,.24);--glass-strong:rgba(248,250,253,.76);--ink:#102132;--muted:#243b50;--line:#ffffff82;--blue:#246bb6;--wash:#dceeff;--shadow:0 10px 32px #05142620,inset 0 1px 0 #ffffffa3;background:#101a26;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-optical-sizing:auto}
body.fluid-app[data-fluid-theme=dark]{--glass:rgba(14,27,43,.32);--glass-strong:rgba(20,32,48,.84);--ink:#f0f5fa;--muted:#bccddd;--line:#e2efff2e;--blue:#a0d2ff;--wash:#ffffff12;--shadow:0 10px 32px #0003,inset 0 1px 0 #ffffff12}
body.fluid-app[data-glass=off]{--glass:#edf2f8;--glass-strong:#f7f9fc;--line:#ccd6e2}
body.fluid-app[data-glass=off][data-fluid-theme=dark]{--glass:#1c2c40;--glass-strong:#152337;--line:#546980}
body.fluid-app #demo-shell{max-width:none;padding:0;margin:0;position:relative;isolation:isolate;overflow:hidden}
body.fluid-app .demo-topbar{position:relative;z-index:5;background:#102035;border-color:#ffffff20;color:#e5eef8}
body.fluid-app .demo-topbar a,body.fluid-app .demo-topbar button{color:#e5eef8}
body.fluid-app .demo-footer{background:#101d30;color:#c5d7e9}
.fluid-backdrop,.fluid-shade{position:absolute;inset:0;z-index:-2;pointer-events:none}
.fluid-backdrop{background-position:center;background-size:cover;filter:saturate(1.18) brightness(1.12);transition:background-image .4s}
.fluid-shade{z-index:-1;background:linear-gradient(90deg,#061322e8,#11263e38 65%,#0513236b),linear-gradient(0deg,#0e1c2bd9,transparent 80%)}
.fluid-layout{display:grid;grid-template-columns:1fr 450px;align-items:center;max-width:1280px;margin:auto;gap:100px;padding:50px 55px}
.fluid-editorial{color:#fff}.fluid-editorial>span{font-size:11px;letter-spacing:.12em;color:#c4d6e7}.fluid-editorial h1{font:500 80px/1.06 -apple-system,BlinkMacSystemFont,sans-serif;letter-spacing:-.055em;margin:32px 0}.fluid-editorial h1 em{font-family:inherit;font-style:normal;color:#c5def4}.fluid-editorial>p{font-size:17px;line-height:1.8;color:#d5e3ee;max-width:350px}.fluid-editorial>a{display:inline-block;font-size:13px;margin-top:40px;color:#d1e8ff;border-bottom:1px solid #b6d8f766;padding-bottom:10px}
.fluid-phone{--glint-x:20%;--glint-y:0%;width:100%;max-width:450px;margin:auto;position:relative}
.fluid-home-header{display:flex;justify-content:space-between;align-items:center;padding:0 3px}
.fluid-house{display:flex;align-items:center;gap:8px;font-size:11px;letter-spacing:.12em;color:#f4f8fc;font-weight:600}.fluid-house small{font-weight:400;font-size:10px;letter-spacing:0;color:#e0eaf3;border:1px solid #ffffff55;border-radius:8px;padding:3px 6px}.fluid-live{width:5px;height:5px;border-radius:50%;background:#cbe9d6;box-shadow:0 0 12px #cbf5dc}
.fluid-round{width:40px;height:40px;background:var(--glass);border:1px solid var(--line);border-radius:50%;box-shadow:var(--shadow);display:grid;place-items:center;backdrop-filter:blur(20px)}
.fluid-icon{display:inline-block;flex-shrink:0;width:34px;height:34px;background-image:url('assets/orbital-atlas-v2.png');background-size:500% 500%;background-position:calc(var(--ix)*25%) calc(var(--iy)*25%);background-repeat:no-repeat;vertical-align:middle}
.fluid-round .fluid-icon{width:27px;height:27px}
.fluid-greeting{color:#fff;padding:20px 3px 17px}.fluid-greeting>p{font-size:12px;color:#e0ebf5;font-weight:500;margin:0 0 8px}.fluid-greeting h2{font-size:36px;line-height:1.1;letter-spacing:-.045em;font-weight:600;margin:0}.fluid-readings{display:flex;align-items:center;gap:11px;margin-top:12px;font-size:12px;font-weight:500;color:#edf6ff}.fluid-readings i{width:3px;height:3px;background:#d3e2f0;border-radius:50%}
.fluid-rooms{display:flex;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(15px) saturate(160%);border-radius:23px;padding:4px;box-shadow:var(--shadow);gap:3px;margin-bottom:21px}
.fluid-rooms button{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;gap:5px;min-height:44px;padding:6px 4px;border:0;border-radius:19px;background:transparent;color:var(--ink);font-size:11px;font-weight:600;transition:background .15s}.fluid-rooms .fluid-icon{width:25px;height:25px}.fluid-rooms button[aria-pressed=true]{background:var(--glass-strong);box-shadow:0 2px 10px #1d36551a,inset 0 1px #ffffff70}
.fluid-section-heading{display:flex;align-items:baseline;justify-content:space-between;padding:0 3px;margin:0 0 11px;color:#fff}.fluid-section-heading h3{font-size:16px;font-weight:600;letter-spacing:-.02em;margin:0}.fluid-section-heading>span{font-size:11px;font-weight:500;color:#dae9f5}
.fluid-scenes{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:16px}
.fluid-scenes button{min-height:80px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:11px 15px;border:1px solid var(--line);border-radius:21px;background:var(--glass);backdrop-filter:blur(12px) saturate(165%);color:var(--ink);font-size:12px;font-weight:600;box-shadow:var(--shadow);text-align:left;position:relative}
.fluid-scenes button[aria-pressed=true]{background:var(--glass-strong);border-color:#d8ebff;box-shadow:0 0 0 2px #d9eaff4d,0 8px 28px #07162426}
.fluid-scenes button[aria-pressed=true]:after{content:'';position:absolute;top:13px;right:13px;width:6px;height:6px;border-radius:50%;background:#5287b7}
.fluid-scenes .fluid-icon{width:33px;height:33px;margin-bottom:5px}
.fluid-control-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fluid-card{position:relative;padding:18px;border-radius:25px;background:var(--glass);border:1px solid var(--line);box-shadow:var(--shadow);backdrop-filter:blur(10px) saturate(165%);overflow:hidden;isolation:isolate}
.fluid-card:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at var(--glint-x) var(--glint-y),#ffffff65,transparent 60%);opacity:.6}
.fluid-card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.fluid-card-head .fluid-icon{width:36px;height:36px}
.fluid-card h3{font-size:17px;letter-spacing:-.03em;font-weight:600;margin:0 0 6px;color:var(--ink)}
.fluid-card-caption{font-size:11px;color:var(--muted);line-height:1.4;margin:0}
.fluid-power{position:relative;width:43px;height:26px;min-width:43px;border:0;background:#60748d54;border-radius:20px;padding:3px;display:flex;align-items:center;box-shadow:inset 0 1px 3px #061d331c}
.fluid-power:before{content:'';position:absolute;inset:-9px 0}
.fluid-power span{width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 5px #0003;transform:translateX(0);transition:transform .18s ease-out}
.fluid-power[aria-checked=true]{background:#508fba}.fluid-power[aria-checked=true] span{transform:translateX(17px)}
.fluid-light-value,.fluid-temp-value{display:flex;align-items:baseline;gap:2px;margin:17px 0 15px;color:var(--ink)}
.fluid-light-value strong,.fluid-temp-value strong{font-size:51px;font-weight:300;line-height:1;letter-spacing:-.06em;font-variant-numeric:tabular-nums}.fluid-light-value>span,.fluid-temp-value>span{font-size:24px;color:var(--muted)}
.fluid-range{display:block;width:100%;font-size:11px;color:var(--muted)}.fluid-range>span{display:flex;justify-content:space-between;gap:8px;font-weight:500}.fluid-range output{color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}
.fluid-range input{appearance:none;-webkit-appearance:none;width:100%;height:34px;display:block;margin:2px 0 0;background:transparent;accent-color:#548bb6;cursor:pointer;touch-action:pan-y}
.fluid-range input::-webkit-slider-runnable-track{height:7px;border-radius:10px;background:linear-gradient(to right,#548bb6 var(--fill),#647d9833 var(--fill))}
.fluid-range input::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:24px;height:24px;border-radius:50%;border:1px solid #dce4ed;background:#fff;margin-top:-8.5px;box-shadow:0 2px 6px #0b254b38}
.fluid-range input::-moz-range-track{height:7px;border-radius:10px;background:#647d9833}.fluid-range input::-moz-range-progress{height:7px;border-radius:10px;background:#548bb6}.fluid-range input::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:#fff;border:1px solid #dce4ed}
.fluid-temp-step{display:flex;justify-content:space-between;align-items:center;gap:5px;margin-top:19px}.fluid-temp-step button{height:38px;width:38px;min-width:38px;background:var(--wash);color:var(--ink);border:1px solid #ffffff40;border-radius:50%;font-size:22px;line-height:1}.fluid-temp-step>span{font-size:10px;color:var(--muted)}.fluid-temp-step button:disabled{opacity:.35}
.fluid-shades-card{grid-column:1/-1;display:flex;gap:15px;align-items:center;padding:14px 18px}.fluid-shades-icon{padding:8px;border-radius:16px;background:var(--wash)}.fluid-shades-icon .fluid-icon{width:39px;height:39px}.fluid-shades-controls{flex:1;min-width:0}.fluid-shades-controls .fluid-range>span{font-size:13px;font-weight:600;color:var(--ink)}.fluid-shade-actions{display:flex;justify-content:space-between;gap:10px}.fluid-shade-actions button{background:transparent;color:var(--muted);font-size:10px;border:0;padding:5px 0;min-height:24px}
.fluid-music-card{grid-column:1/-1;display:flex;align-items:center;gap:10px;padding:12px 16px}
.fluid-track-open{background:transparent;border:0;display:flex;align-items:center;gap:13px;flex:1;min-width:0;padding:0;text-align:left;color:var(--ink)}.fluid-album{display:grid;place-items:center;border-radius:15px;width:48px;height:48px;background:linear-gradient(130deg,#b6cada88,#aa93c776);box-shadow:inset 0 1px #ffffff70;flex-shrink:0}.fluid-album .fluid-icon{width:33px;height:33px}.fluid-album.is-playing{box-shadow:0 0 0 3px #7e96c322,inset 0 1px #ffffff70}.fluid-track-open b{display:block;font-size:14px;font-weight:600;letter-spacing:-.02em}.fluid-track-open small{display:block;margin-top:5px;font-size:10px;color:var(--muted)}
.fluid-play{width:42px;height:42px;border:0;background:var(--wash);border-radius:50%;display:grid;place-items:center}.fluid-play .fluid-icon{width:28px;height:28px}
.fluid-status{text-align:center;color:#e5eff8;font-size:10px;line-height:1.5;min-height:15px;margin:12px 0 9px}
.fluid-dock{display:flex;justify-content:space-around;max-width:290px;margin:auto;border-radius:28px;padding:7px 15px;background:var(--glass);backdrop-filter:blur(28px) saturate(150%);border:1px solid var(--line);box-shadow:var(--shadow)}
.fluid-dock button{display:flex;flex-direction:column;align-items:center;gap:3px;background:transparent;border:0;padding:3px 10px;min-width:65px;color:var(--ink);font-size:9px;font-weight:500}.fluid-dock .fluid-icon{width:25px;height:25px}
.fluid-phone button:active,.fluid-sheet button:active{transform:scale(.96);transition:transform .1s ease-out}.fluid-phone button:focus-visible,.fluid-sheet button:focus-visible,.fluid-phone input:focus-visible,.fluid-sheet input:focus-visible{outline:3px solid #448de1;outline-offset:3px}
.fluid-sheet{color:var(--ink);position:fixed;inset:auto 0 0;margin:0 auto;width:min(100%,450px);max-height:min(90dvh,820px);padding:44px 25px max(30px,env(safe-area-inset-bottom));border-radius:32px 32px 0 0;border:1px solid var(--line);background:var(--glass-strong);backdrop-filter:blur(40px) saturate(130%);box-shadow:0 -15px 70px #06152445;overflow:auto;will-change:transform;font-family:inherit}
.fluid-sheet::backdrop{background:#0310215c;backdrop-filter:blur(5px)}
.fluid-sheet-handle{height:34px;position:absolute;left:60px;right:60px;top:0;display:flex;align-items:center;justify-content:center;touch-action:none;cursor:grab}.fluid-sheet-handle>span{width:36px;height:5px;border-radius:10px;background:#7d8a9b70}
.fluid-sheet-close{position:absolute;top:15px;right:17px;width:31px;height:31px;border-radius:50%;background:var(--wash);border:0;color:var(--muted);font-size:23px;line-height:1}
.fluid-sheet-heading{margin:0 0 24px}.fluid-sheet-heading>.fluid-icon{width:51px;height:51px;margin-bottom:15px}.fluid-sheet-heading h2{font-size:29px;line-height:1.1;font-weight:600;letter-spacing:-.04em;margin:0 0 12px}.fluid-sheet-heading>p{font-size:13px;line-height:1.65;color:var(--muted)}
.fluid-settings-group{background:var(--wash);border-radius:21px;padding:0 15px;border:1px solid #8aa2bc24}
.fluid-setting{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 0;border-bottom:1px solid #8aa2bc24}.fluid-setting:last-child{border-bottom:0}.fluid-setting b{font-size:13px;font-weight:600;display:block}.fluid-setting small{font-size:11px;line-height:1.6;color:var(--muted);display:block;margin-top:6px;max-width:250px}.fluid-setting input{appearance:none;width:44px;min-width:44px;height:27px;border-radius:30px;background:#8799ae70;position:relative;margin:0;cursor:pointer}.fluid-setting input:before{content:'';position:absolute;left:3px;top:3px;width:21px;height:21px;background:white;border-radius:50%;box-shadow:0 1px 5px #0003;transition:transform .16s ease-out}.fluid-setting input:checked{background:#508fba}.fluid-setting input:checked:before{transform:translateX(17px)}.fluid-setting button{border:1px solid #7c9bb438;color:var(--blue);background:var(--wash);border-radius:14px;min-height:39px;padding:5px 9px;font-size:11px;font-weight:600}
.fluid-settings-label{font-size:13px;margin:25px 0 10px;font-weight:600}.fluid-theme-picker{display:flex;border-radius:15px;background:var(--wash);padding:4px;gap:4px}.fluid-theme-picker button{flex:1;background:transparent;border:0;border-radius:12px;min-height:39px;font-size:12px;color:var(--muted)}.fluid-theme-picker button[aria-pressed=true]{background:var(--glass-strong);color:var(--ink);box-shadow:0 2px 10px #0d21371a}.fluid-settings-note{font-size:11px;line-height:1.7;color:var(--muted);margin:18px 0}.fluid-sibling{display:block;font-size:12px;line-height:1.6;color:var(--blue);margin-top:25px}.fluid-reset{display:block;background:transparent;border:0;color:var(--muted);font-size:11px;padding:10px 0;margin-top:15px}
.fluid-scenes-large{grid-template-columns:1fr;gap:12px}.fluid-scenes-large button{padding:18px 20px;display:grid;grid-template-columns:55px 1fr;column-gap:13px}.fluid-scenes-large .fluid-icon{grid-row:1/3;width:45px;height:45px}.fluid-scenes-large small{font-size:11px;font-weight:400;color:var(--muted);margin-top:7px}
.fluid-player{display:flex;justify-content:center;align-items:center;gap:25px;margin:25px 0 35px}.fluid-player button{display:grid;place-items:center;width:53px;height:53px;border-radius:50%;border:0;background:var(--wash)}.fluid-player button[data-music=play]{width:77px;height:77px}.fluid-player button[data-music=play] .fluid-icon{width:45px;height:45px}.fluid-prev{transform:rotate(180deg)}
body.fluid-app[data-glass=off] .fluid-card:before{display:none}body.fluid-app[data-glass=off] :is(.fluid-card,.fluid-rooms,.fluid-scenes button,.fluid-dock,.fluid-sheet,.fluid-round){backdrop-filter:none}
body.fluid-app.fluid-no-motion *,body.fluid-app.fluid-no-motion *:before{transition:none!important;animation:none!important;scroll-behavior:auto!important}
@media(max-width:1000px){.fluid-layout{display:block;padding:26px 20px}.fluid-editorial{display:none}.fluid-shade{background:linear-gradient(0deg,#08182a99,#172a3c40)}.fluid-backdrop{background-attachment:scroll}}
@media(max-width:600px){body.fluid-app .demo-topbar{height:48px;min-height:48px;padding:4px 12px;gap:7px}body.fluid-app .demo-topbar .brand{display:none}body.fluid-app .demo-topbar .back-link span{display:inline}body.fluid-app .demo-topbar select{max-width:120px;font-size:10px;padding:7px}body.fluid-app .demo-top-actions{gap:5px}body.fluid-app .demo-topbar #fullscreen{display:inline-flex;width:34px;height:34px;align-items:center;justify-content:center}body.fluid-app .demo-footer{display:none}.fluid-layout{padding:15px 18px max(15px,env(safe-area-inset-bottom))}.fluid-greeting{padding:12px 2px 14px}.fluid-greeting h2{font-size:31px}.fluid-greeting>p{font-size:11px;margin-bottom:7px}.fluid-readings{font-size:11px;margin-top:9px}.fluid-rooms{margin-bottom:17px;border-radius:21px}.fluid-rooms button{font-size:10px;gap:4px;min-height:41px}.fluid-rooms .fluid-icon{width:24px;height:24px}.fluid-scenes{gap:9px;margin-bottom:12px}.fluid-scenes button{min-height:73px;padding:9px 12px;font-size:11px;border-radius:19px}.fluid-scenes .fluid-icon{width:30px;height:30px}.fluid-control-grid{gap:10px}.fluid-card{padding:14px;border-radius:22px}.fluid-card-head{margin-bottom:9px}.fluid-card-head .fluid-icon{width:31px;height:31px}.fluid-card h3{font-size:15px;margin-bottom:5px}.fluid-card-caption{font-size:10px}.fluid-light-value,.fluid-temp-value{margin:14px 0 11px}.fluid-light-value strong,.fluid-temp-value strong{font-size:45px}.fluid-temp-step{margin-top:15px}.fluid-temp-step button{width:34px;min-width:34px;height:34px}.fluid-temp-step>span{font-size:9px}.fluid-range{font-size:10px}.fluid-shades-card{padding:11px 14px;gap:12px}.fluid-shades-icon{padding:7px}.fluid-shades-icon .fluid-icon{width:33px;height:33px}.fluid-shades-controls .fluid-range>span{font-size:12px}.fluid-shade-actions button{padding:3px 0;font-size:9px}.fluid-music-card{padding:10px 12px}.fluid-album{width:42px;height:42px;border-radius:13px}.fluid-track-open b{font-size:13px}.fluid-track-open small{font-size:9px}.fluid-status{font-size:9px;margin:9px 0 7px;min-height:14px}.fluid-dock{padding:5px 12px;max-width:275px}.fluid-dock .fluid-icon{width:23px;height:23px}.fluid-dock button{font-size:8px;min-height:42px}.fluid-section-heading h3{font-size:15px}.fluid-section-heading>span{font-size:10px}}
@media(max-width:380px){.fluid-layout{padding-inline:13px}.fluid-rooms button{gap:3px;font-size:9px}.fluid-greeting h2{font-size:29px}.fluid-power{width:39px;min-width:39px}.fluid-power[aria-checked=true] span{transform:translateX(13px)}.fluid-temp-step{gap:2px}.fluid-temp-step>span{font-size:8px}}
@media(prefers-contrast:more){body.fluid-app{--glass:#f2f6fc;--glass-strong:#fff;--ink:#081324;--muted:#263c55;--line:#355c85}body.fluid-app .fluid-card:before{display:none}.fluid-card{border-width:2px}}
body.fluid-app .fluid-exit{display:none}body.fluid-app.fluid-immersive .demo-topbar,body.fluid-app.fluid-immersive .demo-footer{display:none}body.fluid-app.fluid-immersive .fluid-exit{display:grid;place-items:center;position:fixed;right:14px;top:max(12px,env(safe-area-inset-top));z-index:10;width:34px;height:34px;font-size:23px;border:1px solid var(--line);border-radius:50%;background:var(--glass);color:var(--ink);backdrop-filter:blur(16px)}
body.fluid-app.fluid-immersive .fluid-home-header{padding-right:45px}body.fluid-app.fluid-immersive .fluid-layout{padding-top:max(16px,env(safe-area-inset-top));min-height:100dvh}
@media(max-width:600px) and (max-height:900px){.fluid-layout{padding-top:10px;padding-bottom:10px}.fluid-greeting{padding:10px 2px 12px}.fluid-greeting>p{display:none}.fluid-rooms{margin-bottom:13px}.fluid-scenes button{min-height:68px;padding-block:8px}.fluid-scenes{margin-bottom:10px}.fluid-card-head{margin-bottom:7px}.fluid-light-value,.fluid-temp-value{margin:10px 0 8px}.fluid-card-head .fluid-icon{width:29px;height:29px}.fluid-card{padding:12px 14px}.fluid-temp-step{margin-top:10px}.fluid-shades-card{padding:9px 14px}.fluid-music-card{padding:9px 12px}.fluid-greeting h2{font-size:30px}}

@media(prefers-reduced-motion:reduce){body.fluid-app *,body.fluid-app *:before{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.fluid-install{border:0;border-radius:15px;background:var(--wash);color:var(--blue);font-size:12px;min-height:42px;padding:10px 15px;margin-top:18px}

/* Clear material: scenery remains visible, with depth tied to the user's hand. */
body.fluid-app{--depth-x:0px;--depth-y:0px;--card-x:0px;--card-y:0px;--tilt-x:0deg;--tilt-y:0deg;--glint-x:20%;--glint-y:0%}
.fluid-backdrop{inset:-32px;transform:translate3d(var(--depth-x),var(--depth-y),0);will-change:transform}
.fluid-card{transform:perspective(850px) translate3d(var(--card-x),var(--card-y),0) rotateX(var(--tilt-x)) rotateY(var(--tilt-y));transform-origin:50% 50%;will-change:transform;box-shadow:0 12px 30px #06122226,inset 0 1px 0 #ffffffbd,inset 0 -1px 0 #ffffff24}
.fluid-card:before{background:radial-gradient(ellipse at var(--glint-x) var(--glint-y),#ffffff8c,transparent 57%);opacity:.45}
.fluid-scenes{transform:translate3d(calc(var(--card-x)*.55),calc(var(--card-y)*.55),0)}
.fluid-dock{transform:translate3d(calc(var(--card-x)*.35),calc(var(--card-y)*.35),0)}
.fluid-phone{--glint-x:inherit;--glint-y:inherit}
body.fluid-app[data-fluid-theme=light] .fluid-card-caption,body.fluid-app[data-fluid-theme=light] .fluid-range,body.fluid-app[data-fluid-theme=light] .fluid-track-open small{font-weight:600;text-shadow:0 1px 7px #ffffff45}
body.fluid-app[data-fluid-theme=dark] .fluid-card{box-shadow:0 12px 30px #0004,inset 0 1px 0 #ffffff55}
.fluid-motion-preview{position:relative;height:95px;border-radius:20px;margin:18px 0 0;background-image:linear-gradient(100deg,#06203b22,#06203b00),var(--preview-photo);background-position:center;background-size:cover;overflow:hidden;border:1px solid var(--line);display:flex;align-items:center;justify-content:center}
.fluid-preview-card{display:flex;align-items:center;gap:10px;padding:12px 20px;background:var(--glass);border:1px solid var(--line);border-radius:18px;backdrop-filter:blur(6px);transform:translate3d(calc(var(--card-x)*2),calc(var(--card-y)*2),0) rotateY(var(--tilt-y));box-shadow:0 8px 20px #0003;color:var(--ink);font-size:12px;font-weight:600}.fluid-preview-card small{display:block;font-size:10px;margin-top:4px}
body.fluid-app.fluid-no-motion .fluid-backdrop,body.fluid-app.fluid-no-motion .fluid-card,body.fluid-app.fluid-no-motion .fluid-scenes,body.fluid-app.fluid-no-motion .fluid-dock,body.fluid-app.fluid-no-motion .fluid-preview-card{transform:none!important;will-change:auto}
@media(max-width:1000px){.fluid-shade{background:linear-gradient(0deg,#08182a30,#172a3c06 60%,#08182a55)}body.fluid-app[data-fluid-theme=light] .fluid-card{background:linear-gradient(115deg,#ffffff57,#ffffff26)}body.fluid-app[data-fluid-theme=light][data-glass=off] .fluid-card{background:var(--glass)}}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more){body.fluid-app .fluid-card{background:var(--glass)!important}body.fluid-app .fluid-preview-card{backdrop-filter:none}}
.fluid-greeting h2,.fluid-greeting>p,.fluid-readings{text-shadow:0 1px 12px #031224a8}
.fluid-section-heading{background:linear-gradient(90deg,#102035ba,#10203555);border-radius:9px;padding:4px 9px;margin-bottom:9px;backdrop-filter:blur(8px)}
body.fluid-app[data-glass=off] .fluid-section-heading{background:#102035;backdrop-filter:none}
@media(max-width:1000px){.fluid-shade{background:linear-gradient(0deg,#08182a30,#172a3c06 60%,#08182a88)}}

/* Keep dismissal and the drag handle reachable when settings scroll. */
.fluid-sheet{padding:0}
.fluid-sheet-chrome{position:sticky;top:0;height:48px;z-index:3;background:var(--glass-strong);backdrop-filter:blur(18px)}
#fluid-sheet-body{padding:0 25px max(30px,env(safe-area-inset-bottom))}
/* Room navigation stays under the thumb; swiping never captures a range input. */
.fluid-room-viewport{overflow:clip;padding:8px;margin:-8px;touch-action:pan-y pinch-zoom;outline-offset:4px}
.fluid-room-stage{will-change:transform;touch-action:pan-y pinch-zoom}
.fluid-room-viewport.is-swiping{cursor:grabbing;user-select:none;-webkit-user-select:none}
.fluid-room-viewport:focus-visible{outline:2px solid #c6e7ff;border-radius:20px}
body.fluid-app .fluid-dock{display:block;max-width:450px;padding:7px;border-radius:28px;transform:none!important;background:var(--glass-strong)}
body.fluid-app .fluid-dock .fluid-rooms{margin:0;padding:0;border:0;box-shadow:none;background:transparent;backdrop-filter:none}
body.fluid-app .fluid-dock .fluid-rooms button{flex:1;min-width:0;min-height:48px;gap:4px;padding:4px;font-size:10px;flex-direction:column}
body.fluid-app .fluid-dock .fluid-rooms .fluid-icon{width:25px;height:25px}
.fluid-swipe-hint{font-size:9px;letter-spacing:.025em;color:var(--muted);margin:0 0 5px;text-align:center}
@media(max-width:1000px){
 body.fluid-app .fluid-dock{position:fixed;z-index:8;left:0;right:0;bottom:max(10px,env(safe-area-inset-bottom));width:calc(100% - 28px);max-width:440px;margin:0 auto;box-sizing:border-box;backdrop-filter:blur(28px) saturate(150%)}
 body.fluid-app .fluid-layout{padding-bottom:calc(108px + env(safe-area-inset-bottom));min-height:calc(100dvh - 48px)}
 body.fluid-app.fluid-immersive .fluid-layout{padding-bottom:calc(108px + env(safe-area-inset-bottom));min-height:100dvh}
 .fluid-phone{scroll-padding-bottom:110px}.fluid-card{scroll-margin-bottom:110px}
}
@media(max-height:500px) and (orientation:landscape){.fluid-swipe-hint{display:none}body.fluid-app .fluid-dock .fluid-rooms button{flex-direction:row;min-height:44px}}