@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Sans+TC:wght@400;500;600;700&display=swap');
.archive-bar{display:flex;align-items:center;gap:14px;padding-bottom:22px;font-size:13px;color:var(--muted)}#records-dialog{max-width:620px;max-height:92vh;overflow:auto}.record-save-row{display:flex;gap:8px}.record-save-row input{min-width:0;flex:1;padding:10px;border:1px solid var(--line);border-radius:8px;font:inherit;font-size:14px}.record-save-row button{white-space:nowrap}.record-actions,.review-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:16px}.review-heading label{font-size:14px}#review-ply{width:100%;margin:18px 0 8px}#review-description{font-size:13px;color:var(--muted);margin-bottom:12px}#review-board{max-width:420px;margin:auto}#review-board .piece{font-size:20px;font-weight:700}#records-dialog details{margin-top:20px;font-size:14px}#records-dialog summary{cursor:pointer}#import-json{width:100%;font:12px monospace;border:1px solid var(--line);border-radius:6px;margin-bottom:10px}#record-message{margin-top:14px;color:var(--green);font-size:13px}@media(max-width:760px){.archive-bar{align-items:flex-start;flex-direction:column}.record-save-row{flex-direction:column}}
:root{color-scheme:light;--ink:#18283f;--muted:#607087;--bg:#f1f4f8;--line:#dbe2ec;--blue:#2762d6;--red:#c74755;--green:#207861;--square:#e4ebf4;--white:#fff;font-family:'DM Sans','Noto Sans TC',sans-serif;color:var(--ink);background:var(--bg);font-synthesis:none}
.board-progress{font-size:14px;font-weight:600;margin:0 3px 12px}.history-row small{display:block;font-size:10px;font-weight:400;color:var(--muted);margin-bottom:3px}.review-heading label{text-align:center;line-height:1.7}.review-jump-row{display:flex;align-items:center;gap:10px;font-size:13px;flex-wrap:wrap}.review-jump-row input{width:80px;padding:8px;border:1px solid var(--line);border-radius:6px;font:inherit}.turn-kicker{flex-wrap:wrap}
*{box-sizing:border-box}body{margin:0}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}button:disabled{cursor:default;opacity:.36}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #e09b24;outline-offset:3px}button{touch-action:manipulation}a{color:inherit}h1,h2,h3,p{margin:0}button{border:0}button:hover:not(:disabled){filter:brightness(.96)}.shell{max-width:1240px;margin:auto;padding:0 40px}.topbar{height:100px;display:flex;align-items:center;gap:28px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-weight:700;font-size:25px;letter-spacing:-.9px}.brand-mark{display:grid;place-items:center;background:var(--ink);color:white;width:39px;height:39px;border-radius:12px;font-size:32px}.brand small{font-size:16px;font-weight:500;letter-spacing:0;margin-left:9px}.local-label{font-size:14px;color:var(--muted);margin-left:auto}.quiet{padding:10px 14px;border:1px solid var(--line);background:transparent;border-radius:8px;font-size:14px}.quiet span{margin-left:10px;font-weight:700}main{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:52px;padding:24px 0 26px}.arena{max-width:690px;min-width:0}.player-strip{display:flex;gap:12px;align-items:center;min-height:64px;padding:2px 3px 13px}.player-strip.you{padding:16px 3px 2px}.avatar{height:40px;width:40px;border-radius:50%;display:grid;place-items:center;font-size:17px;font-weight:700}.avatar.red{background:#f5dfe4;color:#a72e41}.avatar.blue{background:#dce8ff;color:#2455bb}.player-strip strong{font-size:16px}.player-strip div>span{display:block;font-size:13px;color:var(--muted);margin-top:3px}.inventory{margin-left:auto;display:flex;gap:14px;color:var(--muted);font-size:14px}.inventory b{color:var(--ink);font-size:16px}.board-frame{padding:9px;background:#fff;border:1px solid #d5deea;border-radius:14px;box-shadow:0 8px 24px #293f6710}.board{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));aspect-ratio:1;border-radius:7px;overflow:hidden;border:1px solid #dce3ed}.cell{position:relative;min-width:0;display:grid;place-items:center;background:#f8faff;aspect-ratio:1;padding:0;border-radius:0}.cell.dark{background:var(--square)}.cell .coordinate{position:absolute;left:5px;bottom:3px;font-size:10px;line-height:1;color:#7d8a9e;pointer-events:none}.cell.base-blue{background:#ccdcfa}.cell.base-red{background:#f0cfd6}.cell.base-blue::before,.cell.base-red::before{content:'⚑';font-size:30px;opacity:.4;color:var(--blue)}.cell.base-red::before{color:#a0243c}.cell:has(.piece)::before{position:absolute}.cell.last{box-shadow:inset 0 0 0 3px #d4ab4c90}.cell.selected{background:#bbd0f3;box-shadow:inset 0 0 0 3px var(--blue)}.cell.legal::after{content:'';width:18%;height:18%;background:var(--green);opacity:.6;border-radius:50%;position:absolute}.cell.capture::after{width:84%;height:84%;border:3px solid var(--green);background:transparent;opacity:1}.cell:focus-visible{outline-offset:-4px;z-index:2}.piece{width:76%;height:76%;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:1;pointer-events:none;box-shadow:0 3px 0 #1426451c,0 1px 5px #0b1e3b0c;border:1px solid #ffffffb3}.piece.blue{color:#fff;background:var(--blue)}.piece.red{color:#fff;background:var(--red)}.piece-symbol{font-family:'Noto Sans TC',sans-serif;font-size:clamp(17px,2.15vw,28px);font-weight:700;line-height:1.12}.piece-type{font-size:10px;font-weight:700;opacity:.8;line-height:1.1;margin-top:1px}.board-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:20px}.board-toolbar>div{display:flex;align-items:center;gap:8px}.legend{font-size:12px;color:var(--muted)}.legend-dot{width:8px;height:8px;background:var(--green);border-radius:50%;margin-left:3px}.legend-ring{width:11px;height:11px;border:2px solid var(--green);border-radius:50%;margin-left:8px}.icon-button{background:transparent;font-size:13px;padding:7px 6px;border-radius:5px}.sidebar{padding-top:9px;min-width:0}.turn-panel{padding:23px 24px;background:var(--white);border:1px solid var(--line);border-radius:16px}.turn-kicker{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:13px}.status-dot{width:8px;height:8px;border-radius:50%;background:var(--blue)}.status-dot.red{background:var(--red)}.pill{font-size:12px;margin-left:auto;padding:3px 8px;background:var(--bg);border-radius:5px}h1{font-size:29px;font-weight:600;letter-spacing:-1px;margin:15px 0 8px}.turn-panel p{font-size:14px;line-height:1.8;color:var(--muted);min-height:50px}.connection{border-top:1px solid var(--line);padding-top:13px;margin-top:18px;font-size:12px;color:var(--muted)}.connection.live{color:var(--green)}.connection.live::before{content:'●';font-size:8px;margin-right:6px}.match-controls{padding:27px 0 22px}.section-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:17px}h2{font-size:16px;font-weight:600}.text-button{background:transparent;color:var(--blue);padding:4px 0;font-size:13px}.objective{font-size:14px;color:var(--muted)}.objective b{color:var(--ink);margin-left:8px;font-size:17px}.objective>span{display:block;font-size:13px;margin-top:6px}.cycle{display:flex;align-items:center;justify-content:space-between;gap:5px;margin-top:19px;font-size:13px}.cycle>span{background:white;border:1px solid var(--line);border-radius:6px;padding:7px 9px;white-space:nowrap}.cycle b{font-size:11px;color:var(--muted);margin-left:3px}.cycle i{font-style:normal;color:var(--muted);font-size:11px;white-space:nowrap}.history-panel{border-top:1px solid var(--line);padding-top:22px}.history-head,.history-row{display:grid;grid-template-columns:40px 1fr 1fr;align-items:center;gap:4px;font-size:13px;padding:9px 10px}.history-head{color:var(--muted);background:#e8edf4;border-radius:6px}.history{height:160px;overflow:auto}.empty-history{text-align:center;padding:21px 5px;color:var(--muted)}.empty-history>span{display:block;font-size:27px;color:#a0adc0;margin-bottom:7px}.empty-history p{font-size:14px}.empty-history small{display:block;font-size:12px;margin-top:6px}.history-row{border-bottom:1px solid #e2e7ef;font-variant-numeric:tabular-nums;font-size:12px}.history-row>span:first-child{color:var(--muted)}.history-row .blue{color:var(--blue)}.history-row .red{color:var(--red)}.history-row:last-child{background:#ffffff80}.history-note{font-size:12px;padding:12px 0 0;color:var(--muted);min-height:42px;line-height:1.6}.chat-hint{font-size:12px;color:var(--muted);line-height:1.9;margin-top:15px;border-left:2px solid #c4d2e6;padding-left:12px}footer{border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;padding:20px 0;font-size:12px;color:var(--muted)}footer nav{display:flex;gap:22px}footer a{text-decoration:none}footer a:hover{text-decoration:underline}dialog{border:1px solid var(--line);border-radius:20px;padding:28px;max-width:540px;width:calc(100% - 32px);color:var(--ink);box-shadow:0 24px 90px #192b4733}dialog::backdrop{background:#172a4960;backdrop-filter:blur(3px)}.dialog-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:22px}.dialog-header h2{font-size:23px}.close{background:transparent;font-size:28px;padding:0 6px;color:var(--muted)}dialog p,dialog li{font-size:14px;line-height:1.9}dialog ol{padding-left:24px}dialog li{padding:5px 0}dialog h3{font-size:16px;margin:20px 0 7px}dialog .note{font-size:12px;color:var(--muted);margin:15px 0}.primary{width:100%;border-radius:9px;background:var(--blue);color:white;padding:13px 16px;margin-top:18px;font-weight:600}fieldset{border:0;padding:0;margin:24px 0}legend{font-size:13px;color:var(--muted);margin-bottom:10px}fieldset label{display:block;padding:13px;background:var(--bg);margin-top:8px;border-radius:8px;font-size:14px}input{accent-color:var(--blue)}.toast{position:fixed;bottom:28px;left:50%;transform:translateX(-50%);background:var(--ink);color:white;padding:14px 22px;border-radius:10px;font-size:14px;max-width:90%;z-index:5;box-shadow:0 8px 30px #18283f25}.toast[hidden]{display:none}
@media(min-width:1400px){.shell{padding-top:8px}main{padding-top:30px}}@media(max-width:1050px){.shell{padding:0 24px}main{gap:28px;grid-template-columns:minmax(0,1fr) 280px}.turn-panel{padding:20px}.board-toolbar{flex-wrap:wrap}.inventory{gap:9px}}@media(max-width:760px){.shell{padding:0 16px}.topbar{height:76px;gap:12px}.brand{font-size:21px}.brand small{font-size:13px;display:block;margin-left:0;letter-spacing:1px}.brand-mark{width:35px;height:35px}.local-label{display:none}.quiet{margin-left:auto;padding:8px 10px;font-size:12px}main{display:flex;flex-direction:column;gap:12px;padding-top:15px}.arena{max-width:560px;width:100%;margin:auto}.sidebar{display:grid;grid-template-columns:1fr 1fr;gap:20px}.turn-panel{grid-column:1/-1;padding:17px 20px}.turn-kicker{font-size:12px}h1{font-size:25px;margin:8px 0 4px}.turn-panel p{min-height:0}.connection{margin-top:10px;padding-top:9px}.match-controls{padding:0}.history-panel{padding:0;border:0}.history{height:140px}.chat-hint{grid-column:1/-1;margin-top:0}.piece-symbol{font-size:clamp(16px,5.5vw,30px)}.piece-type{font-size:9px}.cell .coordinate{font-size:8px;left:3px;bottom:2px}.board-frame{padding:6px;border-radius:10px}.board-toolbar{margin-top:14px}.player-strip{min-height:54px}.player-strip.you{padding-top:12px}.inventory{font-size:12px;gap:12px}.inventory b{font-size:14px}.avatar{width:34px;height:34px}.player-strip div>span{font-size:12px}footer{flex-direction:column;gap:12px;margin-top:8px}.cycle{flex-wrap:wrap;justify-content:flex-start;gap:5px}.cycle>span{padding:5px}.history-head,.history-row{padding:8px 3px;grid-template-columns:27px 1fr 1fr;font-size:11px}.legend{font-size:11px}.icon-button{font-size:12px}.cell.base-blue::before,.cell.base-red::before{font-size:23px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.opponent-settings{margin-bottom:18px}.opponent-settings .section-heading{margin-bottom:9px}.opponent-settings label{font-weight:600;font-size:15px}select{font:inherit;font-size:15px;width:100%;padding:11px 12px;border:1px solid #c2cede;border-radius:8px;background:#fff;color:var(--ink)}select:focus-visible{outline:3px solid #e09b24;outline-offset:2px}.opponent-settings p{font-size:13px;color:var(--muted);line-height:1.7;margin-top:8px}.engine-insight{margin-top:14px;padding:13px 16px;border-left:3px solid #87a3cf;background:#e8eef7;border-radius:0 8px 8px 0}.engine-insight strong{font-size:13px}.engine-insight p{font-size:13px;line-height:1.8;margin-top:4px}.engine-insight small{font-size:12px;color:var(--muted);display:block;margin-top:5px}.engine-insight[hidden]{display:none}.dialog-select-label{display:block;font-size:13px;color:var(--muted);margin:18px 0 8px}#pause-engine[hidden]{display:none}@media(max-width:760px){.opponent-settings,.engine-insight{grid-column:1/-1;margin:0}.opponent-settings{order:-1}}

/* Distinct object silhouettes: pebble, lined sheet and open scissors. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.piece{width:87%;height:87%;border:0;border-radius:0;box-shadow:none;overflow:visible}
.piece.blue{color:#2458c3;background:transparent}.piece.red{color:#be3948;background:transparent}
.piece-art{display:block;width:100%;height:100%;pointer-events:none;user-select:none;flex-shrink:0}
.inventory.blue .inventory-item{color:#2458c3}.inventory.red .inventory-item{color:#be3948}.inventory .inventory-item{display:flex;align-items:center;gap:3px}.inventory .piece-art{width:30px;height:30px}.inventory{gap:10px}
.illustrated-cycle{gap:3px;justify-content:space-between;color:var(--ink)}.illustrated-cycle .piece-art{width:44px;height:44px}.illustrated-cycle i{font-size:18px;color:var(--muted)}
@media(max-width:760px){.inventory .piece-art{width:25px;height:25px}.inventory{gap:6px}.illustrated-cycle{flex-wrap:nowrap}.illustrated-cycle .piece-art{width:27px;height:27px}.illustrated-cycle i{font-size:13px}}