.nuo-page{background:var(--touchlab-module-background);color:#304b42;height:100svh;min-height:820px;position:relative;overflow:hidden}.nuo-stage{position:absolute;inset:95px 275px 90px 160px}.nuo-stage canvas{width:100%;height:100%;display:block}.nuo-stage canvas:focus{outline:none}.nuo-stage canvas:focus-visible:not([data-pointer-focus]){outline-offset:-2px;outline:2px solid #7d9884}.nuo-intro{pointer-events:none;position:absolute;top:154px;left:4.5%}.nuo-intro>span,.nuo-label{color:#78857b;font:12px monospace}.nuo-intro h1{margin:22px 0;font-size:42px;font-weight:500;line-height:1.45}.nuo-intro em{color:#9aa99c;font-style:normal}.nuo-intro p{color:#6f8175;margin-top:30px;font:12px monospace}.nuo-panel{width:220px;position:absolute;top:25%;right:4%}.nuo-panel h2{margin:14px 0 34px;font-size:21px;font-weight:500}.nuo-label-row{justify-content:space-between;align-items:center;margin:21px 0 12px;font-size:14px;display:flex}.nuo-label-row>span:last-child,.nuo-label-row output{color:#7c8b81}.nuo-swatches{gap:18px;margin-bottom:27px;display:flex}.nuo-swatches button{border:4px solid #f1f3f0;border-radius:50%;outline:1px solid #c5cdc4;width:34px;height:34px}.nuo-swatches button[aria-pressed=true]{outline-color:#35594a}.nuo-panel input[type=range]{accent-color:#466653;cursor:pointer;background:0 0;width:100%;height:20px;margin:0 0 24px;display:block}.nuo-poke{color:#fff;background:#35594a;border:0;border-radius:5px;justify-content:space-between;align-items:center;width:100%;height:48px;margin-top:29px;padding:0 16px;font-size:14px;display:flex}.nuo-reset{color:#6c7e71;background:0 0;border:0;justify-content:center;align-items:center;gap:8px;margin:19px auto;font-size:13px;display:flex}.nuo-tools{background:#ffffffdb;border:1px solid #dfe5db;border-radius:7px;align-items:center;gap:5px;padding:7px;display:flex;position:absolute;bottom:95px;left:46%;transform:translate(-50%)}.nuo-tools button{color:#7a8f80;background:0 0;border:0;border-radius:4px;place-items:center;width:42px;height:42px;display:grid;position:relative}.nuo-tools button[aria-pressed=true]{color:#30573d;background:#e4ece0}.nuo-tools button span{color:#fff;white-space:nowrap;background:#35594a;border-radius:4px;padding:6px 9px;font-size:12px;display:none;position:absolute;bottom:54px}:is(.nuo-tools button:hover span,.nuo-tools button:focus-visible span){display:block}.nuo-tools>i{background:#dce2dc;border-radius:0;width:1px;height:24px;margin:0 5px}.nuo-footer{color:#738177;border-top:1px solid #dce3d9;justify-content:space-between;align-items:center;height:61px;font:12px monospace;display:flex;position:absolute;bottom:0;left:4.5%;right:4.5%}.nuo-footer a{align-items:center;gap:8px;font-size:13px;display:flex}.nuo-error{background:#fff;border-radius:8px;width:min(360px,85%);padding:24px;position:absolute;top:45%;left:50%;transform:translate(-50%,-50%)}.nuo-error button{color:#fff;background:#35594a;border:0;border-radius:4px;padding:10px 16px}@media (max-width:1100px){.nuo-intro h1{font-size:33px}.nuo-panel{width:190px;right:3%}.nuo-stage{inset:130px 180px 100px 30px}.nuo-intro{top:120px}}@media (max-width:700px){.nuo-page{height:auto;min-height:1100px}.nuo-intro{top:108px;left:24px}.nuo-intro h1{margin:12px 0;font-size:28px}.nuo-intro p{display:none}.nuo-stage{height:360px;inset:205px 0 auto}.nuo-panel{grid-template-columns:1fr 1fr;column-gap:25px;width:auto;display:grid;top:660px;left:25px;right:25px}.nuo-label,.nuo-panel h2{display:none}.nuo-panel>div.nuo-label-row{grid-column:1/-1;margin-top:0}.nuo-swatches{grid-column:1/-1;margin:5px 0 4px}.nuo-panel label[for=nuo-stick]{grid-area:3/1}.nuo-panel label[for=nuo-memory]{grid-area:3/2}.nuo-panel input{grid-row:4}.nuo-panel input[type=range]{margin-bottom:6px}.nuo-poke{grid-column:1/-1;margin-top:17px}.nuo-reset{grid-column:1/-1;margin:18px auto}.nuo-tools{top:586px;bottom:auto;left:50%}.nuo-footer{height:60px}.nuo-footer>span:last-child{display:none}}@media (prefers-reduced-motion:reduce){.nuo-page *{transition:none!important}}
