:root{color-scheme:light;--paper:#fafaf7;--ink:#232722;--green:#236333;--line:#cbd0c4;--muted:#62695f}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.55 Arial,Helvetica,sans-serif}main{max-width:1200px;margin:auto;padding:44px 28px 70px}header{display:flex;justify-content:space-between;gap:24px;align-items:center;padding-bottom:32px;border-bottom:1px solid var(--line)}h1{font-size:30px;letter-spacing:-1px;margin:0 0 4px}h2{font-size:23px;margin:48px 0 18px}h3{font-size:17px;margin:0 0 9px}p{margin:6px 0}.muted{color:var(--muted)}a{color:#214b9b;text-underline-offset:4px}a:hover{color:#102f69}.badge{font:13px Consolas,monospace;border:1px solid var(--line);padding:7px 12px;white-space:nowrap}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}article{border:1px solid var(--line);background:#fff;overflow:hidden;border-radius:7px}.canvas{display:flex;align-items:center;justify-content:center;min-height:240px;padding:32px}.canvas img{display:block;width:100%;height:auto}.light{background:#fafaf7}.dark{background:#000}.mark img{width:210px;max-width:100%}.caption{padding:20px 23px;border-top:1px solid var(--line);font-size:14px}.icons{display:flex;gap:27px;align-items:flex-end;flex-wrap:wrap;padding:24px}.icons figure{margin:0;text-align:center}.icons img{display:block;margin:auto}.icons figcaption{font:12px Consolas,monospace;margin-top:12px;color:var(--muted)}.panel{border:1px solid var(--line);padding:22px;background:#fff;border-radius:7px}.rows{display:flex;flex-wrap:wrap;gap:15px 24px}.preview{display:block;width:100%;height:auto}.small{font-size:14px}.buttons img{image-rendering:pixelated;margin:10px 25px 10px 0}.swatches{display:flex;gap:18px;flex-wrap:wrap}.swatches span{display:flex;align-items:center;gap:9px;font:14px Consolas,monospace}.swatches i{display:inline-block;width:25px;height:25px;border:1px solid #cbd0c4;border-radius:50%}code{font-family:Consolas,monospace;background:#f0f1eb;padding:2px 5px}footer{border-top:1px solid var(--line);margin-top:48px;padding-top:20px;font-size:14px;color:var(--muted)}@media(max-width:720px){.grid{grid-template-columns:1fr}header{display:block}.badge{display:inline-block;margin-top:14px}main{padding:25px 18px}.canvas{min-height:190px;padding:20px}h1{font-size:27px}}
.kit-style-0{margin-top:22px}
.kit-style-1{background:#fafaf7}
.kit-style-2{background:#232722}
.kit-style-3{background:#236333}
.kit-style-4{background:#76b77e}
.kit-style-5{background:#000000}