@layer reset,tokens,base,components,board,hud,shell,screens,motion;@layer hud{.game-host{position:relative}.game{position:relative;min-height:100vh;min-height:100dvh;max-width:100vw;overflow:hidden;display:grid;grid-template-columns:100%;grid-template-rows:calc(44px + var(--safe-t)) minmax(8px,1fr) 72px 48px auto 1fr calc(56px + var(--safe-b));grid-template-areas:"top" "." "score" "status" "board" "." "bar";background:var(--paper);color:var(--ink)}.game[data-compact=true]{grid-template-rows:calc(40px + var(--safe-t)) minmax(4px,1fr) 52px 36px auto 1fr calc(48px + var(--safe-b))}.game[data-layout=phone]>:is(.g-top,.g-score,.g-status,.g-bar,.lc-strip){width:min(100%,calc(var(--board-px) + 16px));justify-self:center}.g-top{grid-area:top;display:flex;align-items:center;gap:4px;padding:var(--safe-t) calc(4px + var(--safe-r)) 0 calc(4px + var(--safe-l));min-width:0}.game[data-compact=true] .g-top{align-items:flex-start}.g-label{position:relative;flex:1;min-width:0;height:44px;display:grid;place-items:center;text-align:center}.g-label>span{grid-area:1 / 1;display:inline-flex;align-items:center;gap:6px;max-width:100%;font:600 .875rem/1.125rem var(--font-num);color:var(--pencil);white-space:nowrap;transition:opacity .16s,transform .16s}.g-label .num,.g-label b{font-family:var(--font-num);font-weight:600;color:var(--ink)}.g-label .lbl-btn{display:inline-flex;align-items:center;gap:6px;height:44px;max-width:100%;padding:0 6px;border:0;background:none;color:inherit;font:inherit}.g-label .toast-slot{opacity:0;transform:translateY(4px);color:var(--ink);pointer-events:none}.g-label.toasting .main-slot{opacity:0;transform:translateY(-4px);transition-duration:.12s}.g-label.toasting .toast-slot{opacity:1;transform:none}.g-label .eye{color:var(--pencil)}.g-tools{display:none;align-items:center}.g-tools .icon-btn[aria-pressed]:not(:active){background:none;box-shadow:none}.g-logo{display:none;align-items:center;gap:8px;height:44px;padding:0 8px;color:var(--ink);text-decoration:none;font:800 1.25rem/1.5rem var(--font-print)}.g-score{grid-area:score;position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);grid-template-rows:50px 22px;align-items:center;padding:0 10px;min-width:0}.side{position:relative;display:flex;align-items:center;gap:8px;min-width:0;height:46px;padding:4px 6px;border:0;border-radius:var(--r-m);background:none;color:var(--ink);text-align:left}.side:before{content:"";position:absolute;inset:0;border-radius:inherit;background:var(--wash, transparent);opacity:0;transition:opacity .16s var(--ease-swipe)}.side[data-ink=x]{--wash: var(--x-wash)}.side[data-ink=o]{--wash: var(--o-wash)}.side.active:before{opacity:1}.side>*{position:relative}.side.them{flex-direction:row-reverse;text-align:right}.who{display:flex;flex:1 1 auto;flex-direction:column;min-width:0}.who:has(>.nm:empty){justify-content:center}.who:has(>.nm:empty)>.nm{display:none}.who .nm{display:block;min-height:1.125rem;font:600 .875rem/1.125rem var(--font-print);white-space:nowrap;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 12px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 12px),transparent)}.side .who .nm.fits{-webkit-mask-image:none;mask-image:none}.who .sub{display:flex;align-items:center;gap:5px;min-height:16px;font:600 .75rem/1rem var(--font-num);color:var(--pencil-soft);white-space:nowrap}.side.them .who .sub{justify-content:flex-end}.who .sub .clk{font-family:var(--font-num);font-variant-numeric:tabular-nums;transition:color .16s}.who .sub .clk.low{color:var(--warn);font-size:.9375rem}.who .sub .warn{color:var(--warn)}.who .sub .rate,.row2 .rate{font-family:var(--font-print);animation:fade-in .16s ease-out both}.who .sub .rate.up,.row2 .rate.up{color:var(--pencil)}.who.rate2{justify-content:center}.side:has(>.who.rate2){gap:4px}.who.rate2>.nm{display:none}.who.rate2 .sub{white-space:normal}.who .sub .rate.cut{min-width:0;overflow:hidden;white-space:nowrap;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 12px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 12px),transparent)}@media(prefers-reduced-motion:reduce){.who .sub .rate,.row2 .rate{animation:none}}[data-lowpower] :is(.who .sub,.row2) .rate{animation:none}@media(max-width:400px){.g-score{padding:0 6px}.g-score .side{gap:4px;padding:4px}.game[data-compact=true] .g-score{padding:0 2px}.game[data-compact=true] .g-score .side{padding:4px 2px}}.mchip{width:10px;height:10px;flex:none;fill:none;stroke-width:2;stroke-linecap:round}.mchip.x{stroke:var(--x)}.mchip.o{stroke:var(--o)}.score-col{position:relative;display:flex;align-items:center;justify-content:center;min-width:66px;height:50px;padding:0 6px;border:0;background:none;color:var(--ink)}.row2{grid-column:1 / -1;position:relative;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:22px;min-width:0;padding:0 6px;border:0;background:none;font:600 .75rem/1rem var(--font-print);color:var(--pencil-soft);pointer-events:none}.row2 .l{min-width:0;overflow:hidden;text-align:left;white-space:nowrap}.row2 .r{text-align:right;white-space:nowrap}.note-pop{position:absolute;bottom:0;z-index:20;max-width:calc(50% - 14px);padding:3px 10px 6px;border-radius:var(--r-s);background:var(--paper-raised);box-shadow:var(--e-2);font:600 1rem/1.25rem var(--font-hand);color:var(--ink);white-space:nowrap;pointer-events:none}.note-pop:after{content:"";position:absolute;left:10px;right:10px;bottom:3px;height:2px;border-radius:2px;background:var(--ink-c, var(--ink))}.note-pop[data-ink=x]{--ink-c: var(--x)}.note-pop[data-ink=o]{--ink-c: var(--o)}.note-pop.l{left:12px}.note-pop.r{right:12px}.note-pop.in{animation:note-in .22s var(--ease-swipe) both}.note-pop.out{animation:note-out .16s var(--ease-exit) both}@keyframes note-in{0%{opacity:0;transform:translateY(-6px)}}@keyframes note-out{to{opacity:0;transform:translateY(-4px)}}.game[data-compact=true] .g-score{grid-template-rows:40px 12px}.game[data-compact=true] .g-score .digits{--dh: 26px}.game[data-compact=true] .side{height:40px}.game[data-compact=true] :is(.side,.score-col):after{content:"";position:absolute;inset:0 0 -4px}.game[data-compact=true] .side .av{--av: 32px}.game[data-compact=true] .score-col{height:40px;padding-inline:4px}.game[data-compact=true] .row2{height:12px}.game[data-compact=true] .row2 .l,.game[data-compact=true] .row2 .r{visibility:hidden}.game[data-compact=true] .note-pop{bottom:auto;top:100%;translate:0 2px}.g-status{grid-area:status;position:relative;height:48px;min-width:0;overflow-x:clip;overflow-y:visible}.st-slot{position:absolute;inset:0}.st{position:absolute;inset:0;display:flex;align-items:center;gap:8px;min-width:0;margin:0;padding:0 16px;white-space:nowrap}.st.print{font:600 .9375rem/1.25rem var(--font-num);color:var(--ink)}.st.handline{font:600 1rem/1.375rem var(--font-hand);color:var(--pencil)}.st.result{flex-direction:column;align-items:flex-start;justify-content:center;gap:0}.st .verdict{font:600 1.375rem/1.625rem var(--font-hand);color:var(--ink);white-space:nowrap}.st .detail{font:600 .9375rem/1.125rem var(--font-hand);color:var(--pencil);white-space:nowrap}.st .uline{position:relative}.st .uline:after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:1.5px;background:var(--ink);transform-origin:0 50%;animation:hl-in .2s var(--ease-swipe) both}.st.in{animation:st-in .16s var(--ease-swipe) both}.st.out{animation:st-out .12s var(--ease-exit) both;pointer-events:none}.st.fade{animation:fade-in .12s ease-out both}.st .quiet{margin-left:auto}.st .dots{margin-left:-4px}@keyframes st-in{0%{opacity:0;transform:translateY(4px)}}@keyframes st-out{to{opacity:0}}.st.banner{background:var(--paper-raised);box-shadow:inset 0 1px 0 var(--line),inset 0 -1px 0 var(--line);padding:0 4px 0 16px;font:600 .9375rem/1.25rem var(--font-num);color:var(--ink);white-space:normal}.st.banner .txt{flex:1;display:flex;align-items:baseline;min-width:0;overflow:hidden;line-height:1.125rem}.game[data-compact=true] .g-status{height:36px}.game[data-compact=true] .st .quiet{min-height:36px;position:relative}.game[data-compact=true] .st .quiet:before{content:"";position:absolute;inset:-8px 0 0}.game[data-compact=true] .st.print{font-size:.875rem;line-height:1.125rem}.game[data-compact=true] .st .verdict{font-size:1.25rem;line-height:1.5rem}.game[data-compact=true] .st.result .detail{display:none}.g-boardcol{grid-area:board;position:relative;display:flex;justify-content:center;min-width:0}.g-boardcol .board-shell{view-transition-name:board}.g-score .side:not(.them) .av{view-transition-name:avatar-me}.g-score .side.them .av{view-transition-name:avatar-them}.board-over{position:absolute;left:50%;top:0;width:var(--board-px);height:var(--board-px);translate:-50% 0;display:grid;place-items:center;pointer-events:none}.board-over>*{pointer-events:auto}.board-over:empty{display:none}.pencil-note{pointer-events:none!important;display:flex;flex-direction:column;align-items:center;gap:6px;padding:0 24px;text-align:center}.pencil-note p{padding:2px 8px;border-radius:4px;background:var(--paper);font:600 1.0625rem/1.5rem var(--font-hand);color:var(--pencil)}.pencil-note p+p{font-size:1rem;line-height:1.375rem;color:var(--pencil-soft)}.code-card,.invite-card{position:relative;width:min(calc(var(--board-px) - 32px),400px);display:flex;flex-direction:column;gap:12px;padding:20px 16px 16px;border-radius:var(--r-l);background:var(--paper-raised);box-shadow:var(--e-2);color:var(--ink);text-align:left}.code-card .code{font:800 2.125rem/2.5rem var(--font-num);letter-spacing:.06em}.code-card .presence{font:400 .875rem/1.25rem var(--font-print);color:var(--pencil)}.invite-card h2{font:800 1.375rem/1.75rem var(--font-print)}.invite-card .sub{font:400 1rem/1.5rem var(--font-print);color:var(--pencil)}.g-bar{grid-area:bar;position:relative;display:flex;align-items:center;gap:8px;min-width:0;padding:0 calc(8px + var(--safe-r)) var(--safe-b) calc(8px + var(--safe-l));background:var(--paper)}.g-bar .grow{flex:1}.g-bar .btn{min-width:auto}@media(max-width:399px){.g-bar{gap:4px}}@media(max-width:359px){.g-bar .btn>.face{padding:0 12px}}.g-bar .tool.bare{width:44px;padding:0;justify-content:center}.g-bar .tool.bare>span{display:none}.react-row{flex:1;display:flex;align-items:center;gap:8px;min-width:0;padding:4px 0;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x proximity}.react-row::-webkit-scrollbar{display:none}.rchip{flex:none;display:flex;align-items:center;height:44px;padding:0;border:0;background:none;scroll-snap-align:start}.rchip span{display:flex;align-items:center;height:36px;padding:0 12px;border-radius:var(--r-s);background:var(--paper-raised);box-shadow:inset 0 0 0 1px var(--line-strong);font:600 1rem/1.25rem var(--font-hand);color:var(--ink);white-space:nowrap}.rchip:active span{background:var(--paper-sunk)}.rchip:disabled span{background:none;box-shadow:inset 0 0 0 1px var(--line);color:var(--btn-off-label)}.game[data-compact=true] .g-bar{min-height:48px}.g-side{display:none}.game[data-layout=landscape]{grid-template-columns:max-content minmax(260px,320px);grid-template-rows:44px 72px auto 1fr auto;grid-template-areas:"board top" "board score" "board status" "board ." "board bar";column-gap:8px;justify-content:center;padding-left:calc(4px + var(--safe-l))}.game[data-layout=landscape] .g-boardcol{align-self:center}.game[data-layout=landscape] .g-status{height:auto;min-height:48px}.game[data-layout=landscape] .st{white-space:normal}.game[data-layout=landscape] .g-bar{flex-wrap:wrap;row-gap:8px;padding-top:8px;padding-bottom:calc(8px + var(--safe-b))}.game[data-layout=landscape] .g-bar .btn{flex:1 1 auto}.game[data-layout=landscape] .g-bar .bar-menu{display:none}.game[data-layout=desktop]{--side-w: 360px;--desk-pad: max(24px, calc((100vh - 56px - var(--board-px)) / 2));grid-template-columns:minmax(0,1fr) var(--board-px) var(--side-w) minmax(0,1fr);grid-template-rows:56px var(--desk-pad) auto auto auto minmax(0,1fr) var(--desk-pad);grid-template-areas:"top top top top" ". . . ." ". board score ." ". board status ." ". board bar ." ". board side ." ". . . .";column-gap:32px;min-height:100vh;min-height:100dvh}@supports (height: 100dvh){.game[data-layout=desktop]{--desk-pad: max(24px, calc((100dvh - 56px - var(--board-px)) / 2))}}body[data-page=computer] .game[data-role=computer][data-layout=desktop],body[data-page=local] .game[data-role=local][data-layout=desktop]{--desk-pad: 24px;min-height:0}.game[data-layout=desktop] .g-top{--block-in: calc((100% - var(--board-px) - 32px - var(--side-w)) / 2);border-bottom:1px solid var(--line);padding:0 max(12px,calc(var(--block-in) - 10px)) 0 max(12px,calc(var(--block-in) - 8px))}.game[data-layout=desktop] .g-boardcol{align-self:start}.game[data-layout=desktop] .g-score{padding:0 0 8px;border-bottom:1px solid var(--line);grid-template-rows:60px 24px}.game[data-layout=desktop] .side{height:auto;min-height:56px;gap:6px;padding:4px}.game[data-layout=desktop] .who .sub{white-space:normal}.game[data-layout=desktop] .who .nm,.game[data-layout=desktop] .side.them .who .nm{white-space:normal;overflow-wrap:break-word;line-height:1.0625rem;max-height:2.125rem;overflow:hidden;-webkit-mask-image:none;mask-image:none}.game[data-layout=desktop] .score-col{height:60px;padding:0 2px}.game[data-layout=desktop] .g-back{display:none}.game[data-layout=desktop] .g-logo,.game[data-layout=desktop] .g-tools{display:inline-flex}.game[data-layout=desktop] .av{--av: 44px}.game[data-layout=desktop] .digits{--dh: 44px}.game[data-layout=desktop] .g-status{height:auto;min-height:72px}.game[data-layout=desktop] .st-slot{position:relative;inset:auto;display:grid;min-height:72px}.game[data-layout=desktop] .st{position:relative;inset:auto;grid-area:1 / 1;padding:0 2px}.game[data-layout=desktop] .st .verdict,.game[data-layout=desktop] .st .detail{white-space:normal;text-wrap:balance}.game[data-layout=desktop] .st.print{font-size:1rem;line-height:1.375rem}.game[data-layout=desktop] .st.handline{font-size:1.0625rem;line-height:1.5rem}.game[data-layout=desktop] .st .verdict{font-size:1.875rem;line-height:2.25rem}.game[data-layout=desktop] .st .detail{font-size:1.0625rem;line-height:1.375rem}.game[data-layout=desktop] .g-side{display:flex;grid-area:side;flex-direction:column;min-height:0;overflow:hidden;contain:size}.game[data-layout=desktop] .g-bar{align-self:start;padding:8px 0 0;background:none;flex-wrap:wrap;gap:8px}.game[data-layout=desktop] .g-bar>.grow:not(.btn){display:none}.game[data-layout=desktop] .g-bar .btn{flex:1 1 calc(50% - 4px)}.game[data-layout=desktop] .g-bar .quiet{flex:1 0 100%;justify-content:flex-start;margin-left:-12px}.game[data-layout=desktop] .g-bar .bar-menu{display:none}::view-transition-old(root),::view-transition-new(root){animation:none}::view-transition-group(board),::view-transition-group(avatar-me),::view-transition-group(avatar-them){animation-duration:.32s;animation-timing-function:var(--ease-swipe)}}@layer screens{.game[data-layout=desktop] .g-side{gap:16px;padding:12px 12px 4px;margin-inline:-12px}.game[data-layout=desktop] .g-side :is(.book.inline,.lc-side){padding-bottom:24px;scroll-padding:8px 0 28px;-webkit-mask-image:linear-gradient(#000 calc(100% - 24px),transparent);mask-image:linear-gradient(#000 calc(100% - 24px),transparent)}.game[data-phase=search] .row2 .pips{min-width:0}.st-text .num{font-family:var(--font-num);font-variant-numeric:tabular-nums}.g-bar .btn.small>.face{padding:0 14px}@media(max-width:399px){.g-bar .btn.small>.face{padding:0 10px}.g-bar>.quiet{padding:0 8px}}.btn.fill-clock{position:relative;overflow:visible}.fill-ring{position:absolute;left:-4px;top:-4px;width:calc(100% + 8px);height:calc(100% + 8px);overflow:visible;pointer-events:none}.fill-ring rect{width:calc(100% - 2px);height:calc(100% - 2px);fill:none;stroke:var(--ink);stroke-width:2;stroke-dasharray:1 1;stroke-dashoffset:1;animation:fill-clock var(--fill-ms, 5s) linear forwards}.st.banner .fill-clock{margin:0 6px 0 8px}@keyframes fill-clock{to{stroke-dashoffset:0}}}
