:root{color:#1d1b20;font-synthesis:none;background:#f4f1e9;font-family:Inter,PingFang SC,Microsoft YaHei,sans-serif}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer}main{min-height:100vh}header{border-bottom:1px solid #d6d0c2;justify-content:space-between;align-items:center;height:72px;padding:0 clamp(22px,5vw,76px);display:flex}.brand{letter-spacing:.08em;align-items:center;gap:10px;font-weight:800;display:flex}.seed{border:1px solid;border-radius:50%;place-items:center;width:30px;height:30px;display:grid}.tag{letter-spacing:.15em;color:#777166;font:600 11px/1 monospace}.hero{grid-template-columns:1.2fr minmax(320px,.8fr);align-items:end;gap:8vw;padding:68px clamp(22px,6vw,92px) 58px;display:grid}.eyebrow{letter-spacing:.22em;color:#6c5ce7;font-size:12px;font-weight:700}.hero h1{letter-spacing:-.055em;margin:14px 0 26px;font-family:Georgia,Songti SC,serif;font-size:clamp(46px,6vw,86px);font-weight:500;line-height:.98}.hero h1 em{color:#6c5ce7;font-style:normal}.lede{color:#615d58;max-width:560px;font-size:16px;line-height:1.75}.picker-card{color:#fff;background:#1e1d1f;border-radius:2px;padding:28px;box-shadow:12px 12px #dcd5c5}.picker-card label{letter-spacing:.16em;color:#aaa4ae;font-size:12px}.color-input{grid-template-columns:48px 1fr auto;gap:10px;margin:16px 0 10px;display:grid}.color-input input[type=color]{background:0 0;border:0;width:48px;height:48px;padding:0}.color-input input[type=text],.color-input input:not([type]){min-width:0}.color-input input{color:#fff;background:#29272b;border:1px solid #4b474e;border-radius:0;padding:0 12px;font-weight:700}.color-input button{color:#17200d;background:#b8ff6d;border:0;padding:0 18px;font-weight:800}.error{color:#ff9d9d;margin:4px 0;font-size:12px}.base-meta{border-top:1px solid #403d42;align-items:center;gap:10px;padding-top:14px;display:flex}.base-meta span{border-radius:50%;width:10px;height:10px}.base-meta small{color:#918b95;margin-left:auto}.palettes{padding:20px clamp(22px,5vw,76px) 80px}.palette{border-top:1px solid #beb7aa;padding:34px 0 48px}.palette-head{justify-content:space-between;align-items:start;margin-bottom:22px;display:flex}.palette-head>div{grid-template-columns:36px auto;align-items:baseline;column-gap:8px;display:grid}.palette-head h2{margin:0;font:500 30px/1 Georgia,Songti SC,serif}.palette-head p{color:#777166;grid-column:2;margin:6px 0 0;font-size:13px}.index{color:#6c5ce7;font:600 10px monospace}.export{background:0 0;border:1px solid #8d877b;padding:9px 14px;font-size:12px}.export:hover{color:#fff;background:#1e1d1f}.swatches{grid-template-columns:repeat(5,1fr);gap:10px;display:grid}.swatch{background:#ebe7de;min-width:0}.color{height:118px;padding:10px}.color span{color:#222;background:#fff9;border-radius:50%;place-items:center;width:22px;height:22px;font:700 10px monospace;display:grid}.values{padding:8px}.values button{text-align:left;background:0 0;border:0;width:100%;padding:7px 5px;display:block}.values button:hover{background:#fff}.values small{color:#8b857b;letter-spacing:.08em;font:600 8px monospace;display:block}.values b{white-space:nowrap;text-overflow:ellipsis;margin-top:2px;font:600 11px/1.3 monospace;display:block;overflow:hidden}footer{text-align:center;letter-spacing:.1em;color:#777166;border-top:1px solid #d6d0c2;padding:28px;font-size:12px}@media (width<=800px){.hero{grid-template-columns:1fr;padding-top:42px}.hero h1{font-size:52px}.picker-card{box-shadow:7px 7px #dcd5c5}.swatches{grid-template-columns:1fr}.swatch{grid-template-columns:120px 1fr;display:grid}.color{height:100%}.values{grid-template-columns:repeat(3,1fr);display:grid}.palette-head{gap:16px}.base-meta small{display:none}}@media (width<=480px){header{height:60px}.tag{display:none}.hero h1{font-size:42px}.color-input{grid-template-columns:42px 1fr}.color-input input[type=color]{width:42px}.color-input button{grid-column:1/-1;height:40px}.palette-head{align-items:end}.palette-head p{max-width:150px}.export{padding:8px}.swatch{grid-template-columns:86px 1fr}.values{grid-template-columns:1fr}.values button{padding:5px}.color{min-height:112px}}