:root{color-scheme:light;--bg: Canvas;--fg: CanvasText;--muted: GrayText;--line: GrayText;--cell: #ffffff;--cell-stroke: #b3b2ad;--accent: #2d5bd7;--danger: #c00;--fs-title: 2em;--fs-small: .85em;color:var(--fg);background:var(--bg)}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){color-scheme:dark;--cell: #d9d8d3;--cell-stroke: #8d8c87;--danger: #f66}}:root[data-theme=dark]{color-scheme:dark;--cell: #d9d8d3;--cell-stroke: #8d8c87;--danger: #f66}*{box-sizing:border-box}html{overflow:hidden;overscroll-behavior:none;touch-action:manipulation;-webkit-text-size-adjust:100%;text-size-adjust:100%}body{margin:0;height:100vh;height:100dvh;overflow:hidden;background:var(--bg)}#app{height:100%;padding:8px 12px}h1,h2,p{margin:0}h2{font-size:1.2em}small,.hint{color:var(--muted);font-size:var(--fs-small)}button{cursor:pointer}.link{padding:0;border:0;background:none;color:LinkText;font:inherit;text-decoration:underline}.link:disabled{color:var(--muted);text-decoration:none;cursor:default}.screen{display:grid;grid-template-rows:auto minmax(0,1fr);gap:24px;height:100%}.bar{display:flex;justify-content:space-between;align-items:center;gap:4px 16px}.bar>div{display:flex;align-items:center;gap:16px;min-width:0}.menu{display:grid;gap:16px;align-content:start;justify-items:center;justify-self:center;width:min(100%,720px);text-align:center}.menu.home{align-self:center;padding-bottom:10vh}.tagline{color:var(--muted)}.modes{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}.split{position:relative;display:flex;gap:2px}.bot-menu,.settings-menu{position:absolute;top:calc(100% + 2px);z-index:10;display:grid;gap:8px;padding:8px;background:var(--bg);border:1px solid var(--fg);text-align:left}.bot-menu{right:0;width:max-content;min-width:100%}.bot-menu[hidden],.settings-menu[hidden]{display:none}fieldset{margin:0;padding:0;border:0;min-width:0}.bot-levels{display:grid}.bot-level,.style-choice{cursor:pointer;white-space:nowrap}.styles{display:flex;flex-wrap:wrap;align-items:center;gap:2px 10px}.bot-menu .styles{flex-wrap:nowrap;padding-top:8px;border-top:1px solid var(--line)}.settings{position:relative}.settings-menu{left:0;width:max-content;max-width:calc(100vw - 16px);white-space:nowrap}.settings-menu .styles{flex-wrap:nowrap}.settings-menu legend{float:left;min-width:9em}.resume[hidden]{display:none}.form{display:grid;gap:10px;width:min(100%,320px);text-align:left}.form label{display:grid;gap:2px}.form .concealed{visibility:hidden}.form .show-password{display:flex;align-items:center;gap:4px;cursor:pointer}.form-error{min-height:1.2em;color:var(--danger)}.form-error[hidden]{display:none}.tabs{display:flex;gap:4px}.tabs [aria-selected=true]{font-weight:700}.inline{display:flex;gap:4px}.inline input{flex:1;min-width:0}.stats{margin:0}.stats div{display:flex;gap:6px}.stats dt:after{content:" :"}.stats dd{margin:0;font-weight:700}.players-online{font-size:var(--fs-small);font-weight:400;white-space:nowrap}.join-code{width:min(100%,320px)}.search-time,.code{font-size:var(--fs-title);font-weight:700;font-variant-numeric:tabular-nums}.code{letter-spacing:.1em}.share{display:flex;gap:4px;width:min(100%,520px)}.share input{flex:1;min-width:0}.page{display:grid;grid-template-rows:auto auto minmax(0,1fr);gap:16px;justify-items:center;height:100%}.page>.bar{justify-self:stretch}.page-scroll{width:min(100%,600px);min-height:0;overflow-y:auto;overscroll-behavior:contain}.ranking{width:100%;border-collapse:collapse}.ranking th{position:sticky;top:0;background:var(--bg)}.ranking th,.ranking td{padding:2px 6px;border:1px solid var(--line);text-align:left}.ranking td:nth-child(n+3),.ranking th:nth-child(n+3){text-align:right}.ranking td:nth-child(2){overflow-wrap:anywhere}.ranking tr.me td{font-weight:700}.rules-page{display:grid;grid-template-rows:auto minmax(0,1fr);gap:32px;height:100%}.rules-scroll{min-height:0;overflow-y:auto;overscroll-behavior:contain}.rules-text{max-width:640px;margin:0 auto;padding-bottom:32px}.rules-text h1,.rules-text h2{margin:1em 0 .4em}.rules-text p,.rules-text ul,.rules-text ol{margin:0 0 .8em}.rules-text .note{font-style:italic}.rules-text table{margin:.5em 0 1em;border-collapse:collapse}.rules-text th,.rules-text td{padding:2px 6px;border:1px solid var(--line);text-align:left;vertical-align:top}.rules-text td:first-child{white-space:nowrap}.face-cards{display:flex;flex-wrap:wrap;gap:32px;margin:8px 0 12px}.face-card{display:grid;gap:4px;justify-items:center;margin:0}.face-card figcaption,.cycle-star,.zone-schema figcaption{font-size:var(--fs-small)}.diagram{width:120px;max-width:100%}.mini-cell{fill:var(--cell);stroke:var(--cell-stroke);stroke-width:.6}.mini-cell.hit{fill:color-mix(in srgb,var(--accent) 22%,var(--cell))}.mini-dot{fill:var(--accent)}.cycle{margin:4px 0 0}.cycle-stars{display:flex;flex-wrap:wrap;align-items:center;gap:4px}.cycle-star{display:grid;justify-items:center;gap:2px;padding:4px;border:0;background:none;color:inherit;font:inherit}.cycle-star svg{width:64px;height:64px}.zone-schema{display:grid;justify-items:start;gap:8px;margin:12px 0 0}.zone-schema .board{position:static;width:min(100%,280px);height:auto;pointer-events:none}.zone-schema figcaption{display:flex;flex-wrap:wrap;gap:16px}.dot{display:inline-block;width:10px;height:10px;margin-right:6px}.dot.white{background:var(--accent)}.dot.black{background:var(--muted)}.dot.castle{background:#e3b64a}.tuto{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:24px;align-items:center;height:100%}.tuto-board{position:relative;height:100%;min-height:0}.tuto-side{display:grid;gap:10px;align-content:center;max-height:100%;overflow-y:auto}.tuto-step{color:var(--muted);font-size:var(--fs-small)}.tuto-face,.tuto-forbidden{display:flex;align-items:center;gap:12px}.tuto-face span{flex:1}.tuto-forbidden .forbidden{margin:0}.tuto-msg.ok{color:green}.tuto-msg.ko{color:var(--danger)}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .tuto-msg.ok{color:#7fc68f}}:root[data-theme=dark] .tuto-msg.ok{color:#7fc68f}.tuto-proceed{display:flex;flex-wrap:wrap;gap:8px}.tuto-nav{display:flex;flex-wrap:wrap;gap:4px 16px;margin-top:8px}.match{display:grid;grid-template-columns:minmax(0,1fr) 300px;grid-template-rows:minmax(0,1fr);gap:16px;height:100%}.board-area{position:relative;min-width:0;min-height:0}.board-wrap{position:absolute;inset:0}.board{position:absolute;inset:0;width:100%;height:100%;display:block;-webkit-user-select:none;user-select:none}.board3d-loading{position:absolute;top:50%;left:50%;z-index:1;width:40px;height:40px;margin:-20px 0 0 -20px;border:3px solid var(--line);border-top-color:var(--muted);border-radius:50%;animation:board3d-spin .8s linear infinite}@keyframes board3d-spin{to{transform:rotate(360deg)}}.board3d-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;cursor:grab;touch-action:none}.cell{fill:var(--cell);stroke:var(--cell-stroke);stroke-width:1}.cell.castle{fill:#e3b64a}.piece{cursor:pointer}.token .plate{stroke-width:1.5;stroke-linejoin:miter}.token.p2 .plate{fill:#ece8de;stroke:#b9ae95}.token.p1 .plate{fill:#30333b;stroke:#151719}.token.p0 .plate{fill:#b9b6ae;stroke:#6d6a62}.token .star{fill:#2a2620;stroke:none;pointer-events:none}.token.p1 .star{fill:#efe6d4}.token .lord{fill:#f0bf3c;stroke:#6b4a08;stroke-width:1.1;stroke-linejoin:round;paint-order:stroke;pointer-events:none}.piece.selected .plate{stroke:var(--accent);stroke-width:3.5}.piece.forbidden .token{opacity:.45}.threat-ring{fill:none;stroke:var(--danger);stroke-width:2.5;stroke-dasharray:5 3}.hl{pointer-events:none}.hl-move,.hl-place{fill:var(--accent)}.hl-preview{fill:var(--muted);opacity:.8}.hl-next{fill:none;stroke:var(--accent);stroke-width:2;stroke-dasharray:4 3}.cell.danger{fill:color-mix(in srgb,var(--danger) 16%,var(--cell))}.hl-capture{fill:none;stroke:var(--danger);stroke-width:3.5}.hl-lord{fill:none;stroke:#e0a91a;stroke-width:3.5}.hl-target{cursor:pointer}.hl-hit{fill:transparent}.hl-target:hover .hl{transform:scale(1.35)}.hl-target .hl{transition:transform .12s ease}@media(prefers-reduced-motion:reduce){.hl-target .hl{transition:none}}.capture-ghost{pointer-events:none}.coord{fill:var(--muted);font-size:12px;text-anchor:middle;dominant-baseline:central;pointer-events:none;-webkit-user-select:none;user-select:none}.icon{display:block}.panel{display:grid;gap:12px;align-content:center;align-self:center;min-height:0;max-height:100%;overflow:auto}.clock{display:flex;align-items:baseline;gap:8px;padding:4px 8px;border:1px solid;font-variant-numeric:tabular-nums}.clock.p1{background:#000;color:#fff;border-color:#000}.clock.p2{background:#fff;color:#000;border-color:#000}.clock .time{margin-left:auto;font-size:1.5em;font-weight:700}.clock:not(.running) .time{opacity:.55}.clock.low .time{color:var(--danger)}.clock.p1.low .time{color:#f66}.clock .time:empty{display:none}.clock:has(.time:empty):not(.running){opacity:.55}.forbidden{position:relative;width:fit-content;margin:0 auto}.forbidden:after{content:"";position:absolute;left:-4px;right:-4px;top:50%;height:3px;background:var(--danger);transform:rotate(-45deg)}.setup[hidden]{display:none}.choices{display:flex;flex-wrap:wrap;gap:8px}.choices.faces{justify-content:center}.tuto-side .choices.faces{justify-content:flex-start}.face-choice{display:grid;justify-items:center;padding:2px}.face-choice.selected{outline:2px solid var(--fg)}.tools{position:fixed;top:8px;left:12px;z-index:20;display:flex;gap:6px}.notice{color:var(--danger);font-size:var(--fs-small)}.notice[hidden]{display:none}.actions{display:flex;align-items:center;justify-content:center;gap:16px;min-height:36px}.icon-btn{display:grid;place-items:center;padding:2px 6px}.icon-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.modal,.end{position:fixed;inset:0;z-index:30;display:grid;place-items:center;padding:16px;background:#0000004d}.end{position:absolute;z-index:5;animation:end-fade .2s ease-out .45s both}.modal[hidden],.end[hidden]{display:none}.modal-card,.end-card{display:grid;gap:12px;width:min(340px,100%);padding:16px;background:var(--bg);border:1px solid var(--fg)}.modal-buttons,.end-buttons{display:flex;flex-wrap:wrap;gap:8px}.end-card{gap:6px}.end h2{font-size:1.5em}.end.loss h2{color:var(--danger)}.end-reason{color:var(--muted)}.end-note{font-weight:700}.end-note[hidden]{display:none}.end-buttons{margin-top:8px}@keyframes end-fade{0%{opacity:0}}@media(prefers-reduced-motion:reduce){.end{animation:none}}.moves{display:none}@media(min-width:801px){.match{grid-template-rows:minmax(0,1fr) auto}.board-area{grid-row:1 / -1}.panel{grid-column:2;grid-row:1}.moves{display:grid;grid-template-rows:auto minmax(0,1fr);gap:8px;grid-column:2;grid-row:2;height:min(30vh,260px);min-height:0;padding:4px 6px;border:1px solid var(--line)}.moves h2{font-size:1em}.moves ol{margin:0;padding:0;min-height:0;overflow-y:auto;list-style:none;font-family:monospace;font-variant-numeric:tabular-nums}.moves li{display:grid;grid-template-columns:4ch 1fr 1fr;gap:8px}.moves .num{color:var(--muted);text-align:right}.moves[hidden]{display:none}.moves .mv.last{font-weight:700}}@media(max-height:760px){.panel{gap:8px}.clock .time{font-size:1.25em}}@media(max-width:800px){.match{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto;gap:8px}.panel{align-self:end;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}.clock .name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.panel>:not(.clock){grid-column:1 / -1}.clock{grid-row:1}.clock .time{font-size:1.1em}.tuto{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto;gap:12px}.tuto-side{align-content:start;max-height:48dvh}.face-cards{gap:16px}.diagram{width:90px}.rules-text td:first-child{white-space:normal}}@media(max-width:600px){.bar{flex-direction:column;align-items:flex-start;gap:4px}.bar>div{gap:16px;max-width:100%}}@media(max-width:400px){.bar [data-account]{min-width:0}.bar [data-account] .link{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}