:root{font-family:system-ui,-apple-system,"Segoe UI",sans-serif;color:#233631;background:#f5f4ef;font-synthesis:none;color-scheme:light}
*{box-sizing:border-box}body{margin:0}header{display:flex;align-items:center;gap:1.5rem;padding:1rem 2rem;border-bottom:1px solid #bec8bf;flex-wrap:wrap}
h1{font-size:1.45rem;margin:0}header span{color:#486052;margin-left:auto}a{color:#265747;text-underline-offset:.2em}a:hover{color:#152f24}
main{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(19rem,1fr);gap:2rem;padding:1.5rem 2rem;max-width:1500px;margin:auto}
.toolbar{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:.7rem}button{font:inherit;font-size:.9rem;min-height:44px;padding:.6rem .85rem;border:1px solid #6b8172;border-radius:4px;color:#233631;background:#f5f4ef;cursor:pointer}
button:hover{background:#e0e8df}button[aria-pressed=true]{background:#335947;color:#fff}button:disabled{opacity:.6;cursor:wait}
:focus-visible{outline:3px solid #244d86;outline-offset:3px}#stage{aspect-ratio:4/3;position:relative;background:#e3e2da;border:1px solid #bec8bf}
#stage canvas,#stage img{width:100%;height:100%;object-fit:contain;display:block}#stage [hidden]{display:none}#status{font-size:.9rem;min-height:1.5em;margin-bottom:.4rem}
.caption{font-size:.9rem;color:#486052;line-height:1.5}aside{max-width:68ch}h2{font-size:1.12rem;margin:1.6rem 0 .7rem}aside h2:first-child{margin-top:0}
p{line-height:1.6;margin:.65rem 0}dl{display:grid;grid-template-columns:1fr auto;gap:.7rem 1rem;border-block:1px solid #bec8bf;padding:1rem 0;margin:0}
dt,dd{margin:0}dd{font-variant-numeric:tabular-nums;font-weight:650}.drawing{grid-column:1/-1;border-top:1px solid #bec8bf;padding-top:.5rem}
.drawing img{display:block;width:100%;max-width:1100px;margin:1rem auto;height:auto}
@media(max-width:850px){header{padding:1rem;gap:.7rem 1.2rem}header span{margin-left:0}main{grid-template-columns:1fr;padding:1rem;gap:1.2rem}aside{max-width:none}.drawing{grid-column:auto}h1{font-size:1.2rem}}