.online-tools{display:flex;gap:8px;align-items:center}
.top-ten-button{min-height:44px;padding:8px 14px;border:1px solid var(--line);background:#051813a6;color:var(--green);font:700 10px var(--mono);letter-spacing:1px;clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px)}
.top-ten-button:focus-visible{clip-path:none;outline:2px solid var(--green);outline-offset:2px}
.online-dialog{width:min(620px,calc(100vw - 28px));max-height:calc(100dvh - 28px);padding:30px;background:#031710;color:#d5f5df;border:1px solid #357655;box-shadow:0 0 50px #00170f80;overflow-y:auto}
.online-dialog::backdrop{background:#020d0ce8;backdrop-filter:blur(8px)}
.online-dialog h2{font-family:var(--sans,Arial,sans-serif);font-size:36px;line-height:1.08;margin:16px 0 12px;letter-spacing:-1px}
.online-dialog h2 span{color:var(--green)}
.online-dialog p{font-size:12px;line-height:1.6;color:#a2c4b0}
.online-dialog .primary,.online-dialog .secondary{width:100%;min-height:46px;margin-top:10px}
.online-dialog label{display:block;font:9px var(--mono);letter-spacing:1px;color:#91bfaa}
.online-dialog input[type=text],.online-dialog select{width:100%;min-height:46px;margin-top:8px;border:1px solid #357655;border-radius:0;background:#02120d;color:#daffea;padding:10px 12px;font:14px var(--mono);box-sizing:border-box;color-scheme:dark}
.online-dialog input:focus,.online-dialog select:focus{outline:2px solid var(--green);outline-offset:2px}
#name-dialog{max-width:440px}
#name-form{margin-top:22px}
.online-dialog .name-note{font-size:10px;margin:12px 0}
#name-error{font-size:11px;min-height:18px;letter-spacing:0;color:#d5f5df}
#name-submit:disabled{opacity:.6;cursor:wait}
.board-heading{display:flex;align-items:start;justify-content:space-between;gap:15px}
.board-heading h2{margin:10px 0 7px}
.board-heading .icon-button{min-width:44px;min-height:44px}
.board-subtitle{margin:0 0 18px}
.board-identity{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:10px 0;font:11px/1.6 var(--mono)}
.board-filters{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}
.online-dialog .board-assault{grid-column:1/-1;display:flex;align-items:center;gap:9px;min-height:36px;font-size:10px;letter-spacing:.5px}
.board-assault input{width:18px;height:18px;accent-color:var(--green)}
.board-live{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:8px 0 12px;font:9px var(--mono);color:#91bfaa}
#board-status[data-state=online]{color:var(--green)}
#board-refresh{background:transparent;border:1px solid var(--line);color:#b2ccbc;min-height:36px;padding:7px 9px;font:9px var(--mono)}
.board-table{width:100%;border-collapse:collapse;table-layout:fixed;font-family:var(--mono)}
.board-table th{text-align:left;font-size:8px;font-weight:400;letter-spacing:1px;color:#83a792;padding:9px 6px;border-bottom:1px solid var(--line)}
.board-table th:first-child{width:34px}.board-table th:last-child{width:100px;text-align:right}
.board-table td{padding:11px 6px;border-bottom:1px solid #234b3a80;vertical-align:middle}
.board-table strong{font-size:12px;font-weight:600;display:block;overflow-wrap:anywhere}
.board-table small{font-size:8px;color:#83a792;display:block;margin-top:5px;line-height:1.5}
.board-rank{font-size:16px;color:#83a792}.board-score{text-align:right;color:var(--green)}
.board-table tr:first-child .board-rank{color:var(--green)}
.your-record{background:#1e523d55}
#board-empty{padding:24px 6px;text-align:center;font-size:12px}
.board-foot{font:9px/1.6 var(--mono)!important;color:#83a792!important;margin:17px 0 0}
.online-result-box{border-top:1px solid var(--line);padding-top:10px;margin:13px 0}
#online-result{font:10px/1.6 var(--mono);color:var(--green);margin:0}
#online-retry{margin:6px 0;padding:7px 0;min-height:32px}
#result-leaderboard{min-height:42px;font-size:10px;margin:10px 0 0;width:100%}
@media(max-width:650px){.online-tools{gap:6px}.top-ten-button{padding:8px 10px;font-size:9px}.online-dialog{padding:22px 18px}.online-dialog h2{font-size:30px}.board-table th:last-child{width:86px}.board-table strong{font-size:11px}.board-filters{gap:8px}.online-dialog select{font-size:12px;padding:10px 8px}.board-live{font-size:8px}.board-heading .eyebrow{font-size:8px}.online-dialog .name-note{font-size:10px}}