:root{font-family:"Segoe UI",Arial,sans-serif;color:#202522;background:#f7f8f6;color-scheme:light;--ink:#202522;--muted:#626b65;--line:#e0e5df;--accent:#315c46;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;font-size:15px;line-height:1.6;background:#f7f8f6}[hidden],.view-hidden{display:none!important}
a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}button,input,select,textarea{font:inherit}button,a,summary,select{touch-action:manipulation}
:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.skip-link{position:fixed;top:-80px;left:16px;z-index:100;padding:12px 20px;background:var(--ink);color:white}.skip-link:focus{top:12px}
.app-shell{display:grid;grid-template-columns:232px minmax(0,1fr);min-height:100vh}
.workspace-sidebar{position:sticky;top:0;height:100vh;padding:34px 22px 24px;display:flex;flex-direction:column;border-right:1px solid var(--line);background:#f1f3ef}
.brand{display:flex;align-items:center;gap:9px;color:var(--ink);font-size:20px;font-weight:750;letter-spacing:-.7px}.brand:hover{text-decoration:none}.brand-symbol{display:grid;place-items:center;width:30px;height:30px;border-radius:7px;background:var(--ink);color:white;font-size:22px;line-height:1;padding-bottom:5px;letter-spacing:-3px;padding-right:4px}.brand-label{font-size:9px;letter-spacing:1.5px;color:var(--muted);font-weight:600;margin-top:4px}
.sidebar-caption{color:var(--muted);font-size:10px;letter-spacing:1.5px;margin:27px 0 22px 4px}
#workspace-nav{display:flex;flex-direction:column;gap:5px}#workspace-nav a{display:flex;align-items:center;gap:14px;min-height:45px;padding:10px 12px;color:#59635b;border-radius:6px;font-size:14px;font-weight:500}#workspace-nav a:hover{text-decoration:none;color:var(--ink);background:#e7ebe4}#workspace-nav a[aria-current]{background:#e0e8dc;color:#23402c;font-weight:650}.nav-number{font:10px Consolas,monospace;opacity:.65}
.sidebar-bottom{margin-top:auto}.account{padding:18px 4px;border-top:1px solid var(--line)}.account strong{display:block;font-size:13px;overflow-wrap:anywhere}#overview{font-size:11px;color:var(--muted);margin:4px 0 10px}.legacy-link{display:flex;justify-content:space-between;font-size:12px;padding:15px 4px 0;color:var(--muted);border-top:1px solid var(--line)}
main{width:100%;max-width:1280px;margin:0 auto;padding:48px clamp(24px,4.5vw,76px) 24px;min-width:0}
.page-header{display:flex;align-items:start;justify-content:space-between;gap:20px;margin-bottom:32px}.eyebrow{font-size:10px;font-weight:650;letter-spacing:1.8px;color:var(--muted);margin:0 0 12px}h1{font-size:clamp(27px,3vw,38px);font-weight:650;line-height:1.25;letter-spacing:-1.3px;margin:0 0 10px}h1:focus{outline:none}h2{font-size:18px;font-weight:650;letter-spacing:-.4px;margin:0 0 16px;line-height:1.4}h3{font-size:15px;font-weight:600}p{margin:0 0 16px}#page-description{color:var(--muted);margin:0;font-size:14px;max-width:660px}.edition-label{padding-top:5px;font-size:9px;color:#6b756d;letter-spacing:1.6px;white-space:nowrap}
section{padding:28px;border:1px solid var(--line);background:white;border-radius:10px;margin-bottom:20px;min-width:0;max-width:none}
#resources-panel,#submission-panel,#admin-tools,#scores-panel,#rule-panel,#match-panel,#replay-panel,#admin-guide{max-width:none;margin:0 0 20px}
.panel-heading{display:flex;justify-content:space-between;align-items:start;gap:18px;margin-bottom:18px}.panel-heading h2{margin-bottom:6px}.panel-heading p{margin:0}.panel-heading button{margin:0}.small-tag{flex-shrink:0;font:11px Consolas,monospace;color:var(--muted);border:1px solid var(--line);border-radius:4px;padding:6px 9px}
label{display:block;margin:18px 0 7px;font-weight:600;font-size:13px;color:#3e4941}input,select,textarea{width:100%;min-width:0;padding:11px 12px;border:1px solid #b6c0b7;border-radius:6px;background:white;color:var(--ink);min-height:44px}input::placeholder,textarea::placeholder{color:#788078}input:focus,select:focus,textarea:focus{border-color:var(--accent)}textarea{resize:vertical}input[type=range]{padding:0;accent-color:var(--accent)}input[type=file]{padding:9px;background:#fafbf9;font-size:13px}input::file-selector-button{padding:5px 10px;margin-right:12px;border-radius:4px;border:1px solid #b6c0b7;background:white;color:var(--ink);cursor:pointer}
button,.primary-link{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:10px 17px;margin-top:20px;border:1px solid transparent;border-radius:6px;background:var(--accent);color:white;font-size:13px;font-weight:600;cursor:pointer;transition:background-color .15s,border-color .15s}button:hover,.primary-link:hover{background:#244835;text-decoration:none}button:disabled{opacity:.5;cursor:default}
.secondary-button,td button,.submission-actions button,#refresh-monitor,#refresh-scores,#check-sandbox,#rule-new,#close-replay,#close-password{background:white;color:#39483d;border-color:#b6c0b7}.secondary-button:hover,td button:hover,.submission-actions button:hover,#refresh-monitor:hover,#refresh-scores:hover,#check-sandbox:hover,#rule-new:hover{background:#eff3ec}
.text-button{padding:4px 0;margin:0 12px 0 0;min-height:32px;background:transparent;color:var(--muted);border:0;font-size:11px;font-weight:500}.text-button:hover{color:var(--ink);background:transparent;text-decoration:underline}
.muted,.optional{font-size:13px;color:var(--muted);font-weight:400;line-height:1.7}details{margin-top:18px;border-top:1px solid var(--line);padding-top:16px}details p,details ol,details dl{font-size:13px;line-height:1.8;color:#566159}summary{cursor:pointer;color:#46544a;font-size:13px;font-weight:600;padding:4px 0}details[open]>summary{margin-bottom:12px}pre{white-space:pre-wrap;overflow-wrap:anywhere;max-height:340px;overflow:auto;padding:18px;border:1px solid var(--line);background:#f5f7f3;color:#3c4b40;border-radius:6px;font:12px/1.8 Consolas,monospace}
#message{color:#8a3b24;font-size:13px;white-space:pre-wrap}#message:not(:empty){position:fixed;bottom:24px;left:max(24px,calc(50% - 200px));z-index:30;max-width:min(580px,calc(100vw - 48px));padding:14px 20px;background:#fff8ed;border:1px solid #d6bd99;border-radius:8px;box-shadow:0 4px 20px #2025220a}
footer{display:flex;flex-wrap:wrap;gap:20px;color:var(--muted);border-top:1px solid var(--line);padding-top:22px;margin-top:40px;font-size:11px}footer a{color:var(--muted)}footer span{margin-left:auto}
.match-form,.submission-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 20px}.match-form{grid-template-columns:repeat(3,minmax(0,1fr))}.match-form>button{grid-column:1/-1;justify-self:start}.practice-rule-field{grid-column:1/-1}
.match-row,.submission-row{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:18px 0;border-bottom:1px solid var(--line)}.match-row strong,.submission-row strong{font-size:13px;font-weight:600}.match-row p,.submission-row p{font-size:12px;color:var(--muted);margin:6px 0 0;overflow-wrap:anywhere}.match-row button{margin:0;flex-shrink:0}.section-heading{margin-top:34px;border-top:1px solid var(--line);padding-top:26px}
.submission-actions{display:flex;flex-wrap:wrap;gap:8px;flex-shrink:0}.submission-actions button{margin:0;font-size:12px}.submission-row>div:first-child{min-width:0}.submission-row strong{display:block;margin-bottom:8px;overflow-wrap:anywhere}.status-badge{display:inline-block;padding:3px 7px;margin:0 6px 3px 0;border-radius:4px;border:1px solid #d9ded7;background:#f4f6f2;color:#59635b;font-size:10px;line-height:1.7}.status-badge.accepted,.status-badge.active{background:#edf3e9;color:#315536;border-color:#ccdac5}.status-badge.rejected{background:#fbefeb;color:#943d2d;border-color:#eacbc2}
#submission-message,#submission-reason{font-size:13px;white-space:pre-wrap;color:#805125;margin:16px 0;overflow-wrap:anywhere}#submission-message:empty{display:none}#submission-detail{border-top:1px solid var(--line);margin-top:26px;padding-top:24px}.pipeline{display:flex;flex-wrap:wrap;gap:7px;padding:0;margin:20px 0;list-style:none}.pipeline li{border:1px solid var(--line);border-radius:4px;padding:7px 10px;font-size:11px;color:#667166}.pipeline .done{border-color:#cbdac4;background:#eff5ec;color:#355335}.pipeline .current{border-color:#6b8061;background:#f5f8f1;color:#344e2c}.pipeline .failed{border-color:#dfbfb4;color:#943d2d;background:#fcf1ec}#submission-tests{display:flex;flex-wrap:wrap;gap:8px}#submission-tests button{margin:0}
.contestant-guide{border:1px solid var(--line);background:#fafbf8;padding:12px 16px;border-radius:6px;margin:18px 0;color:#566159}.contestant-guide>summary{font-weight:500}.contestant-guide h3{color:var(--ink)}.contestant-guide dt{margin-top:16px;font-weight:600;color:var(--accent)}.contestant-guide dd{margin-left:0}.contestant-guide li{margin:10px 0}.contestant-guide code{color:var(--accent)}
.resource-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:22px 0}.resource-card{display:flex;flex-direction:column;padding:20px;border:1px solid var(--line);border-radius:6px;color:var(--ink);background:#fafbf8}.resource-card:hover{background:#f2f5ed;text-decoration:none;border-color:#8b9d84}.resource-tag{font-size:9px;letter-spacing:1px;color:var(--muted)}.resource-card h3{margin:16px 0 10px;font-size:17px}.resource-card p{font-size:13px;color:var(--muted)}.resource-action{margin-top:auto;font-size:12px;color:var(--accent);font-weight:600}
.admin-scroll{overflow:auto;max-height:520px;margin-top:20px}table{width:100%;border-collapse:collapse;font-size:12px;white-space:nowrap}td,th{text-align:left;padding:13px 14px;border-bottom:1px solid var(--line);vertical-align:middle}th{position:sticky;top:0;background:#f5f7f3;color:var(--muted);font-weight:500;z-index:1}td button{margin:0;min-height:36px;font-size:11px;padding:7px 11px}.admin-actions,#score-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}#score-actions{margin:16px 0;font-size:12px}#score-actions button{margin:0}
#score-status,#score-eligibility,#worker-status,#sandbox-status{font-size:13px;line-height:1.8;color:var(--muted)}#worker-status{padding:14px 18px;background:#f5f7f3;border-radius:6px}#live-list button{margin-right:8px}#rule-json{font:12px/1.8 Consolas,monospace;white-space:pre;min-height:280px;background:#fafbf8}#rule-message,#password-message,#score-message{color:var(--accent);white-space:pre-wrap;font-size:13px;margin-top:12px}.admin-steps{padding-left:22px;color:#566159;font-size:14px;line-height:1.9}.admin-steps li{margin:14px 0}#password-panel{max-width:580px}body[data-session=password] #close-password{display:none}
body[data-session=guest] main{max-width:1000px;padding-top:80px}body[data-session=guest] .page-header{margin-bottom:35px}body[data-session=guest] .edition-label{display:none}#login-panel{max-width:420px;padding:32px}.login-mark{font-size:37px;line-height:1;letter-spacing:-5px;font-weight:750;color:var(--accent);margin-bottom:25px}#login-panel h2{font-size:21px;margin-bottom:6px}#submit{width:100%;margin-top:24px}.login-note{padding-top:20px;margin-top:24px;margin-bottom:0;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}.login-resources{display:flex;flex-wrap:wrap;gap:10px 14px;margin-top:18px;font-size:11px}
/* Keep the established board renderer, with quiet surfaces and readable labels. */
.replay-stage{--p0:#6554b7;--p1:#ad4265;--accent3:#315c46}.replay-stage .player-banner,.replay-stage .sidebar-card{background:#fafbf8;border-color:var(--line);box-shadow:none}.replay-stage .banner-name,.replay-stage .p0 .banner-name,.replay-stage .pt.p0{color:#6554b7}.replay-stage .p1 .banner-name,.replay-stage .pt.p1{color:#ad4265}.replay-stage .banner-turn,.replay-stage .sidebar-title,.replay-stage .stat-val{color:#315c46}.replay-stage .pc{background:#edf0e8;color:var(--ink)}.replay-stage .status-msg,.replay-stage .stat-lbl,.replay-stage .log-empty,.replay-stage .log-entry,.replay-stage .clabel{color:#626b65}.replay-stage .log-entry{border-color:var(--line)}.replay-stage .game-board{background:#d7dfd3;border-color:#c0cdb9}.replay-stage .light-sq{background:#eff3e9}.replay-stage .dark-sq{background:#dde5d5}.replay-stage .last-from{outline-color:#6554b7}.replay-stage .last-to{outline-color:#315c46}.replay-controls{display:flex;flex-wrap:wrap;align-items:end;gap:12px;margin:20px 0}.replay-controls button{margin:0}.replay-controls label{margin:0 0 6px}.replay-controls button[aria-pressed=true]{background:#805d2a}
/* Public protocol documentation shares the same typography and neutral palette. */
.docs-nav{display:flex;justify-content:space-between;align-items:center}.docs-header>p,.docs-layout p,.docs-layout li,.docs-layout td,.docs-bottom p{color:#566159}.docs-layout code{color:#315c46}.docs-layout p code,.docs-layout li code,.docs-layout td code,.flow li,.runtime-grid>div{background:#f3f6ef}.flow b,.docs-layout th{color:var(--ink)}.flow li::before,.section-number,.docs-layout caption,.piece-cycle b{color:#315c46}.docs-layout pre,.code-header,.docs-toc a,.docs-layout td,.docs-layout th,.flow li,.piece-cycle span{border-color:var(--line)}.code-header,.docs-layout th{background:#eff3ea;color:#566159}.callout{background:#edf3e9;border-color:#729563}.callout.warning{background:#faf3e7;border-color:#a48142}.primary-link.secondary{background:white;color:var(--accent);border-color:#b6c0b7}.docs-layout table{white-space:normal}
@media(max-width:1000px){.app-shell{grid-template-columns:195px minmax(0,1fr)}.workspace-sidebar{padding:28px 14px 20px}main{padding:34px 25px 20px}.edition-label{display:none}.resource-grid{grid-template-columns:1fr}}
@media(max-width:700px){.app-shell{display:block}.workspace-sidebar{height:auto;position:static;padding:20px 20px 0;border-right:0;border-bottom:1px solid var(--line)}.brand{font-size:18px}.sidebar-caption{margin:12px 0;font-size:9px}#workspace-nav{flex-direction:row;flex-wrap:wrap;gap:4px;padding-bottom:14px}#workspace-nav a{padding:8px 10px;min-height:42px;font-size:12px;gap:7px}.nav-number{display:none}.sidebar-bottom{margin:0}.account{display:flex;align-items:center;flex-wrap:wrap;gap:8px 14px;padding:12px 2px}#overview{display:none}.account strong{margin-right:auto}.text-button{margin:0;min-height:34px}.legacy-link{display:none}main,body[data-session=guest] main{padding:28px 18px}section{padding:22px 18px}.page-header{margin-bottom:24px}h1{font-size:28px;letter-spacing:-.8px}.match-form,.submission-fields{grid-template-columns:minmax(0,1fr)}.match-row,.submission-row{align-items:start;flex-direction:column;gap:12px}.submission-actions{justify-content:start}.panel-heading{flex-wrap:wrap;gap:10px}.small-tag{display:none}footer span{margin-left:0;width:100%}#login-panel{max-width:none}body[data-session=guest] .sidebar-caption{margin-bottom:18px}}
.admin-scroll td .admin-actions{flex-wrap:nowrap}
.beginner-steps{padding-left:22px}.beginner-steps li{padding-left:6px;margin:16px 0}.docs-layout details .code-header{margin-top:18px}.docs-layout #more>details{margin:18px 0}.docs-layout #more>.muted{margin-top:24px}
.footer-legacy,body:not([data-session=guest]) footer a{display:none}
@media(max-width:700px){body[data-session] footer .footer-legacy{display:inline-flex}}
.admin-scroll[data-overflow=true]::before{content:"Cuộn ngang để xem toàn bộ bảng →";display:block;position:sticky;left:0;width:fit-content;padding:0 0 10px;color:var(--muted);font-size:11px}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

.badges{display:inline-flex;gap:4px;font-size:16px;white-space:nowrap}.badge{cursor:help}.badge-legend{font-size:12px;color:var(--muted);line-height:1.7;margin:10px 0 0;white-space:normal}