/* The directory shares the room's warm paper and lavender palette. */
#home-page{max-width:1384px;padding:58px 64px 64px}
.home-welcome{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:38px}
.home-welcome h1{font:normal clamp(38px,4.2vw,60px)/1.12 var(--font-ui);letter-spacing:-2px;margin:0 0 18px;color:#292951}
.home-welcome h1 em{color:#8971ab;font-weight:400}
.home-welcome p{font-size:14px;color:#777083;line-height:1.8;margin:0;max-width:450px}
.home-welcome .home-note{font:italic 16px/1.6 var(--font-ui);color:#8b7e98;text-align:right;max-width:185px;padding-bottom:4px}
.continue-session{display:flex;align-items:center;gap:15px;padding:17px 20px;margin-bottom:30px;border:1px solid #dcd4e5;border-radius:14px;background:#f0ecf5;color:#514464}
.continue-icon{width:35px;height:35px;border-radius:50%;background:#e5ddee;display:grid;place-items:center;flex-shrink:0}
.continue-icon svg{width:17px;height:17px}
.continue-copy{display:flex;flex-direction:column;gap:6px;min-width:0}
.continue-copy strong{font-size:13px;font-weight:600}.continue-copy span{font-size:11px;color:#776a86;font-variant-numeric:tabular-nums}
.continue-session>a{margin-left:auto;font-size:12px;white-space:nowrap;padding:10px 0 10px 15px}
.directory-heading{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-bottom:18px}
.directory-heading h2{font:normal 21px var(--font-ui);margin:0;color:#393451}
.directory-heading a{font-size:11px;color:#736185;padding:8px 0}
.home-spaces{display:grid;grid-template-columns:minmax(0,1.72fr) minmax(0,1fr);gap:22px;align-items:stretch}
.home-card{border-radius:20px;border:1px solid #ded8e4;overflow:hidden;background:#fffdf8;min-width:0;box-shadow:0 8px 24px #28233f05}
.night-cover{display:block;position:relative;aspect-ratio:1.83;overflow:hidden;background:#171d32}
.night-cover img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.night-cover:hover img{transform:scale(1.025)}
.night-cover .home-preview-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.night-cover .cover-tag{z-index:2}
.night-cover:has(.home-preview-video) img,.night-cover:has(canvas) img{transform:none;transition:none}
.cover-tag{position:absolute;top:20px;left:20px;border:1px solid #ffffff40;background:#13182ba6;backdrop-filter:blur(12px);border-radius:20px;padding:8px 12px;font-size:10px;color:#eee6ff;letter-spacing:.2px}
.home-card-body{padding:25px 27px 23px}
.home-card h3{font:normal 29px var(--font-ui);letter-spacing:-.6px;margin:0 0 12px;color:#332e4b}
.home-card p{font-size:12px;line-height:1.8;color:#7b7186;margin:0}
.card-tags{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin-bottom:16px;color:#766985;font-size:10px}
.card-tags span{border:1px solid #e3dce9;border-radius:20px;padding:5px 9px;background:#f9f6fb}
.card-actions{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:22px}
.enter-space{display:inline-flex;align-items:center;justify-content:center;gap:24px;border-radius:30px;padding:13px 19px;background:#38314e;color:#faf7ff;font-size:12px;white-space:nowrap;border:1px solid #38314e;transition:background .2s}
.enter-space:hover{background:#544263}.enter-space svg{height:15px;width:15px}
.preview-sound{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:0;background:transparent;color:#776187;font-size:11px;padding:12px 0;min-height:40px}
.preview-sound svg{width:15px;height:15px;flex-shrink:0}.preview-sound[aria-pressed=true]{color:#473159}
.preview-sound[aria-pressed=true] .preview-play,.preview-sound:not([aria-pressed=true]) .preview-stop{display:none}
.preview-status{display:block;font-size:11px;line-height:1.5;color:#806989;margin-top:10px}.preview-status:empty{display:none}
.focus-card{display:flex;flex-direction:column;background:#eee9f2;border-color:#e0d7e8}
.focus-cover{position:relative;display:grid;place-items:center;flex:1;min-height:230px;padding:24px;overflow:hidden;background:radial-gradient(ellipse at 55% 55%,#fffafae0 0%,#eee5f38a 45%,#e7ddec 100%)}
.focus-cover:before,.focus-cover:after{content:'';position:absolute;width:300px;height:300px;border:1px solid #a993bf1c;border-radius:50%;pointer-events:none}.focus-cover:after{width:390px;height:390px}
.focus-dial{width:184px;height:184px;border:1px solid #b09bb44d;border-radius:50%;box-shadow:0 0 0 14px #ffffff26,0 12px 36px #85729113;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;background:#fcf7ff6b;color:#625075;position:relative}
.focus-dial svg{position:absolute;top:0;left:0;width:100%;height:100%;transform:rotate(-90deg);color:#9982aa;opacity:.65}
.focus-dial strong{font:normal 43px var(--font-ui);letter-spacing:-2px;font-variant-numeric:tabular-nums}.focus-dial span{font-size:9px;letter-spacing:2px;text-transform:uppercase}
.focus-card .home-card-body{padding-top:25px}.focus-card .enter-space{background:transparent;color:#594667;border-color:#cdbed8;width:100%;justify-content:space-between}.focus-card .enter-space:hover{background:#e6dcee}
.home-bottom-note{display:flex;align-items:center;justify-content:center;gap:10px;font-size:11px;color:#897e91;padding-top:30px;margin:0;text-align:center;line-height:1.8}.home-bottom-note svg{width:14px;height:14px;flex-shrink:0}
@media(max-width:1050px){#home-page{padding:42px 30px 48px}.home-welcome .home-note{display:none}.home-spaces{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr)}.night-cover{aspect-ratio:1.55}.home-card-body{padding:23px}.focus-cover{min-height:210px}.focus-dial{width:160px;height:160px}.card-actions{gap:10px}.enter-space{gap:15px}.preview-sound{font-size:10px}}
@media(max-width:740px){.home-spaces{grid-template-columns:1fr}.night-cover{aspect-ratio:1.8}.focus-card{display:grid;grid-template-columns:minmax(130px,.8fr) minmax(0,1.2fr)}.focus-cover{min-height:220px;padding:15px}.focus-card .home-card-body{padding:25px 20px}.focus-card h3{font-size:25px}.focus-card .card-tags{gap:5px}.focus-card .card-tags span{font-size:9px;padding:4px 6px}.focus-dial{width:134px;height:134px}.focus-dial strong{font-size:34px}}
@media(max-width:680px){header nav{gap:22px}#home-page{padding:32px 18px 40px}.home-welcome{margin-bottom:28px}.home-welcome h1{font-size:39px;letter-spacing:-1.5px}.home-welcome p{font-size:12px;max-width:310px}.directory-heading h2{font-size:20px}.directory-heading a{font-size:10px}.home-card-body{padding:22px}.continue-session{padding:14px;gap:10px;flex-wrap:wrap;margin-bottom:24px}.continue-copy strong{font-size:12px}.continue-session>a{font-size:11px;padding:8px 0}.cover-tag{top:14px;left:14px}.card-actions{margin-top:18px}.home-bottom-note{font-size:10px;padding-top:24px}}
@media(max-width:370px){header nav{gap:15px}.focus-card{grid-template-columns:1fr}.focus-cover{min-height:190px}.home-welcome h1{font-size:35px}.home-card-body{padding:18px}.card-actions{flex-wrap:wrap}.continue-session>a{margin-left:45px}.directory-heading{gap:10px}}
@media(prefers-reduced-motion:reduce){.night-cover img,.enter-space{transition:none}.night-cover:hover img{transform:none}}

/* Five environments and the timer form three balanced rows. */
.home-spaces{grid-template-columns:repeat(2,minmax(0,1fr))}
.home-card:not(.focus-card) .night-cover{aspect-ratio:1.83}
.quiet-label{font-size:11px;color:#718578}.green-card .enter-space{background:#214936;border-color:#214936}.green-card .enter-space:hover{background:#30634a}.green-card .card-tags span{background:#f1f6ef;border-color:#d9e5d9;color:#59745f}.green-card .cover-tag{background:#071710aa;border-color:#a8d7ba40;color:#d5ebdb}
@media(max-width:740px){.home-spaces{grid-template-columns:1fr}}
