:root{--bg: #0d1220;--bg2: #161d33;--ink: #eef1f8;--mute: #8f97b3;--line: #2a3352;--yellow: #ffcb05;--red: #ff5a5f;--teal: #3dd6d0;--spring: cubic-bezier(.2, 1.3, .4, 1);--out: cubic-bezier(.2, .8, .2, 1);color-scheme:dark;font-family:"M PLUS Rounded 1c",Hiragino Maru Gothic ProN,Hiragino Sans,system-ui,sans-serif;font-weight:500;color:var(--ink);background:var(--bg);-webkit-tap-highlight-color:transparent}*{box-sizing:border-box}body{margin:0;min-height:100dvh;background:radial-gradient(120% 60% at 50% -10%,#24305a 0%,transparent 60%),radial-gradient(80% 50% at 100% 110%,#3a1d3c55 0%,transparent 70%),var(--bg);background-attachment:fixed}button{font:inherit;color:inherit;cursor:pointer}.screen{max-width:480px;margin:0 auto;min-height:100dvh;padding:calc(env(safe-area-inset-top) + 20px) 20px calc(env(safe-area-inset-bottom) + 24px);display:flex;flex-direction:column}.title{font-weight:800;font-size:2.1rem;line-height:1.15;letter-spacing:.02em;margin:0;text-align:center}.title.small{font-size:1.35rem}h2{font-size:.78rem;letter-spacing:.12em;color:var(--mute);margin:18px 0 8px}.btn{border:1px solid var(--line);background:var(--bg2);border-radius:999px;padding:14px 22px;font-weight:800;font-size:1rem;transition:transform .18s var(--out),opacity .2s,background .2s;touch-action:manipulation}.btn:active:not(:disabled){transform:scale(.95)}.btn:disabled{opacity:.35;cursor:default}.btn.primary{background:var(--yellow);border-color:var(--yellow);color:#1b1600;box-shadow:0 6px 24px #ffcb0533}.btn.big{width:100%;padding:18px;font-size:1.15rem}.icon-btn{border:0;background:none;width:40px;height:40px;border-radius:50%;font-size:1.1rem;color:var(--mute)}.gate{justify-content:center;align-items:center;gap:28px}.gate-card{perspective:900px}.cardback{width:140px;aspect-ratio:63 / 88;border-radius:10px;background:radial-gradient(circle at 50% 50%,#fff 0 9%,#1b2340 9% 12.5%,transparent 12.5%),linear-gradient(#1b2340,#1b2340) center / 100% 7% no-repeat,radial-gradient(circle at 50% 50%,transparent 0 32%,#1b2340 32% 35%,transparent 35%),linear-gradient(180deg,var(--red) 0 50%,var(--ink) 50%);border:6px solid #2f3d75;box-shadow:0 20px 50px #0008,inset 0 0 0 2px #0003;animation:float 3.2s ease-in-out infinite;position:relative;overflow:hidden}.cardback span{position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,#fff6 45%,transparent 60%);transform:translate(-120%);animation:sheen 3.2s ease-in-out infinite}@keyframes float{50%{transform:translateY(-10px) rotateY(10deg) rotateX(4deg)}}@keyframes sheen{60%,to{transform:translate(120%)}}.gate-form{width:100%;max-width:300px;display:grid;grid-template-columns:minmax(0,1fr);gap:12px;text-align:center}.gate-form label{font-size:.85rem;letter-spacing:.3em;color:var(--mute)}.gate-form input{width:100%;min-width:0;font:inherit;font-size:1.3rem;font-weight:800;text-align:center;letter-spacing:.15em;color:var(--ink);background:#0008;border:2px solid var(--line);border-radius:16px;padding:14px;outline:none;transition:border-color .2s}.gate-form input:focus{border-color:var(--yellow)}.gate-msg{min-height:1.4em;margin:0;color:var(--red)}.shake{animation:shake .45s}@keyframes shake{20%,60%{transform:translate(-10px)}40%,80%{transform:translate(10px)}}.unlocking .cardback{animation:unlock .75s var(--out) forwards}.unlocking .gate-form,.unlocking .title{transition:opacity .4s,transform .4s var(--out);opacity:0;transform:translateY(16px)}@keyframes unlock{40%{transform:rotateY(180deg) scale(1.1)}to{transform:rotateY(360deg) scale(6);opacity:0}}.home{gap:8px}.home-head .title{text-align:left}.today{display:grid;gap:14px;padding:8px 0 28px}.session-bar{height:8px;border-radius:99px;background:var(--line);overflow:hidden}.session-bar i{display:block;height:100%;width:var(--p, 0%);border-radius:inherit;background:linear-gradient(90deg,var(--teal),var(--yellow));transition:width .6s var(--spring)}.chips{display:flex;flex-wrap:wrap;gap:8px}.chip{border:1.5px solid var(--line);background:transparent;border-radius:999px;padding:9px 14px;font-weight:800;font-size:.9rem;display:inline-flex;gap:6px;align-items:baseline;transition:background .2s,border-color .2s,color .2s,transform .25s var(--spring);touch-action:manipulation}.chip small{color:var(--mute);font-size:.72rem}.chip:active{transform:scale(.92)}.chip[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--bg)}.chip[aria-pressed=true] small{color:#0d122099}.hand{position:relative;height:236px;margin:4px 0 0}.hand-card{--w: 118px;position:absolute;left:50%;bottom:34px;width:var(--w);aspect-ratio:868 / 1212;margin-left:calc(var(--w) / -2);border-radius:6px;overflow:hidden;box-shadow:0 12px 30px #000b;transform-origin:50% 140%;transform:translate(calc(var(--k) * 30px)) rotate(calc(var(--k) * 8deg)) translateY(calc(var(--k) * var(--k) * 4px))}.hand-card img{width:100%;height:100%;object-fit:cover;display:block}.hand-card .mask{position:absolute;left:3%;right:3%;top:6.6%;height:8.4%;background:#000;border-radius:3px}.hand.deal .hand-card{animation:deal-in .7s var(--spring) calc(var(--i) * 70ms) both}@keyframes deal-in{0%{transform:translateY(60px) rotate(0) scale(.9);opacity:0}}.deck-mix{margin:0;display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:4px 14px;color:var(--mute);font-size:.9rem}.deck-mix b{color:var(--ink);font-size:1.6rem;font-weight:800;margin-right:2px}.deck-mix b small{font-size:.9rem;margin-left:1px}.deck-settings{border:1.5px solid var(--line);background:transparent;border-radius:14px;padding:12px 64px 12px 14px;text-align:left;position:relative;display:grid;gap:2px;font-size:.82rem;color:var(--mute)}.deck-settings span:first-child{color:var(--ink);font-weight:800;font-size:.92rem}.deck-settings em{position:absolute;right:14px;top:50%;transform:translateY(-50%);font-style:normal;font-weight:800;color:var(--yellow)}.deck-settings:active{background:var(--bg2)}.collection-head{display:flex;justify-content:space-between;align-items:baseline}.collection-head p{margin:0;color:var(--mute);font-size:.85rem}.collection-head b{color:var(--ink);font-size:1.15rem}.binder{display:grid;grid-template-columns:repeat(auto-fill,minmax(13px,1fr));gap:3px}.binder button,.legend i{--c: var(--line);border:0;padding:0;aspect-ratio:63 / 88;border-radius:2px;background:var(--c)}.binder button[data-off]{opacity:.25}.binder [data-lv="1"],.legend [data-lv="1"] i{--c: #6b5a1c}.binder [data-lv="2"],.legend [data-lv="2"] i{--c: var(--yellow)}.binder [data-lv="3"],.legend [data-lv="3"] i{--c: var(--teal)}.legend{list-style:none;padding:0;margin:10px 0 0;display:flex;gap:14px;font-size:.72rem;color:var(--mute)}.legend li{display:flex;align-items:center;gap:5px}.legend i{width:9px}.sheet{border:0;inset:auto 0 0;margin:0 auto;width:min(100%,480px);max-width:none;max-height:88dvh;padding:8px 20px calc(env(safe-area-inset-bottom) + 20px);border-radius:22px 22px 0 0;background:var(--bg2);color:var(--ink)}.sheet:before{content:"";display:block;width:40px;height:4px;border-radius:2px;background:var(--line);margin:4px auto 6px}.sheet::backdrop{background:#05070dcc}.sheet[open]{animation:sheet-up .4s var(--spring)}@keyframes sheet-up{0%{transform:translateY(100%)}}.sheet .btn{margin-top:22px}.chips-note{flex-basis:100%;margin:2px 0 0;font-size:.72rem;color:var(--mute)}.dex{margin-top:18px}.dex-grid{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.dex-item{border:0;background:none;padding:0;width:100%;text-align:left;display:grid;gap:4px}.dex-item img{width:100%;height:auto;border-radius:6px;background:var(--bg2);transition:transform .25s var(--spring)}.dex-item:active img{transform:scale(.94)}.dex-item span{font-size:.68rem;line-height:1.3}.pips{font-style:normal;font-size:.55rem;letter-spacing:.15em;color:var(--yellow)}.zoom{border:0;padding:0;background:none;max-width:min(92vw,440px);color:var(--ink);text-align:center}.zoom::backdrop{background:#05070ddd;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.zoom[open]{animation:pop .4s var(--spring)}.zoom img{width:100%;border-radius:14px;display:block}.zoom p{font-weight:800;font-size:1.2rem;display:grid;gap:4px}.zoom small{font-weight:500;font-size:.75rem;color:var(--mute)}@keyframes pop{0%{transform:scale(.85);opacity:0}}.session{gap:14px;overflow:hidden}.session-head{display:flex;align-items:center;gap:12px}.session-bar{flex:1}.count{font-size:.8rem;color:var(--mute);min-width:3.5em;text-align:right;font-variant-numeric:tabular-nums}.stage{flex:1;display:grid;place-items:center;perspective:1400px;min-height:0}.flash{--yes: 0;--no: 0;position:relative;width:min(88vw,58dvh * .716,400px);aspect-ratio:868 / 1212;touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab;transition:transform .3s var(--out)}.flash.spread{width:min(94vw,64dvh * 1.432,460px);aspect-ratio:868 / 606}.flash.dragging{transition:none;cursor:grabbing}.flash.enter{animation:deal .5s var(--spring)}@keyframes deal{0%{transform:translateY(40px) scale(.9) rotate(-4deg);opacity:0}}.face{position:absolute;inset:0;border-radius:4.5%/3.2%;overflow:hidden;box-shadow:0 24px 60px #000a}.face img{width:100%;height:100%;display:block;pointer-events:none}.face:after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,#fff5 48%,transparent 62%);transform:translate(-130%);pointer-events:none}.flipped .face:after{animation:glint .9s .15s ease-out forwards}@keyframes glint{to{transform:translate(130%)}}.mask{position:absolute;left:3%;right:3%;top:var(--mask-top, 6.6%);height:var(--mask-h, 8.4%);border-radius:6px;background:#000;display:grid;place-items:center;font-weight:800;letter-spacing:.3em;color:var(--yellow);font-size:clamp(.8rem,3.6vw,1.05rem);box-shadow:0 2px 10px #0008;transform-origin:left center;transition:clip-path .45s var(--out),opacity .3s .2s;clip-path:inset(0 0 0 0 round 6px)}.spread .mask{left:1.5%;right:52%;top:4%;height:9%}.spread .mask.side{height:auto;border-radius:4px}.spread .mask.l{inset:14% 89% 22% 1%}.spread .mask.r{inset:22% 1% 12% 89%}.flipped .mask{clip-path:inset(0 0 0 100% round 6px);opacity:0}.stamp{position:absolute;top:12%;padding:6px 14px;border:3px solid;border-radius:10px;font-weight:800;font-size:1.3rem;background:#0d1220cc;pointer-events:none;z-index:2}.stamp.yes{left:8%;color:var(--teal);transform:rotate(-14deg);opacity:var(--yes)}.stamp.no{right:8%;color:var(--red);transform:rotate(14deg);opacity:var(--no)}.show-yes{--yes: 1}.show-no{--no: 1}.answer{min-height:2.4em;margin:0;text-align:center;font-weight:800;font-size:clamp(1.3rem,6.4vw,1.8rem);line-height:1.2;display:flex;flex-wrap:wrap;justify-content:center;align-items:center}.answer span{display:inline-block;opacity:0;transform:translateY(.5em) scale(.8)}.answer.in span{opacity:1;transform:none;transition:opacity .3s calc(.18s + var(--i) * 35ms),transform .5s var(--spring) calc(.18s + var(--i) * 35ms)}.actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}.session .reveal{grid-column:1 / -1}.session:not(.revealed) .again,.session:not(.revealed) .got,.session.revealed .reveal{display:none}.session.revealed .again,.session.revealed .got{animation:pop .35s var(--spring)}.session:not(.revealed) .hint{visibility:hidden}.session .btn.again{color:var(--red)}.hint{margin:0;text-align:center;font-size:.72rem;color:var(--mute)}.result{align-items:center;text-align:center;gap:10px;padding-top:calc(env(safe-area-inset-top) + 48px)}.score{position:relative;width:160px;height:160px;display:grid;place-items:center}.score svg{position:absolute;inset:0;transform:rotate(-90deg)}.score circle{fill:none;stroke:var(--line);stroke-width:10}.score .arc{stroke:var(--yellow);stroke-linecap:round;stroke-dasharray:326.7;stroke-dashoffset:calc(326.7 * (1 - var(--p) / 100));animation:arc 1.2s var(--out) both}@keyframes arc{0%{stroke-dashoffset:326.7}}.score b{font-size:3rem;font-weight:800}.sub{color:var(--mute);margin:0 0 8px}.result h2{align-self:stretch;text-align:left}.missed{list-style:none;padding:0;margin:0 0 18px;align-self:stretch;display:grid;gap:8px}.missed li{display:flex;align-items:center;gap:12px;background:var(--bg2);border-radius:12px;padding:8px;text-align:left;font-weight:800;animation:slidein .45s var(--spring) calc(.4s + var(--i) * .05s) both}.missed img{width:44px;border-radius:4px}@keyframes slidein{0%{opacity:0;transform:translate(-20px)}}.result .actions{align-self:stretch;grid-template-columns:1fr;margin-top:auto}.confetti{position:fixed;left:50%;top:28%;pointer-events:none}.confetti i{position:absolute;width:8px;height:12px;border-radius:2px;animation:burst 1.6s var(--out) var(--d) forwards}@keyframes burst{to{transform:translate(var(--x),calc(var(--y) + 260px)) rotate(var(--r));opacity:0}}::view-transition-old(root),::view-transition-new(root){animation-duration:.28s}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
