/* The header uses the same proportions and colors as the bot avatar. */
.brand .brand-ball,
body:is([data-screen=game],[data-screen=practice],[data-screen=joining]) .brand .brand-ball,
.landscape-table .brand .brand-ball{display:block;width:34px;height:34px;flex:0 0 34px;border:0;border-radius:50%;background:none;box-shadow:none}

/* A top-layer dialog centers within Telegram's usable viewport, not the table. */
#result-panel{--result-accent:#e8c87e;--result-tint:#343827;--result-bg:#182a24;position:fixed;inset:var(--tg-content-top,env(safe-area-inset-top,0px)) max(16px,var(--tg-content-right,env(safe-area-inset-right,0px))) var(--content-bottom,0px) max(16px,var(--tg-content-left,env(safe-area-inset-left,0px)));transform:none;margin:auto;width:min(328px,calc(100% - 32px));height:fit-content;max-height:calc(var(--viewport-height,100dvh) - var(--tg-content-top,0px) - var(--content-bottom,0px) - 32px);overflow-y:auto;padding:26px 22px 15px;text-align:center;color:#f4efdf;background:linear-gradient(155deg,var(--result-tint),var(--result-bg) 42%);border:1px solid color-mix(in srgb,var(--result-accent) 24%,transparent);border-top:3px solid var(--result-accent);border-radius:24px;box-shadow:0 20px 55px #0007}
#result-panel::backdrop{background:#07110ed1;backdrop-filter:blur(2px)}
#result-panel.result-lost{--result-accent:#f0a49b;--result-tint:#3b2928;--result-bg:#222725}
#result-panel .result-emblem{width:56px;height:56px;display:grid;place-items:center;margin:0 auto 17px;border-radius:50%;background:color-mix(in srgb,var(--result-accent) 12%,transparent);color:var(--result-accent);border:1px solid color-mix(in srgb,var(--result-accent) 25%,transparent)}
#result-panel .result-emblem svg{width:25px;height:25px;stroke-width:1.6}
#result-panel .result-loss-icon,#result-panel.result-lost .result-win-icon{display:none}
#result-panel.result-lost .result-loss-icon{display:block}
#result-panel h2{font:650 32px/1.13 'DM Sans',sans-serif;letter-spacing:-1.2px;color:var(--result-accent);margin:0 0 14px}
#result-panel h2:focus{outline:none}
#result-panel #result-reason{font-size:14px;line-height:1.55;color:#f4efdf;margin:0;min-height:44px}
#result-panel .result-buttons{border-top:1px solid #ffffff14;margin-top:23px;padding-top:23px;display:grid;gap:8px}
#result-panel button{min-height:48px;width:100%;padding:12px 8px;border-radius:13px;background:#eee6ce;color:#17271f;border:0;font:600 14px/1.3 'DM Sans',sans-serif}
#result-panel .result-quit{margin:0;background:transparent;color:#eee6ce;border:1px solid #a9bcaf66}
#result-panel.result-anonymous .result-quit{background:#eee6ce;color:#17271f;border:0}
#result-panel #result-chat-hint{font-size:11px;line-height:1.6;color:#a9b8af;margin:12px 0 4px}
#result-panel #result-feedback{font-size:12px;line-height:1.5;color:var(--result-accent);margin:12px 0 0}
#result-panel .result-inspect{background:transparent;border:0;color:#e0e6df;min-height:44px;padding:10px;font-size:12px;font-weight:400;text-decoration:underline;text-decoration-color:#e0e6df55;text-underline-offset:4px;margin-top:4px}
.result-reopen{position:absolute;bottom:13%;left:50%;transform:translateX(-50%);background:#eee6ce;color:#17271f;padding:12px 18px;white-space:nowrap;border:0;border-radius:20px;font-size:13px;font-weight:600;min-height:44px;z-index:3}
.result-reopen:not(:disabled):active{transform:translateX(-50%) translateY(1px)}
@media(max-width:360px){#result-panel{padding-left:16px;padding-right:16px}#result-panel h2{font-size:29px}}
@media(max-height:540px){#result-panel{width:min(380px,calc(100% - 32px));padding:16px 20px 8px;border-radius:18px}#result-panel .result-emblem{display:none}#result-panel h2{font-size:28px;margin-bottom:8px}#result-panel #result-reason{min-height:0;font-size:13px}#result-panel .result-buttons{margin-top:14px;padding-top:14px}#result-panel .result-buttons:has(#rematch-button:not([hidden])){grid-template-columns:1fr 1fr}#result-panel #result-chat-hint{margin:8px 0 0}}