@import url('./tips.css');
/* The finished game stays compact; support never hides the record or rematch. */
.postgame{margin:20px 0;padding:20px;border:1px solid #52627d;border-radius:16px;background:#142035;scroll-margin:80px}
.postgame[hidden]{display:none}
.postgame h3{margin:0 0 8px}
.postgame>p{color:#b4c3d6;font-size:14px;line-height:1.8}
.postgame:focus-visible{outline:2px solid #9dcddd;outline-offset:4px}
/* Keep human and agent support equally reachable without another large panel. */
.tip-bar .tip-agent{gap:10px;padding:9px 14px;border:1px solid #bba8cb;border-radius:5px;background:#ede7f3;color:#58406e;font-size:14px;font-weight:500;text-decoration:none}
.tip-bar--night .tip-agent{background:#30253e;border-color:#8d759f;color:#ead7fa}
.tip-bar .tip-agent span{font-size:11px;white-space:nowrap}.tip-bar .tip-button{border-radius:5px}
.agent-shortcut{display:flex;align-items:center;flex-wrap:wrap;gap:4px 10px;margin-top:10px;font-size:12px;line-height:1.6}
.agent-shortcut a{text-underline-offset:4px}.agent-shortcut button{display:inline-block;width:auto;min-height:44px;margin:0;padding:6px 10px;border:1px solid var(--tip-line);border-radius:4px;background:none;color:var(--tip-ink);font:inherit;cursor:pointer}
.agent-shortcut [data-x402-status]{font-size:11px;color:var(--tip-muted)}.agent-shortcut [data-mode=live]::before{content:'● ';color:#71aa92}
.tip-content .copy-feedback,#postgame .copy-feedback{margin:8px 0 0;font-size:12px;color:var(--tip-muted,#aebed1);line-height:1.7}.copy-feedback:empty{display:none}
.entrance-page .tip-bar{max-width:none;margin:24px 0 0;padding:18px 0 0;border:0;border-top:1px solid #d5d9dd;border-radius:0;background:none;box-shadow:none;align-items:flex-start;gap:14px}
.entrance-page .tip-avatar{width:48px;height:62px;border-radius:4px}.entrance-page .tip-bar .tip-title{font-size:16px;font-weight:500}.entrance-page .tip-bar .tip-caption{font-size:13px}.entrance-page .tip-bar .support-english{font-size:12px;color:#687889}
.gate-page .tip-bar{display:grid;grid-template-columns:48px minmax(0,1fr);column-gap:12px;row-gap:0;padding:20px 0;margin:20px 0;border:0;border-block:1px solid var(--line);border-radius:0;background:none;align-items:start;box-shadow:none}
.gate-page .tip-avatar{grid-column:1;grid-row:1 / 4;width:48px;height:62px;border-radius:5px}
.gate-page .tip-content{display:contents}.gate-page .tip-content>p{grid-column:2}.gate-page .tip-bar .tip-title{font-weight:500}
/* Actions share the panel edges, independently of the portrait and label length. */
.gate-page .tip-bar .tip-actions{grid-column:1 / -1;display:grid;grid-template-columns:minmax(0,1fr);grid-auto-rows:1fr;gap:8px;margin-top:16px;align-items:stretch}
.gate-page .tip-bar .tip-agent,.gate-page .tip-bar .tip-button{box-sizing:border-box;width:100%;min-width:0;min-height:48px;justify-content:space-between;gap:12px;padding:10px 14px;border-radius:5px;font-size:14px;font-weight:500;line-height:1.6}
.gate-page .tip-bar .tip-agent span,.gate-page .tip-bar .tip-button span{font-size:12px;font-weight:400}
.gate-page .agent-shortcut{grid-column:1 / -1;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;margin-top:8px}
.gate-page .agent-shortcut>a{display:flex;align-items:center;min-height:44px}.gate-page .agent-shortcut button{min-width:76px;border-radius:5px;padding:8px 12px}
.gate-page .agent-shortcut [data-x402-status]{grid-column:1 / -1}.gate-page .tip-content>.copy-feedback{grid-column:1 / -1}
.gate-page .postgame{padding:20px;background:#142431;border:1px solid #537285;border-radius:5px}.gate-page .agent-copy-button{font-size:13px!important;text-align:left;line-height:1.7;margin-top:12px}.postgame-tip{display:flex;gap:12px;flex-wrap:wrap}.postgame-tip a{display:inline-flex;align-items:center;min-height:44px;font-size:14px;text-underline-offset:4px}
.gate-page .postgame>.secondary{box-sizing:border-box;width:100%;min-height:48px;padding:10px 14px}
.gate-page .postgame .postgame-tip{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}.gate-page .postgame-tip a{box-sizing:border-box;min-height:48px;padding:10px 14px;border:1px solid #537285;border-radius:5px;line-height:1.6}
@media(max-width:380px){.entrance-page .tip-avatar{display:none}.entrance-page .tip-actions{gap:8px}.entrance-page .tip-bar .tip-button,.entrance-page .tip-bar .tip-agent{padding:8px 12px;font-size:13px}}