:root{--ink:#30383a;--paper:#e8e9e5;--line-heavy:#3e484a;--line-mid:#7a8584;--line-light:#c5cbca;--surface:#f0f1ed;--surface-deep:#dfe3e0;--x-color:#a84f55;--o-color:#456f88;--tri-color:#587d69;--pi-color:#9a7b3f;--highlight:#8b9692;--highlight-soft:#cfd5d2;--last-move:#566664;--last-move-soft:#d9dfdc;--forecast-soft:#cfe8f5;--forecast-line:#78a9c2;--cell-size:clamp(8px, min(1.65vw, 2.05vh), 18px);--font-display:"Vollkorn", Georgia, "Iowan Old Style", serif;--font-mono:"SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace}*{box-sizing:border-box}body{background:radial-gradient(circle at 50% -10%, #ffffffb8, transparent 44%), linear-gradient(180deg, #eceeeb 0%, var(--paper) 100%);color:var(--ink);font-family:var(--font-mono);flex-direction:column;align-items:center;min-height:100vh;margin:0;padding:14px 10px 24px;display:flex;overflow-x:hidden}h1{font-family:var(--font-display);letter-spacing:.1px;text-align:center;text-shadow:0 1px #ffffffbf;margin:0 0 8px;font-size:clamp(30px,4.6vw,48px);font-weight:500}h1 sup{vertical-align:super;font-size:.55em;position:relative;top:-.2em}.how-to-play{border:1px solid var(--line-light);background:#f1f2ef;width:100%;max-width:none;margin:0 0 14px;padding:4px 18px 14px;font-size:13px;line-height:1.55}.how-to-play summary{font-family:var(--font-display);cursor:pointer;outline:none;padding:10px 0;font-size:15px}.how-to-play h3{font-family:var(--font-display);border-bottom:1px solid var(--line-light);margin:14px 0 4px;padding-bottom:3px;font-size:14px;font-weight:400}.how-to-play p{margin:6px 0}.how-to-play ul{margin:6px 0;padding-left:20px}.how-to-play li{margin:3px 0}.turn-demo{border:1px solid var(--line-light);text-align:center;background:#f3efe4;margin:12px 0;padding:16px}.demo-label{text-transform:uppercase;letter-spacing:1px;color:var(--line-mid);margin-bottom:4px;font-size:10px;display:block}.demo-move{font-family:var(--font-mono);margin:6px 0;font-size:20px;font-weight:700}.demo-move .seg{border-radius:2px;padding:2px 6px;display:inline-block}.demo-move .seg.plain{color:var(--ink)}.demo-move .seg.blank{color:var(--line-mid);background:#e5e0d3}.demo-move .seg.hl-a{color:var(--ink);background:var(--highlight);animation:2.4s ease-in-out infinite pulseA}.demo-move .seg.hl-b{color:#fff;background:var(--tri-color);animation:2.4s ease-in-out infinite pulseB}@keyframes pulseA{0%,to{background:var(--highlight)}50%{background:var(--highlight-soft)}}@keyframes pulseB{0%,to{background:var(--tri-color)}50%{background:#5fa864}}.demo-arrow{color:var(--line-mid);margin:8px 0;font-size:12px}.demo-caption{color:var(--line-mid);text-align:left;margin-top:10px;font-size:11.5px;line-height:1.5}.review-bar{border:1px solid var(--line-light);background:#e8ebe9;margin-top:14px;padding:12px;display:none}.review-bar.show{display:block}.review-bar button{margin-top:0;padding:6px 10px;font-size:11.5px}.move-log div.reviewing{background:var(--highlight-soft);font-weight:700}.layout{flex-wrap:nowrap;justify-content:center;align-items:flex-start;gap:18px;width:100%;max-width:1100px;display:flex}.status-panel{border:1px solid var(--line-light);background:var(--surface);width:300px;max-height:calc(100vh - 100px);padding:16px;font-size:13px;line-height:1.6;overflow-y:auto;box-shadow:0 3px 12px #3f342c12}.status-panel h2{font-family:var(--font-display);border-bottom:1px solid var(--line-light);margin:0 0 8px;padding-bottom:6px;font-size:15px;font-weight:400}.turn-badge{border:1px solid;align-items:center;gap:6px;padding:2px 8px;font-weight:700;display:inline-flex}.turn-badge.x{color:var(--x-color)}.turn-badge.o{color:var(--o-color)}.turn-badge.tri{color:var(--tri-color)}.turn-badge.pi{color:var(--pi-color)}.target-code{letter-spacing:1px;color:var(--ink);background:var(--highlight-soft);margin-top:4px;padding:4px 6px;font-size:16px;font-weight:700;display:inline-block}.move-log{border-top:1px solid var(--line-light);max-height:220px;margin-top:14px;padding-top:8px;overflow-y:auto}.move-log div{color:#444;padding:1px 0;font-size:11.5px}.move-log div.x-move{color:var(--x-color)}.move-log div.o-move{color:var(--o-color)}.move-log div.tri-move{color:var(--tri-color)}.move-log div.pi-move{color:var(--pi-color)}button{font-family:var(--font-mono);background:var(--ink);color:var(--paper);cursor:pointer;border:none;margin-top:14px;padding:7px 14px;font-size:12px}button:hover{opacity:.85}.player-toggle{border:1px solid var(--ink);gap:0;width:fit-content;margin-top:2px;display:flex}.player-toggle button{color:var(--ink);border-right:1px solid var(--ink);background:#f1f2ef;margin:0;padding:6px 12px;font-size:12px}.player-toggle button:last-child{border-right:none}.player-toggle button.active{background:var(--ink);color:var(--paper)}.player-toggle button:hover{opacity:1}.beta-gate{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:10000;background:#30383ad1;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.beta-card{background:var(--surface);border:1px solid var(--line-light);width:min(430px,100%);font-family:var(--font-display);padding:28px;box-shadow:0 18px 60px #141c1d47}.beta-card h2{margin:0 0 5px;font-size:28px;font-weight:600}.beta-card p{font-family:var(--font-mono);color:var(--line-mid);font-size:11px;line-height:1.5}.beta-card label{font-family:var(--font-mono);color:var(--line-mid);margin:12px 0 4px;font-size:11px;display:block}.beta-card input{border:1px solid var(--line-mid);width:100%;color:var(--ink);font-family:var(--font-mono);background:#f7f8f5;padding:9px 10px}.beta-card .beta-error{min-height:16px;color:var(--x-color);font-family:var(--font-mono);margin-top:8px;font-size:11px}.beta-card button{width:100%;margin-top:12px}.beta-secondary{color:var(--ink);border:1px solid var(--line-mid);background:0 0}.beta-hidden{display:none!important}.account-strip{width:min(1100px,100%);color:var(--line-mid);justify-content:space-between;align-items:center;gap:10px;margin:0 auto 12px;font-size:11px;display:flex}.account-strip button{color:var(--ink);border:1px solid var(--line-mid);background:0 0;margin:0;padding:5px 9px;font-size:10px}.admin-panel{border-top:1px solid var(--line-light);margin:10px 0 14px;padding-top:10px}.admin-panel input{border:1px solid var(--line-light);background:var(--surface);width:100%;font-family:var(--font-mono);padding:7px;font-size:11px}.admin-users{max-height:150px;margin-top:8px;font-size:10px;overflow:auto}.admin-user-row{border-bottom:1px solid var(--line-light);justify-content:space-between;gap:6px;padding:5px 0;display:flex}.admin-user-row button{margin:0;padding:3px 6px;font-size:9px}.history-panel{border-top:1px solid var(--line-light);margin-top:14px;padding-top:8px}.history-tabs{flex-wrap:wrap;gap:4px;margin:6px 0;display:flex}.history-tabs button{color:var(--ink);border:1px solid var(--line-light);background:0 0;margin:0;padding:4px 7px;font-size:9px}.history-tabs button.active{background:var(--ink);color:var(--paper)}.history-list{max-height:190px;font-size:10px;overflow:auto}.history-item{border-bottom:1px solid var(--line-light);padding:7px 0;line-height:1.45}.history-item strong{font-family:var(--font-display);font-size:12px}.online-panel{border:1px solid var(--line-light);background:var(--surface-deep);margin-top:12px;padding:10px;font-size:10px;line-height:1.5}.big-board{border:4px solid var(--line-heavy);background:var(--surface-deep);grid-template-columns:repeat(3,max-content);gap:7px;width:max-content;max-width:100%;margin-inline:auto;padding:6px;display:grid;box-shadow:0 8px 22px #3f342c1f}.medium-board{border:2px solid var(--line-mid);background:#e9ece9;grid-template-columns:repeat(3,max-content);gap:4px;padding:4px;transition:box-shadow .15s;display:grid;position:relative;box-shadow:0 1px 4px #3f342c12}.medium-board.eligible-zone{box-shadow:0 0 0 2px var(--highlight-soft) inset}.small-board{border:1px solid var(--line-light);background:#e2e5e2;grid-template-columns:repeat(3,max-content);gap:1px;padding:2px;display:grid;position:relative}.small-board.legal-target{border:2px solid var(--highlight);z-index:2;background:#e8ebe9;box-shadow:0 0 6px 1px #78858273}.cell{width:var(--cell-size);height:var(--cell-size);font-size:calc(var(--cell-size) * .62);border:.5px solid var(--line-light);cursor:pointer;-webkit-user-select:none;user-select:none;background:#f4f5f2;justify-content:center;align-items:center;font-weight:700;line-height:1;display:flex}.cell.x{color:var(--x-color)}.cell.o{color:var(--o-color)}.cell.tri{color:var(--tri-color)}.cell.pi{color:var(--pi-color)}.cell.disabled{cursor:not-allowed}.cell.playable:hover{background:#e7ebe8}.cell.last-move{background:var(--last-move-soft);box-shadow:inset 0 0 0 2px var(--last-move), 0 0 0 1px #765b431f;z-index:3;position:relative}.cell.last-move.x{background:#f3dddd}.cell.last-move.o{background:#dce8f2}.cell.last-move.tri{background:#dcece3}.cell.last-move.pi{background:#eee7d5}.small-board.won-x,.small-board.won-o,.small-board.won-tri,.small-board.won-pi,.small-board.won-d{background:0 0}.small-board .overlay{font-weight:700;font-family:var(--font-display);pointer-events:none;justify-content:center;align-items:center;display:none;position:absolute;inset:0}.small-board.won-x .overlay,.small-board.won-o .overlay,.small-board.won-tri .overlay,.small-board.won-pi .overlay,.small-board.won-d .overlay{display:flex}.small-board.won-x .overlay{color:var(--x-color);font-size:calc(var(--cell-size)*2.1);background:#f0f2efe0}.small-board.won-o .overlay{color:var(--o-color);font-size:calc(var(--cell-size)*2.1);background:#f0f2efe0}.small-board.won-tri .overlay{color:var(--tri-color);font-size:calc(var(--cell-size)*2.1);background:#f0f2efe0}.small-board.won-pi .overlay{color:var(--pi-color);font-size:calc(var(--cell-size)*2.1);background:#f0f2efe0}.small-board.won-d .overlay{color:var(--line-mid);font-size:calc(var(--cell-size)*1.6);background:#f0f2efbf}.small-board.won-x .cell,.small-board.won-o .cell,.small-board.won-tri .cell,.small-board.won-pi .cell,.small-board.won-d .cell{opacity:.18}.medium-board .med-overlay{font-weight:700;font-family:var(--font-display);pointer-events:none;z-index:5;justify-content:center;align-items:center;display:none;position:absolute;inset:0}.medium-board.mwon-x .med-overlay,.medium-board.mwon-o .med-overlay,.medium-board.mwon-tri .med-overlay,.medium-board.mwon-pi .med-overlay,.medium-board.mwon-d .med-overlay{display:flex}.medium-board.mwon-x .med-overlay{color:var(--x-color);font-size:calc(var(--cell-size)*4.4);background:#dfe3e0eb}.medium-board.mwon-o .med-overlay{color:var(--o-color);font-size:calc(var(--cell-size)*4.4);background:#dfe3e0eb}.medium-board.mwon-tri .med-overlay{color:var(--tri-color);font-size:calc(var(--cell-size)*4.4);background:#dfe3e0eb}.medium-board.mwon-pi .med-overlay{color:var(--pi-color);font-size:calc(var(--cell-size)*4.4);background:#dfe3e0eb}.medium-board.mwon-d .med-overlay{color:var(--line-mid);font-size:calc(var(--cell-size)*3);background:#dfe3e0db}.big-board-wrapper{position:relative}.win-popup{z-index:100;text-align:center;background:#f6f3ecf0;flex-direction:column;justify-content:center;align-items:center;gap:16px;padding:20px;display:none;position:absolute;inset:0}.win-popup.show{display:flex}.win-popup .win-msg{font-family:var(--font-display);letter-spacing:1px;font-size:clamp(28px,6vw,52px);font-weight:700}.win-popup .win-msg.x{color:var(--x-color)}.win-popup .win-msg.o{color:var(--o-color)}.win-popup .win-msg.tri{color:var(--tri-color)}.win-popup .win-msg.pi{color:var(--pi-color)}.win-popup .win-msg.draw{color:var(--line-mid)}.win-popup button{margin-top:0}@media (width<=900px){.layout{gap:12px}.status-panel{width:270px}}@media (width<=720px){body{padding:10px 6px 16px}h1{font-size:clamp(24px,7vw,34px)}.layout{flex-direction:column;align-items:center}.status-panel{width:100%;max-width:560px;max-height:none;overflow:visible}.big-board{max-width:calc(100vw - 12px)}}.site-links{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.site-links a{color:var(--ink);border-bottom:1px solid var(--line-light);padding-bottom:1px;text-decoration:none}.site-links a:hover{border-bottom-color:var(--ink)}.page{width:min(1100px,100%);margin:0 auto}.card{border:1px solid var(--line-light);background:var(--surface);margin-bottom:14px;padding:16px;box-shadow:0 3px 12px #3f342c12}.card h2{font-family:var(--font-display);margin:0 0 8px;font-size:18px;font-weight:600}.field{color:var(--line-mid);margin:10px 0 4px;font-size:11px;display:block}.input{border:1px solid var(--line-mid);width:100%;color:var(--ink);font-family:var(--font-mono);background:#f7f8f5;padding:9px 10px;font-size:12px}textarea.input{resize:vertical;min-height:90px}.row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.muted{color:var(--line-mid);font-size:11px;line-height:1.6}.err{color:var(--x-color);min-height:15px;font-size:11px}.ok{color:var(--tri-color);min-height:15px;font-size:11px}table.data{border-collapse:collapse;width:100%;font-size:12px}table.data th{text-align:left;font-family:var(--font-mono);color:var(--line-mid);border-bottom:1px solid var(--line-mid);text-transform:uppercase;letter-spacing:.06em;padding:6px 8px;font-size:10px}table.data td{border-bottom:1px solid var(--line-light);padding:7px 8px}table.data tr.me{background:var(--highlight-soft)}.stars{color:#b58b2f;letter-spacing:2px}.review-quote{border-left:3px solid var(--line-light);font-family:var(--font-display);margin:12px 0;padding:4px 0 4px 12px;font-size:15px}.seat-list{font-size:11px;line-height:1.8}.code-pill{font-family:var(--font-mono);letter-spacing:3px;background:var(--highlight-soft);padding:4px 10px;font-size:20px;display:inline-block}.big-board.turn-x .small-board.legal-target{border-color:var(--x-color);background:#f7e9e9;box-shadow:0 0 7px 1px #a03c3c59}.big-board.turn-o .small-board.legal-target{border-color:var(--o-color);background:#e6eef6;box-shadow:0 0 7px 1px #3a669459}.big-board.turn-tri .small-board.legal-target{border-color:var(--tri-color);background:#e6f1ea;box-shadow:0 0 7px 1px #3a806259}.big-board.turn-pi .small-board.legal-target{border-color:var(--pi-color);background:#f5efdf;box-shadow:0 0 7px 1px #96783259}.big-board.turn-x .medium-board.eligible-zone{box-shadow:inset 0 0 0 2px #a03c3c52}.big-board.turn-o .medium-board.eligible-zone{box-shadow:inset 0 0 0 2px #3a669452}.big-board.turn-tri .medium-board.eligible-zone{box-shadow:inset 0 0 0 2px #3a806252}.big-board.turn-pi .medium-board.eligible-zone{box-shadow:inset 0 0 0 2px #96783252}.big-board .medium-board .small-board.forecast-target,.big-board .medium-board .small-board.forecast-free{border-color:var(--forecast-line);background:var(--forecast-soft);box-shadow:0 0 0 2px var(--forecast-soft);z-index:3}.small-board.forecast-target .cell:not(.last-move),.small-board.forecast-free .cell:not(.last-move){background:var(--forecast-soft)}.medium-board.forecast-zone{box-shadow:0 0 0 2px var(--forecast-line) inset}.learn-panel{border:1px solid var(--line-light);background:var(--surface);width:min(900px,100%);margin:16px auto 0;padding:14px 16px;box-shadow:0 3px 12px #3f342c12}.learn-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.learn-head h2{font-family:var(--font-display);margin:0;font-size:18px;font-weight:600}.learn-head button{margin-top:0}.learn-body{margin-top:10px;font-size:13px;line-height:1.7}.learn-body h3{font-family:var(--font-display);margin:12px 0 4px;font-size:14px}.learn-list{margin:0;padding-left:18px;font-size:12px;line-height:1.8}.about-text{white-space:pre-wrap;font-size:15px;line-height:1.8}.screen-note{border:1px dashed var(--line-mid);background:var(--highlight-soft);color:var(--ink);margin:0 0 10px;padding:8px 10px;font-size:11px;line-height:1.6}@media (width>=901px) and (width<=1280px){:root{--cell-size:clamp(8px, min(2vw, 2vh), 16px)}.status-panel{width:300px}}@media (width<=900px){:root{--cell-size:clamp(8px, min(2.6vw, 2.4vh), 16px)}.layout{flex-direction:column;align-items:center}.status-panel{width:100%;max-width:640px;max-height:none;overflow:visible}}@media (width<=560px){:root{--cell-size:clamp(7px, 3.1vw, 13px)}body{padding:8px 4px 14px}.big-board{border-width:3px;gap:4px;max-width:calc(100vw - 8px);padding:4px}.medium-board{gap:2px;padding:2px}.player-toggle{flex-wrap:wrap}.account-strip{flex-wrap:wrap;gap:6px}.learn-panel{padding:12px}}.radio-list{flex-direction:column;gap:2px;margin-top:4px;display:flex}.radio-item{cursor:pointer;border:1px solid #0000;padding:6px 8px;display:block}.radio-item.selected{border-color:var(--line-light);background:var(--highlight-soft)}.radio-line{align-items:center;gap:8px;display:flex}.radio-line input{accent-color:var(--ink);margin:0}.radio-label{font-size:12.5px}.radio-note{color:var(--line-mid);margin:5px 0 1px 22px;font-size:11px;line-height:1.6;display:block}.conn-status{min-height:20px;color:var(--line-mid);align-items:center;gap:7px;margin:2px 0 4px;font-size:11px;display:flex}.conn-dot{background:var(--line-mid);border-radius:50%;flex:none;width:8px;height:8px}.conn-live .conn-dot{background:#2f7d4f}.conn-polling .conn-dot{background:#b8860b}.conn-offline .conn-dot{background:#a8322d}.conn-connecting .conn-dot{background:var(--line-light)}.sync-warn{border:1px dashed var(--line-mid);background:var(--highlight-soft);margin:4px 0;padding:6px 8px;font-size:11px;line-height:1.5}@media (width<=560px){.page.playing h1{margin:2px 0 6px;font-size:20px}.page.playing .big-board-wrapper{justify-content:center;align-items:center;min-height:calc(100dvh - 96px);display:flex}.page.playing .big-board{max-width:calc(100vw - 8px)}.page.playing .status-panel{overscroll-behavior:contain;width:100%;margin-top:12px;overflow-x:hidden}.page.playing .status-panel button,.page.playing .review-bar button{min-height:40px;padding:0 12px}.page.playing .row{flex-wrap:wrap;gap:8px}.page.playing .conn-status{min-height:24px}.page.playing .move-log,.page.playing .moves{-webkit-overflow-scrolling:touch;max-height:34vh;overflow-y:auto}}.moves-dock-toggle,.moves-dock-head{display:none}@media (width<=560px){.moves-dock-title{display:none}.moves-dock-toggle{z-index:60;border:1px solid var(--ink);background:var(--paper);letter-spacing:.04em;min-height:44px;font-family:inherit;font-size:13px;display:block;position:fixed;bottom:8px;left:8px;right:8px}.moves-dock-panel{z-index:61;background:var(--paper);border-top:2px solid var(--ink);-webkit-overflow-scrolling:touch;overscroll-behavior:contain;max-height:62dvh;padding:10px 10px 14px;transition:transform .22s;position:fixed;bottom:0;left:0;right:0;overflow-y:auto;transform:translateY(105%);box-shadow:0 -6px 18px #0000002e}.moves-dock.open .moves-dock-panel{transform:translateY(0)}.moves-dock.open .moves-dock-toggle{display:none}.moves-dock-head{justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px;display:flex}.moves-dock-head button{min-height:36px}.moves-dock-body .move-log,.moves-dock-body .moves{max-height:46dvh;overflow-y:auto}.page.playing{padding-bottom:64px}}