:root{--room-safe-bottom:env(safe-area-inset-bottom,0px)}.room-code{background:transparent;border:1px dashed #b9baaf;border-radius:7px;padding:7px 10px;display:grid;grid-template-columns:1fr auto;text-align:left;gap:2px 6px;min-height:44px;color:var(--ink)}.room-code>span{grid-column:1/-1;color:var(--muted);font-size:11px}.room-code b{font-size:14px;letter-spacing:1px}.recent-room{margin-bottom:16px;gap:12px}.game-result{display:flex;align-items:center;justify-content:center;gap:14px;padding:16px;margin:0 0 14px;text-align:left;animation:result-arrive .42s ease-out both}.game-result .result-mark{font-size:30px;line-height:1;color:var(--blue)}.game-result h2{font-size:23px;margin:0}.game-result .result-detail,.game-result .result-winner{margin:4px 0 0;font-size:14px}.game-result[data-outcome=lose]{background:#f1f3fa;border-color:#bdc6e8}.game-result[data-outcome=cancelled],.game-result[data-outcome=complete],.game-result[data-outcome=draw]{background:#f5f4ed;border-color:#c9c7b9}@keyframes result-arrive{0%{opacity:.55;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.board button.preview{outline:2px dashed var(--blue);outline-offset:-2px;z-index:1}.board .stone-preview{opacity:.5;outline:1px dashed var(--blue)}.board-confirm{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px 12px;margin:12px 0;font-size:14px}.kind-connect4 .legend-piece.p-0{background:var(--yellow);border-color:#c8a32a}.kind-connect4 .legend-piece.p-1{background:var(--red);border-color:#bb4838}.uno-card.is-new{outline:3px solid var(--ink);outline-offset:3px;animation:result-arrive .42s ease-out both}.new-card-label{position:absolute;top:-10px;left:50%;transform:translateX(-50%);padding:2px 5px;background:#fffdf5;color:var(--ink);border:1px solid var(--ink);border-radius:4px;font-size:11px;white-space:nowrap}.uno-hand{padding-top:16px}.poker-summary:has(.game-result){display:block}html[data-reduce-motion=true] .game-result,html[data-reduce-motion=true] .uno-card.is-new{animation:none;transition:none}@media (prefers-reduced-motion:reduce){.game-result,.uno-card.is-new{animation:none;transition:none}}@media (min-width:901px){.board-panel.is-finished .game-surface{padding:12px 24px}.board-panel.is-finished .board{width:min(100%,max(240px,calc(100dvh - 500px)));max-width:560px;margin:8px auto 12px}.board-panel.is-finished .game-result{padding:10px 16px;margin-bottom:10px}.board-panel.is-finished .end-actions{padding:12px}}@media (max-width:900px){body:has(.room-page){overflow:hidden}.room-page{height:calc(100dvh - 94px - 66px - var(--room-safe-bottom));overflow-y:auto;overscroll-behavior-y:contain;padding-bottom:18px;scroll-padding-block:12px}.mobile-chat-toggle,body:has(.your-turn) .mobile-chat-toggle{position:fixed;bottom:calc(10px + var(--room-safe-bottom));right:max(16px,env(safe-area-inset-right,0px));min-height:44px;z-index:35}.room-tools .room-code{display:grid}.room-heading{row-gap:12px}.room-heading,.room-tools{flex-wrap:wrap}.room-sidebar.show-chat{bottom:calc(66px + var(--room-safe-bottom));right:12px;width:360px;max-width:calc(100% - 24px)}.room-sidebar.show-chat .chat-panel{height:min(410px,calc(100dvh - 160px - var(--room-safe-bottom)))}.poker-controls.your-turn{position:static;margin:0;padding:14px}.poker-wrap:has(.your-turn){padding-bottom:18px}.room-footer{flex-wrap:wrap;gap:6px}}@media (max-width:650px){.site-header{height:64px;padding:0 12px;gap:8px}.brand{gap:8px}.brand b{font-size:19px}.brand small{font-size:9px}.site-header nav{display:flex;margin-left:auto;gap:0}.site-header nav>button:first-child{display:none}.site-header nav .handbook-link{display:flex;flex-direction:column;gap:2px;font-size:11px;padding:2px;min-width:44px;min-height:44px}.header-actions .icon-button{width:36px;height:44px;padding:6px}.room-page{height:calc(100dvh - 64px - 66px - var(--room-safe-bottom));padding-inline:12px;padding-top:12px}.room-heading{margin-bottom:16px}.room-heading h1{font-size:23px}.room-tools{width:100%;gap:8px}.room-tools .room-code{margin-right:auto}.room-tools .btn{padding:8px 10px;font-size:13px}.room-tools .icon-button{min-width:44px;min-height:44px}.kind-draw.game-surface{padding:12px 5px}.draw-game canvas{display:block;width:100%;height:auto;aspect-ratio:8/5}.draw-game .inline-form,.draw-header,.draw-tools{margin-inline:5px}.draw-tools{flex-wrap:wrap}.draw-tools button,.draw-tools select{min-height:44px}.draw-tools .swatch{width:36px;height:44px}.game-result{gap:10px;padding:12px}.game-result h2{font-size:21px}.lobby{padding:16px 14px 0}.lobby-heading{margin-bottom:12px}.lobby-heading h1{font-size:24px;line-height:1.3}.lobby-heading h1 br{display:none}.lobby-heading .title-star{font-size:26px;margin-left:6px}.scribble-label{font-size:12px;margin-bottom:4px}.lobby-top{gap:12px}.featured{min-height:0}.feature-copy{width:100%;padding:14px}.feature-copy h2{font-size:24px;margin:8px 0 5px}.feature-copy p{font-size:12px;line-height:1.5}.feature-info{font-size:11px;margin:8px 0}.feature-copy .btn{min-height:44px;font-size:13px;padding:8px 11px}.feature-copy .text-button{min-height:44px;padding:8px}.featured .feature-art{width:84px;height:84px;right:12px;top:30px}.featured .feature-drawing .game-preview{width:84px;height:84px;transform:none}.feature-copy p{max-width:calc(100% - 55px)}.join-panel{padding:12px;gap:8px}.join-panel h2{font-size:16px}.join-panel p{display:none}.join-panel .btn,.join-panel input{grid-row:2;min-height:44px}.section-title{margin:18px 0 12px}.section-title h2{font-size:19px}.recent-room{min-height:44px;font-size:13px;margin-bottom:12px}}.game-paywall-lock{display:inline-flex;align-items:center;gap:4px;color:var(--muted);font-size:11px;line-height:1.5;margin-top:4px}.site-header nav .benefits-link{display:flex;align-items:center;gap:6px;white-space:nowrap}.paywall-modal{width:min(520px,100%);padding:28px}.paywall-modal.paywall-pricing{width:min(820px,100%)}.paywall-modal h2{padding-right:20px;line-height:1.4;text-wrap:balance}.paywall-modal h3{font-size:16px;margin:0}.paywall-tiers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:26px 0 18px}.paywall-tier{display:flex;flex-direction:column;padding:18px 14px;border:1.5px solid var(--ink);border-radius:6px 11px 7px 9px;background:var(--paper);min-width:0}.paywall-best{background:#fff3bf;border-width:2px;transform:rotate(-.5deg)}.paywall-tier-heading{min-height:48px;display:flex;flex-wrap:wrap;align-content:start;align-items:center;gap:5px}.paywall-best-label{font-size:11px;padding:3px 6px;color:#fff;background:var(--blue);border-radius:4px}.paywall-tier .paywall-price{font-size:34px;font-weight:800;margin:10px 0 6px;line-height:1.2;font-variant-numeric:tabular-nums}.paywall-duration{font-size:13px;margin:0 0 6px}.paywall-tier-note{min-height:20px;margin:0 0 20px;font-size:12px;font-weight:600}.paywall-tier .btn{margin-top:auto;padding:10px 8px;text-align:center;text-decoration:none;min-height:44px;font-size:13px}.paywall-note{font-size:13px;color:var(--muted);line-height:1.8;margin:14px 0}.paywall-links{border-top:1px dashed #b9baaf;margin-top:24px;padding-top:14px;display:flex;flex-direction:column;align-items:flex-start;gap:6px}.paywall-links .text-button{min-height:40px;text-align:left}.paywall-validity{font-size:16px;font-weight:650;line-height:1.7;display:flex;align-items:start;gap:8px}.paywall-validity svg{flex-shrink:0;margin-top:3px}.paywall-benefits{margin:20px 0}.paywall-benefits>p,.paywall-receipt>p{line-height:1.8}.paywall-code{font-family:ui-monospace,monospace;letter-spacing:.025em;font-size:14px}.paywall-recovery-secret{display:block;width:100%;min-height:100px;padding:12px;resize:vertical;line-height:1.7;white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-all;border:1px solid var(--ink);border-radius:6px;background:#fffdf5}.paywall-receipt .btn{margin-top:12px}.paywall-error{background:#fff0e9;color:#8b2c20;padding:12px;border:1px solid #c89a8d;border-radius:6px;font-size:14px;line-height:1.7;margin:14px 0}.paywall-channel{border-top:1px dashed #b9baaf;padding-top:20px;margin-top:20px}.paywall-channel textarea{width:100%;resize:vertical;min-height:82px;font-size:14px;line-height:1.6;padding:10px;border:1px solid var(--ink);border-radius:6px;background:#fffdf5;overflow-wrap:anywhere}.paywall-channel ol{padding-left:24px;font-size:14px;line-height:1.9}.paywall-channel .btn{margin-top:10px}.paywall-channel textarea,.paywall-code,.paywall-selectable{user-select:text;overflow-wrap:anywhere}.paywall-copy-status{line-height:1.7;font-size:13px;color:var(--blue)}.paywall-host-note{background:#fff3bf}.paywall-modal :focus-visible{outline:2px solid var(--blue);outline-offset:3px}.paywall-modal ::selection{color:var(--ink);background:#f2d66e}@media (max-width:650px){.site-header nav .benefits-link{flex-direction:column;gap:2px;font-size:11px;padding:2px;min-width:48px;min-height:44px}.paywall-backdrop{padding:12px}.paywall-modal{padding:22px 18px;max-height:calc(100dvh - 24px)}.paywall-modal h2{font-size:22px;margin-top:12px}.paywall-tiers{grid-template-columns:1fr;gap:12px;margin-top:20px}.paywall-tier{padding:14px;display:grid;grid-template-columns:1fr auto;column-gap:12px;align-items:center}.paywall-tier-heading{min-height:0;grid-column:1}.paywall-tier .paywall-price{grid-column:2;grid-row:1/3;margin:0;font-size:30px}.paywall-duration{grid-column:1;margin:5px 0 0}.paywall-tier-note{grid-column:1;margin:10px 0 0;min-height:0}.paywall-tier .btn{grid-column:2;grid-row:3;width:auto;min-width:104px;margin-top:10px}.paywall-tier h3{font-size:15px}}