/* Liquid Glass visual layer. The portfolio skin is intentionally independent. */
:root{--paper:#fff;--muted:#ffffffd9;--accent:#fff;--line:#ffffff2b;--serif:-apple-system,BlinkMacSystemFont,'SF Pro Display','Segoe UI','Yu Gothic UI','Microsoft YaHei',sans-serif;--spring:linear(0,.2 3%,.54 7%,.86 12%,1.06 18%,1.12 24%,1.08 33%,.99 50%,1 75%,1)}
body{font-family:var(--serif);-webkit-font-smoothing:antialiased}.shade{background:linear-gradient(180deg,#0a141c4d,transparent 28%,#07131a12 50%,#07121c55),linear-gradient(90deg,#10211b10,transparent 70%)}body[data-scene=rain] .shade{background:linear-gradient(180deg,#07131d40,transparent 32%,#09132459)}body[data-scene=night] .shade{background:linear-gradient(180deg,#0b131526,transparent 40%,#0a141f50)}.light{background:radial-gradient(ellipse at 75% 18%,#ffefcf25,transparent 55%)}
/* All refraction is applied to the backdrop, never to readable text. */
.liquid-material{--glass-shade:.11;--glass-radius:30px;--lx:35%;--ly:0%;--light-angle:135deg;--rim-alpha:.8;position:relative;isolation:isolate;background:linear-gradient(135deg,#ffffff24,#ffffff08 45%,#ffffff12)!important;border:0!important;box-shadow:inset 0 1px 1px #ffffff80,inset 0 -1px 1px #ffffff2b,inset 1px 0 1px #ffffff38,0 8px 24px #0717281f,0 2px 4px #07172813!important;backdrop-filter:blur(10px) saturate(1.35);-webkit-backdrop-filter:blur(10px) saturate(1.35);border-radius:var(--glass-radius);transition:box-shadow .3s,scale .65s var(--spring),background .3s;transform:translateZ(0)}
.liquid-material::before{content:'';position:absolute;inset:0;border-radius:inherit;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 90% 110% at var(--lx) var(--ly),#ffffff25,transparent 65%),linear-gradient(180deg,rgba(5,12,24,var(--glass-shade)),rgba(5,12,24,calc(var(--glass-shade)*.9)));box-shadow:inset 0 0 12px #ffffff0c}
.liquid-material::after{content:'';position:absolute;inset:0;padding:1.2px;border-radius:inherit;pointer-events:none;background:conic-gradient(from var(--light-angle),#fff0 0deg,#ffffff0a 42deg,#ffffffdf 82deg,#d4f1ffba 100deg,#fff2 120deg,#fff0 170deg,#ffffffc7 244deg,#fff9 262deg,#ffdfef2b 285deg,#fff0 330deg);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;opacity:var(--rim-alpha);box-shadow:inset 0 0 2px #ffffff80;z-index:3}
.liquid-material.refraction-active{backdrop-filter:var(--liquid-filter);-webkit-backdrop-filter:var(--liquid-filter)}
.liquid-material.glass-panel{--glass-shade:.2;box-shadow:inset 0 1.3px 1px #ffffff99,inset 0 -1px 2px #ffffff26,0 24px 70px #07172842,0 5px 15px #07172814!important}
.liquid-material.is-pressed{scale:.975}.liquid-material.glass-action:hover{scale:1.035}.liquid-material.glass-action.is-pressed{scale:.95}
.app-shell{position:relative;padding:26px 40px 15px;gap:0}.site-header{height:auto;min-height:62px;position:relative;display:grid;grid-template-columns:1fr auto 1fr;gap:22px;border:0;z-index:5}.brand{--glass-radius:100px;justify-self:start;padding:10px 18px 10px 12px;gap:10px;font-size:19px;font-weight:650;letter-spacing:.01em}.brand-mark{border:0;border-radius:0;width:34px;height:34px}.brand-mark svg{width:24px;height:24px;stroke-width:1.6}.brand-study{font-size:13px;font-weight:550;letter-spacing:.075em}.brand-separator{font-size:17px;margin:0 6px;opacity:.5}.site-header nav{--glass-radius:100px;display:flex;justify-self:center;align-items:center;gap:3px;min-height:56px;margin:0;padding:6px}.site-header nav>button,.site-header nav>a{border:0;border-radius:100px;background:transparent;padding:11px 24px;font-size:13px;font-weight:550;white-space:nowrap;color:#fff;text-shadow:0 1px 8px #0003;transition:background .3s,transform .55s var(--spring)}.site-header nav>button:after{display:none}.site-header nav>button:hover{background:#ffffff19}.site-header nav>button[aria-expanded=true]{background:#ffffff30;box-shadow:inset 0 1px 1px #fff8,0 4px 12px #0001}.site-header nav>a{display:block;font-size:11px;padding:11px 18px;opacity:.85}.header-actions{--glass-radius:100px;justify-self:end;gap:5px;padding:7px;min-height:56px}.language-control{gap:9px;padding:0 7px 0 12px}.language-control>span{font-size:10px;opacity:.8}.language-control select{font-size:12px;width:88px;padding:4px 0;color:white}.language-control option{background:#333d42}.account-button{border:0;background:#ffffff1b;box-shadow:inset 0 1px 1px #ffffff42;border-radius:100px;padding:12px 16px;font-size:12px;font-weight:550;gap:8px;max-width:170px}.account-button:hover{background:#ffffff30}.account-button svg{width:16px;height:16px}
main{min-height:420px}.home-view{justify-content:center;text-align:center;padding:52px 0 48px}.hero-copy{max-width:940px;margin:0 auto}.eyebrow{justify-content:center;font-size:10px;letter-spacing:.16em;font-weight:600;color:#fff;gap:10px;text-shadow:0 1px 8px #0004}.tiny-line{width:6px;height:6px;background:#fff;border-radius:50%;box-shadow:0 0 12px #fff5}.hero-copy>.eyebrow{margin:0 auto 21px;opacity:.9}.hero-copy h1{font-family:var(--serif);font-size:clamp(44px,4.4vw,72px);font-weight:600;line-height:1.29;letter-spacing:-.055em;margin:0 0 23px;text-shadow:0 4px 32px #00121b33;text-wrap:balance}.hero-copy h1 em{color:#fff}.hero-description{font-size:14px;line-height:1.85;letter-spacing:.025em;color:#fffffff0;margin:0 0 30px;text-shadow:0 2px 14px #00182766}.hero-actions{justify-content:center;gap:14px}.primary-button{--glass-radius:100px;border:0;border-radius:100px;padding:17px 28px;min-height:57px;gap:26px;color:#fff;background:#ffffff40;font-size:14px;font-weight:600;letter-spacing:.01em;box-shadow:inset 0 1px 1px #fff7,0 5px 16px #00172415;transition:transform .55s var(--spring),background .2s}.primary-button:hover{background:#ffffff55;transform:translateY(-2px)}.primary-button svg{width:19px;height:19px}.quiet-button{border-radius:100px;padding:14px 20px;font-size:12px;font-weight:500;gap:12px;color:#ffffffed}.quiet-button:hover{background:#ffffff15}.hero-note{justify-content:center;margin-top:23px;font-size:10px;color:#ffffffb3;text-shadow:0 1px 12px #0006}.live-dot{background:#d4ffd9;box-shadow:0 0 9px #c9ffdc70}.daily-note{position:absolute;left:0;bottom:38px;display:flex;flex-direction:row;align-items:center;gap:9px;padding:0;min-width:0;font-size:10px;opacity:.8;text-shadow:0 1px 8px #0005}.daily-note>svg{width:17px;height:17px;margin:0;color:white}.daily-divider,.daily-note p,.vertical-label{display:none}
.scene-dock{--glass-radius:30px;align-self:center;width:min(900px,100%);padding:10px 12px 10px 19px;margin:0 auto 18px;gap:12px}.dock-label{width:128px;padding-right:4px}.dock-label>span{font-size:7px;letter-spacing:.12em;color:#ffffffa1;opacity:1;margin-bottom:3px}.dock-label strong{font-size:11px;font-weight:550;line-height:1.5;white-space:normal;display:block}.scene-list{gap:6px}.scene-tile{border:1px solid transparent;border-radius:20px;background:transparent;padding:7px;gap:9px;transition:background .25s,transform .55s var(--spring),box-shadow .3s}.scene-tile:hover{background:#ffffff17;transform:translateY(-2px)}.scene-tile[aria-pressed=true]{background:#ffffff29;border-color:#ffffff30;box-shadow:inset 0 1px 1px #ffffff7a,inset 0 -1px 2px #ffffff12,0 4px 10px #0000000d}.scene-tile img{width:50px;height:44px;border-radius:12px;box-shadow:0 2px 8px #0002}.scene-tile .scene-label{font-size:11px;font-weight:550}.scene-list small,.selected-dot{display:none!important}.scene-next{border:0;background:#ffffff14;box-shadow:inset 0 1px 1px #ffffff48;width:31px;height:31px}.scene-next svg{width:15px;height:15px}
.soundbar{--glass-radius:100px;position:relative;z-index:4;align-self:center;width:min(820px,100%);justify-content:center;padding:13px 24px 13px 14px;gap:25px}.sound-current{min-width:210px;gap:12px}.audio-play{border:0;width:43px;height:43px;background:#ffffff25;box-shadow:inset 0 1px 2px #ffffff8c,0 4px 12px #0002;transition:transform .5s var(--spring),background .2s}.audio-play:hover{background:#ffffff40}.audio-play:active{transform:scale(.9)}.audio-play svg{width:18px;height:18px}.track-copy{flex:1;min-width:100px}.track-kicker{font-size:8px;letter-spacing:.025em;color:#ffffffa6;line-height:1.5}.track-copy button{display:block;font-size:12px;font-weight:550;text-align:left;letter-spacing:0}.equalizer{margin-left:5px;height:20px}.equalizer i{background:white}.mixer{gap:22px;border-left:1px solid #ffffff28;padding-left:24px}.mixer label{font-size:10px;gap:8px;color:#ffffffe3}.mixer input{width:91px;height:4px;accent-color:white}.soundbar-end{display:grid;place-items:center;padding:5px}.soundbar-end span{display:none}.soundbar-end svg{width:19px;height:19px}.bottom-credit{padding:16px 4px 0;min-height:32px;font-size:8px;color:#ffffffa1;letter-spacing:.08em;text-shadow:0 1px 5px #0004}#saveState{font-size:9px;max-width:65%;color:#ffffffb3}
.room-view{padding:27px 0 28px;min-height:480px}.room-top{padding:0 6px}.scene-caption{font-size:12px;font-weight:550;text-shadow:0 1px 10px #0005;color:white}.room-top-actions{gap:8px}.glass-button{background:#ffffff14;border:1px solid #ffffff38;color:white;padding:9px 17px;border-radius:100px;font-size:11px;font-weight:550}.glass-button:hover{background:#ffffff28}.room-top-actions .glass-button{background:#ffffff14;backdrop-filter:blur(9px);border:1px solid #ffffff38;color:white}.focus-workspace{flex:1;justify-content:center;align-items:center;gap:22px;padding:32px 0 12px;margin:0}.timer-card{--glass-radius:42px;width:370px;padding:28px 31px 25px}.timer-card-top{font-size:9px;letter-spacing:.14em;color:#ffffffdc}.status-pill{border:0;background:#ffffff13;gap:7px;padding:5px 9px;font-size:9px}.timer-number{font-size:90px;font-weight:250;line-height:1.3;letter-spacing:-.06em;margin:16px 0 8px;text-align:center;text-shadow:0 2px 20px #0000001a;color:white}.timer-mode{gap:3px;padding:3px;background:#00000015;border-radius:100px;margin-bottom:26px}.timer-mode button{border:0;border-radius:100px;padding:6px 14px;font-weight:550;font-size:10px;color:#ffffffb3}.timer-mode button[aria-pressed=true]{border:0;background:#ffffff26;box-shadow:inset 0 1px 1px #ffffff4a;color:white}.timer-mode button:last-child{padding:6px 10px;font-size:9px;letter-spacing:.03em}.progress-track{height:3px;border-radius:6px;background:#ffffff28;margin-bottom:22px;overflow:hidden}.progress-track span{background:white;border-radius:6px}.timer-controls{align-items:center}.timer-main{border:1px solid #ffffff23;border-radius:100px;background:#ffffff2a;box-shadow:inset 0 1px 1px #ffffff6e;padding:11px 17px;font-size:12px;font-weight:550}.timer-main:hover{background:#ffffff44}.icon-button{background:#ffffff0c;border:0;width:36px;height:36px;color:#ffffffe0}.icon-button:hover{background:#ffffff23;border:0}.timer-footnote{text-align:center;font-size:10px;color:#ffffffb3;margin-top:20px;letter-spacing:0}.goal-card{--glass-radius:30px;width:330px;padding:24px;align-self:center}.goal-title{display:block;font-size:11px;font-weight:550;color:#ffffffdb;letter-spacing:0}.goal-card input{padding:15px 0 13px;border-color:#ffffff38;font-size:14px;color:white}.goal-card input::placeholder{color:#ffffff80}.goal-card button{padding:17px 0 0;font-size:10px;color:#ffffffe0}
dialog::backdrop{background:#08141f36;backdrop-filter:blur(5px)}.drawer{--glass-radius:40px;margin:18px 18px 18px auto;width:min(560px,calc(100vw - 36px));height:calc(100dvh - 36px);max-width:none;max-height:none;background:#6c757359;border:0;border-radius:40px;box-shadow:0 28px 90px #0313204d;scrollbar-width:thin}.dialog-header{position:sticky;top:0;z-index:5;padding:29px 31px 24px;background:linear-gradient(#383f416b,#383f4100);border:0;border-radius:inherit}.eyebrow.small{justify-content:flex-start;font-size:8px;letter-spacing:.13em;opacity:.7}.dialog-header h2{font-family:var(--serif);font-size:25px;font-weight:600;letter-spacing:-.045em;line-height:1.4;margin:5px 0 0}.dialog-header>.icon-button{background:#ffffff21;box-shadow:inset 0 1px 1px #ffffff5e;flex-shrink:0}.drawer-content{padding:0 31px 30px;position:relative}.drawer-content>section{padding:22px 0;border-color:#ffffff22;scroll-margin:100px}.section-heading{gap:12px;margin-bottom:17px}.section-heading>span{display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:#ffffff17;font-size:10px;opacity:1}.section-heading h3{font-size:14px;font-weight:550;letter-spacing:-.01em}.scene-grid{gap:10px}.scene-grid .scene-tile{padding:7px 7px 12px;border-radius:23px;background:#ffffff0d;border-color:#ffffff1c}.scene-grid .scene-tile[aria-pressed=true]{background:#ffffff2c;border-color:#ffffff80}.scene-grid img{height:111px;border-radius:17px}.scene-grid .scene-label{font-size:12px;padding:9px 6px 0}.scene-grid small{display:block;padding:3px 6px 0;white-space:normal;font-size:9px;color:#ffffffba;line-height:1.5}.check-row{color:#ffffffd9}.check-row input{accent-color:white}.settings-selects{gap:12px}.settings-selects label,.duration-inputs label{color:#ffffffce;gap:8px}.settings-selects select,.duration-inputs input{border:1px solid #ffffff24;box-shadow:inset 0 1px 1px #ffffff24;background:#ffffff15;color:white;border-radius:14px;padding:12px 11px;font-size:11px}.settings-selects select option{background:#343c40}.muted{color:#ffffffbd}.duration-presets{gap:9px;margin-bottom:17px}.duration-presets button{border:1px solid #ffffff24;background:#ffffff10;color:white;border-radius:100px;padding:12px 9px;font-size:19px;font-weight:500}.duration-presets button[aria-pressed=true]{background:#ffffff36;border-color:#ffffff5c;box-shadow:inset 0 1px 2px #ffffff75}.duration-inputs{gap:14px}.wide{margin-top:23px}.stats-row{border-color:#ffffff29}.stats-row>div{border-color:#ffffff26}.stats-row strong{font-family:var(--serif);font-size:34px;font-weight:400;letter-spacing:-.04em;color:white}.stats-row span{color:#ffffffba}.task-form input{border:1px solid #ffffff30;background:#ffffff14;border-radius:100px;padding:13px 16px;color:white}.task-form input::placeholder{color:#ffffffb0}.task-form button{background:#ffffff30;border:1px solid #ffffff30;box-shadow:inset 0 1px 1px #ffffff4f;color:white;border-radius:100px;padding:10px 21px;font-weight:550}.task-item,.history-row{border-color:#ffffff21}.empty-state{color:#ffffffb5;border-color:#ffffff38;border-radius:22px;padding:24px 15px}.history-title{font-weight:550;letter-spacing:0}.history-row .history-time{font-family:var(--serif);font-size:22px;color:white}.history-row .history-date{color:#ffffffa3;opacity:1}
.account-dialog{--glass-radius:38px;width:444px;max-width:calc(100vw - 28px);max-height:calc(100dvh - 28px);padding:35px;border-radius:38px;background:#67716c69;border:0;box-shadow:0 28px 90px #0313204d}.account-close{right:14px;top:14px;background:#ffffff1f;z-index:5}.account-intro .brand-mark{width:58px;height:58px;margin:2px 0 16px;border:1px solid #ffffff57;box-shadow:inset 0 1px 2px #ffffff66,0 6px 20px #0001;border-radius:20px;background:#ffffff12}.account-intro .brand-mark svg{width:27px;height:27px}.account-intro .eyebrow{justify-content:center}.account-intro h2{font-family:var(--serif);font-size:26px;font-weight:600;letter-spacing:-.04em;line-height:1.45;margin:12px 0 7px}.account-intro p{font-size:12px;margin:0 0 23px}.auth-tabs{padding:4px;background:#00000013;border-radius:100px;border:0;margin:0 0 23px}.auth-tabs button{border:0;border-radius:100px;padding:9px;color:#ffffffba;font-size:12px;font-weight:550}.auth-tabs button[aria-pressed=true]{border:0;background:#ffffff2e;color:white;box-shadow:inset 0 1px 1px #ffffff80,0 3px 12px #0001}#authForm label{color:#ffffffdf}#authForm input{padding:12px 15px;border:1px solid #ffffff30;background:#ffffff13;box-shadow:inset 0 1px 3px #0000000d;color:white;border-radius:15px;font-size:13px}#authForm small{color:#ffffffa3;opacity:1}#authError{color:#ffdfcf}.local-account-note{color:#ffffffb3;margin-top:19px}.admin-link{color:#ffffffb3}.admin-link:hover{color:white}#memberGreeting{font-family:var(--serif);font-size:22px;font-weight:550}#confirmQuestion{font-family:var(--serif);font-size:19px;font-weight:550;line-height:1.7;margin-bottom:27px}.confirm-actions .primary-button{min-height:40px;font-size:12px;padding:10px 25px}.confirm-actions .glass-button{border:0}.toast{bottom:150px;background:#73807b50;border:1px solid #ffffff4d;border-radius:100px;backdrop-filter:blur(30px);font-size:12px;padding:15px 24px;color:white;box-shadow:0 12px 40px #00101b2b;text-align:center}
body.immersive .app-shell{padding:40px 40px 25px}body.immersive .room-view{padding-bottom:20px;min-height:0}body.immersive .focus-workspace{justify-content:center;align-items:center}body.immersive .soundbar{width:min(900px,100%);margin-bottom:0}
html[lang=en] .hero-copy h1{font-size:clamp(52px,5.5vw,88px);line-height:1.08;letter-spacing:-.065em}html[lang=ja] .hero-copy h1{font-size:clamp(40px,4.1vw,66px);line-height:1.38;letter-spacing:-.065em}html[lang=en] .site-header nav>button{padding:11px 21px}html[lang=en] .scene-dock{width:min(950px,100%)}html[lang=en] .dock-label{width:145px}html[lang=en] .scene-tile .scene-label{font-size:10px}
@media(max-width:1200px){.app-shell{padding:22px 28px 15px}.site-header{gap:15px}.site-header nav>button{padding:11px 20px}.site-header nav>a{display:none}.header-actions{gap:0}.language-control{padding-left:8px}.language-control>span{display:none}.header-actions select{width:79px}.account-button{padding:12px 14px}.home-view{padding:50px 0}.scene-dock{width:min(860px,100%)}.scene-list{gap:3px}.scene-tile{gap:7px}.scene-tile img{width:43px}.dock-label{width:112px}.soundbar{gap:20px}.mixer{gap:20px}}
@media(max-width:850px){.app-shell{padding:18px 22px 13px}.site-header{grid-template-columns:1fr 1fr;gap:16px;row-gap:19px;height:auto}.brand{padding:8px 15px 8px 9px;font-size:18px}.brand-study{font-size:11px}.brand-mark{width:31px;height:31px}.header-actions{grid-column:2;grid-row:1;min-height:49px;padding:5px}.site-header nav{grid-column:1/-1;grid-row:2;min-height:49px;padding:5px;position:relative;top:auto;left:auto;margin:0}.site-header nav>button{padding:9px 29px;font-size:12px}.site-header nav>a{display:block;padding:9px 20px;font-size:10px}.account-button{padding:10px 13px;font-size:11px}.language-control select{font-size:11px}.home-view{padding:43px 0 42px}.hero-copy h1{font-size:50px}.hero-description{font-size:12px}.daily-note{display:none}.dock-label{display:none}.scene-dock{width:min(670px,100%);padding:9px 11px;gap:6px}.scene-tile .scene-label{font-size:10px}.scene-tile img{width:45px;height:43px}.soundbar{width:min(670px,100%);gap:16px;padding:12px 16px 12px 12px}.sound-current{min-width:190px}.mixer{gap:16px;padding-left:17px}.mixer input{width:68px}.mixer label{gap:6px}.soundbar-end{display:none}.focus-workspace{gap:15px}.timer-card{width:340px;padding:25px 27px}.timer-number{font-size:83px}.goal-card{width:280px;padding:21px}.goal-card input{font-size:12px}.room-view{min-height:460px}}
@media(max-width:600px){.app-shell{padding:14px 16px 13px}.site-header{gap:13px;row-gap:18px;align-content:normal;z-index:10;flex-wrap:nowrap}.brand{padding:7px 13px 7px 8px;gap:7px;font-size:17px}.brand-study{font-size:10px;letter-spacing:.03em}.brand-separator{font-size:13px;margin:0 4px}.brand-mark{width:28px;height:28px}.brand-mark svg{width:20px;height:20px}.header-actions{min-height:43px;padding:4px;gap:3px;margin:0}.language-control{padding:0 4px 0 9px}.language-control select{width:71px;font-size:10px}.account-button{padding:8px;width:33px;height:33px;justify-content:center;background:#ffffff1b}.account-button span{display:none}.account-button svg{width:17px;height:17px}.site-header nav{width:min(342px,100%);padding:5px;min-height:46px;gap:2px;justify-content:space-evenly}.site-header nav>button{padding:8px 23px;font-size:12px;flex:1}.site-header nav>a{display:none}main{min-height:360px}.home-view{padding:37px 0 36px;min-height:0}.hero-copy>.eyebrow{font-size:7px;letter-spacing:.12em;margin-bottom:19px;gap:8px}.tiny-line{width:5px;height:5px}.hero-copy h1{font-size:37px;line-height:1.4;letter-spacing:-.06em;margin:0 0 20px}.hero-description{font-size:11px;line-height:1.85;margin-bottom:25px;letter-spacing:0}.hero-actions{flex-direction:column;gap:5px}.primary-button{font-size:13px;min-height:50px;padding:14px 26px;gap:25px}.primary-button svg{width:17px}.quiet-button{font-size:10px;padding:11px 19px;gap:9px}.down-arrow{font-size:16px}.hero-note{font-size:8px;margin-top:13px;gap:7px}.scene-dock{display:flex;padding:7px;margin-bottom:13px;--glass-radius:26px;gap:0}.scene-list{display:flex;gap:3px}.scene-list .scene-tile{display:block;padding:5px 4px 8px;text-align:center;border-radius:19px}.scene-list .scene-tile img{width:100%;height:45px;border-radius:12px}.scene-list .scene-label{padding-top:7px;font-size:9px;line-height:1.3;white-space:normal}.scene-next{display:none}.soundbar{width:100%;--glass-radius:30px;padding:13px 16px;flex-wrap:wrap;gap:11px}.sound-current{width:100%;min-width:0;gap:11px}.audio-play{width:35px;height:35px}.audio-play svg{width:16px}.track-copy{flex:1}.track-kicker{font-size:7px}.track-copy button{font-size:11px}.mixer{width:100%;border-left:0;border-top:1px solid #ffffff24;padding:12px 1px 1px;gap:19px;justify-content:space-between}.mixer label{flex:1;min-width:0;font-size:9px;gap:7px}.mixer input{width:100%;min-width:27px}.mixer svg{width:13px;height:13px}.bottom-credit{padding:13px 3px 0;font-size:6px;min-height:29px;gap:9px}#saveState{font-size:8px;max-width:55%}.room-view{padding:20px 0;min-height:445px}.room-top{padding:0 2px;gap:8px}.scene-caption{font-size:10px;gap:6px}.room-top-actions{gap:5px}.room-top-actions .glass-button{font-size:8px;padding:7px 10px;gap:5px}.room-top-actions svg{width:12px;height:12px}.focus-workspace{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;padding:23px 0 0;margin:0}.timer-card{width:min(100%,344px);padding:23px 27px 21px;--glass-radius:37px}.timer-number{font-size:79px;margin:11px 0 8px}.timer-card-top,.status-pill{font-size:8px}.timer-mode{margin-bottom:20px}.timer-mode button{font-size:9px;padding:5px 14px}.timer-mode button:last-child{font-size:8px}.progress-track{margin-bottom:19px}.timer-main{font-size:11px;padding:10px 14px}.timer-footnote{font-size:9px;margin-top:17px}.goal-card{width:min(100%,344px);padding:15px 21px;--glass-radius:27px;margin:0}.goal-title{font-size:9px}.goal-card input{font-size:11px;padding:9px 0}.goal-card button{font-size:9px;padding-top:10px}.drawer{margin:10px;width:calc(100vw - 20px);height:calc(100dvh - 20px);--glass-radius:34px}.dialog-header{padding:24px 23px 20px;gap:12px}.dialog-header h2{font-size:22px}.eyebrow.small{font-size:7px}.drawer-content{padding:0 23px 25px}.drawer-content>section{padding:21px 0;scroll-margin:90px}.scene-grid img{height:91px;border-radius:15px}.scene-grid .scene-tile{border-radius:21px}.scene-grid .scene-label{font-size:11px;white-space:normal}.scene-grid small{font-size:8px}.settings-selects{gap:10px}.settings-selects select{font-size:10px;padding:12px 9px}.section-heading h3{font-size:12px}.muted{font-size:10px}.account-dialog{padding:33px 27px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);--glass-radius:35px}.account-intro h2{font-size:25px}.account-intro p{font-size:11px}.stats-row strong{font-size:31px}.stats-row span{font-size:8px}.toast{font-size:11px;bottom:175px;padding:13px 20px;border-radius:25px}.shade{background:linear-gradient(180deg,#0c1b2035,transparent 30%,#06152033 65%,#0b172252)}html[lang=en] .hero-copy h1{font-size:48px;line-height:1.06;letter-spacing:-.07em}html[lang=ja] .hero-copy h1{font-size:33px;line-height:1.5;letter-spacing:-.07em}html[lang=en] .site-header nav>button{padding:8px 20px}html[lang=en] .scene-tile .scene-label{font-size:8px}body.immersive .app-shell{padding:20px 16px}body.immersive .soundbar{--glass-radius:30px}body.immersive .room-view{min-height:0;padding-top:0}}
@media(prefers-reduced-motion:reduce){.liquid-material{transition:none!important;scale:1!important}}body.motion-off .liquid-material{scale:1!important;transition:none!important}
@media(prefers-reduced-transparency:reduce){.liquid-material{background:#414c51ee!important;backdrop-filter:blur(10px)!important}}
@media(prefers-contrast:more){.liquid-material{background:#17212ee8!important;--rim-alpha:1}.hero-note,.muted,.bottom-credit{color:white}}
.scene-grid img{width:100%;object-fit:cover}
@keyframes glass-appear{from{opacity:0;transform:translateY(14px) scale(.965);filter:blur(4px)}to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}
dialog[open]{animation:glass-appear .48s var(--spring)}
body[data-view=room] .timer-card,body[data-view=room] .goal-card{animation:glass-appear .65s var(--spring)}
body.motion-off dialog[open],body.motion-off .timer-card,body.motion-off .goal-card{animation:none}
.site-header{position:sticky;top:18px;transition:translate .65s var(--spring)}
@media(max-width:600px){.site-header{top:14px}body.glass-scrolled .site-header{translate:0 -61px}}
.glass-panel.is-pressed{scale:.995}.liquid-material.is-pressed::before{background:radial-gradient(ellipse 90% 110% at var(--lx) var(--ly),#ffffff45,transparent 70%),linear-gradient(rgba(5,12,24,var(--glass-shade)),rgba(5,12,24,var(--glass-shade)))}
.glass-native-select{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;clip-path:inset(50%);overflow:hidden;pointer-events:none}
.glass-select-control{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:42px;padding:11px 13px;border:1px solid #ffffff26;box-shadow:inset 0 1px 1px #ffffff30;background:#ffffff14;color:white;border-radius:14px;font-size:12px;text-align:left;cursor:pointer;width:100%}
.glass-select-control>span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.glass-chevron{width:6px;height:6px;border-right:1.4px solid currentColor;border-bottom:1.4px solid currentColor;rotate:45deg;flex-shrink:0;margin-right:3px;translate:0 -2px}.glass-select-control[aria-expanded=true]{background:#ffffff27}.glass-select-control[aria-expanded=true] .glass-chevron{rotate:225deg;translate:0 2px}
.language-control .glass-select-control{background:transparent;border:0;box-shadow:none;padding:8px 0;font-size:12px;min-height:30px;gap:13px}.language-control .glass-select-control>span:first-child{white-space:nowrap;min-width:60px}.glass-menu{--glass-radius:22px;position:fixed;inset:auto;margin:0;max-width:calc(100vw - 24px);max-height:min(320px,60dvh);overflow:auto;padding:6px;min-width:140px;color:white;border-radius:22px}.glass-menu::backdrop{background:transparent}.glass-menu:popover-open{display:block;animation:glass-appear .3s var(--spring)}
.glass-menu [role=option]{display:flex;align-items:center;justify-content:space-between;gap:15px;width:100%;border:0;border-radius:15px;padding:11px 13px;background:transparent;color:white;text-align:left;font-size:12px;font-weight:500}.glass-menu [role=option]:hover,.glass-menu [role=option]:focus-visible{background:#ffffff20;outline:0}.glass-menu [aria-selected=true]{background:#ffffff27;box-shadow:inset 0 1px 1px #ffffff59}
.scene-grid small{font-size:10px}.scene-grid .scene-label{font-size:13px}.section-heading h3{font-size:15px}.settings-selects label,.duration-inputs label{font-size:11px}.drawer .muted{font-size:12px}.dialog-header>.icon-button{width:40px;height:40px}
@media(max-width:600px){.language-control .glass-select-control{font-size:10px;gap:9px}.language-control .glass-select-control>span:first-child{min-width:49px}.glass-select-control{font-size:11px;padding:11px}.scene-grid .scene-label{font-size:12px}.scene-grid small{font-size:9px}.section-heading h3{font-size:13px}.drawer .muted{font-size:11px}.glass-menu [role=option]{font-size:12px}}
.glass-panel.is-pressed,.site-header nav.is-pressed,.header-actions.is-pressed,.scene-dock.is-pressed,.soundbar.is-pressed{scale:1}
.site-header .brand{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}
.study-admin-menu{z-index:1100}.study-admin-menu>button{display:flex;align-items:center;gap:10px;width:100%;border:0;background:transparent;padding:12px 14px;border-radius:16px;font-size:12px;color:#fff;text-align:left}.study-admin-menu>button:hover,.study-admin-menu>button:focus-visible{background:#ffffff23;outline:0}.study-admin-menu svg{width:17px;height:17px}
.study-admin-form label{display:block;margin-top:17px;font-size:12px;color:#ffffffeb}.study-admin-form input{display:block;width:100%;margin-top:8px;padding:13px 15px;border:1px solid #ffffff38;border-radius:15px;background:#ffffff13;box-shadow:inset 0 1px 3px #0000000d;color:white;font-size:14px}.study-admin-form input:focus-visible{outline:2px solid #d6ecff;outline-offset:2px}.study-admin-form .primary-button{margin-top:25px}.study-admin-form [role=alert]{font-size:12px;line-height:1.8;color:#ffdfcf;margin:13px 0 0}.study-admin-form [role=alert]:empty{display:none}
/* Keep the optical rim fixed while only the inside of a drawer scrolls. */
.drawer[open]{display:grid;grid-template-rows:auto minmax(0,1fr);position:fixed;overflow:hidden}
.drawer>.dialog-header{position:relative;top:auto;border-radius:0}
.drawer>.drawer-content{min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-gutter:stable}
.drawer-content>section{scroll-margin-top:16px}
.settings-selects{grid-template-columns:repeat(2,minmax(0,1fr))}
.settings-selects>label,.duration-inputs>label{min-width:0}
.settings-selects select,.glass-select-control{min-width:0;max-width:100%}
.glass-select-control>span:first-child{min-width:0;flex:1}
.video-settings{margin-top:18px;padding:16px;border:1px solid #ffffff25;border-radius:21px;background:#ffffff08}
.video-settings>strong{font-size:12px;font-weight:550}.video-settings>p{margin:9px 0;font-size:11px;line-height:1.8;overflow-wrap:anywhere}
.video-actions{display:flex;flex-wrap:wrap;gap:8px;margin:13px 0}.video-actions .glass-button{font-size:11px;padding:10px 14px;min-height:40px}
.video-settings .video-note{font-size:10px;color:#ffffffbb;margin-bottom:0}
.scenery>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s;pointer-events:none}
body.video-background .scenery>video{opacity:1}body.video-background .scenery>img{opacity:0;animation:none;will-change:auto}
body.video-background .scenery>.light,body.video-background #weather{display:none}
.effect-settings{grid-template-columns:minmax(0,1fr);margin-top:18px}.effect-note{font-size:10px;line-height:1.8;margin:8px 0 0;color:#ffffffb8}
.effect-strength{display:flex;align-items:center;gap:12px;margin:16px 0 10px;font-size:11px;color:#ffffffdc}.effect-strength input{flex:1;min-width:40px;accent-color:white;height:4px}.effect-strength output{min-width:34px;text-align:right;font-variant-numeric:tabular-nums}
html{scrollbar-gutter:stable}html.dialog-lock{overflow:hidden;overscroll-behavior:none}
@media(max-width:850px),(pointer:coarse){html{scrollbar-gutter:auto}}
.drawer{height:calc(var(--dialog-height,100svh) - 36px)}.account-dialog{max-height:calc(var(--dialog-height,100svh) - 28px)}
body.dialog-still .scenery>img,body.dialog-still .scenery>.light{animation-play-state:paused}
body.dialog-still dialog,body.dialog-still .glass-menu{animation:none!important;transform:none!important;scale:1!important;transition:none!important;backdrop-filter:blur(18px) saturate(1.2)!important;-webkit-backdrop-filter:blur(18px) saturate(1.2)!important}
body.dialog-still dialog::backdrop{backdrop-filter:none;-webkit-backdrop-filter:none;background:#07121b66}
body.dialog-still .glass-panel{--lx:35%!important;--ly:0%!important;--light-angle:135deg!important}
body.dialog-still .drawer input:not([type=range]),body.dialog-still .drawer textarea,body.dialog-still .account-dialog input{font-size:16px}
.feedback-entry{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid #ffffff38;border-radius:100px;background:#ffffff12;color:#fff;padding:7px 13px;min-height:34px;font-size:11px;letter-spacing:0;white-space:nowrap}.feedback-entry:hover{background:#ffffff26}.feedback-entry svg{width:15px;height:15px}.bottom-credit{flex-wrap:wrap}.bottom-credit>span:first-child{flex:1}.bottom-credit #saveState{flex:1;text-align:right}
.feedback-intro{margin:2px 0 22px;color:#ffffffe0;font-size:13px;line-height:1.9}.feedback-form>label{display:grid;gap:8px;margin:18px 0;font-size:12px}.feedback-form input,.feedback-form textarea{width:100%;border:1px solid #ffffff3b;border-radius:16px;background:#ffffff14;padding:13px 14px;color:#fff;font:inherit;font-size:14px}.feedback-form textarea{resize:vertical;min-height:150px;max-height:400px;line-height:1.8}.feedback-form textarea::placeholder{color:#ffffff9c}.feedback-note{font-size:11px;line-height:1.8;color:#ffffffbf}.feedback-status{font-size:12px;line-height:1.8;white-space:pre-line;overflow-wrap:anywhere}.feedback-status:empty{display:none}.feedback-status[role=alert]{color:#ffdfcf}.feedback-status[role=status]{color:#d9f4e1}.feedback-form .primary-button{width:100%;justify-content:center}.feedback-honeypot{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
@media(max-width:600px){.drawer{height:calc(var(--dialog-height,100svh) - 20px)}.account-dialog{max-height:calc(var(--dialog-height,100svh) - 24px)}.drawer input:not([type=range]),.drawer textarea,.account-dialog input{font-size:16px}.feedback-entry{font-size:10px;padding:6px 10px;min-height:34px}.feedback-entry svg{width:13px;height:13px}.bottom-credit{gap:8px}.feedback-intro{font-size:12px}.feedback-form>label{font-size:12px}}
@media(max-width:400px){.settings-selects{grid-template-columns:minmax(0,1fr)}.video-settings{padding:13px}}
/* More scenes keep readable cards, with native touch/trackpad scrolling. */
.scene-list{min-width:0;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:#ffffff45 transparent;overscroll-behavior-x:contain;padding:3px 0 5px;mask-image:linear-gradient(90deg,transparent,#000 18px,#000 calc(100% - 18px),transparent)}
.scene-list .scene-tile{flex:0 0 145px;scroll-snap-align:start;min-width:0}
.scene-list .scene-tile:hover{transform:none}.scene-list .scene-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.scene-next{flex-shrink:0}.dock-label{flex-shrink:0}
.track-copy button{max-width:190px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:850px){.scene-list .scene-tile{flex-basis:130px}}
@media(max-width:600px){.scene-list{display:flex;gap:5px}.scene-list .scene-tile{flex:0 0 78px;padding:5px 4px 8px}.scene-list .scene-tile img{width:68px;height:45px}.scene-list .scene-label{white-space:normal;overflow:visible}.scene-next{display:grid;place-items:center;margin-right:3px;width:27px;height:27px}.scene-dock{gap:6px}}