.co-caro{--co-caro-paper:#1b2433;--co-caro-paper-line:#96b8e657;--co-caro-x:#ff8a8a;--co-caro-o:#8fbcff;--co-caro-wood:#d9a35a;--co-caro-wood-edge:#9a6a2c;--co-caro-wood-line:#4a2a0e;--co-caro-win:#f2c94c;--co-caro-pick:#f2c94c;--co-caro-last:#f2c94c;border:1px solid var(--tro-choi-line);background:var(--tro-choi-paper-soft);border-radius:20px;gap:.8rem;max-width:900px;margin:2rem auto 0;padding:clamp(.9rem,3.5vw,1.8rem);display:grid;position:relative}html[data-theme=light] .co-caro{--co-caro-paper:#fdfbf3;--co-caro-paper-line:#4278be57;--co-caro-x:#c62828;--co-caro-o:#1557b0;--co-caro-wood:#e9b86a;--co-caro-wood-edge:#b07d35;--co-caro-win:#b7791f;--co-caro-pick:#b7791f;--co-caro-last:#b7791f}@media (width<=480px){.co-caro{border-inline:0;border-radius:0;margin-inline:-1rem;padding-inline:.75rem}.co-caro .co-caro__frame{width:calc(100% + 1.5rem);margin-inline:-.75rem}}.co-caro__preview{border:1px dashed var(--tro-choi-gold);color:var(--tro-choi-gold);border-radius:12px;margin:0;padding:.6rem .9rem;font-size:.92rem;font-weight:700}.co-caro__title{font:600 clamp(1.2rem, 4.2vw, 1.55rem) / 1.3 var(--font-serif,Lora, "Lora fallback", Georgia, serif);text-align:center;margin:.2rem 0 0}.co-caro__note{color:var(--tro-choi-copy);background:var(--tro-choi-paper);border-radius:12px;margin:0;padding:.6rem .9rem;font-size:.95rem}.co-caro__setup{border:1px solid var(--tro-choi-line);border-radius:14px;justify-items:center;gap:.55rem;min-width:0;margin:0;padding:.7rem .8rem .8rem;display:grid}.co-caro__setup legend{color:var(--tro-choi-muted);padding:0 .4rem;font-size:.85rem;font-weight:700}.co-caro__choices{flex-wrap:wrap;justify-content:center;gap:.45rem;display:flex}.co-caro__setup-words{color:var(--tro-choi-copy);text-align:center;margin:0;font-size:.92rem}.co-caro__setup:disabled .co-caro__toggle{cursor:default;opacity:.7}.co-caro__turn{justify-content:center;align-items:center;gap:.5rem;font-weight:700;display:flex}.co-caro__chip{background:var(--tro-choi-line);border-radius:50%;width:.95rem;height:.95rem}.co-caro__chip--x{background:var(--co-caro-x)}.co-caro__chip--o{box-shadow:inset 0 0 0 3px var(--co-caro-o);background:0 0}.co-caro[data-look=go] .co-caro__chip--x{background:radial-gradient(circle at 35% 30%,#6b6b6b,#111 70%)}.co-caro[data-look=go] .co-caro__chip--o{background:radial-gradient(circle at 35% 30%,#fff,#d6d6d6 75%);box-shadow:inset 0 0 0 1px #9a9a9a}.co-caro__frame{width:min(100%,640px);margin:0 auto;container-type:inline-size}.co-caro__paper{--co-caro-gutter:.62;--co-caro-cell:min(2.5rem, calc((100cqi - 8px) / (15 + var(--co-caro-gutter))));grid-template-columns:calc(var(--co-caro-gutter) * var(--co-caro-cell)) calc(15 * var(--co-caro-cell));grid-template-rows:calc(var(--co-caro-gutter) * var(--co-caro-cell)) calc(15 * var(--co-caro-cell));background:var(--co-caro-paper);border-radius:10px;justify-content:center;padding:4px;display:grid;box-shadow:0 10px 28px #00000047}.co-caro__paper.no-coords{--co-caro-gutter:0}.co-caro[data-look=go] .co-caro__paper{border:2px solid var(--co-caro-wood-edge);background:linear-gradient(to bottom, #fff0d224, transparent 40%), linear-gradient(to bottom, transparent, #3c1e051a), var(--co-caro-wood)}.co-caro__coords{color:var(--tro-choi-muted);font:700 calc(var(--co-caro-cell) * .42) / 1 var(--font-sans,system-ui, sans-serif);font-variant-numeric:tabular-nums;-webkit-user-select:none;user-select:none;display:grid}.co-caro[data-look=go] .co-caro__coords{color:#4a2a0ed9}.co-caro__coords span{place-items:center;display:grid}.co-caro__coords--top{grid-area:1/2;grid-template-columns:repeat(15, var(--co-caro-cell))}.co-caro__coords--side{grid-area:2/1;grid-template-rows:repeat(15, var(--co-caro-cell))}.co-caro__board{grid-area:2/2;grid-template-columns:repeat(15, var(--co-caro-cell));grid-template-rows:repeat(15, var(--co-caro-cell));touch-action:manipulation;display:grid;position:relative}.co-caro__lines,.co-caro__win{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.co-caro__grid{fill:none;stroke:var(--co-caro-paper-line);stroke-width:1px}.co-caro[data-look=go] .co-caro__grid{stroke:var(--co-caro-wood-line)}.co-caro__star{fill:var(--co-caro-wood-line)}.co-caro__win line{stroke:var(--co-caro-win);stroke-width:.16px;stroke-linecap:round;opacity:.85;stroke-dasharray:1;stroke-dashoffset:0;animation:.42s ease-out co-caro-draw}.co-caro__cell{width:var(--co-caro-cell);height:var(--co-caro-cell);min-width:0;min-height:0;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;border-radius:0;place-items:center;padding:0;display:grid;position:relative}.co-caro__cell:focus-visible{z-index:2;outline:3px solid var(--tro-choi-son);outline-offset:-2px}.co-caro__cell.is-win{background:#f2c94c38}.co-caro__mark{fill:none;stroke-linecap:round;stroke-width:1.45px;stroke-dasharray:1;stroke-dashoffset:0;width:86%;height:86%}.co-caro__mark--x{stroke:var(--co-caro-x)}.co-caro__mark--o{stroke:var(--co-caro-o)}.co-caro__cell.is-v0>.co-caro__mark{transform:rotate(-4deg)}.co-caro__cell.is-v1>.co-caro__mark{transform:rotate(3deg)translate(2%,-1%)}.co-caro__cell.is-v2>.co-caro__mark{transform:translate(-2%,2%)}.co-caro__cell.is-v3>.co-caro__mark{transform:rotate(5deg)}.co-caro__cell.is-v4>.co-caro__mark{transform:rotate(-2deg)translate(1%,2%)}.co-caro__stone{border-radius:50%;width:88%;height:88%;box-shadow:0 .08em .16em #170a0273}.co-caro__stone--x{background:radial-gradient(circle at 34% 30%,#707070 0%,#262626 45%,#0b0b0b 100%)}.co-caro__stone--o{background:radial-gradient(circle at 34% 30%,#fff 0%,#f1f1f1 45%,#c9c9c9 100%);box-shadow:inset 0 0 0 1px #0000001f,0 .08em .16em #170a0273}.co-caro__cell.is-v1>.co-caro__stone{transform:translate(-3%)}.co-caro__cell.is-v2>.co-caro__stone{transform:translateY(-3%)}.co-caro__cell.is-v3>.co-caro__stone{transform:translate(3%)}.co-caro__cell.is-v4>.co-caro__stone{transform:translateY(3%)}.co-caro__cell.is-last:after{content:"";background:var(--co-caro-last);pointer-events:none;border-radius:50%;width:20%;height:20%;position:absolute;top:8%;right:8%}.co-caro[data-look=go] .co-caro__cell.is-last:after{background:0 0;border:2px solid;width:26%;height:26%;top:50%;right:50%;transform:translate(50%,-50%)}.co-caro[data-look=go] .co-caro__cell.is-last[data-mark=x]:after{color:#f2f2f2}.co-caro[data-look=go] .co-caro__cell.is-last[data-mark=o]:after{color:#222}.co-caro__cell.is-dim>.co-caro__mark,.co-caro__cell.is-dim>.co-caro__stone{opacity:.55}.co-caro__ghost{opacity:.45;place-items:center;width:100%;height:100%;display:grid}.co-caro__cell.is-pending{outline:2px dashed var(--co-caro-pick);outline-offset:-3px}@media (hover:hover){.co-caro[data-turn=x] .co-caro__cell.is-empty:hover:before,.co-caro[data-turn=o] .co-caro__cell.is-empty:hover:before{content:"";pointer-events:none;opacity:.4;border-radius:50%;position:absolute;inset:22%}.co-caro[data-look=giay][data-turn=x] .co-caro__cell.is-empty:hover:before{background:linear-gradient(45deg, transparent 44%, var(--co-caro-x) 44% 56%, transparent 56%), linear-gradient(-45deg, transparent 44%, var(--co-caro-x) 44% 56%, transparent 56%);border-radius:0}.co-caro[data-look=giay][data-turn=o] .co-caro__cell.is-empty:hover:before{border:2px solid var(--co-caro-o)}.co-caro[data-look=go][data-turn=x] .co-caro__cell.is-empty:hover:before{background:#111;inset:8%}.co-caro[data-look=go][data-turn=o] .co-caro__cell.is-empty:hover:before{background:#fff;inset:8%}}.co-caro__cell.is-last>.co-caro__mark{animation:.22s ease-out co-caro-draw}.co-caro__cell.is-last>.co-caro__stone{animation:.16s ease-out co-caro-set}@keyframes co-caro-draw{0%{stroke-dashoffset:1px}to{stroke-dashoffset:0}}@keyframes co-caro-set{0%{scale:.82}to{scale:1}}.co-caro[data-motion=none] .co-caro__mark,.co-caro[data-motion=none] .co-caro__stone,.co-caro[data-motion=none] .co-caro__win line{animation:none}@media (prefers-reduced-motion:reduce){.co-caro__mark,.co-caro__stone,.co-caro__win line{animation:none!important}}.co-caro__message{min-height:2.6em;color:var(--tro-choi-copy);text-align:center;margin:0;font-size:1rem}.co-caro__confirm{flex-wrap:wrap;justify-content:center;gap:.5rem;display:flex}.co-caro__end{border:1px solid var(--tro-choi-gold);text-align:center;background:var(--tro-choi-paper);border-radius:14px;gap:.3rem;padding:.9rem 1rem;display:grid}.co-caro__end h3{color:var(--tro-choi-gold);font:600 1.4rem / 1.25 var(--font-serif,Lora, "Lora fallback", Georgia, serif);margin:0}.co-caro__end h3:focus-visible{outline:3px solid var(--tro-choi-son);outline-offset:3px}.co-caro__end p{color:var(--tro-choi-copy);margin:0}.co-caro__actions{flex-wrap:wrap;justify-content:center;gap:.5rem;display:flex}.co-caro__primary,.co-caro__secondary,.co-caro__toggle{border:1px solid var(--tro-choi-line);min-height:44px;color:var(--tro-choi-ink);background:var(--tro-choi-paper);font:inherit;cursor:pointer;border-radius:999px;padding:.55rem 1rem;font-weight:700}.co-caro__primary{border-color:var(--tro-choi-gold);color:var(--tro-choi-gold);justify-self:center}.co-caro__secondary:hover:not(:disabled),.co-caro__toggle:hover:not(:disabled),.co-caro__primary:hover{border-color:var(--tro-choi-gold)}.co-caro__secondary:disabled{opacity:.5;cursor:default}.co-caro__primary:focus-visible,.co-caro__secondary:focus-visible,.co-caro__toggle:focus-visible{outline:3px solid var(--tro-choi-son);outline-offset:2px}.co-caro__toggle[aria-pressed=true]{border-color:var(--tro-choi-gold);color:var(--tro-choi-gold)}.co-caro__toggle[aria-pressed=true]:before{content:"✓ "}.co-caro__log{border-top:1px solid var(--tro-choi-line);padding-top:.8rem}.co-caro__log h3{font:600 1.1rem / 1.3 var(--font-serif,Lora, "Lora fallback", Georgia, serif);margin:0 0 .4rem}.co-caro__log ol{max-height:12rem;color:var(--tro-choi-copy);grid-template-columns:repeat(auto-fill,minmax(6.5rem,1fr));gap:.2rem 1rem;margin:0;padding:0;font-size:.92rem;list-style:none;display:grid;overflow-y:auto}.co-caro__num{min-width:2.2em;color:var(--tro-choi-muted);font-variant-numeric:tabular-nums;display:inline-block}.co-caro__empty{color:var(--tro-choi-muted);margin:0;font-size:.92rem}