@font-face{font-family:"Nunito";font-style:normal;font-weight:200 1000;font-display:swap;src:url(/fonts/nunito-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* Glimt: an evening sky (deep plum), warm amber light, paper for the rest. Colours from Glimt/App/Theme.swift. */
:root{color-scheme:light dark;
--page:#FBF7F2;--card:#FFFFFF;--ink:#2A1E3B;--muted:#6D6378;--line:#EAE1D6;--soft:#F4ECE2;--gap:#EFE8E0;
--accent:#E0892B;--accent-ink:#B5631A;--accent-soft:#FBEBD8;--plum:#4A3478;--night:#2A1E3B;--glow:#F5A54A;
--sky:radial-gradient(70% 90% at 78% 8%,rgba(245,165,74,.26),transparent 62%),radial-gradient(60% 70% at 10% 100%,rgba(156,131,240,.18),transparent 70%),linear-gradient(180deg,#4A3478 0%,#33244F 45%,#1E1630 100%);
--shadow:0 1px 2px rgba(42,30,59,.06),0 14px 34px -16px rgba(42,30,59,.28);
--round:"Nunito",ui-rounded,"SF Pro Rounded","Hiragino Maru Gothic ProN","Apple SD Gothic Neo",system-ui,sans-serif;
--sans:"Nunito",ui-rounded,-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,"Hiragino Sans","Apple SD Gothic Neo","Noto Sans",sans-serif}
@media (prefers-color-scheme:dark){:root{
--page:#141019;--card:#221C2B;--ink:#F4EEE6;--muted:#B3A9BE;--line:#352C40;--soft:#2A2233;--gap:#2C2535;
--accent:#F5A54A;--accent-ink:#F5A54A;--accent-soft:#3B2A16;
--shadow:0 1px 2px rgba(0,0,0,.3),0 14px 34px -16px rgba(0,0,0,.7)}}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--page);color:var(--ink);font:500 17px/1.6 var(--sans);overflow-x:hidden}
a{color:var(--accent-ink)}img{max-width:100%;height:auto}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:8px}
.skip{position:absolute;left:-999px}.skip:focus{left:16px;top:16px;background:var(--card);color:var(--ink);padding:8px 12px;border-radius:10px;z-index:10}
.wrap{max-width:1160px;margin:0 auto;padding:0 24px}.narrow{max-width:780px}
h1,h2,h3{font-family:var(--round);margin:0 0 .4em;font-weight:900;letter-spacing:-.025em;line-height:1.04}
h1{font-size:clamp(40px,5.6vw,72px);letter-spacing:-.035em}h2{font-size:clamp(32px,4.2vw,52px)}
h3{font-size:21px;font-weight:850;letter-spacing:-.01em;line-height:1.2}
h1 em,h2 em{font-style:normal;color:var(--accent)}
:lang(ko) h1,:lang(ko) h2,:lang(ko) h3,:lang(ko) .lead,:lang(ko) p{word-break:keep-all}
:lang(ja) h1,:lang(ja) h2,:lang(ko) h1,:lang(ko) h2{letter-spacing:-.01em;line-height:1.2}
:lang(ja) h1,:lang(ko) h1{font-size:clamp(34px,4.6vw,58px)}
:lang(ja){--round:"Nunito",ui-rounded,"Hiragino Maru Gothic ProN","Hiragino Sans","Yu Gothic","Noto Sans JP",sans-serif}
.lead{font-size:clamp(18px,1.9vw,21px);color:var(--muted);max-width:36em;margin:0}.muted{color:var(--muted);font-size:15px}

/* the evening sky: header + hero (home), header + title (other pages) */
.sky{position:relative;background:var(--sky);color:#FBF7F2;overflow:hidden;isolation:isolate}
.sky::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:70px;background:linear-gradient(transparent,rgba(20,16,25,.25));z-index:-1}
.stars{position:absolute;inset:0;z-index:-1;pointer-events:none}
.stars i{position:absolute;width:calc(var(--r)*2);height:calc(var(--r)*2);border-radius:50%;background:#FFF3DE;opacity:.55;animation:twinkle 5s ease-in-out var(--d) infinite}
@keyframes twinkle{50%{opacity:.12}}
.top .wrap{display:flex;align-items:center;gap:26px;height:76px}
.brand{display:flex;align-items:center;gap:10px;font:900 24px var(--round);letter-spacing:-.02em;color:#FBF7F2;text-decoration:none}
.brand img{border-radius:9px;box-shadow:0 0 0 1px rgba(255,255,255,.12),0 6px 18px -6px rgba(245,165,74,.7)}
.top nav{margin-left:auto;display:flex;gap:22px}.top nav a{color:rgba(251,247,242,.82);text-decoration:none;font-weight:750;font-size:16px}.top nav a:hover{color:#FFD596}
.pill{display:inline-flex;align-items:center;justify-content:center;background:var(--accent);color:#fff;border-radius:999px;padding:10px 18px;font-weight:800;font-size:15px;text-decoration:none;white-space:nowrap}
.pill.soon{background:rgba(245,165,74,.14);color:#FFD596;box-shadow:inset 0 0 0 1.5px rgba(245,165,74,.5)}
.page .pill.soon,main .pill:not(.big){background:var(--accent);color:#fff;box-shadow:none}
.pill.big{padding:15px 26px;font-size:17px}
.hero{padding:40px 0 96px}
.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:40px;align-items:center}
.hero h1{color:#FBF7F2}.hero h1 em{color:transparent;background:linear-gradient(180deg,#FFD596,#F5A54A 55%,#E0892B);-webkit-background-clip:text;background-clip:text}
.hero .lead{color:rgba(251,247,242,.8)}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin:30px 0 26px}
.more{color:#FBF7F2;font-weight:800;text-underline-offset:5px;text-decoration-color:rgba(245,165,74,.7)}
.facts{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:10px 22px;font-weight:750;font-size:15.5px;color:rgba(251,247,242,.88)}
.facts li{display:flex;align-items:center;gap:7px}.facts svg{width:18px;height:18px;color:#F5A54A;flex:none}
.hero-art{position:relative;display:grid;place-items:center;min-height:660px}
.hero-art>div{position:relative}
.glow{position:absolute;left:50%;top:50%;width:560px;height:560px;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(245,165,74,.34),rgba(245,165,74,.08) 45%,transparent 68%);z-index:0}
.glint{position:absolute;z-index:2;filter:drop-shadow(0 0 18px rgba(245,165,74,.6));animation:glint 4.5s ease-in-out infinite}
.glint.big{width:92px;left:-62px;top:46px}.glint.small{width:44px;right:-40px;top:-6px;animation-delay:-2s}
@keyframes glint{50%{transform:scale(.82) rotate(8deg);opacity:.8}}
.sky.slim{padding-bottom:44px}.sky.slim h1{font-size:clamp(36px,5vw,58px);color:#FBF7F2;margin:26px 0 0}

/* the phone and the app's own colours (fixed, whatever the site's scheme) */
.phone{position:relative;z-index:1;width:300px;height:618px;border-radius:50px;padding:10px;background:#0E0A14;box-shadow:0 0 0 1.5px #3A3046,0 40px 80px -30px rgba(0,0,0,.7),0 0 60px -10px rgba(245,165,74,.25)}
.phone.light{width:272px;height:540px;border-radius:46px;padding:9px;box-shadow:0 0 0 1.5px #3A3046,0 30px 60px -30px rgba(42,30,59,.55)}
.app{--a-paper:#FBF7F2;--a-card:#FFFFFF;--a-ink:#2A1E3B;--a-sec:#857B90;--a-gap:#EFE8E0;--a-accent:#E0892B;--a-soft:#FBEBD8;
height:100%;border-radius:40px;overflow:hidden;background:var(--a-paper);color:var(--a-ink);font:600 12px/1.3 var(--round);padding:0 12px 12px;display:flex;flex-direction:column;letter-spacing:0}
.phone.light .app{border-radius:37px}
.app.dark{--a-paper:#141019;--a-card:#221C2B;--a-ink:#F4EEE6;--a-sec:#9C93A8;--a-gap:#2C2535;--a-accent:#F5A54A;--a-soft:#3B2A16}
.app svg{width:13px;height:13px;flex:none}
.status{position:relative;display:flex;align-items:center;justify-content:space-between;height:40px;padding:2px 14px 0;font-size:12.5px;flex:none}
.island{position:absolute;left:50%;top:9px;width:84px;height:24px;margin-left:-42px;border-radius:14px;background:#000}
.sb-icons{display:flex;align-items:center;gap:3px}.sb-icons i{width:3px;height:9px;border-radius:1px;background:currentColor}.sb-icons i:nth-child(1){height:5px}.sb-icons i:nth-child(2){height:7px}
.batt{width:20px;height:10px;border-radius:3px;margin-left:4px;box-shadow:inset 0 0 0 1.2px currentColor;position:relative}.batt::after{content:"";position:absolute;inset:2px 5px 2px 2px;border-radius:1.5px;background:currentColor}
.navbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:6px;padding:4px 2px 10px;flex:none}
.navbar b{font-size:12.5px;font-weight:800;white-space:nowrap}.nb-side{color:var(--a-accent);font-size:12px;display:flex}.nb-side:last-child{justify-content:flex-end}.nb-side.strong{font-weight:800}
.nb-side svg{width:16px;height:16px}
.btn{display:flex;align-items:center;justify-content:center;gap:6px;border-radius:999px;padding:9px 10px;font-weight:800;font-size:11.5px;white-space:nowrap;flex:none}
.btn.tinted{background:var(--a-soft);color:var(--a-accent)}.btn.solid{background:var(--a-accent);color:#fff}
.btn.small{font-size:12.5px;padding:9px 14px}

/* tiles: a day's picture, abstract warm light, never a person */
.tile{display:block;background:
 linear-gradient(transparent 63%,rgba(20,10,30,.14) 63.4%,rgba(20,10,30,.24)),
 radial-gradient(circle at var(--x) var(--y),var(--c) 0,color-mix(in srgb,var(--c) 45%,transparent) 12%,transparent 40%),
 linear-gradient(var(--g),var(--a),var(--b))}
.kb{animation:kb 3.2s ease-in-out infinite alternate}
@keyframes kb{to{transform:scale(1.1) translate(-3%,2%)}}

/* the day screen (hero) */
.preview{position:relative;width:68%;aspect-ratio:9/16;margin:0 auto;border-radius:18px;overflow:hidden;background:var(--a-gap);flex:none}
.preview .tile{position:absolute;inset:0}
.picked{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);display:flex;align-items:center;gap:4px;white-space:nowrap;padding:5px 10px;border-radius:999px;font-size:9.5px;font-weight:800;color:#fff;background:rgba(30,22,48,.42);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);animation:fade .5s 2.2s both}
.picked svg{width:11px;height:11px;color:#FFD596}
.trim{margin:12px 2px 0}.track{position:relative;display:block;height:4px;border-radius:2px;background:var(--a-gap)}
.track i{position:absolute;left:0;top:0;bottom:0;border-radius:2px;background:var(--a-accent)}
.track b{position:absolute;top:50%;width:17px;height:17px;margin:-8.5px 0 0 -8.5px;border-radius:50%;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.35)}
.trim-row{display:flex;justify-content:space-between;margin-top:9px;font-size:9.5px;color:var(--a-sec);font-weight:700}
.screen-day .btn{margin-top:11px}
.row-title{margin:13px 2px 7px;font-size:11.5px;font-weight:850}
.cands{display:flex;gap:6px}
.cand{position:relative;flex:0 0 52px;height:76px;border-radius:9px;overflow:hidden;background:var(--a-gap)}
.cand .tile{position:absolute;inset:0}
.cand::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 2.5px transparent;transition:box-shadow .3s}
.cand.on::after{box-shadow:inset 0 0 0 2.5px var(--a-accent,#E0892B)}
.badges{position:absolute;left:4px;bottom:4px;display:flex;gap:2px;color:#fff;filter:drop-shadow(0 1px 2px rgba(0,0,0,.6))}
.badges svg{width:10px;height:10px}
.screen-day .cand{animation:rise .45s both}
.screen-day .c0{animation-delay:.3s}.screen-day .c1{animation-delay:.55s}.screen-day .c2{animation-delay:.8s}.screen-day .c3{animation-delay:1.05s}.screen-day .c4{animation-delay:1.3s}
.screen-day .cand.on::after{animation:ring .4s 1.8s both}
@keyframes rise{from{opacity:0;transform:translateY(10px)}}
@keyframes fade{from{opacity:0}}
@keyframes ring{from{box-shadow:inset 0 0 0 2.5px transparent}}

/* sections */
.band{padding-top:110px}
.band>.wrap>h2{max-width:16em}
.kicker{display:inline-flex;align-items:center;gap:8px;margin:0 0 14px;padding:6px 14px 6px 10px;border-radius:999px;background:var(--accent-soft);color:var(--accent-ink);font-weight:850;font-size:14.5px}
.kicker svg{width:18px;height:18px}
.shows{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:40px}
.shows article{background:var(--card);border-radius:28px;padding:14px 14px 24px;box-shadow:var(--shadow)}
.shows article>h3{margin:20px 10px 6px}.shows article>p{margin:0 10px;color:var(--muted);font-size:16px}
.vis{position:relative;height:230px;border-radius:20px;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;
background:radial-gradient(90% 80% at 85% 0%,rgba(245,165,74,.22),transparent 65%),linear-gradient(160deg,#FBF1E4,#F3E9F7);color:#2A1E3B;font-family:var(--round)}
@media (prefers-color-scheme:dark){.vis{background:radial-gradient(90% 80% at 85% 0%,rgba(245,165,74,.16),transparent 65%),linear-gradient(160deg,#2B2131,#211A2E);color:#F4EEE6}}
.vis svg{width:14px;height:14px;flex:none}
.vis-cap{display:flex;align-items:center;gap:6px;margin:0;font-size:12.5px;font-weight:750;opacity:.7}

/* scan: frames sampled, scored, the best second kept */
.strip{position:relative;display:flex;gap:4px;padding:16px 10px 6px}
.frame{display:flex;flex-direction:column;align-items:center;gap:7px}
.frame .tile{width:30px;height:52px;border-radius:6px}
.score{display:block;width:8px;height:30px;border-radius:4px;background:rgba(127,110,140,.18);position:relative;overflow:hidden}
.score::after{content:"";position:absolute;left:0;right:0;bottom:0;height:calc(var(--s)*100%);background:var(--accent);border-radius:4px;transform-origin:bottom;animation:score 4.8s calc(var(--i)*.45s) ease-out infinite}
@keyframes score{0%,4%{transform:scaleY(0)}14%,92%{transform:scaleY(1)}100%{transform:scaleY(0)}}
.strip .head{position:absolute;top:8px;bottom:42px;left:10px;width:2px;border-radius:1px;background:#fff;box-shadow:0 0 8px 2px rgba(245,165,74,.8);animation:head 4.8s linear infinite}
@keyframes head{from{transform:translateX(0)}75%{transform:translateX(270px);opacity:1}76%,100%{transform:translateX(270px);opacity:0}}
.best{position:absolute;top:10px;left:calc(10px + 3*34px - 4px);width:calc(2*34px + 4px);height:64px;border-radius:10px;box-shadow:0 0 0 2.5px var(--accent);animation:best 4.8s ease infinite}
.best b{position:absolute;left:50%;top:-11px;transform:translateX(-50%);background:var(--accent);color:#fff;font-size:11px;font-weight:900;padding:1px 8px;border-radius:999px;white-space:nowrap}
@keyframes best{0%,58%{opacity:0;transform:scale(1.08)}66%,94%{opacity:1;transform:none}100%{opacity:0}}

/* face: one reference photo, the right child gets a tick */
.form-head{margin:0;font-size:11.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;opacity:.62}
:lang(ja) .form-head,:lang(ko) .form-head{letter-spacing:0;text-transform:none}
.face-row{display:flex;align-items:center;gap:10px}
.ref{width:66px;height:66px;border-radius:50%;overflow:hidden;box-shadow:0 0 0 3px #fff,0 6px 16px -6px rgba(42,30,59,.5)}
.ref .tile{width:100%;height:100%;display:grid;place-items:center;color:rgba(255,255,255,.92)}.ref .tile svg{width:32px;height:32px}
.vis .to{width:20px;height:20px;color:var(--accent)}
.vis .cands{gap:6px}.vis .cand{flex-basis:50px;height:74px}
.vis-face .cand .badges svg:nth-child(2){animation:pop 4s ease infinite}
.vis-face .cand:nth-child(3) .badges svg:nth-child(2){animation-delay:.5s}
.vis-face .cand.dim{opacity:.42;filter:saturate(.6)}
@keyframes pop{0%,10%{transform:scale(0)}20%,90%{transform:scale(1)}100%{transform:scale(0)}}

/* fill the missing days */
.mini-cal{display:grid;grid-template-columns:repeat(7,30px);gap:4px}
.mini-cal .cell{position:relative;height:42px;border-radius:6px;overflow:hidden;background:rgba(127,110,140,.16)}
.mini-cal .tile{position:absolute;inset:0}
.mini-cal .fill{animation:fillin 6s ease infinite}
.mini-cal .spark{position:absolute;right:2px;bottom:2px;width:10px;height:10px;color:#fff;filter:drop-shadow(0 1px 1px rgba(0,0,0,.5));animation:fillin 6s ease infinite}
.g1 .fill,.g1 .spark{animation-delay:.35s}.g2 .fill,.g2 .spark{animation-delay:.7s}.g3 .fill,.g3 .spark{animation-delay:1.05s}
@keyframes fillin{0%,18%{opacity:0;transform:scale(.6)}28%,90%{opacity:1;transform:none}100%{opacity:0}}
.vis .btn{background:var(--accent-soft);color:var(--accent-ink);font-family:var(--round)}
@media (prefers-color-scheme:dark){.vis .btn{background:#3B2A16;color:#F5A54A}}

/* the calendar and the film (panels) */
.panels{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:40px}
.panel{background:var(--card);border-radius:32px;padding:16px 16px 30px;box-shadow:var(--shadow)}
.panel-art{display:grid;place-items:center;padding:36px 16px;border-radius:24px;background:radial-gradient(80% 60% at 50% 0%,rgba(245,165,74,.26),transparent 70%),linear-gradient(180deg,#4A3478,#2A1E3B)}
.panel h3{margin:24px 14px 6px;font-size:24px}.panel>p{margin:0 14px;color:var(--muted)}
.points{list-style:none;padding:0;margin:16px 14px 0;display:grid;grid-template-columns:1fr 1fr;gap:8px 16px;font-weight:700;font-size:15.5px}
.points li{display:flex;gap:8px;align-items:flex-start}.points svg{width:18px;height:18px;flex:none;color:var(--accent);margin-top:3px}
.month-head{display:flex;align-items:center;justify-content:space-between;padding:6px 4px 12px;color:var(--a-accent)}
.month-head b{color:var(--a-ink);font-size:16px;font-weight:900}.month-head svg{width:15px;height:15px}.month-head .off{opacity:.3}
.wd{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;text-align:center;font-size:9.5px;color:var(--a-sec);font-weight:800;margin-bottom:5px}
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.cc{position:relative;aspect-ratio:.7;border-radius:7px;overflow:hidden;background:var(--a-gap)}
.cc.empty{background:none}.cc.future{opacity:.35}
.cc .tile{position:absolute;inset:0}
.cc b{position:absolute;left:3px;top:2px;font-size:8.5px;font-weight:900;color:#fff;text-shadow:0 0 3px rgba(0,0,0,.55)}
.cc.gap b{color:var(--a-sec);text-shadow:none}
.cc .spark{position:absolute;right:2px;bottom:2px;width:9px;height:9px;color:#fff;filter:drop-shadow(0 0 1.5px rgba(0,0,0,.6))}
.cc.today{overflow:visible}.cc.today::after{content:"";position:absolute;inset:-2px;border-radius:9px;box-shadow:0 0 0 2.2px var(--a-accent)}
.cc.today .tile{border-radius:7px}
.sum{margin:12px 2px 10px;font-size:10.5px;color:var(--a-sec);font-weight:700}
.screen-cal .btn+.btn{margin-top:7px}
.film{position:relative;width:76%;aspect-ratio:9/16;margin:auto auto 0;border-radius:18px;overflow:hidden;background:#000;flex:none}
.ff{position:absolute;inset:0;opacity:0;animation:second 6s steps(1,end) infinite}
.ff .tile{position:absolute;inset:0;animation:kb 1s linear infinite alternate}
.f1{animation-delay:1s}.f2{animation-delay:2s}.f3{animation-delay:3s}.f4{animation-delay:4s}.f5{animation-delay:5s}
@keyframes second{0%{opacity:1}16.66%,100%{opacity:0}}
.date{position:absolute;left:9px;bottom:14px;color:#fff;font-size:10.5px;font-weight:900;text-shadow:0 1px 4px rgba(0,0,0,.6)}
.playbar{position:absolute;left:9px;right:9px;bottom:6px;height:2.5px;border-radius:2px;background:rgba(255,255,255,.3)}
.playbar i{position:absolute;left:0;top:0;bottom:0;width:100%;border-radius:2px;background:#fff;transform-origin:left;animation:play 6s linear infinite}
@keyframes play{from{transform:scaleX(0)}}
.film-btns{display:flex;gap:7px;margin:16px 0 auto}.film-btns .btn{flex:1;font-size:10.5px;padding:9px 6px}

/* evening */
.vis-remind{background:radial-gradient(80% 60% at 50% 120%,rgba(245,165,74,.7),transparent 70%),linear-gradient(180deg,#4A3478,#2A1E3B);color:#fff;justify-content:flex-start;padding-top:26px}
.clock{font:300 52px/1 var(--round);letter-spacing:-.02em;color:rgba(255,255,255,.95)}
.notif{display:flex;gap:9px;align-items:flex-start;width:calc(100% - 28px);padding:10px 12px;border-radius:18px;background:rgba(251,247,242,.82);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);color:#2A1E3B;font-size:12.5px;line-height:1.3;animation:drop 5s ease infinite}
.notif img{width:30px;height:30px;border-radius:7px;flex:none}.notif p{margin:0}.notif div{flex:1}
.n-top{display:flex;justify-content:space-between;gap:8px;margin-bottom:2px!important}.n-top span{color:#857B90;font-size:11px}
@keyframes drop{0%,6%{opacity:0;transform:translateY(-14px)}14%,92%{opacity:1;transform:none}100%{opacity:0}}
.vis-camera{flex-direction:row;gap:18px}
.viewfinder{position:relative;width:118px;height:188px;border-radius:16px;overflow:hidden;box-shadow:0 10px 24px -12px rgba(42,30,59,.6)}
.viewfinder>.tile{position:absolute;inset:-6px}
.rec{position:absolute;top:8px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:4px;padding:2px 7px;border-radius:6px;background:rgba(0,0,0,.35);color:#fff;font-size:10.5px;font-weight:800;font-variant-numeric:tabular-nums}
.rec i{width:6px;height:6px;border-radius:50%;background:#FF453A;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.shutter{position:absolute;left:50%;bottom:10px;width:44px;height:44px;margin-left:-22px}
.shutter svg{width:44px;height:44px;transform:rotate(-90deg)}.shutter .ring{fill:none;stroke:#fff;stroke-width:3.5}
.shutter .prog{fill:none;stroke:#FF453A;stroke-width:3.5;stroke-dasharray:100;animation:rec 3s linear infinite}
.shutter>i{position:absolute;inset:12px;border-radius:5px;background:#FF453A}
@keyframes rec{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}
.vis-length{gap:12px;padding:0 18px}
.recent{display:flex;gap:3px;width:100%;max-width:280px}.recent .tile{flex:1;aspect-ratio:.62;border-radius:4px}
.recent .tile.miss{background:rgba(127,110,140,.18)}
.form{width:100%;max-width:280px;background:#fff;border-radius:12px;padding:11px 14px;box-shadow:0 1px 2px rgba(42,30,59,.08)}
.form-row{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:13.5px;font-weight:700;color:#2A1E3B}
.val{display:flex;align-items:center;gap:3px;color:#E0892B;white-space:nowrap}
@media (prefers-color-scheme:dark){.form{background:#221C2B}.form-row{color:#F4EEE6}.val{color:#F5A54A}}
.form-foot{margin:0;max-width:280px;width:100%;padding:0 14px;font-size:11.5px;opacity:.65;line-height:1.35}

/* private + price */
.duo{display:grid;grid-template-columns:1.1fr 1fr;gap:20px;align-items:stretch;padding-top:110px;padding-bottom:16px}
.duo section{border-radius:34px;padding:42px}
.night{position:relative;overflow:hidden;color:#FBF7F2;background:var(--sky)}
.night h2{color:#FBF7F2}.night h2 em{color:#F5A54A}.night p{color:rgba(251,247,242,.84);max-width:32em}
.night .lock{width:34px;height:34px;color:#F5A54A;margin-bottom:14px}
.nots{list-style:none;padding:0;margin:20px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:8px 16px;font-weight:750}
.nots li{display:flex;align-items:center;gap:8px}.nots svg{width:20px;height:20px;flex:none;color:#F5A54A}
.night .fine{margin:22px 0 0;font-size:14.5px;color:rgba(251,247,242,.66)}
.card-panel{background:var(--card);box-shadow:var(--shadow)}.card-panel p{color:var(--muted)}
.icons{display:flex;gap:14px;margin-top:22px}.icons img{width:60px;border-radius:14px;box-shadow:0 6px 14px -8px rgba(42,30,59,.6)}

/* faq */
.faq-band{padding-bottom:96px}.faq-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:48px;align-items:start}
.faq details{border-bottom:2px solid var(--line);padding:18px 0}.faq details:first-child{padding-top:4px}
.faq summary{font-weight:850;cursor:pointer;font-size:18.5px;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;font-family:var(--round)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;width:32px;height:32px;border-radius:50%;background:var(--accent-soft);color:var(--accent-ink);display:grid;place-items:center;font-weight:900;font-size:21px;line-height:1}
.faq details[open] summary::after{content:"\2212"}.faq p{color:var(--muted);margin:10px 0 0}

/* other pages */
.wrap.page{padding:48px 24px 80px}.wrap.page h2{font-size:27px;margin-top:40px}.tips li{margin:8px 0}
.page .lead a{font-weight:800}

/* footer (layout B) */
.site-footer{border-top:2px solid var(--line);padding:34px 0 40px;font-size:15px;color:var(--muted)}
.footer-top{display:flex;justify-content:space-between;gap:30px}
.footer-brand{display:inline-flex;align-items:center;gap:8px;color:var(--ink);font-weight:850;text-decoration:none;font-family:var(--round)}
.footer-brand img{filter:grayscale(1);opacity:.5;border-radius:5px;box-shadow:0 0 0 1px var(--line)}.footer-brand:hover img{filter:none;opacity:1}
.footer-tagline,.footer-made{margin:6px 0 0}.footer-made a{color:inherit;text-decoration:none}.footer-made a:hover,.footer-made a:focus{color:var(--ink);text-decoration:underline}
.footer-side{display:flex;flex-direction:column;align-items:flex-end;gap:14px}
.footer-links{display:flex;gap:18px;flex-wrap:wrap;justify-content:flex-end}.footer-links a{color:var(--muted)}
details.language{position:relative}
details.language summary{list-style:none;display:flex;align-items:center;gap:7px;cursor:pointer;color:var(--ink);font-weight:750}
details.language summary::-webkit-details-marker{display:none}details.language summary svg{width:18px;height:18px}details.language .chevron{width:14px;height:14px}
details.language ul{position:absolute;right:0;bottom:calc(100% + 8px);list-style:none;margin:0;padding:6px;background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:0 18px 40px rgba(0,0,0,.16);min-width:200px;max-height:70vh;overflow:auto;z-index:5}
details.language li a{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 12px;border-radius:10px;color:var(--ink);text-decoration:none}
details.language li a:hover{background:var(--soft)}details.language li svg{width:16px;height:16px;color:var(--accent)}

/* small screens */
@media (max-width:1060px){.shows{grid-template-columns:1fr 1fr}.panels{grid-template-columns:1fr}}
@media (max-width:900px){.hero-grid,.duo,.faq-grid{grid-template-columns:1fr}.hero{padding-top:16px}.faq-grid{gap:8px}.hero-art{min-height:0;padding:20px 0 10px}}
@media (max-width:760px){.footer-top{flex-direction:column}.footer-side{align-items:flex-start}.footer-links{justify-content:flex-start}details.language ul{left:0;right:auto}.top nav{display:none}.top .pill{margin-left:auto}}
@media (max-width:640px){.wrap{padding:0 16px}.wrap.page{padding:40px 16px 64px}.shows{grid-template-columns:1fr}.band{padding-top:76px}.duo{padding-top:76px}.duo section{padding:30px 22px}
.nots,.points{grid-template-columns:1fr}.panel{padding:12px 12px 24px;border-radius:26px}.panel-art{padding:24px 8px}.glint.big{left:-30px;width:64px}.glint.small{right:-14px}.glow{width:380px;height:380px}}
@media (max-width:360px){.phone{width:280px;height:600px}.phone.light{width:260px}}

/* still for people who'd rather not have motion */
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}
.ff{opacity:0}.ff.f3{opacity:1}html{scroll-behavior:auto}}
