.duel-pick{gap:26px;max-width:800px;margin:0 auto;padding:12px 0 24px;display:grid;position:relative}.duel-pick__head{text-align:center;justify-items:center;gap:6px;display:grid}.duel-pick__eyebrow{letter-spacing:.12em;text-transform:uppercase;background:var(--bfg-surface-2);color:var(--bfg-muted);border-radius:999px;padding:4px 12px;font-size:12px;font-weight:900}.duel-pick__head h1{margin:4px 0 0;font-size:clamp(30px,6vw,44px);line-height:1.1}.duel-pick__head p{max-width:600px;color:var(--bfg-muted);margin:0;font-weight:600}.duel-pick__cards{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;display:grid}.duel-mode{all:unset;--accent:#d9822b;--accent-ink:#9a4f0c;box-sizing:border-box;cursor:pointer;color:var(--bfg-ink);background:var(--bfg-card);box-shadow:var(--bfg-shadow);transition:transform .25s var(--bfg-spring), box-shadow .2s;border-radius:24px;flex-direction:column;display:flex;position:relative;overflow:hidden}.duel-mode:after{content:"";border-radius:inherit;box-shadow:inset 0 0 0 1.5px var(--bfg-line);pointer-events:none;transition:box-shadow .2s;position:absolute;inset:0}.duel-mode:hover:after{box-shadow:inset 0 0 0 2px var(--accent)}.duel-mode--friend{--accent:#3b7fd4;--accent-ink:#1f5288}.duel-mode:hover{box-shadow:0 14px 34px color-mix(in srgb, var(--accent) 22%, transparent);transform:translateY(-4px)}.duel-mode:active{transform:scale(.98)}.duel-mode:focus-visible{outline:3px solid var(--bfg-lime-d);outline-offset:3px}.duel-mode__hero{background:radial-gradient(circle at 50% 120%, color-mix(in srgb, var(--accent) 38%, transparent), transparent 70%), linear-gradient(160deg, color-mix(in srgb, var(--accent) 16%, var(--bfg-card)), color-mix(in srgb, var(--accent) 30%, var(--bfg-card)));place-items:center;height:150px;display:grid;position:relative}.duel-mode__badge{letter-spacing:.08em;text-transform:uppercase;background:var(--bfg-card);color:var(--accent-ink);border-radius:999px;padding:4px 10px;font-size:11px;font-weight:900;position:absolute;top:12px;left:12px}.duel-mode__foggie svg{filter:drop-shadow(0 8px 10px #00000026);width:112px;height:104px;transition:transform .3s var(--bfg-spring);display:block}.duel-mode:hover .duel-mode__foggie svg{transform:rotate(-6deg)scale(1.06)}.duel-mode__pair{align-items:center;gap:4px;display:flex}.duel-mode__pair img{filter:drop-shadow(0 8px 10px #00000026);width:84px;height:84px;transition:transform .3s var(--bfg-spring)}.duel-mode:hover .duel-mode__pair img:first-child{transform:translate(-4px)rotate(-6deg)}.duel-mode:hover .duel-mode__pair img:last-child{transform:translate(4px)rotate(6deg)}.duel-mode__vs{background:var(--bfg-ink);width:34px;height:34px;color:var(--bfg-card);border-radius:50%;place-items:center;font-size:12px;font-weight:900;display:grid}.duel-mode__body{flex-direction:column;flex:1;gap:10px;padding:18px 20px 20px;display:flex}.duel-mode__title{font-family:var(--bfg-font-display);font-size:23px;font-weight:900}.duel-mode__line{color:var(--bfg-ink-2);margin-top:-4px;font-size:15px;line-height:1.4}.duel-mode__list{color:var(--bfg-ink-2);gap:6px;font-size:14px;font-weight:700;display:grid}.duel-mode__cta{text-align:center;font-family:var(--bfg-font-display);color:#fff;background:var(--accent);box-shadow:0 4px 0 color-mix(in srgb, var(--accent) 70%, #000);border-radius:999px;margin-top:auto;padding:12px 16px;font-size:16px;font-weight:900}.duel-mode:active .duel-mode__cta{box-shadow:0 2px 0 color-mix(in srgb, var(--accent) 70%, #000);transform:translateY(2px)}@media (max-width:560px){.duel-mode__hero{height:124px}}@media (prefers-reduced-motion:reduce){.duel-mode,.duel-mode__foggie svg,.duel-mode__pair img{transition:none}}
.bfg-gl{--bg:var(--bfg-bg);--ink:var(--bfg-ink);--ink2:var(--bfg-ink-2);--ink3:var(--bfg-muted);--line:#1c1a2417;--lime:var(--bfg-lime);--lime-d:var(--bfg-lime-d);--lime-soft:var(--bfg-lime-soft);--display:var(--bfg-font-display);--spring:cubic-bezier(.2, .9, .25, 1.12);--ease:cubic-bezier(.2, .8, .2, 1);--shadow:0 1px 0 #1c1a240a, 0 2px 6px -2px #1c1a240f, 0 24px 48px -32px #3c285a59;--c:#e4dcff;--d:#5a3fd0;z-index:100;color:var(--ink);font-family:var(--bfg-font-text);-webkit-font-smoothing:antialiased;background:radial-gradient(900px 600px at 50% 20%, color-mix(in srgb, var(--c) 85%, #fff) 0%, transparent 70%), radial-gradient(700px 500px at 90% 100%, var(--lime-soft) 0%, transparent 65%), var(--bg);transition:opacity .5s var(--ease), transform .6s var(--ease);place-items:center;padding:24px;display:grid;position:fixed;inset:0;overflow:hidden auto}.bfg-gl.is-leaving{opacity:0;pointer-events:none;transform:scale(1.04)}.bfg-gl:before{content:"";background-image:radial-gradient(color-mix(in srgb, var(--d) 14%, transparent) 1.5px, transparent 1.6px);pointer-events:none;background-size:26px 26px;animation:30s linear infinite gl-drift;position:fixed;inset:-50%}@keyframes gl-drift{to{transform:translate(26px,26px)}}.bfg-gl button{font:inherit;color:inherit;cursor:pointer}.bfg-gl :focus-visible{outline:3px solid var(--d);outline-offset:3px;border-radius:12px}.gl-in{text-align:center;flex-direction:column;align-items:center;width:min(440px,100%);display:flex;position:relative}.gl-fog{z-index:2;width:118px;margin-bottom:-26px;animation:2.6s ease-in-out infinite gl-bob;position:relative}.gl-fog svg{width:100%;display:block}@keyframes gl-bob{50%{transform:translateY(-8px)}}.gl-fog .eyes{transform-box:fill-box;transform-origin:50%;animation:4s ease-in-out infinite gl-look}@keyframes gl-look{0%,30%{transform:translate(0)}40%,60%{transform:translate(-4px)}70%,90%{transform:translate(4px)}}.gl-fog .lid{transform-origin:50%;transform-box:fill-box;animation:4.4s infinite gl-blink}@keyframes gl-blink{0%,94%,to{transform:scaleY(0)}97%{transform:scaleY(1)}}.gl-fog.is-cheer{animation:gl-cheer .8s var(--spring)}@keyframes gl-cheer{30%{transform:translateY(-26px)rotate(-6deg)}60%{transform:translateY(0)rotate(4deg)}}.gl-board{position:relative}.gl-tiles{aspect-ratio:1;width:min(280px,72vw);box-shadow:0 0 0 1px var(--line), 0 40px 70px -36px color-mix(in srgb, var(--d) 70%, transparent);perspective:700px;background:#fff;border-radius:30px;grid-template-columns:repeat(4,1fr);gap:8px;padding:14px;display:grid;position:relative}.gl-t{transform-style:preserve-3d;transition:transform .7s var(--spring);transition-delay:calc(var(--i,0) * .12s);border-radius:14px;position:relative}.gl-t i{backface-visibility:hidden;font-family:var(--display);border-radius:14px;place-items:center;font-size:clamp(22px,6vw,34px);font-style:normal;font-weight:900;display:grid;position:absolute;inset:0}.gl-t .f{transition:background .35s, transform .45s var(--spring);background:#f3f0f7}.gl-t.on .f{background:var(--c);box-shadow:inset 0 -4px 0 color-mix(in srgb, var(--d) 22%, transparent);animation:gl-fill .55s var(--spring);transform:scale(1)}@keyframes gl-fill{0%{transform:scale(.5)}60%{transform:scale(1.12)}}.gl-t .b{background:var(--d);color:#fff;transform:rotateY(180deg);box-shadow:inset 0 -4px #0000002e}.gl-t.flip{transform:rotateY(180deg)}.gl-t.dim .f{background:color-mix(in srgb, var(--c) 55%, #fff)}.gl-t:not(.on) .f{animation:1.6s linear infinite gl-shim;animation-delay:calc(var(--k) * 60ms);background:linear-gradient(110deg,#f3f0f7 30%,#fbfafd 50%,#f3f0f7 70%) 0 0/300% 100%}@keyframes gl-shim{0%{background-position:100% 0}to{background-position:-100% 0}}.gl-glyph{background:var(--d);color:#fff;width:58px;height:58px;font-family:var(--display);box-shadow:0 0 0 5px var(--bg), 0 14px 24px -12px var(--d);animation:gl-spin 3s var(--ease) infinite;border-radius:18px;place-items:center;font-size:24px;font-weight:900;display:grid;position:absolute;bottom:-16px;right:-16px}@keyframes gl-spin{0%,70%{transform:rotate(0)}85%{transform:rotate(-14deg)}to{transform:rotate(0)}}.bfg-gl h1{font-family:var(--display);letter-spacing:-.035em;margin:30px 0 0;font-size:clamp(34px,7vw,48px);font-weight:900;line-height:1}.gl-kick{color:var(--d);margin-top:6px;font-size:14px;font-weight:800}.gl-step{height:24px;color:var(--ink2);width:100%;margin-top:14px;font-size:16px;font-weight:700;position:relative}.gl-step span{animation:gl-stepin .45s var(--ease);position:absolute;inset:0}@keyframes gl-stepin{0%{opacity:0;transform:translateY(8px)}}.gl-bar{background:#1c1a2414;border-radius:6px;width:min(300px,80vw);height:12px;margin-top:14px;position:relative;overflow:hidden}.gl-bar i{transform-origin:0;background:linear-gradient(90deg, var(--d), color-mix(in srgb, var(--d) 60%, #fff));transition:transform .5s var(--ease);border-radius:6px;position:absolute;inset:0;transform:scaleX(0)}.gl-bar i:after{content:"";background:linear-gradient(100deg,#0000 20%,#ffffff80 50%,#0000 80%) 0 0/200% 100%;animation:1.2s linear infinite gl-shine;position:absolute;inset:0}@keyframes gl-shine{0%{background-position:200% 0}to{background-position:-200% 0}}.gl-pct{font-family:var(--display);color:var(--ink3);font-variant-numeric:tabular-nums;margin-top:8px;font-size:14px;font-weight:900}.gl-tip{text-align:left;box-shadow:var(--shadow);background:#fff;border-radius:20px;align-items:flex-start;gap:12px;width:100%;min-height:74px;margin-top:26px;padding:14px 16px;display:flex}.gl-tip b{background:var(--lime-soft);width:34px;height:34px;color:var(--lime-d);font-family:var(--display);border-radius:11px;flex:none;place-items:center;font-size:16px;display:grid}.gl-tip p{color:var(--ink2);animation:gl-stepin .5s var(--ease);margin:0;font-size:14px;line-height:1.45}.gl-tip p strong{color:var(--ink);font-family:var(--display);font-size:15px;display:block}.gl-err{color:#b4232a;background:#ffe1e1;border-radius:16px;align-items:center;gap:10px;margin-top:18px;padding:12px 16px;font-size:14px;font-weight:700;display:flex}.gl-err span{text-align:left;margin-right:auto}.bfg-gl .gl-err button{white-space:nowrap;color:#fff;background:#b4232a;border:0;border-radius:999px;flex:none;padding:7px 14px;font-size:13px;font-weight:800}.bfg-gl .gl-err button.ghost{color:#b4232a;background:0 0;box-shadow:inset 0 0 0 2px #b4232a}@media (prefers-reduced-motion:reduce){.bfg-gl,.bfg-gl *,.bfg-gl :before,.bfg-gl :after,.bfg-gl:before{transition-duration:.01ms!important;transition-delay:0s!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
body:has(.stage.is-hud) .topbar{display:none}body:has(.stage.is-hud){background:radial-gradient(1200px 700px at 50% -10%, var(--phud-wash,#eae2ff) 0%, transparent 60%), radial-gradient(900px 600px at 100% 100%, #e9f8d5 0%, transparent 60%), var(--bfg-bg,#fbf7f0);background-attachment:fixed}html:has(.stage.is-hud){scrollbar-width:none}html:has(.stage.is-hud)::-webkit-scrollbar{display:none}.stage.is-hud.is-fs::-webkit-scrollbar{display:none}body:has(.stage.is-hud){overflow-x:clip}.stage.is-hud.is-fs{scrollbar-width:none;overflow-x:clip}body:has(.stage.is-hud[data-cat=number]){--phud-wash:#d9f2e5}.page--wide:has(>.stage.is-hud){max-width:1640px;padding-top:0}@container bfgplay (min-width:981px){.stage.is-hud .bfg-play.has-sides .bfg-grid{--bfg-cw:clamp(340px, min(100dvh - 250px, 100cqw - 540px), 720px);--bfg-sw:minmax(220px, 360px);grid-template-columns:var(--bfg-sw) minmax(min-content, var(--bfg-cw)) var(--bfg-sw);gap:clamp(16px,2.4vw,40px)}.stage.is-hud .bfg-center{width:var(--bfg-cw);justify-self:center}}.stage.is-hud .bfg-side{top:86px}.phud{--phud-shadow:0 1px 0 #1c1a240a, 0 2px 6px -2px #1c1a240f, 0 24px 48px -32px #3c285a66;z-index:40;-webkit-backdrop-filter:saturate(180%)blur(18px);box-shadow:0 1px 0 var(--bfg-line,#1c1a2417);background:#fbf7f0bf;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;margin:0 -20px;padding:12px clamp(14px,2.5vw,32px);display:grid;position:sticky;top:0}.stage.is-fs .phud{border-radius:20px;margin:0}.phud__l{align-items:center;gap:12px;min-width:0;display:flex}.phud__back,.phud__ib{width:42px;height:42px;color:var(--bfg-ink-2,#34303f);box-shadow:var(--phud-shadow);cursor:pointer;transition:transform .3s var(--bfg-spring);background:#fff;border:0;border-radius:14px;flex:none;place-items:center;padding:0;text-decoration:none;display:grid}.phud__back:hover{transform:translate(-3px)}.phud__ib:hover{transform:translateY(-2px)}.phud__back svg{width:18px;height:18px}.phud__ib svg{width:19px;height:19px}.phud__pause[aria-pressed=true]{background:var(--phud-d);color:#fff}.phud__title{align-items:center;gap:10px;min-width:0;display:flex}.phud__ic{background:var(--phud-d);color:#fff;width:42px;height:42px;font-family:var(--bfg-font-display);box-shadow:0 10px 18px -10px var(--phud-d);border-radius:14px;flex:none;place-items:center;font-size:19px;font-weight:900;display:grid}.phud__title>div{min-width:0}.phud h1{font-family:var(--bfg-font-display);letter-spacing:-.02em;white-space:nowrap;text-overflow:ellipsis;margin:0;font-size:24px;font-weight:900;line-height:1;overflow:hidden}.phud small{color:var(--bfg-muted);white-space:nowrap;margin-top:3px;font-size:12px;font-weight:800;display:block}.phud__c{box-shadow:var(--phud-shadow);background:#fff;border-radius:999px;align-items:center;gap:14px;padding:7px 16px 7px 8px;display:flex}.phud__clock{background:var(--bfg-ink,#1c1a24);color:#fff;text-align:center;min-width:80px;font-family:var(--bfg-font-display);font-variant-numeric:tabular-nums;border-radius:999px;padding:4px 14px;font-size:22px;font-weight:900}.phud__pips{gap:3px;display:flex}.phud__pips i{color:#ddd8e6;width:22px;height:22px;transition:color .3s, transform .5s var(--bfg-spring);display:block}.phud__pips i svg{width:100%;height:100%;display:block}.phud__pips i.on{color:#f5b70a;filter:drop-shadow(0 3px 3px #f5b70a59);transform:translateY(-2px)scale(1.12)}.phud__pips i.bad{color:var(--bfg-bad,#e5484d)}.phud__count{font-family:var(--bfg-font-display);color:var(--phud-d);font-variant-numeric:tabular-nums;font-size:16px;font-weight:900}.phud__count--narrow{display:none}.phud__stat{text-overflow:ellipsis;white-space:nowrap;max-width:36vw;overflow:hidden}.phud__r{justify-content:flex-end;align-items:center;gap:8px;display:flex;position:relative}.phud__menu{z-index:60;width:300px;max-height:calc(100dvh - 90px);box-shadow:0 30px 60px -24px #1c1a2480, 0 0 0 1px var(--bfg-line,#1c1a2417);transform-origin:100% 0;animation:phud-pop .35s var(--bfg-spring);background:#fff;border-radius:22px;padding:10px;position:absolute;top:54px;right:0;overflow-y:auto}@keyframes phud-pop{0%{opacity:0;transform:scale(.92)}}.phud__menu h3{font-family:var(--bfg-font-text);color:var(--bfg-muted);margin:0;padding:8px 10px 6px;font-size:13px;font-weight:800}.phud__opt{text-align:left;width:100%;font:inherit;color:var(--bfg-ink);cursor:pointer;background:0 0;border:0;border-radius:14px;justify-content:space-between;align-items:center;gap:12px;padding:10px;font-size:14px;font-weight:800;line-height:1.3;display:flex}.phud__opt:hover{background:var(--bfg-bg,#fbf7f0)}.phud__opt small{white-space:normal;margin-top:1px;font-weight:600}.phud__opt--quit{border-top:1px solid var(--bfg-line,#1c1a241a);color:var(--bfg-bad,#d64545);margin-top:6px}.phud__sw{background:#ddd8e6;border-radius:11px;flex:none;width:38px;height:22px;transition:background .25s;position:relative}.phud__sw:after{content:"";width:16px;height:16px;transition:transform .35s var(--bfg-spring);background:#fff;border-radius:50%;position:absolute;top:3px;left:3px;box-shadow:0 1px 3px #00000040}.phud__opt[aria-pressed=true] .phud__sw{background:var(--phud-d)}.phud__opt[aria-pressed=true] .phud__sw:after{transform:translate(16px)}@media (max-width:640px){.phud{grid-template-columns:auto 1fr auto;gap:8px;margin:0 -20px;padding:10px 12px}.phud__ic,.phud__title small{display:none}.phud h1{font-size:20px}.phud__c{justify-self:center;gap:8px;padding:5px 10px 5px 5px}.phud__clock{min-width:60px;padding:3px 10px;font-size:17px}.phud__pips{display:none}.phud__count--narrow{display:block}.phud__back,.phud__ib{width:38px;height:38px}.phud__pause{display:none}}@media (max-width:440px){.phud__title{display:none}}.pbtn{font-family:var(--bfg-font-display);white-space:nowrap;cursor:pointer;color:var(--bfg-ink);transition:transform .3s var(--bfg-spring);background:#fff;border:0;border-radius:18px;justify-content:center;align-items:center;gap:9px;padding:14px 16px;font-size:16px;font-weight:900;line-height:1.1;text-decoration:none;display:inline-flex;box-shadow:0 1px #1c1a240a,0 2px 6px -2px #1c1a240f,0 24px 48px -32px #3c285a66}.pbtn:hover{transform:translateY(-3px)}.pbtn--main{background:var(--bfg-lime);color:var(--bfg-ink);box-shadow:0 16px 26px -14px #3f7a06e6,inset 0 -4px #00000021}.pbtn--small{border-radius:14px;padding:9px 14px;font-size:14px}@media (prefers-reduced-motion:reduce){.phud__menu{animation:none}}
