:root{--washi:var(--color-base-100);--washi-2:var(--color-base-200);--washi-3:var(--color-base-300);--sumi:var(--color-base-content);--sumi-soft:color-mix(in oklab, var(--color-base-content) 75%, var(--color-base-100));--shu:var(--color-primary);--shu-deep:color-mix(in oklab, var(--color-primary) 72%, var(--color-base-content));--kin:var(--color-accent);--kin-hi:color-mix(in oklab, var(--color-accent) 35%, var(--color-base-100));--f-tate:var(--font-serif);--f-punch:var(--font-sans);--f-ui:"Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", Meiryo, sans-serif;--ease:cubic-bezier(.22, 1, .36, 1);--pop:cubic-bezier(.34, 1.56, .64, 1);color-scheme:light}*{box-sizing:border-box}h1,p{margin:0}img,svg{max-width:100%}[hidden]{display:none!important}html,body{height:100%}body{background-color:var(--washi-2);background-image:var(--fiber,none), radial-gradient(ellipse at 50% 40%, var(--washi) 0%, var(--washi-2) 70%, var(--washi-3) 100%);color:var(--sumi);font-family:var(--f-ui);transition:background-color .6s var(--ease);-webkit-tap-highlight-color:transparent;background-size:320px 320px,cover;background-attachment:scroll,fixed;margin:0}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,input:focus-visible,a:focus-visible{outline:3px solid var(--shu);outline-offset:3px}.app{flex-direction:column;min-height:100%;padding-inline:16px;display:flex;position:relative;overflow-x:clip}.screen{z-index:2;flex-direction:column;flex:1;justify-content:center;align-items:center;display:flex;position:relative}.enso-layer{pointer-events:none;z-index:0;position:fixed;inset:0;overflow:clip}.enso{aspect-ratio:1;opacity:.07;background:conic-gradient(from 200deg, transparent 0 8%, var(--sumi) 12% 88%, transparent 95%);border-radius:50%;width:min(120vmin,1100px);animation:90s linear infinite spin;position:absolute;inset:50% auto auto 50%;translate:-50% -50%;-webkit-mask:radial-gradient(circle,#0000 58%,#000 60% 68%,#0000 71%);mask:radial-gradient(circle,#0000 58%,#000 60% 68%,#0000 71%)}body.fever{background-color:color-mix(in oklab, var(--shu) 16%, var(--washi))}body.fever .enso{opacity:.22;background:conic-gradient(from 200deg, transparent 0 8%, var(--shu) 12% 88%, transparent 95%);animation-duration:8s}@keyframes spin{to{rotate:360deg}}#fx{pointer-events:none;z-index:60;width:100%;height:100%;position:fixed;inset:0}.flash{background:var(--washi);opacity:0;pointer-events:none;z-index:55;position:fixed;inset:0}.flash.on{animation:.35s ease-out flash}@keyframes flash{0%{opacity:.8}to{opacity:0}}.shake{animation:shake var(--shake-t,.45s) cubic-bezier(.36,.07,.19,.97)}@keyframes shake{10%,90%{transform:translate(calc(var(--s,6px) * -.3), 1px)}20%,80%{transform:translate(calc(var(--s,6px) * .6), -2px)}30%,50%,70%{transform:translate(calc(var(--s,6px) * -1), 2px)}40%,60%{transform:translate(var(--s,6px), -1px)}}@keyframes ping{0%{opacity:.8;transform:scale(.9)}to{opacity:0;transform:scale(1.5)}}@keyframes bump{0%{transform:scale(1)}40%{transform:scale(1.25)}to{transform:scale(1)}}@keyframes popIn{0%{transform:scale(0)}}.tap{pointer-events:none;z-index:6;width:56px;height:56px;animation:tapMove 1.6s var(--ease) infinite;position:absolute}.tap:before{content:"";width:30px;height:30px;animation:ping 1.6s var(--ease) infinite;border:3px solid;border-radius:50%;position:absolute;top:2px;left:6px}.tap svg{width:36px;height:44px;position:absolute;top:10px;left:12px}@keyframes tapMove{0%,to{transform:translateY(6px)}40%{transform:translate(0)scale(.92)}}#title{gap:28px;padding-block:32px 40px}.title-row{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:clamp(24px,5vw,72px);width:min(100%,980px);display:grid}.title-copy{flex-direction:column;gap:18px;min-width:0;display:flex}.title-logo{width:min(100%,460px);height:auto;display:block}.back-logo{height:auto}.home-link{z-index:5;color:var(--sumi-soft);align-items:center;gap:6px;font-size:13px;text-decoration:none;display:inline-flex;position:absolute;top:12px;left:16px}.home-link:hover{color:var(--shu)}.title-tcg{flex-wrap:wrap;align-items:flex-end;gap:14px;display:flex}.tcg-mark{font-family:var(--f-punch);color:var(--shu);text-shadow:3px 3px 0 var(--sumi), 6px 6px 0 color-mix(in oklab, var(--sumi) 18%, transparent);transform-origin:0 100%;font-size:clamp(56px,9vw,104px);font-weight:900;line-height:.9;transform:rotate(-4deg)}.tcg-sub{font-family:var(--f-tate);font-size:clamp(15px,1.6vw,19px);font-weight:800;line-height:1.7}.title-lead{max-width:34em;color:var(--sumi-soft);margin:0;font-size:15px;line-height:1.9}.title-lead b{color:var(--sumi)}.opts{flex-wrap:wrap;align-items:center;gap:10px 18px;display:flex}.opt-group{align-items:center;gap:6px;display:flex}.opt-label{letter-spacing:.12em;color:var(--sumi-soft);margin-right:4px;font-size:12px}.chip{border:2px solid var(--sumi);background:var(--washi);font-family:var(--f-tate);border-radius:999px;padding:6px 14px;font-size:14px;font-weight:800;transition:background .15s,color .15s}.chip[aria-pressed=true]{background:var(--sumi);color:var(--washi)}.best{color:var(--sumi-soft);margin:0;font-size:13px;line-height:1.7}.best b{font-family:var(--f-punch);color:var(--shu);font-size:17px;font-weight:400}.pack-wrap{perspective:1000px;justify-items:center;gap:18px;display:grid;position:relative}.pack{aspect-ratio:5/8;width:clamp(200px,26vw,270px);transform-style:preserve-3d;filter:drop-shadow(0 22px 22px color-mix(in oklab, var(--sumi) 35%, transparent));background:0 0;border:0;padding:0;animation:3.6s ease-in-out infinite packFloat;display:block;position:relative}.pack:hover{animation-duration:1.4s}@keyframes packFloat{0%,to{transform:translateY(0)rotateY(-12deg)rotate(-2deg)}50%{transform:translateY(-12px)rotateY(12deg)rotate(2deg)}}.pack-body,.pack-top{background:linear-gradient(115deg, transparent 20%, color-mix(in oklab, var(--washi) 55%, transparent) 38%, transparent 46%, color-mix(in oklab, var(--washi) 25%, transparent) 58%, transparent 70%), repeating-linear-gradient(90deg, color-mix(in oklab, var(--washi) 6%, transparent) 0 2px, transparent 2px 6px), linear-gradient(160deg, var(--shu) 0%, var(--shu-deep) 55%, var(--sumi) 100%);background-size:250% 100%,auto,auto;border-radius:10px;animation:3.2s linear infinite foil;position:absolute;inset:0;overflow:hidden}.pack-top{clip-path:inset(0 0 86%);z-index:2;border-bottom:2px dashed color-mix(in oklab, var(--washi) 60%, transparent)}@keyframes foil{0%{background-position:150% 0,0 0,0 0}to{background-position:-150% 0,0 0,0 0}}.pack-enso{aspect-ratio:1;border:10px solid color-mix(in oklab, var(--washi) 90%, transparent);border-left-color:#0000;border-radius:50%;width:78%;position:absolute;top:24%;left:11%;rotate:-30deg}.pack-fox{width:62%;filter:drop-shadow(0 4px 0 color-mix(in oklab, var(--sumi) 25%, transparent));position:absolute;top:32%;left:18%}.pack-name{text-align:center;font-family:var(--f-punch);color:var(--washi);text-shadow:2px 2px 0 var(--sumi);font-size:clamp(20px,5vw,28px);font-weight:900;position:absolute;top:17%;left:0;right:0}.pack-cut{z-index:3;color:var(--washi);animation:cut 1.6s var(--ease) infinite;font-size:18px;position:absolute;top:5%;right:6%}@keyframes cut{0%,to{opacity:.4;transform:translate(0)}50%{opacity:1;transform:translate(-60px)}}.pack .tap{color:var(--shu);bottom:16%;right:-14px}.pack.shaking{animation:90ms linear infinite packShake}@keyframes packShake{0%{transform:translate(-3px,1px)rotate(-2deg)}50%{transform:translate(3px,-1px)rotate(2deg)}to{transform:translate(-3px,1px)rotate(-2deg)}}.pack.torn .pack-top{animation:tear .7s var(--ease) forwards}@keyframes tear{to{opacity:0;transform:translate(140px,-160px)rotate(38deg)}}.pack.torn .pack-body,.pack.torn .tap,.pack.torn .pack-cut{animation:packGone .6s .35s var(--ease) forwards}@keyframes packGone{to{opacity:0;transform:translateY(60px)scale(.9)}}.pack-beam{opacity:0;z-index:4;border-radius:50%;width:10px;height:10px;position:absolute;top:14%;left:50%;translate:-50% -50%}.pack.torn .pack-beam{animation:beam .9s var(--ease) forwards}@keyframes beam{0%{opacity:1;box-shadow:0 0 40px 20px var(--washi), 0 0 80px 40px var(--kin-hi)}to{opacity:0;box-shadow:0 0 260px 180px var(--washi), 0 0 400px 260px var(--kin-hi)}}.btn-main{border:3px solid var(--sumi);background:var(--shu);color:var(--washi);font-family:var(--f-punch);letter-spacing:.08em;box-shadow:0 6px 0 var(--sumi);border-radius:999px;padding:14px 34px;font-size:20px;font-weight:900;transition:transform .1s,box-shadow .1s;position:relative}.btn-main:hover{box-shadow:0 8px 0 var(--sumi);transform:translateY(-2px)}.btn-main:active{box-shadow:0 1px 0 var(--sumi);transform:translateY(5px)}.btn-main:after{content:"";border-radius:inherit;border:2px solid var(--shu);opacity:0;animation:ping 1.8s var(--ease) infinite;position:absolute;inset:-8px}@media (width<=640px){.title-row{text-align:center;grid-template-columns:minmax(0,1fr);justify-items:center}.title-copy{align-items:center}.title-tcg,.opts{justify-content:center}.pack{width:clamp(180px,46vw,230px)}}#play{height:calc(100svh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));justify-content:flex-start;padding-block:10px;overflow:clip}.play-col{--chrome:64px;min-height:0;width:min(100%, calc((100svh - var(--chrome)) * 2 / 3), 620px);flex:1;grid-template-rows:36px minmax(0,1fr);gap:8px;display:grid}.topbar{align-items:center;gap:12px;padding-inline:4px;display:flex}.topbar .dots{gap:6px}.topbar .dot{width:12px;height:12px}.card-area{min-height:0;position:relative}.stack{background:var(--sumi);transition:box-shadow .4s var(--ease), opacity .3s;border-radius:18px;position:absolute;inset:0 9px 14px 0}.card3d{perspective:1600px;transition:transform .6s var(--ease), opacity .4s;position:absolute;inset:0 9px 14px 0}.card3d.away{opacity:0;transition:none;transform:translateY(-30px)scale(.92)}.card3d.leave-ok{opacity:0;transition:transform .5s cubic-bezier(.5,0,.75,0),opacity .5s;transform:translate(60vw,-10vh)rotate(18deg)}.card3d.leave-ng{opacity:0;transition:transform .5s cubic-bezier(.5,0,.75,0),opacity .5s;transform:translate(-60vw,10vh)rotate(-18deg)}.card-inner{transform-style:preserve-3d;transition:transform .75s var(--pop);position:absolute;inset:0;transform:rotateY(180deg)}.card3d.flipped .card-inner{transform:rotateY(0)}.card3d:not(.flipped) .front,.card3d.flipped .back{pointer-events:none}.face{-webkit-backface-visibility:hidden;backface-visibility:hidden;border-radius:18px;position:absolute;inset:0;overflow:hidden}.back{background:var(--sumi);box-shadow:0 24px 40px color-mix(in oklab, var(--sumi) 35%, transparent);color:var(--washi);place-items:center;display:grid;transform:rotateY(180deg)}.back:before{content:"";border:1.5px solid color-mix(in oklab, var(--kin) 55%, transparent);border-radius:12px;position:absolute;inset:12px}.back-enso{aspect-ratio:1;border:14px solid var(--shu);border-left-color:#0000;border-bottom-color:color-mix(in oklab, var(--shu) 60%, transparent);border-radius:50%;width:62%;animation:14s linear infinite spin;position:absolute}.back-logo{filter:invert()sepia(.4)brightness(.96);width:56%;position:relative}.front{background:var(--sumi);box-shadow:0 24px 40px color-mix(in oklab, var(--sumi) 35%, transparent);padding:7px}.frame{background:var(--fiber,none), linear-gradient(to bottom, var(--washi), var(--washi-2));background-size:320px 320px,auto;border-radius:12px;grid-template-rows:minmax(0,1fr) auto auto;height:100%;display:grid;position:relative;overflow:hidden}.dots{flex-wrap:wrap;gap:5px;min-width:0;display:flex}.dot{border:1.5px solid var(--sumi);width:10px;height:10px;transition:background .3s, transform .3s var(--pop);border-radius:50%}.dot.now{background:var(--sumi);transform:scale(1.3)}.dot.ok{background:var(--shu);border-color:var(--shu)}.dot.ng{background:repeating-linear-gradient(45deg, var(--sumi) 0 2px, transparent 2px 4px)}.combo{font-family:var(--f-punch);color:var(--shu);white-space:nowrap;opacity:0;transition:opacity .2s, transform .3s var(--pop);font-size:15px;font-weight:900;transform:scale(.6)}.combo.on{opacity:1;transform:scale(1)}.combo b{font-size:22px;font-weight:400}.combo.punch{animation:punch .4s var(--pop)}@keyframes punch{0%{transform:scale(1.8)rotate(-8deg)}to{transform:scale(1)rotate(0)}}.score{font-family:var(--f-punch);font-variant-numeric:tabular-nums;margin-left:auto;font-size:26px;font-weight:900;line-height:1}.score.bump{animation:bump .35s var(--pop);color:var(--shu)}.card-body{z-index:1;scrollbar-width:none;direction:rtl;flex-direction:row;align-items:stretch;gap:6px;padding:22px 12px 12px;display:flex;position:relative;overflow:auto hidden}.card-body::-webkit-scrollbar{display:none}.card-body>*{direction:ltr}.q{writing-mode:vertical-rl;text-orientation:mixed;margin:var(--y,0px) auto 0;max-height:calc(100% - var(--y,0px));transform:rotate(var(--r,0deg));font-family:var(--f-tate);font-weight:600;font-size:calc(var(--qs,19px) * var(--z,1));--chip:calc(var(--qs,19px) * 1.4);color:color-mix(in oklab, var(--sumi) 85%, transparent);padding:calc(var(--chip) + 12px) 3px 8px;transition:color .15s, background .15s, transform .25s var(--pop), opacity .2s;background:0 0;border:0;border-radius:999px;flex-shrink:0;align-self:flex-start;line-height:1.45;position:relative}.q-chip{margin-left:calc(var(--chip) / -2);writing-mode:horizontal-tb;box-sizing:border-box;width:var(--chip);height:var(--chip);background:var(--shu);color:var(--washi);box-shadow:0 2px 0 var(--shu-deep);transition:transform .2s var(--pop), background .2s, color .2s, box-shadow .2s;border-radius:50%;place-items:center;display:grid;position:absolute;top:4px;left:50%}.q-chip svg{grid-area:1/1;width:52%;height:52%;display:block}.q-chip .i-stop,.q-chip .bars{display:none}.bars{grid-area:1/1;align-items:center;gap:9%;width:52%;height:52%;display:flex}.bars i{transform-origin:50%;background:currentColor;border-radius:2px;flex:1;height:100%;animation:.5s ease-in-out infinite alternate eq}.bars i:nth-child(2){animation-duration:.36s}.bars i:nth-child(3){animation-duration:.44s;animation-delay:-.2s}@keyframes eq{0%{transform:scaleY(.3)}to{transform:scaleY(1)}}.q:hover{color:var(--shu);transform:rotate(0)scale(1.04)}.q:hover .q-chip,.q:focus-visible .q-chip{transform:scale(1.18)}.q:active .q-chip{box-shadow:0 0 0 var(--shu-deep);transform:scale(.92)}.q.heard .q-chip{background:var(--washi);color:var(--shu);box-shadow:inset 0 0 0 2px var(--shu)}.q.playing{color:var(--shu);transform:rotate(0)scale(1.04)}.q.playing .q-chip{background:conic-gradient(var(--shu) calc(var(--p,0) * 1turn), color-mix(in oklab, var(--shu) 20%, transparent) 0);color:var(--shu);box-shadow:none;transform:scale(1.18)}.q.playing .q-chip:before{content:"";background:var(--washi);border-radius:50%;position:absolute;inset:3px}.q.playing .q-chip>*{z-index:1;position:relative}.q.playing .i-play{display:none}.q.playing .bars{display:flex}@media (hover:hover){.q.playing:hover .bars{display:none}.q.playing:hover .i-stop{display:block}}.q.loading .q-chip{background:conic-gradient(var(--shu) 0 28%, color-mix(in oklab, var(--shu) 20%, transparent) 0);animation:.8s linear infinite spin}.q.loading .bars{display:none}.q.teach .q-chip:after{content:"";border:2px solid var(--shu);animation:ping 1.4s var(--ease) infinite;border-radius:50%;position:absolute;inset:-4px}.q.hint .q-chip{animation:hint .6s var(--pop)}@keyframes hint{40%{transform:scale(1.35)}}.card-body.listening .q:not(.playing){opacity:.4}.card-bg{z-index:0;opacity:.18;pointer-events:none;width:min(30%,140px);position:absolute;bottom:40%;left:10px}.whisper{z-index:5;pointer-events:none;opacity:0;transition:opacity .2s, transform .3s var(--pop);align-items:flex-end;gap:8px;display:flex;position:absolute;bottom:40%;left:10px;right:10px;transform:translateY(10px)}.whisper.on{opacity:1;transform:none}.whisper img{flex-shrink:0;width:44px}.whisper-bubble{background:var(--washi);border:2px solid var(--sumi);min-width:0;font-family:var(--f-tate);box-shadow:3px 3px 0 color-mix(in oklab, var(--sumi) 25%, transparent);border-radius:14px;flex:1;padding:8px 12px 9px;font-size:14px;font-weight:600;line-height:1.55;position:relative}.whisper-bubble:before{content:"";background:var(--washi);border-left:2px solid var(--sumi);border-bottom:2px solid var(--sumi);width:14px;height:14px;position:absolute;bottom:12px;left:-9px;rotate:45deg}.whisper.on .whisper-bubble{pointer-events:auto;cursor:pointer}.stamp{z-index:8;pointer-events:none;aspect-ratio:1;border:5px double var(--shu);width:clamp(72px,11svh,96px);color:var(--shu);background:color-mix(in oklab, var(--washi) 60%, transparent);font-family:var(--f-punch);font-weight:900;font-size:calc(clamp(22px, 3.6svh, 32px) * var(--k,1));letter-spacing:-.02em;opacity:0;mix-blend-mode:multiply;border-radius:50%;place-items:center;line-height:1;display:grid;position:absolute;top:12px;right:12px;transform:rotate(-14deg)scale(2.4)}.stamp.ng{border-color:var(--sumi);color:var(--sumi)}.stamp.on{animation:.34s cubic-bezier(.2,1.6,.4,1) forwards stamp}@keyframes stamp{0%{opacity:0;transform:rotate(-14deg)scale(2.4)}60%{opacity:1;transform:rotate(-14deg)scale(.92)}to{opacity:.92;transform:rotate(-14deg)scale(1)}}.card3d.ng .card-body{filter:grayscale(.85);transition:filter .4s}.after{z-index:9;position:absolute;top:12px;left:12px}.after[aria-hidden=true]{visibility:hidden}.next{border:3px solid var(--sumi);background:var(--shu);width:54px;height:54px;color:var(--washi);box-shadow:0 5px 0 var(--sumi);animation:popIn .4s var(--pop);border-radius:50%;place-items:center;display:grid;position:relative}.next:after{content:"";border:2px solid var(--shu);animation:ping 1.4s var(--ease) infinite;border-radius:50%;position:absolute;inset:-6px}.next:active{box-shadow:0 1px 0 var(--sumi);transform:translateY(4px)}.next svg{width:28px;height:28px}.fuse{background:var(--washi-3);height:6px;position:relative}.rope{background:repeating-linear-gradient(60deg, color-mix(in oklab, var(--kin) 70%, var(--sumi)) 0 4px, var(--kin) 4px 8px);width:100%;position:absolute;top:0;bottom:0;left:0}.fuse.low .rope{background:repeating-linear-gradient(60deg, var(--shu-deep) 0 4px, var(--shu) 4px 8px)}.spark{background:radial-gradient(circle, var(--washi) 10%, var(--kin-hi) 35%, color-mix(in oklab, var(--kin) 80%, transparent) 55%, transparent 70%);border-radius:50%;width:16px;height:16px;animation:.12s linear infinite alternate sparkle;position:absolute;top:50%;left:100%;translate:-50% -50%}.fuse.done .spark{opacity:0}@keyframes sparkle{to{transform:scale(1.5)}}.moves{background:color-mix(in oklab, var(--washi-3) 35%, transparent);flex-direction:column;display:flex}.move{text-align:left;border:0;border-top:1.5px solid color-mix(in oklab, var(--sumi) 30%, transparent);width:100%;min-height:52px;font-family:var(--f-tate);overflow-wrap:anywhere;background:0 0;grid-template-columns:34px minmax(0,1fr);align-items:center;gap:10px;padding:9px 14px 9px 12px;font-size:clamp(13px,1.9svh,16px);font-weight:800;line-height:1.4;transition:background .15s,color .15s,opacity .3s;display:grid}.move-key{width:34px;height:34px;font-family:var(--f-punch);transition:transform .2s var(--pop), background .15s, color .15s;border:2px solid;border-radius:50%;place-items:center;font-size:15px;font-weight:900;display:grid}.move:hover:not(:disabled){background:color-mix(in oklab, var(--washi) 90%, transparent)}.move:hover:not(:disabled) .move-key{background:var(--sumi);color:var(--washi);border-color:var(--sumi);transform:rotate(-12deg)scale(1.1)}.move:active:not(:disabled){background:var(--washi-3)}.move:disabled{cursor:default}.moves.locked .move{opacity:.25}.move.is-correct{background:var(--shu);color:var(--washi);animation:bump .4s var(--pop)}.move.is-wrong{background:var(--sumi);color:var(--washi);animation:.4s shake}.move.dim{opacity:.35}.float{z-index:70;pointer-events:none;font-family:var(--f-punch);color:var(--shu);text-shadow:3px 3px 0 var(--washi), 5px 5px 0 var(--sumi);white-space:nowrap;font-size:44px;font-weight:900;position:fixed;translate:-50% -50%}.banner{z-index:65;pointer-events:none;font-family:var(--f-punch);color:var(--washi);text-shadow:5px 5px 0 var(--sumi), 0 0 60px var(--shu);background:linear-gradient(90deg, transparent, color-mix(in oklab, var(--shu) 92%, transparent) 15%, color-mix(in oklab, var(--shu) 92%, transparent) 85%, transparent);animation:banner 1.4s var(--ease) forwards;place-items:center;padding-block:14px;font-size:clamp(32px,9vw,110px);font-weight:900;line-height:1;display:grid;position:fixed;top:38%;left:0;right:0;transform:skewY(-4deg)scaleY(0)}.banner.kin{background:linear-gradient(90deg, transparent, color-mix(in oklab, var(--sumi) 90%, transparent) 15%, color-mix(in oklab, var(--sumi) 90%, transparent) 85%, transparent);color:var(--kin-hi)}@keyframes banner{0%{transform:skewY(-4deg)scaleY(0)}12%{transform:skewY(-4deg)scaleY(1.15)}20%,78%{letter-spacing:.08em;transform:skewY(-4deg)scaleY(1)}to{opacity:0;letter-spacing:.3em;transform:skewY(-4deg)scaleY(0)}}#result{justify-content:flex-start;gap:36px;padding-block:40px 56px}.res-head{justify-content:center;align-items:center;gap:clamp(28px,6vw,64px);width:min(100%,960px);display:flex}.rank{aspect-ratio:1;border:10px double var(--shu);width:clamp(150px,40vw,210px);color:var(--shu);font-family:var(--f-punch);background:color-mix(in oklab, var(--washi) 70%, transparent);opacity:0;border-radius:50%;flex:none;place-items:center;font-size:clamp(84px,22vw,128px);font-weight:900;line-height:1;display:grid;transform:rotate(-12deg)scale(3)}.rank.on{animation:.4s cubic-bezier(.2,1.6,.4,1) forwards stamp}.res-sum{flex-direction:column;align-items:flex-start;gap:14px;min-width:0;display:flex}.res-score{font-family:var(--f-punch);font-variant-numeric:tabular-nums;align-items:baseline;gap:6px;font-size:clamp(56px,13vw,92px);font-weight:900;line-height:1;display:flex}.res-score small{color:var(--sumi-soft);font-size:.32em}.res-new{background:var(--shu);color:var(--washi);font-family:var(--f-punch);letter-spacing:.06em;animation:bump .8s var(--pop) infinite;border-radius:999px;align-self:center;margin-left:6px;padding:5px 12px;font-size:15px;font-weight:900}.res-dots{flex-wrap:wrap;gap:8px;display:flex}.res-dots .dot{border-width:2px;width:16px;height:16px}.res-meta{font-family:var(--f-punch);color:var(--sumi-soft);align-items:baseline;gap:18px;font-size:16px;font-weight:900;display:flex}.res-meta b{color:var(--sumi);font-size:24px;font-weight:400}.res-actions{align-items:center;gap:14px;margin-top:8px;display:flex}.btn-post{border:3px solid var(--sumi);background:var(--sumi);height:64px;color:var(--washi);font-family:var(--f-punch);letter-spacing:.04em;white-space:nowrap;box-shadow:0 5px 0 var(--shu);border-radius:999px;align-items:center;gap:10px;padding-inline:26px 30px;font-size:18px;font-weight:900;text-decoration:none;transition:transform .1s,box-shadow .1s;display:inline-flex;position:relative}.btn-post svg{width:22px;height:22px}.btn-post:after{content:"";border-radius:inherit;border:2px solid var(--sumi);animation:ping 1.8s var(--ease) infinite;position:absolute;inset:-7px}.btn-post:hover{box-shadow:0 7px 0 var(--shu);transform:translateY(-2px)}.btn-post:active{box-shadow:0 1px 0 var(--shu);transform:translateY(4px)}.round{border:3px solid var(--sumi);background:var(--washi);width:64px;height:64px;box-shadow:0 5px 0 var(--sumi);border-radius:50%;place-items:center;display:grid}.round:active{box-shadow:0 1px 0 var(--sumi);transform:translateY(4px)}.round svg{width:28px;height:28px}.binder-h{font-family:var(--f-punch);letter-spacing:.08em;flex-direction:column;align-items:center;gap:4px;margin:0;font-size:20px;font-weight:900;display:flex}.binder-h small{font-family:var(--f-ui);letter-spacing:.04em;color:var(--sumi-soft);font-size:12px;font-weight:400}.binder{grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:18px;width:min(100%,960px);margin-top:-18px;display:grid}.mini{aspect-ratio:5/7;background:var(--sumi);color:inherit;box-shadow:0 10px 18px color-mix(in oklab, var(--sumi) 22%, transparent);opacity:0;animation:dealIn .5s var(--pop) forwards;transition:transform .2s var(--pop);border-radius:14px;padding:5px;text-decoration:none;position:relative;transform:translateY(20px)rotate(-4deg)}.mini:hover{transform:translateY(-6px)rotate(-2deg)scale(1.03)}@keyframes dealIn{to{opacity:1;transform:none}}.mini-in{background:var(--washi);border-radius:10px;grid-template-rows:auto minmax(0,1fr) auto;gap:8px;height:100%;padding:10px 10px 12px;display:grid;position:relative;overflow:hidden}.mini-no{min-height:1em;font-family:var(--f-punch);color:var(--shu);font-variant-numeric:tabular-nums;font-size:26px;font-weight:900;line-height:1}.mini-art{background:radial-gradient(circle at 50% 55%, var(--washi) 0 38%, var(--washi-3) 100%);border-radius:8px;min-height:0;position:relative;overflow:hidden}.mini-art img{object-fit:contain;width:84%;height:84%;position:absolute;inset:8%}.mini-title{font-family:var(--f-tate);text-wrap:balance;-webkit-line-clamp:4;line-clamp:4;-webkit-box-orient:vertical;font-size:15px;font-weight:800;line-height:1.4;display:-webkit-box;overflow:hidden}.mini-mark{z-index:2;border:4px double var(--shu);width:46px;height:46px;color:var(--shu);font-family:var(--f-punch);background:var(--washi);border-radius:50%;place-items:center;font-size:22px;font-weight:900;display:grid;position:absolute;top:-10px;right:-8px;transform:rotate(-12deg)}.mini.miss .mini-art{filter:grayscale();opacity:.7}.mini.miss .mini-no{color:var(--sumi-soft)}.mini.miss .mini-mark{border-color:var(--sumi);color:var(--sumi)}.toast{background:var(--sumi);color:var(--washi);z-index:80;opacity:0;pointer-events:none;border-radius:999px;padding:10px 18px;font-size:14px;transition:opacity .2s;position:fixed;bottom:24px;left:50%;translate:-50%}.toast.on{opacity:1}@media (width<=640px){.res-head{flex-direction:column;gap:24px}.res-sum{align-items:center}.res-dots{justify-content:center}}@media (width<=520px){.binder{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.mini-no{font-size:22px}.mini-title{font-size:14px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}
