@font-face{font-family:Chillax;src:url('/assets/chillax-400.woff2')}@font-face{font-family:Chillax;src:url('/assets/chillax-600.woff2');font-weight:600}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:#f4f2e9;color:#202826;font:16px/1.55 Chillax,sans-serif}::selection{background:#d4e766;color:#202826}a{color:inherit;text-underline-offset:4px}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer;min-height:44px;padding:9px 15px;border:1px solid #9aa297;border-radius:8px;background:transparent;color:#202826}button:hover{background:#e6e7dc}button:active{transform:translateY(1px)}:focus-visible{outline:3px solid #3160bd;outline-offset:4px}button.primary{background:#d4e766;border-color:#d4e766}.lab-nav,main,footer{max-width:1400px;margin:auto;padding-inline:40px}.lab-nav{display:flex;justify-content:space-between;align-items:center;height:96px;border-bottom:1px solid #c8cdc0}.lab-nav a:first-child{font-weight:600;font-size:22px;text-decoration:none}.intro{display:flex;align-items:end;justify-content:space-between;gap:24px;padding:46px 0 36px}h1{font-size:48px;line-height:1.1;letter-spacing:-.04em;margin:0}h1 span{color:#59615b}h2{font-size:24px;letter-spacing:-.03em;margin:0 0 8px}p{margin:8px 0 20px}.intro p{font-size:18px;margin-bottom:0}.intro>a{font-size:14px}.workspace{display:grid;grid-template-columns:290px minmax(0,1fr);gap:40px}aside>p,.quiet,.preview-bar{font-size:14px;color:#59615b}.color-row{display:grid;grid-template-columns:48px 1fr;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid #c8cdc0}.color-row label{display:block;font-size:14px;font-weight:600}.color-row input[type=color]{width:48px;height:48px;border:0;padding:0;background:none;cursor:pointer;border-radius:50%;overflow:hidden}.color-row input[type=color]::-webkit-color-swatch-wrapper{padding:0}.color-row input[type=color]::-webkit-color-swatch{border:1px solid #9aa297;border-radius:50%}.hex{width:100%;max-width:140px;font-family:ui-monospace,monospace;font-size:15px;background:transparent;border:0;border-bottom:1px solid transparent;color:#202826;padding:3px 0}.hex:hover,.hex:focus{border-color:#9aa297}.hex[aria-invalid=true]{border-color:#a02b19}.actions{display:flex;gap:8px;flex-wrap:wrap}.preset-label{display:block;margin:24px 0 12px;font-size:14px}select{width:100%;padding:12px;background:transparent;border:1px solid #9aa297;border-radius:8px;color:#202826}.quiet{line-height:1.65}.preview-wrap{min-width:0}.preview-bar{display:flex;justify-content:space-between;padding:0 0 12px;gap:16px}#preview{--background:#f4f2e9;--text:#202826;--accent:#d4e766;--surface:#87a9e0;--on-accent:#202826;background:var(--background);color:var(--text);border:1px solid #c8cdc0;border-radius:16px;overflow:hidden}.sample-nav{display:flex;justify-content:space-between;padding:24px 32px;align-items:center}.sample-nav strong{font-size:22px}.sample-nav span{font-size:12px}.sample-hero{padding:38px 32px 56px;display:grid;grid-template-columns:1.25fr 1fr;align-items:center;gap:12px}.sample-hero h2{font-size:48px;line-height:1.08;letter-spacing:-.04em}.sample-hero p{max-width:330px;font-size:15px;margin:22px 0 30px}.sample-button{display:inline-block;padding:14px 20px;background:var(--accent);color:var(--on-accent);border-radius:8px;font-size:14px;font-weight:600;text-decoration:none}.sculpture{position:relative;aspect-ratio:1;perspective:700px}.sculpture i{position:absolute;inset:4%;border:26px solid var(--surface);border-radius:30%;transform:rotate(-22deg) rotateY(-24deg);box-shadow:6px 12px 20px #20282618}.sculpture i:nth-child(2){inset:18%;border-color:var(--accent);transform:rotate(4deg) rotateY(-24deg)}.sculpture i:nth-child(3){inset:32%;border-width:16px;border-color:var(--text);transform:rotate(30deg) rotateY(-24deg)}.sample-bottom{display:grid;grid-template-columns:1fr 1fr;gap:32px;background:var(--surface);padding:32px}.sample-bottom span{font-size:13px}.sample-bottom h3{font-size:30px;margin:10px 0}.sample-bottom p{font-size:14px;margin-bottom:0;max-width:310px}.type-sample{font-size:100px;letter-spacing:-.04em;line-height:1.2;align-self:center;text-align:center}.type-sample span{display:block;font-size:13px;letter-spacing:0}.results{display:grid;grid-template-columns:1fr 1fr;gap:64px;padding:64px 0}.results>section{min-width:0}.results p{font-size:14px;color:#59615b}.check{padding:16px 0;border-bottom:1px solid #c8cdc0;display:grid;grid-template-columns:1fr auto;gap:4px 16px}.check strong{font-family:ui-monospace,monospace;font-weight:400;font-variant-numeric:tabular-nums}.check small{grid-column:1/-1;font-size:13px;color:#59615b}textarea{display:block;width:100%;height:206px;resize:vertical;border:1px solid #c8cdc0;background:#e9e9df;padding:20px;border-radius:8px;font:14px/1.7 ui-monospace,monospace;color:#202826;margin-bottom:16px}#error,#status{min-height:22px;font-size:13px;margin:8px 0}#error{color:#a02b19}footer{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #c8cdc0;padding-block:28px;font-size:14px}@media(max-width:1000px){.workspace{grid-template-columns:240px minmax(0,1fr);gap:24px}.sample-hero{grid-template-columns:1fr;padding:28px}.sculpture{display:none}.sample-hero h2{font-size:40px}.sample-nav{padding:24px}.sample-nav span{display:none}.sample-bottom{padding:24px;gap:16px}.intro{align-items:start}.intro>a{max-width:160px}}@media(max-width:650px){.lab-nav,main,footer{padding-inline:20px}.lab-nav{height:76px}.intro{display:block;padding-block:30px}.intro>a{display:inline-block;margin-top:16px;max-width:none}h1{font-size:36px}.workspace,.results{grid-template-columns:1fr;gap:32px}#colors{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}.color-row{grid-template-columns:36px 1fr;gap:8px}.color-row input[type=color]{height:36px;width:36px}.hex{max-width:104px}.preview-bar span:last-child{display:none}.sample-bottom{grid-template-columns:1fr 1fr}.type-sample{font-size:72px}.results{padding:40px 0}footer{flex-direction:column}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

#preset{appearance:none;-webkit-appearance:none;padding:14px 44px 14px 16px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m3 6 5 5 5-5' fill='none' stroke='%23202826' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-size:16px;background-position:right 16px center}#preset+.quiet{margin-top:14px}@media(forced-colors:active){#preset{appearance:auto;-webkit-appearance:auto;background-image:none;padding-right:16px}}
