.cf-main{max-width:1160px;margin:auto;padding:12px 24px 44px;color:#25353b}.cf-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:8px 0 18px}.cf-heading h1{font-size:34px;line-height:1.1;margin:5px 0}.cf-kicker{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:#62777b}.cf-badge{font-size:12px;padding:5px 10px;border:1px solid #cdd9d5;border-radius:20px;color:#52736a;white-space:nowrap}.cf-layout{display:grid;grid-template-columns:minmax(0,590px) minmax(260px,1fr);gap:32px}.cf-score{display:flex;justify-content:space-between;gap:12px;font-size:14px;margin:0 0 9px}.cf-score span,.cf-muted{color:#647579;font-size:13px}.cf-muted{line-height:1.5}.cf-play{min-width:0}#cf-board{width:min(100%,calc(100svh - 310px));min-width:300px;margin:auto;aspect-ratio:1;outline:none;touch-action:manipulation}#cf-board:focus-visible{outline:2px solid #237669;outline-offset:4px}#cf-board svg{display:block;width:100%;height:100%;user-select:none}.cf-cell{cursor:pointer}.cf-cell text,.cf-cell .cf-piece,.cf-cell .cf-puck{pointer-events:none}.cf-cell .cf-square{fill:#eaf0eb}.cf-cell.dark .cf-square{fill:#d1dfd7}.cf-cell.goal .cf-square{fill:#bed4c7}.cf-cell.selected .cf-square{fill:#79ad98}.cf-cell.target .cf-square{fill:#e6c57b}.cf-cell.cursor .cf-square{stroke:#406d69;stroke-width:2;stroke-dasharray:3 2}.cf-piece.white{fill:#fffefa;stroke:#466861;stroke-width:1.5}.cf-piece.black{fill:#314d50;stroke:#183638;stroke-width:1.5}.cf-letter{font:700 17px system-ui;fill:#234c43}.cf-letter.black{fill:#fff}.cf-puck{fill:#efc05c;stroke:#84632b;stroke-width:2}.cf-diagram{color:#365f56;width:66px;height:66px}.cf-diagram line{stroke:currentColor;stroke-width:2}.cf-diagram text{fill:currentColor;font:bold 16px system-ui}#cf-status{min-height:44px;line-height:1.45;margin:12px 0 4px;font-size:15px}.cf-tools{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:8px 0}.cf-page button,.cf-page select,.cf-page input:not([type=checkbox]):not([type=range]){font:inherit;min-height:40px;border:1px solid #bdcec7;border-radius:7px;padding:8px 11px;color:#284a43;background:#fff;box-sizing:border-box}.cf-page button{cursor:pointer}.cf-page button:hover{background:#edf4ef}.cf-page button.cf-primary{background:#286c5b;color:#fff;border-color:#286c5b}.cf-page button:disabled{opacity:.5;cursor:default}.cf-page button:focus-visible,.cf-page select:focus-visible{outline:2px solid #2f816c;outline-offset:2px}.cf-page label{font-size:13px}.cf-tools label{display:flex;align-items:center;gap:6px}.cf-goal{font-size:19px;line-height:1.4;margin:0 0 20px;font-weight:600}.cf-notebook{background:#f5f7f2;border:1px solid #dce4da;border-radius:12px;padding:16px}.cf-notebook-heading{display:flex;justify-content:space-between;gap:8px;align-items:center}.cf-notebook h2{font-size:18px;margin:0 0 12px}.cf-notebook label{display:flex;align-items:center;gap:10px}.cf-notebook select{flex:1;min-width:0}#cf-type-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}#cf-type-cards button{position:relative;padding:4px 2px;min-width:0;background:#fff}.cf-type-name{display:block;font-size:10px;overflow-wrap:anywhere}.cf-type-mark{position:absolute;right:3px;top:0;font:bold 20px system-ui}.cf-type-card.excluded{background:#eee!important;color:#888}.cf-type-card.excluded svg{opacity:.25}.cf-type-card.guessed{border:2px solid #347b61}.cf-aside details{border-bottom:1px solid #dce4da;padding:13px 0;font-size:14px;line-height:1.5}.cf-aside summary{cursor:pointer;font-weight:600}#cf-history{max-height:320px;overflow:auto;padding-left:24px;font-size:13px}#cf-history li{padding:5px 0}#cf-link{width:100%;margin:6px 0;font-size:12px}#cf-result{border-left:4px solid #3b8165;background:#edf4ec;padding:12px 16px;margin-top:14px}#cf-result h2{margin:0;font-size:22px}#cf-games-section{margin-top:28px;border-top:1px solid #dbe4db;padding-top:14px}#cf-games-section h2{font-size:20px}#cf-games{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:8px}.cf-game-link{display:block;border:1px solid #dce4da;border-radius:8px;padding:12px;text-decoration:none;color:#305849}.cf-game-link small{display:block;color:#647579;margin-top:5px}#cf-dialog{border:1px solid #b8cbc1;border-radius:12px;padding:24px;max-width:420px}#cf-dialog::backdrop{background:#182c2d70}#cf-replay-slider{display:block;width:100%}[hidden]{display:none!important}@media(max-width:760px){.cf-main{padding:8px 12px 32px}.cf-heading{margin:4px 0 12px}.cf-heading h1{font-size:28px}.cf-kicker{font-size:10px}.cf-badge{font-size:10px}.cf-layout{grid-template-columns:1fr;gap:24px}#cf-board{width:min(100%,450px);min-width:0}.cf-score{font-size:12px}.cf-goal{font-size:16px;margin-bottom:12px}.cf-notebook{padding:12px}.cf-diagram{width:58px;height:58px}.cf-page button{min-height:44px}.cf-type-name{font-size:12px}#cf-status{font-size:14px}.cf-tools{gap:6px}.cf-aside{min-width:0}}
@media(min-width:761px){#cf-board{width:min(100%,calc(100svh - 420px))}}
#cf-known{display:flex;align-items:center;gap:12px;font-size:13px;line-height:1.5;margin-bottom:12px;padding:8px;border:1px solid #c3d7cb;border-radius:8px;background:#e5efe5}#cf-known svg{flex-shrink:0}
/* Persistent last-attempt overlay: color AND shape distinguish the result. */
.cf-last-attempt{pointer-events:none;color:#137357}.cf-last-attempt.denied{color:#b35420}.cf-attempt-origin{fill:none;stroke:currentColor;stroke-width:2.5}.cf-attempt-end{fill:none;stroke:currentColor;stroke-width:3}.cf-attempt-halo{fill:none;stroke:#fffefa;stroke-width:7;opacity:.9}.cf-attempt-line,.cf-attempt-head{fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round}.denied .cf-attempt-line,.denied .cf-attempt-end{stroke-dasharray:5 4}.cf-attempt-badge{fill:currentColor;stroke:#fffefa;stroke-width:1.5}.cf-attempt-symbol{fill:white;font:bold 15px system-ui}.cf-attempt-puck{fill:#efc05c;stroke:currentColor;stroke-width:2}.cf-score{min-height:32px;align-items:center;padding:5px 9px;border-radius:7px;border-left:4px solid transparent;box-sizing:border-box}.cf-score[data-turn=yours]{background:#e0f0df;border-left-color:#267349}.cf-score[data-turn=yours] strong{color:#205e3c}.cf-score[data-turn=theirs],.cf-score[data-turn=sending]{background:#fbedd2;border-left-color:#a36b15}.cf-score[data-turn=theirs] strong,.cf-score[data-turn=sending] strong{color:#865413}.cf-score[data-turn=finished]{background:#e4e9ea;border-left-color:#536c70}.cf-score strong{font-family:system-ui,sans-serif;font-size:14px}.cf-score span{flex-shrink:0}@media(min-width:761px){#cf-board{width:min(100%,calc(100svh - 435px))}}@media(max-width:760px){.cf-score strong{font-size:12px}.cf-score{padding:4px 6px}}
/* Compact notebook identities are relative to the player, including the dark side. */
.cf-piece-group{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:6px;margin:8px 0}.cf-page button.cf-piece-button{width:100%;min-width:0;min-height:34px;height:34px;padding:0!important;font:700 15px/1 system-ui,sans-serif;border:1px solid #9da8a2;border-radius:50%;color:#000;background:#fff}.cf-page button.cf-piece-button.opponent{color:#fff;background:#111;border-color:#111;border-radius:5px}.cf-page button.cf-piece-button[aria-pressed=true]{outline:3px solid #45917a;outline-offset:1px}.cf-page button.cf-piece-button:focus-visible{outline:3px solid #a86e19;outline-offset:2px}.cf-piece-button.captured{text-decoration:line-through;text-decoration-thickness:2px}.cf-aside{min-width:0}
@media(min-width:961px){.cf-layout{grid-template-columns:minmax(300px,430px) minmax(0,1fr);gap:24px}.cf-play{position:sticky;top:16px;align-self:start}.cf-score{gap:6px}.cf-score span{font-size:12px}}
@media(min-width:761px) and (max-width:960px){.cf-layout{grid-template-columns:1fr;gap:24px}.cf-play{position:static;max-width:540px;width:100%;margin:auto}}
@media(max-width:1100px){.cf-piece-group{grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}.cf-page button.cf-piece-button{width:36px;justify-self:center}.cf-piece-group{padding:2px}}
@media(pointer:coarse){.cf-page button.cf-piece-button{width:40px;height:40px;min-height:40px}.cf-piece-group{gap:6px}}

/* Keep desktop notebook scrolling inside its panel, including at both edges. */
.cf-piece-status{padding:8px 10px;border-left:3px solid #8b7160;background:#eee8e1;color:#655044;font-size:13px;line-height:1.4}.cf-page button.cf-piece-button.captured{border-style:dashed;opacity:.55}.cf-aside{overflow-anchor:none}
@media(min-width:961px){.cf-aside{max-height:max(340px,calc(100svh - 230px));overflow-y:auto;overscroll-behavior-y:contain;scrollbar-gutter:stable;padding:4px 10px 4px 4px;box-sizing:border-box;align-self:start}#cf-history{max-height:none;overflow:visible}}
