:root{--ground: #1f2d24;--ground-2: #283a2e;--parchment: #e6dcc3;--parchment-dim: #b7ad97;--west: #5c86c7;--east: #b4483f;--brass: #c9a24a;--font: "Alegreya", Georgia, "Times New Roman", serif}*{box-sizing:border-box}html{background:var(--ground);color:var(--parchment);font-family:var(--font);font-size:18px;line-height:1.55}body{margin:0}main{max-width:68ch;margin:0 auto;padding:2rem 1.25rem 4rem}h1{font-size:2.6rem;line-height:1.05;font-weight:700;margin:0 0 .5rem}h1 span.w{color:var(--west)}h1 span.e{color:var(--east)}h2{font-size:1.35rem;margin:2.5rem 0 .75rem;border-bottom:1px solid var(--ground-2);padding-bottom:.25rem}p{margin:0 0 1rem}a{color:var(--brass)}.lede{font-size:1.15rem;color:var(--parchment-dim)}.cta{display:inline-block;background:var(--brass);color:var(--ground);font-weight:700;padding:.6rem 1.2rem;text-decoration:none;border-radius:3px;margin:.5rem 0 1rem}.cta:hover,.cta:focus-visible{filter:brightness(1.1)}ol.loop{padding-left:1.4rem}ol.loop li{margin-bottom:.5rem}.submit label{display:block;margin-bottom:.8rem;color:var(--parchment-dim)}.submit input,.submit textarea{display:block;width:100%;margin-top:.25rem;padding:.5rem .6rem;font:inherit;color:var(--parchment);background:var(--ground-2);border:1px solid #3c5040;border-radius:3px}.submit input:focus-visible,.submit textarea:focus-visible,button:focus-visible{outline:2px solid var(--brass);outline-offset:2px}.submit button,.controls button{font:inherit;font-weight:700;padding:.5rem 1rem;background:var(--parchment);color:var(--ground);border:0;border-radius:3px;cursor:pointer}.submit button:disabled,.controls button:disabled{opacity:.4;cursor:default}.status{min-height:1.5rem;color:var(--parchment-dim)}.play main{max-width:1100px}#lane{width:100%;height:220px;border:1px solid #3c5040;border-radius:3px;overflow:hidden}.controls{display:flex;flex-wrap:wrap;gap:.5rem;margin:.75rem 0}.controls button.unit{border-left:4px solid var(--west)}.controls kbd{font-family:inherit;opacity:.6;font-size:.85em}#result{font-size:1.4rem;color:var(--brass);min-height:2rem}.side{display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin-top:1.5rem}@media (max-width: 720px){.side{grid-template-columns:1fr}html{font-size:16px}}@media (prefers-reduced-motion: reduce){*{transition:none!important}}
