*{box-sizing:border-box}
  body{margin:0;background:#0f1211}
  [data-theme="light"]{
    --surface:#DCE0D9; --surface-deep:#CDD3CB; --card:#E9ECE5; --border:#C9CFC6;
    --ink:#1C231E; --mid:#5A6455; --accent:#1F5A72; --accent-ink:#164457;
    --accent-soft:rgba(31,90,114,.09); --danger:#8C3A28; --shadow:rgba(28,35,30,.10);
  }
  [data-theme="dark"]{
    --surface:#191D1C; --surface-deep:#212625; --card:#232827; --border:#363D3A;
    --ink:#E6E9E3; --mid:#9BA69C; --accent:#63B2CE; --accent-ink:#8FCADF;
    --accent-soft:rgba(99,178,206,.12); --danger:#D08A74; --shadow:rgba(0,0,0,.35);
  }
  a{color:var(--accent-ink);text-decoration-thickness:1px;text-underline-offset:3px}
  a:hover{color:var(--ink)}
  input,select,textarea,button{font:inherit;color:inherit}
  ::selection{background:var(--accent-soft)}
  :focus-visible{outline:2px solid var(--accent);outline-offset:2px}
  @keyframes drawplot{from{stroke-dashoffset:1400}to{stroke-dashoffset:0}}
  @keyframes popdot{0%{opacity:0;transform:scale(.2)}62%{opacity:1;transform:scale(1.4)}100%{opacity:1;transform:scale(1)}}
  @keyframes splayshot{0%{opacity:0;stroke-dashoffset:44}14%{opacity:.9;stroke-dashoffset:0}64%{opacity:.9;stroke-dashoffset:0}100%{opacity:0;stroke-dashoffset:0}}
  @keyframes drawwall{0%{opacity:.55;stroke-dashoffset:900}100%{opacity:1;stroke-dashoffset:0}}
  @keyframes drawoutline{0%{opacity:.5;stroke-dashoffset:2400}100%{opacity:1;stroke-dashoffset:0}}
  @keyframes symin{0%{opacity:0;transform:translateY(3px)}100%{opacity:1;transform:none}}
  @media (prefers-reduced-motion: reduce){
    [data-plot-draw]{animation:none !important;stroke-dasharray:none !important;stroke-dashoffset:0 !important;opacity:1 !important;transform:none !important}
    [data-splay]{display:none !important}
    [data-replay]{display:none !important}
  }