:root{font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#e4e6df;background:#101714;font-size:15px}*{box-sizing:border-box}body{margin:0}main{max-width:1450px;margin:auto;padding:40px}header{display:flex;justify-content:space-between;align-items:start;gap:20px}.eyebrow{font-size:12px;letter-spacing:.18em;color:#c3ed72}h1{font-size:clamp(32px,4vw,58px);letter-spacing:-.045em;margin:12px 0}h1 span{display:block;color:#82978b;font-weight:400}h2{font-size:18px;color:#d6edb2}h3{font-size:16px}.intro{max-width:720px;font-size:18px;line-height:1.6}p{line-height:1.6;color:#adbbb1}nav{display:flex;flex-wrap:wrap;gap:8px;margin:25px 0}button,select,input{font:inherit;background:#26392d;color:#e6efdf;border:1px solid #4c6251;border-radius:7px;padding:10px;max-width:100%}button{cursor:pointer;margin:3px}button:hover{background:#405737}button:disabled{opacity:.45;cursor:not-allowed}:focus-visible{outline:3px solid #ddf789;outline-offset:3px}.status{border-left:3px solid #c2e975;padding:12px;background:#1a281e;overflow-wrap:anywhere}.layout{display:grid;grid-template-columns:1fr 1fr;gap:22px}section{background:#17231c;border:1px solid #334536;border-radius:14px;padding:24px;margin-bottom:22px;min-width:0}article{background:#1e2e23;padding:16px;border-radius:8px;margin:14px 0}.nodehead{display:flex;justify-content:space-between;align-items:center}label{display:flex;justify-content:space-between;gap:12px;align-items:center;margin:12px 0}select{min-width:120px}.error{color:#ffd2a9;border:1px solid #ae774d;padding:12px;border-radius:7px}.good{color:#c3ed72}.swatches{display:flex;gap:12px}.swatches figure{margin:0;flex:1}.swatches svg{width:100%;height:180px;background:#111;image-rendering:pixelated}.swatches figcaption{margin-top:9px;font-size:12px}li{margin:12px 0;line-height:1.6;overflow-wrap:anywhere}li b{font-size:10px;color:#c3ed72;display:block}pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px;color:#adbfa7;line-height:1.7}textarea{width:100%;height:320px;background:#0e1811;color:#cce2bb;border:1px solid #57734e;border-radius:8px;padding:16px;resize:vertical;font:13px/1.6 monospace}footer{font-size:12px;max-width:1000px}input{width:100px}@media(max-width:760px){main{padding:18px}.layout{grid-template-columns:1fr}header{display:block}section{padding:16px}label{flex-wrap:wrap}.swatches svg{height:130px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
