:root{color-scheme:dark;font-family:system-ui,-apple-system,sans-serif;color:#e2e9df;background:#0c1d24;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 90% 0,#27453f55,transparent 65%)}main{max-width:1280px;margin:auto;padding:28px 30px 20px}header{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:28px}.eyebrow{font-size:10px;letter-spacing:2.5px;font-weight:700;color:#afbeaa;margin:0 0 13px}h1{font-family:Georgia,serif;font-size:56px;font-weight:400;margin:0;line-height:1}h1 span{display:inline-block;font-family:system-ui,sans-serif;font-size:13px;letter-spacing:1px;color:#afc1bc;margin-left:24px}button,select{font:inherit;color:inherit;border:1px solid #48605e;background:#1d343a;border-radius:8px;min-height:43px;padding:9px 14px;cursor:pointer}button:hover,select:hover{background:#2a4649;border-color:#a2c1af}button:disabled{opacity:.4;cursor:default}button:focus-visible,select:focus-visible{outline:3px solid #efd08b;outline-offset:3px}.primary{background:#dec18b;color:#14282d;border-color:#dec18b;font-weight:700}.primary:hover{background:#f4d79f;color:#14282d}.toolbar{display:flex;align-items:end;gap:12px;margin-bottom:22px;flex-wrap:wrap}label{font-size:11px;letter-spacing:1px;color:#afc0bc;display:grid;gap:7px}select{letter-spacing:0;font-size:13px;min-width:188px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 265px;gap:27px;align-items:start}.machine{border:1px solid #49615d;border-radius:15px;overflow:hidden;box-shadow:0 18px 55px #0003;background:#12272d}.readout{display:flex;justify-content:space-between;gap:12px;padding:17px 20px;background:#233b3d;font-size:10px;letter-spacing:1.4px;color:#cbd5bd}#pane{width:100%;position:relative}canvas{display:block;width:100%;height:auto;touch-action:none;cursor:pointer}.message{padding:17px 20px;min-height:73px;font-size:13px;color:#bbcfc6;line-height:1.6;border-top:1px solid #304c4e}.result{padding:0 20px 20px}.result p{font-family:Georgia,serif;font-size:24px;color:#efce95}aside{padding-top:4px}h2{font-family:Georgia,serif;font-size:30px;font-weight:400;line-height:1.15;margin:0 0 14px}.intro{font-size:13px;line-height:1.6;color:#b4c7bf;margin:0 0 20px}.wheels{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:0 0 16px}.wheels button{padding:5px;min-height:38px;font-size:12px}.wheels .active{border-color:#ebcc92;background:#665c40;color:#ffe7b7}.wheels .cleared{color:#98dfb9}.selected{background:#172e34;border:1px solid #38534f;border-radius:10px;padding:16px}#selected{font-size:13px;margin:0 0 12px;color:#d4d8bc}#rotate{width:100%;font-size:13px;padding:9px 8px}.launch-label{font-size:11px;color:#9fb4ad;margin:19px 0 9px}.launch{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.launch button{font-size:23px;padding:4px;min-height:43px}.small{font-size:11px;line-height:1.7;color:#a8bdb2;min-height:39px;margin:11px 0 0}.notes p{font-size:12px;color:#9bb5ad;line-height:1.65}.notes strong{color:#ccd9c8;font-weight:600}.record{border-top:1px solid #334d4b;padding:14px 0;font-size:11px;line-height:1.6;color:#acc1b2}#sound{font-size:11px;min-height:34px}footer{margin:24px 0 0;color:#839e98;font-size:10px;line-height:1.8}footer p{margin:7px 0}a{color:#b7cfb8;text-underline-offset:3px}kbd{font:inherit;background:#304a4a77;border-radius:3px;padding:1px 4px;color:inherit}dialog{color:#e3eadd;background:#182f34;border:1px solid #789482;border-radius:18px;max-width:610px;width:calc(100% - 30px);padding:32px}dialog::backdrop{background:#041317d9;backdrop-filter:blur(5px)}dialog p,dialog li{font-size:13px;line-height:1.8;color:#bcd0c4}dialog li{margin:10px 0}dialog ol{padding-left:20px}.close{float:right;min-width:36px;min-height:36px;padding:0;font-size:25px}dialog h2{max-width:390px}button[hidden],div[hidden]{display:none!important}@media(min-width:1600px){main{padding-top:44px}}@media(max-width:900px){main{padding:24px 20px}.workspace{grid-template-columns:minmax(0,1fr) 220px;gap:16px}h1{font-size:43px}h1 span{display:block;margin:10px 0 0}.readout{padding:12px;font-size:9px}aside h2{font-size:26px}}@media(max-width:660px){main{padding:20px 12px}header{gap:10px;margin-bottom:22px}header button{font-size:11px;padding:8px}h1{font-size:38px}h1 span{font-size:10px;margin-top:10px}.eyebrow{font-size:8px;letter-spacing:1.7px}.toolbar{gap:8px}.toolbar label{flex:1;min-width:140px}.toolbar select{min-width:0;width:100%;font-size:11px}.toolbar button{flex:1;padding:8px;font-size:12px}.workspace{grid-template-columns:1fr}.readout{font-size:8px;letter-spacing:.8px}.message{padding:12px;font-size:12px;min-height:67px}aside{display:grid;grid-template-columns:1fr 1fr;gap:12px}aside>.eyebrow,aside>h2,aside>.intro{display:none}.wheels{grid-column:1;margin:0;align-content:start}.selected{grid-column:2;grid-row:1 / span 3;padding:12px}#rotate{font-size:11px}#rotate kbd{display:none}.notes{grid-column:1}.notes p{font-size:10px;margin:0 0 9px}.record{grid-column:1;font-size:10px;padding:8px 0}#sound{grid-column:1;font-size:10px}footer{margin-top:16px}dialog{padding:24px}}