.darts-game {
  max-width: 1200px;
  margin: 0 auto;
  padding: clamp(1rem,3vw,2.5rem);
  color: #213a31;
  background: #f9f7ef;
  border-radius: 1.5rem;
  box-shadow: 0 18px 45px #0c233225;
  font-family: system-ui, sans-serif;
}
.darts-intro {max-width: 820px;margin-bottom: 1.5rem}
.darts-intro h1 {font-size:clamp(2rem,4vw,3.3rem);font-weight:800;line-height:1.12}
.darts-intro p {font-size:1.05rem;line-height:1.6}
.darts-eyebrow {color:#a44829;text-transform:uppercase;letter-spacing:.12em;font-weight:800}
.darts-article-link {color:#145e5b;font-weight:750;text-underline-offset:.2em}
.darts-layout {display:grid;grid-template-columns:minmax(0,2fr) minmax(260px,1fr);gap:1.25rem}
.darts-main,.darts-side {background:#fff;border:1px solid #dbe5dd;border-radius:1.25rem;padding:clamp(1rem,2vw,1.6rem)}
.darts-meta {display:flex;gap:.6rem;flex-wrap:wrap;align-items:center;font-weight:750}
.darts-meta span {background:#e7f3f0;padding:.3rem .75rem;border-radius:999px}
.darts-meta span:nth-child(2) {background:#fff0d9;color:#754818}
.darts-target {display:flex;align-items:baseline;gap:.75rem;margin:1rem 0;font-size:1.1rem}
.darts-target strong {font-size:2.1rem;color:#9d3c21}
.darts-board {display:block;width:min(100%,390px);aspect-ratio:1;margin:0 auto 1rem;overflow:visible;touch-action:manipulation}
.darts-sector,.darts-center {cursor:pointer;outline:none}
.darts-sector path {stroke:#fff8e9;stroke-width:3;transition:filter .15s, transform .15s;transform-origin:160px 160px}
.darts-sector:nth-child(odd) path {fill:#206d6b}
.darts-sector:nth-child(even) path {fill:#c45c40}
.darts-sector text,.darts-center text {fill:#fffdf5;font-size:26px;font-weight:800;pointer-events:none}
.darts-center circle {fill:#edba54;stroke:#fff8e9;stroke-width:5}
.darts-center text {fill:#253932;font-size:28px}
.darts-sector:hover path,.darts-sector:focus-visible path,.darts-center:hover circle,.darts-center:focus-visible circle {filter:brightness(1.15);stroke:#1d2f2b;stroke-width:5}
.darts-board-locked .darts-sector,.darts-board-locked .darts-center {cursor:not-allowed;opacity:.72}
.darts-throws {display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;font-weight:700}
.darts-throws>div {display:flex;gap:.4rem}
.darts-throw {display:grid;place-items:center;width:2.7rem;height:2.7rem;border:2px solid #b6c9c3;border-radius:.55rem;font-size:1.1rem}
.darts-status {min-height:3.4rem;padding:.7rem .9rem;border-radius:.75rem;background:#eff6f3;font-weight:650}
.darts-status[data-tone=error] {background:#ffebe4;color:#8e3219}
.darts-status[data-tone=warn] {background:#fff3d6;color:#795000}
.darts-status[data-tone=success] {background:#def5e7;color:#17643e}
.darts-status[data-tone=hint] {background:#e9edfb;color:#354893}
.darts-actions,.darts-navigation {display:flex;flex-wrap:wrap;gap:.55rem;margin:.7rem 0}
.darts-actions button,.darts-navigation button,.darts-level-list button {border:1px solid #93ada4;border-radius:.65rem;padding:.55rem .8rem;background:#fff;color:#173d34;font-weight:700}
.darts-actions button:hover,.darts-navigation button:hover,.darts-level-list button:hover {background:#e7f3f0}
.darts-actions button:focus-visible,.darts-navigation button:focus-visible,.darts-level-list button:focus-visible {outline:3px solid #bd6b41;outline-offset:2px}
.darts-actions button:disabled,.darts-navigation button:disabled {opacity:.5;cursor:not-allowed}
.darts-progress {font-weight:750;margin-top:1rem}
.darts-solutions {padding:1rem 1.2rem 1rem 2.3rem;background:#f4f6ec;border-radius:.8rem;columns:2}
.darts-solutions li {break-inside:avoid;margin-bottom:.35rem}
.darts-side h2 {font-size:1.35rem;font-weight:800}
.darts-level-list {display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.4rem}
.darts-level-list button {padding:.45rem .2rem}
.darts-level-list button.is-active {background:#146966;color:white;border-color:#146966}
.darts-level-list button.is-complete:not(.is-active) {background:#d9f1e3;border-color:#66a881}
.darts-source {margin-top:1.3rem;padding-top:1rem;border-top:1px solid #dbe5dd;color:#61726b;font-size:.9rem;line-height:1.5}
@media (max-width:850px) {.darts-layout{grid-template-columns:1fr}.darts-side{order:-1}}
@media (max-width:480px) {.darts-level-list{grid-template-columns:repeat(6,minmax(0,1fr))}.darts-throws{font-size:.92rem}.darts-solutions{columns:1}}
@media (prefers-reduced-motion:reduce){.darts-sector path{transition:none}}