*{box-sizing:border-box}body{margin:0;background:#e3d6b4;color:#365563;font-family:'Microsoft JhengHei',Arial,sans-serif}header{padding:22px max(20px,calc((100% - 1200px)/2));display:flex;justify-content:space-between;background:#c3d5c9;border-bottom:3px solid #829e90}header>a{font:bold italic 20px Impact,Arial;color:#365563;text-decoration:none}nav{display:flex;gap:20px}a{color:#365563;font-weight:bold;font-size:13px}main{max-width:1200px;padding:38px 20px;margin:auto}.eyebrow{font:bold 10px monospace;letter-spacing:3px}h1{font-style:italic;font-size:38px;margin:12px 0}h1 span{font-style:normal;font-size:20px;margin-left:18px}.intro{font-size:13px;line-height:1.8;color:#576b66}.stats{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px;margin-top:30px}.stats article,.leader{border:3px solid #849f91;background:#c4d8ce;padding:24px;box-shadow:4px 4px #afba9e}.stats .p2{background:#e0bca0}.stats article>span,.leader>span{font-weight:bold;font-size:13px}.stats b{display:block;font:bold 52px monospace;margin:15px 0}.stats small{display:block;font-size:12px}.leader{background:#ddd3a5;display:flex;flex-direction:column;justify-content:center;text-align:center;gap:15px}.leader strong{font-size:24px}.sharebar{height:12px;background:#d9ab8c;margin:20px 0 30px;border:2px solid #819b8e}.sharebar i{display:block;height:100%;background:#88aea9;width:50%}.list-title{display:flex;align-items:center;justify-content:space-between}h2{font-size:20px}button{cursor:pointer;border:2px solid #8d9e85;background:#e5cd95;color:#365563;padding:10px 15px;font-weight:bold;min-height:42px}button:disabled{opacity:.6}#load-status{font-size:12px;line-height:1.8;min-height:22px}.table-wrap{border:3px solid #849f91;background:#d1ddc6;overflow:auto}table{width:100%;border-collapse:collapse;text-align:left;font-size:14px}th{background:#aec8c0;font-size:12px}th,td{padding:16px;border-bottom:1px solid #a9b99f}th small{display:block;margin-top:4px}td:nth-child(2){font-weight:bold;overflow-wrap:anywhere}td:nth-child(4){font:bold 18px monospace}footer{font-size:11px;line-height:1.9;margin-top:24px;color:#53665f}a:focus-visible,button:focus-visible{outline:3px solid #476b83;outline-offset:4px}@media(max-width:650px){header{padding:16px 14px}header>a{font-size:16px}nav{gap:12px}nav a{font-size:11px}main{padding:25px 14px}h1{font-size:29px}h1 span{display:block;margin:9px 0 0;font-size:18px}.stats{gap:9px;grid-template-columns:1fr 1fr}.stats article,.leader{padding:15px}.leader{grid-column:1/-1;grid-row:2;gap:7px}.stats b{font-size:38px}.stats article>span{font-size:11px}th,td{padding:12px 9px;font-size:12px}th:last-child,td:last-child{display:none}.intro{font-size:12px}.table-wrap{overflow-wrap:anywhere}}
.demo-banner{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#dfc69b;border:2px solid #8c9f88;padding:12px 16px;margin-top:22px}.demo-banner strong{font-size:14px}#board-note{font-size:12px;line-height:1.8;color:#53665f}@media(max-width:650px){.demo-banner{padding:10px;gap:8px}.demo-banner strong{font-size:12px}.demo-banner button{font-size:11px;padding:8px;white-space:nowrap}}

/* Waiting state approved in mockup. */

main{text-align:center;padding-top:72px}.calculating{max-width:820px;margin:42px auto;background:#cad9c9;border:3px solid #829e90;padding:65px 25px;box-shadow:7px 7px #b2bea2}.loading-label{font:11px monospace;letter-spacing:4px;color:#5a716a}.calculating h2{font-size:clamp(26px,5vw,46px);margin:30px 0;color:#3c626c;letter-spacing:4px;text-shadow:2px 2px #e1ce9f}.calculating h2 span{display:inline-block;animation:letterhop 1.4s ease-in-out infinite;animation-delay:calc(var(--i)*.12s)}.loading-track{display:flex;justify-content:center;gap:9px;margin:32px}.loading-track i{height:15px;width:23px;background:#8aa99c;animation:tile 1.4s steps(2,end) infinite;animation-delay:calc(var(--i)*.12s)}.count{font: bold 14px monospace;color:#526e6d}.calculating p{font-size:14px;line-height:1.9;color:#536d68}.duel{display:flex;justify-content:center;gap:48px;margin:25px 0}.duel div{width:75px;height:75px;display:grid;place-items:center;border:3px solid #8ba496;font:bold italic 24px monospace;background:#d9cda3}.duel div:last-child{background:#dfbca0}.duel>b{align-self:center;font:italic bold 25px monospace}.note{font-size:11px;color:#61756c}.home{display:inline-block;margin:8px;padding:13px 24px;background:#dfb795;border:2px solid #8b9f8b;text-decoration:none}footer{text-align:center}@keyframes letterhop{0%,70%,100%{transform:translateY(0)}35%{transform:translateY(-8px)}}@keyframes tile{50%{background:#dec18b;transform:translateY(-3px)}}@media(max-width:650px){main{padding:34px 15px}.calculating{padding:35px 12px;margin:24px auto}.loading-label{font-size:8px;letter-spacing:2px}.calculating h2{letter-spacing:1px}.loading-track{gap:5px;margin:25px 10px}.loading-track i{width:18px;height:12px}.duel{gap:24px}}@media(prefers-reduced-motion:reduce){*{animation:none!important}}

[hidden]{display:none!important}.waiting-main{padding-top:40px;text-align:center}.waiting-main .stats{text-align:left}.waiting-main .table-wrap{text-align:left}#rank-results{text-align:left}#load-status{text-align:center}.waiting-main .calculating{margin:30px auto}.waiting-main footer{text-align:center}
