*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%;margin:0}body{background:var(--dx-color-bg);color:var(--dx-color-text);font-family:var(--dx-font-family);font-size:var(--dx-font-size-md);overscroll-behavior:none;-webkit-font-smoothing:antialiased;-webkit-user-select:none;user-select:none;line-height:1.35}button{font:inherit;color:inherit}.num{font-variant-numeric:tabular-nums}.shell{height:100%;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);flex-direction:column;display:flex}.topbar{justify-content:space-between;align-items:center;gap:var(--dx-space-md);padding:var(--dx-space-sm) var(--dx-space-lg);min-height:52px;display:flex}.brand{font-weight:var(--dx-font-weight-bold);font-size:var(--dx-font-size-lg);letter-spacing:-.02em}.brand span{color:var(--dx-color-accent)}.balance{align-items:center;gap:var(--dx-space-sm);min-height:var(--dx-touch-min);padding:0 var(--dx-space-md);border-radius:var(--dx-radius-pill);background:var(--dx-color-surface);border:1px solid var(--dx-color-border);font-weight:var(--dx-font-weight-bold);font-size:var(--dx-font-size-md);display:inline-flex}.balance small{color:var(--dx-color-textMuted);font-weight:var(--dx-font-weight-regular);font-size:var(--dx-font-size-xs)}.content{min-height:0;padding:0 var(--dx-space-lg) var(--dx-space-xl);gap:var(--dx-space-lg);flex-direction:column;flex:1;display:flex;overflow-y:auto}.content.tight{gap:0;padding:0;overflow:hidden}.nav{border-top:1px solid var(--dx-color-border);background:var(--dx-color-bgElevated);grid-template-columns:repeat(5,1fr);display:grid}.nav button{min-height:56px;color:var(--dx-color-textMuted);font-size:var(--dx-font-size-xs);transition:color var(--dx-motion-fast);background:0 0;border:0;flex-direction:column;justify-content:center;align-items:center;gap:2px;display:flex}.nav button.active{color:var(--dx-color-accent)}.nav .icon{font-size:20px;line-height:1}.btn{justify-content:center;align-items:center;gap:var(--dx-space-sm);min-height:52px;padding:0 var(--dx-space-xl);border-radius:var(--dx-radius-lg);font-weight:var(--dx-font-weight-bold);font-size:var(--dx-font-size-md);cursor:pointer;transition:transform var(--dx-motion-fast), opacity var(--dx-motion-fast), background var(--dx-motion-fast);border:0;display:inline-flex}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.5;cursor:default}.btn.primary{background:var(--dx-color-accent);color:var(--dx-color-accentText);box-shadow:var(--dx-shadow-raised)}.btn.secondary{background:var(--dx-color-surface);color:var(--dx-color-text);border:1px solid var(--dx-color-border)}.btn.ghost{color:var(--dx-color-textMuted);min-height:var(--dx-touch-min);background:0 0}.btn.danger{color:var(--dx-color-danger);border:1px solid var(--dx-color-border);background:0 0}.btn.block{width:100%}.btn.big{min-height:64px;font-size:var(--dx-font-size-lg)}.card{background:var(--dx-color-surface);border:1px solid var(--dx-color-border);border-radius:var(--dx-radius-lg);padding:var(--dx-space-lg);gap:var(--dx-space-md);flex-direction:column;display:flex}.card h2{font-size:var(--dx-font-size-md);font-weight:var(--dx-font-weight-medium);color:var(--dx-color-textMuted);margin:0}.hero{text-align:center;align-items:center;gap:var(--dx-space-md);padding:var(--dx-space-xl) 0;flex-direction:column;display:flex}.hero h1{font-size:var(--dx-font-size-xl);letter-spacing:-.02em;margin:0}.muted{color:var(--dx-color-textMuted)}.faint{color:var(--dx-color-textFaint);font-size:var(--dx-font-size-sm)}.row{justify-content:space-between;align-items:center;gap:var(--dx-space-md);display:flex}.stack{gap:var(--dx-space-sm);flex-direction:column;display:flex}.big-number{font-size:var(--dx-font-size-xxl);font-weight:var(--dx-font-weight-bold);letter-spacing:-.03em}.list{background:var(--dx-color-border);border-radius:var(--dx-radius-md);flex-direction:column;gap:1px;display:flex;overflow:hidden}.list>*{background:var(--dx-color-surface);padding:var(--dx-space-md) var(--dx-space-lg);min-height:var(--dx-touch-min);justify-content:space-between;align-items:center;gap:var(--dx-space-md);display:flex}.list .me{background:var(--dx-color-surfaceHover)}.state{justify-content:center;align-items:center;gap:var(--dx-space-md);padding:var(--dx-space-xxl) var(--dx-space-lg);text-align:center;color:var(--dx-color-textMuted);flex-direction:column;display:flex}.spinner{border:3px solid var(--dx-color-border);border-top-color:var(--dx-color-accent);border-radius:50%;width:28px;height:28px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.toasts{left:var(--dx-space-lg);right:var(--dx-space-lg);bottom:calc(72px + env(safe-area-inset-bottom,0px));gap:var(--dx-space-sm);pointer-events:none;z-index:10;flex-direction:column;display:flex;position:fixed}.toast{padding:var(--dx-space-md) var(--dx-space-lg);border-radius:var(--dx-radius-md);background:var(--dx-color-bgElevated);border:1px solid var(--dx-color-border);box-shadow:var(--dx-shadow-card);animation:rise var(--dx-motion-normal) ease-out}.toast.error{border-color:var(--dx-color-danger)}.toast.success{border-color:var(--dx-color-accent)}@keyframes rise{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.pill{padding:2px var(--dx-space-sm);border-radius:var(--dx-radius-pill);background:var(--dx-color-bgElevated);color:var(--dx-color-textMuted);font-size:var(--dx-font-size-xs);align-items:center;display:inline-flex}.pill.accent{color:var(--dx-color-accent)}.pill.danger{color:var(--dx-color-danger)}.match{flex-direction:column;height:100%;display:flex}.match .players{align-items:center;gap:var(--dx-space-md);padding:var(--dx-space-sm) var(--dx-space-lg);grid-template-columns:1fr auto 1fr;display:grid}.player{flex-direction:column;gap:2px;min-width:0;display:flex}.player.right{text-align:right}.player .name{font-weight:var(--dx-font-weight-medium);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.player.onturn .name{color:var(--dx-color-accent)}.score{font-size:var(--dx-font-size-lg);font-weight:var(--dx-font-weight-bold)}.board-wrap{min-height:0;padding:0 var(--dx-space-sm);flex:1;justify-content:center;align-items:center;display:flex}.board-wrap canvas{touch-action:none;border-radius:var(--dx-radius-md);width:100%;height:100%;display:block}.match .actions{gap:var(--dx-space-sm);padding:var(--dx-space-sm) var(--dx-space-lg);align-items:center;min-height:64px;display:flex}.match .status{color:var(--dx-color-textMuted);font-size:var(--dx-font-size-sm);flex:1}.emoji-bar{gap:var(--dx-space-xs);display:flex}.emoji-bar button{width:var(--dx-touch-min);height:var(--dx-touch-min);border-radius:var(--dx-radius-md);border:1px solid var(--dx-color-border);background:var(--dx-color-surface);font-size:20px}.emoji-pop{animation:pop var(--dx-motion-slow) ease-out;pointer-events:none;font-size:40px;position:absolute;top:12px;left:50%;transform:translate(-50%)}@keyframes pop{0%{opacity:0;transform:translate(-50%)scale(.6)}to{opacity:1;transform:translate(-50%)scale(1)}}.overlay{padding:var(--dx-space-lg);animation:rise var(--dx-motion-normal) ease-out;background:#0b1020b8;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.overlay .card{text-align:center;align-items:center;width:min(360px,100%)}.relative{position:relative}.bracket{gap:var(--dx-space-sm);grid-template-columns:repeat(3,1fr);display:grid}.bracket .round{justify-content:space-around;gap:var(--dx-space-sm);flex-direction:column;display:flex}.bracket .game{background:var(--dx-color-surface);border:1px solid var(--dx-color-border);border-radius:var(--dx-radius-sm);padding:var(--dx-space-xs) var(--dx-space-sm);font-size:var(--dx-font-size-xs);flex-direction:column;gap:2px;display:flex}.bracket .game div{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.bracket .game .win{color:var(--dx-color-accent);font-weight:var(--dx-font-weight-bold)}.bracket .game .lose{color:var(--dx-color-textFaint);text-decoration:line-through}.bracket .game .you{text-decoration:underline}.countdown{font-size:var(--dx-font-size-xxl);font-weight:var(--dx-font-weight-bold);letter-spacing:-.03em;font-variant-numeric:tabular-nums}.seats{gap:var(--dx-space-xs);justify-content:center;display:flex}.seat{border:2px solid var(--dx-color-border);width:22px;height:22px;transition:background var(--dx-motion-normal);border-radius:50%}.seat.full{background:var(--dx-color-accent);border-color:var(--dx-color-accent)}.tabs{gap:var(--dx-space-xs);background:var(--dx-color-bgElevated);padding:var(--dx-space-xs);border-radius:var(--dx-radius-md);display:flex}.tabs button{border-radius:var(--dx-radius-sm);min-height:40px;color:var(--dx-color-textMuted);background:0 0;border:0;flex:1}.tabs button.active{background:var(--dx-color-surface);color:var(--dx-color-text)}code{font-family:var(--dx-font-mono);font-size:var(--dx-font-size-xs);word-break:break-all;color:var(--dx-color-textMuted)}.dice-row{gap:var(--dx-space-xs);flex-wrap:wrap;display:flex}.dice-row span{border-radius:var(--dx-radius-sm);background:var(--dx-color-bgElevated);font-family:var(--dx-font-mono);font-size:var(--dx-font-size-xs);padding:2px 6px}.ok{color:var(--dx-color-accent)}.bad{color:var(--dx-color-danger)}