@font-face{font-family:Bricolage Grotesque;font-style:normal;font-display:swap;font-weight:600;src:url(/assets/bricolage-grotesque-latin-600-normal-nxTgbNFE.woff2)format("woff2"),url(/assets/bricolage-grotesque-latin-600-normal-Bw0J83-2.woff)format("woff")}@font-face{font-family:Inter;font-style:normal;font-display:swap;font-weight:600;src:url(/assets/inter-latin-600-normal-LgqL8muc.woff2)format("woff2"),url(/assets/inter-latin-600-normal-CiBQ2DWP.woff)format("woff")}@font-face{font-family:JetBrains Mono;font-style:normal;font-display:swap;font-weight:500;src:url(/assets/jetbrains-mono-latin-500-normal-BWZEU5yA.woff2)format("woff2"),url(/assets/jetbrains-mono-latin-500-normal-CJOVTJB7.woff)format("woff")}.topbar{justify-content:space-between;align-items:center;gap:var(--space-3);max-width:var(--page-max);padding:var(--space-4);flex-wrap:wrap;margin:0 auto;display:flex}.brand{align-items:center;gap:var(--space-3);min-height:var(--touch);text-decoration:none;display:inline-flex}.wordmark{font-family:var(--font-display);letter-spacing:-.04em;font-size:2rem;font-weight:800;line-height:1}.wordmark__i{position:relative}.wordmark__i:after{content:"";background:var(--pip-1);border-radius:.04em;width:.17em;height:.17em;position:absolute;top:.08em;left:50%;transform:translate(-50%)}.wordmark__i--b:after{background:var(--pip-2)}.intro{max-width:var(--page-max);padding:var(--space-2) var(--space-4) var(--space-6);margin:0 auto}.intro__title{max-width:22ch;font-family:var(--font-display);letter-spacing:-.03em;font-size:clamp(1.9rem,5vw,3.2rem);font-weight:800;line-height:1.05}.intro__lead{max-width:62ch;margin-top:var(--space-3);color:var(--muted);font-size:1.125rem}.tool{max-width:var(--page-max);min-height:720px;padding:0 var(--space-4);margin:0 auto}.topbar__controls{min-height:52px}.noscript{padding:var(--space-6);border-radius:var(--radius-l);background:var(--surface)}.about{max-width:var(--page-max);padding:var(--space-16) var(--space-4) var(--space-12);margin:0 auto}.about h2{margin-bottom:var(--space-6);font-family:var(--font-display);letter-spacing:-.02em;font-size:clamp(1.6rem,3.5vw,2.25rem);font-weight:800}.about h3{margin-bottom:var(--space-2);font-size:1.125rem}.about p,.about dd{color:var(--muted);max-width:64ch}.about__grid{gap:var(--space-8);margin-bottom:var(--space-16);grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));display:grid}.about code{font-family:var(--font-mono);font-size:.9em}.faq dt{margin-top:var(--space-6);font-weight:600}.faq dd{margin-top:var(--space-1)}.footer{max-width:var(--page-max);padding:var(--space-8) var(--space-4) var(--space-12);border-top:1px solid var(--line);color:var(--muted);margin:0 auto;font-size:.875rem}.controls{align-items:center;gap:var(--space-2);display:flex}.controls__seed{border:1px solid var(--line);background:var(--surface);font-family:var(--font-mono);border-radius:10px;padding:10px 12px;font-size:.875rem}.roll-btn{align-items:center;gap:var(--space-2);min-height:52px;padding:0 var(--space-5);border-radius:var(--radius-m);background:var(--ink);color:var(--paper);font-family:var(--font-display);border:0;font-size:1.125rem;font-weight:800;display:inline-flex}.roll-btn__hint{font-family:var(--font-mono);border:1px solid #8a8891;border-radius:6px;padding:2px 7px;font-size:.7rem;font-weight:500}.icon-btn,.mini-btn{width:var(--touch);height:var(--touch);background:var(--surface);color:var(--ink);border:1px solid #d3d0c8;border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:inline-flex}.icon-btn[aria-pressed=true],.mini-btn[aria-pressed=true]{border-color:var(--ink);background:var(--ink);color:var(--paper)}.mini-btn{border-radius:var(--radius-s);width:36px;height:36px}.text-btn,.solid-btn,.ghost-btn{align-items:center;gap:var(--space-2);min-height:var(--touch);padding:0 var(--space-4);border-radius:12px;font-weight:600;display:inline-flex}.text-btn{border:1px solid var(--line-strong);background:var(--surface)}.solid-btn{background:var(--ink);color:var(--paper);border:0}.solid-btn--light{background:var(--paper);color:var(--ink)}.ghost-btn{color:var(--paper);background:0 0;border:1px solid #6b6973}.layout{gap:var(--space-5);grid-template-columns:minmax(0,2fr) minmax(320px,1fr);align-items:start;display:grid}.bento{gap:var(--space-4);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.aside{top:var(--space-4);gap:var(--space-4);flex-direction:column;display:flex;position:sticky}.tile{gap:var(--space-3);min-width:0;padding:var(--space-4);border:1px solid var(--line);border-radius:var(--radius-l);background:var(--surface);flex-direction:column;display:flex}.tile--colour,.tile--open{grid-column:1/-1}.tile__head{justify-content:space-between;align-items:center;gap:var(--space-2);display:flex}.tile__titles{flex:1 1 0;min-width:0}.tile__title{letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-size:.75rem;font-weight:700}.tile__label{text-overflow:ellipsis;white-space:nowrap;font-size:1rem;font-weight:600;overflow:hidden}.tile__actions{gap:6px;display:flex}.stage{border:1px solid var(--color-border);border-radius:var(--radius-m);background:var(--color-bg);min-height:150px;color:var(--color-text);flex-grow:1;position:relative}.stage__inner{gap:var(--space-3);height:100%;padding:var(--space-4);flex-direction:column;display:flex;overflow:hidden}.stage__open{border-radius:var(--radius-m);background:0 0;border:0;width:100%;position:absolute;inset:0}.stage__open:hover{box-shadow:inset 0 0 0 2px var(--ink)}.stage__hint{background:var(--ink);color:var(--paper);opacity:0;pointer-events:none;border-radius:999px;padding:4px 10px;font-size:.75rem;font-weight:600;transition:opacity .15s;position:absolute;bottom:10px;right:10px}.stage__open:hover+.stage__hint,.stage__open:focus-visible+.stage__hint{opacity:1}.tile__open{gap:var(--space-4);grid-template-columns:minmax(220px,1fr) minmax(0,2.4fr);align-items:start;display:grid}.tile__now{gap:var(--space-2);flex-direction:column;display:flex}.tile__now-label{letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-size:.75rem;font-weight:700}.gallery{gap:var(--space-3);flex-direction:column;min-width:0;display:flex}.gallery__tabs{flex-wrap:wrap;gap:6px;display:flex}.tab-pill{border:1px solid var(--line-strong);background:var(--surface);border-radius:999px;min-height:36px;padding:0 14px;font-size:.875rem;font-weight:600}.tab-pill[aria-pressed=true]{border-color:var(--ink);background:var(--ink);color:var(--paper)}.gallery__grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;display:grid}.pick{gap:var(--space-2);width:100%;height:100%;padding:var(--space-2);border:1px solid var(--line);border-radius:var(--radius-m);background:var(--surface);text-align:left;flex-direction:column;display:flex}.pick:hover{border-color:var(--ink)}.pick[aria-pressed=true]{border-color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink)}.pick__preview{background:var(--color-bg);min-height:84px;color:var(--color-text);border-radius:10px;flex-direction:column;justify-content:center;gap:6px;padding:10px;display:flex;overflow:hidden}.pick__name{justify-content:space-between;align-items:center;gap:6px;min-height:20px;font-size:.8rem;font-weight:600;display:flex}.pick__label{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.pick__inuse{color:var(--pass-fg);flex-shrink:0;align-items:center;gap:3px;display:inline-flex}.gallery__foot{justify-content:space-between;align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.gallery__hint{max-width:46ch;color:var(--muted);font-size:.8rem}.finetune{padding-top:var(--space-3);border-top:1px solid var(--line)}.finetune summary{min-height:var(--touch);cursor:pointer;align-items:center;font-weight:700;display:flex}.sheet{width:100%;max-width:100%;max-height:85vh;padding:var(--space-4);border-radius:var(--radius-l) var(--radius-l) 0 0;background:var(--surface);color:var(--ink);border:0;margin:auto 0 0}.sheet::backdrop{background:#16151c73}.sheet__head{justify-content:space-between;align-items:center;gap:var(--space-2);margin-bottom:var(--space-3);display:flex}.sheet .gallery__tabs{flex-wrap:nowrap;padding-bottom:2px;overflow-x:auto}.sheet .gallery__grid{grid-template-columns:repeat(2,minmax(0,1fr))}.pass,.fail{border-radius:999px;padding:1px 7px;font-size:.75rem;font-weight:700}.pass{background:var(--pass-bg);color:var(--pass-fg)}.fail{background:var(--fail-bg);color:var(--fail-fg)}.status{border-radius:999px;padding:6px 10px;font-size:.8rem;font-weight:600}.status--pass{background:var(--pass-bg);color:var(--pass-fg)}.status--fail{background:var(--fail-bg);color:var(--fail-fg)}.editor{gap:var(--space-3);padding-top:var(--space-2);flex-direction:column;display:flex}.editor__hint{color:var(--muted);font-size:.875rem}.editor__conflict{padding:var(--space-3);background:var(--fail-bg);color:var(--fail-fg);border-radius:10px;font-size:.875rem;font-weight:600}.roles{gap:6px;display:grid}.role{grid-template-columns:40px minmax(0,1fr) 96px 36px 36px 36px 64px;align-items:center;gap:6px;display:grid}.role__picker{border:1px solid var(--line-strong);border-radius:var(--radius-s);background:var(--surface);width:40px;height:36px;padding:2px}.role__name{text-overflow:ellipsis;white-space:nowrap;font-size:.875rem;font-weight:600;overflow:hidden}.role__hex{width:100%;height:36px;padding:0 var(--space-2);border:1px solid var(--line-strong);border-radius:var(--radius-s);font-family:var(--font-mono);text-transform:uppercase;font-size:.8rem}.role__hex[aria-invalid=true]{border-color:var(--fail-fg)}.role__ok{color:var(--pass-fg);text-align:right;font-size:.75rem;font-weight:700}.fix-btn{border-radius:var(--radius-s);background:var(--fail-fg);color:#fff;border:0;height:36px;font-size:.8rem;font-weight:700}.tile--export{gap:var(--space-4);background:var(--ink);color:var(--paper);border:0}.export__seed{justify-content:space-between;align-items:center;gap:var(--space-2);flex-wrap:wrap;display:flex}.export__title{letter-spacing:.1em;text-transform:uppercase;color:#bdbbc3;font-size:.75rem;font-weight:700}.export__code{font-family:var(--font-mono);font-size:1.5rem}.export__code-wrap{align-items:flex-start;gap:var(--space-3);flex-direction:column;min-width:0;display:flex}.tabs{gap:var(--space-1);border:1px solid #45434b;border-radius:12px;flex-wrap:wrap;padding:3px;display:flex}.tab{min-height:38px;padding:0 var(--space-3);color:var(--paper);background:0 0;border:0;border-radius:9px;font-size:.875rem;font-weight:600}.tab[aria-pressed=true]{background:var(--paper);color:var(--ink)}.export__pre{width:100%;max-height:280px;padding:var(--space-3) var(--space-4);background:var(--code-bg);color:var(--code-fg);font-family:var(--font-mono);border-radius:12px;margin:0;font-size:.75rem;line-height:1.6;overflow:auto}@media (width<=1100px){.layout{grid-template-columns:minmax(0,1fr)}.aside{order:-1;position:static}}@media (width<=860px){.bento{grid-template-columns:minmax(0,1fr)}.controls__seed{display:none}}@media (width<=520px){.role{grid-template-columns:40px minmax(0,1fr) 36px 36px 36px}.role__hex{grid-area:2/2/auto/3}.role__ok,.fix-btn{grid-area:2/3/auto/-1}}.k{font-family:var(--k-font-body)}.k-btn{min-height:var(--k-control);padding:0 var(--k-pad);border:2px solid var(--k-button-border);border-radius:var(--k-radius-button);background:var(--k-button-bg);color:var(--k-button-fg);font-family:var(--k-font-body);letter-spacing:var(--k-button-tracking);text-transform:var(--k-button-case);white-space:nowrap;align-self:flex-start;align-items:center;font-size:.9375rem;font-weight:600;display:inline-flex}.k-btn--secondary{border-color:var(--color-border);color:var(--color-text);background:0 0}.k-btn--danger{border-color:var(--color-error);background:var(--color-error);color:var(--color-on-error)}.k-field{min-height:var(--k-control);padding:0 var(--k-field-pad);border-style:solid;border-width:var(--k-field-width);border-color:var(--k-field-sides) var(--k-field-sides) var(--k-field-line);border-radius:var(--k-field-radius);background:var(--k-field-bg);color:var(--color-text);align-items:center;font-size:.9375rem;display:flex}.k-focused{outline:var(--k-focus-outline);outline-offset:var(--k-focus-offset);box-shadow:var(--k-focus-shadow)}.pv-meta{font-family:var(--font-mono);color:var(--color-muted);font-size:.7rem}.pv-checks{align-items:center;gap:var(--space-2);font-size:.8rem;display:flex}.pv-strip{border:1px solid var(--color-border);border-radius:8px;height:44px;display:flex;overflow:hidden}.pv-strip span{flex:1}.pv-type__aa{font-family:var(--k-font-heading);font-size:2.6rem;font-weight:var(--k-weight-heading);line-height:1}.pv-type__heading{font-family:var(--k-font-heading);font-size:1.35rem;font-weight:var(--k-weight-heading);line-height:1.15}.pv-type__body{color:var(--color-muted);font-size:.85rem}.pv-scale{flex-direction:column;gap:4px;display:flex}.pv-scale__row{justify-content:space-between;align-items:baseline;gap:var(--space-2);display:flex}.pv-scale__name{white-space:nowrap;line-height:1.1}.pv-scale__name--heading{font-family:var(--k-font-heading);font-weight:var(--k-weight-heading)}.pv-bars{flex-direction:column;gap:4px;display:flex}.pv-bars__row{align-items:center;gap:var(--space-2);display:flex}.pv-bars__px{text-align:right;width:28px}.pv-bars__bar{background:var(--color-primary);border-radius:2px;height:8px;display:block}.pv-shapes{align-items:flex-end;gap:12px;display:flex}.pv-shapes span{border:2px solid var(--color-text);display:block}.pv-shapes__button{border-radius:var(--k-radius-button);width:64px;height:30px}.pv-shapes__card{border-radius:var(--k-radius-card);width:64px;height:50px}.pv-shapes__input{border-radius:var(--k-radius-input);width:64px;height:26px}.pv-card{border:1px solid var(--k-card-border);border-radius:var(--k-radius-card);background:var(--k-card-bg);box-shadow:var(--k-card-shadow);flex-direction:column;gap:4px;padding:12px;display:flex}.pv-card__title{font-family:var(--k-font-heading);font-weight:var(--k-weight-heading)}.pv-card__body{color:var(--color-muted);font-size:.8rem}.pv-row{flex-wrap:wrap;align-items:center;gap:10px;padding:4px;display:flex}.pv-form{flex-direction:column;gap:6px;display:flex}.pv-form__label{font-size:.8rem;font-weight:600}.swatches{gap:var(--space-2);grid-template-columns:repeat(auto-fill,minmax(84px,1fr));display:grid}.swatch{flex-direction:column;gap:2px;min-width:0;display:flex}.swatch__chip{border:1px solid var(--color-border);border-radius:10px;height:56px}.swatch__name{font-size:.8rem;font-weight:600}.swatch__hex{font-family:var(--font-mono);color:var(--color-muted);font-size:.75rem}.pick__preview .k-btn{min-height:34px;padding:0 12px;font-size:.8rem}.pick__preview .k-field{min-height:34px;font-size:.8rem}.pick__preview .pv-type__aa{font-size:2rem}.sample{gap:var(--k-gap);padding:var(--space-5);border:1px solid var(--color-border);border-radius:var(--radius-m);background:var(--color-bg);color:var(--color-text);font-size:var(--k-text-body);flex-direction:column;display:flex}.sample__nav{justify-content:space-between;align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.sample__brand{font-family:var(--k-font-heading);font-size:1.1rem;font-weight:var(--k-weight-heading)}.sample__links,.sample__lead,.sample__muted{color:var(--color-muted)}.sample__links{font-size:var(--k-text-small)}.sample__link{color:var(--color-link);text-underline-offset:.2em;text-decoration:underline}.sample__hero{gap:var(--k-gap);flex-direction:column;display:flex}.sample__h1{font-family:var(--k-font-heading);font-size:min(var(--k-text-h1), 2.6rem);font-weight:var(--k-weight-heading);letter-spacing:-.01em;line-height:1.05}.sample__lead{max-width:44ch}.sample__buttons{gap:var(--k-gap);flex-wrap:wrap;display:flex}.sample__card{gap:var(--space-2);padding:var(--k-pad);border:1px solid var(--k-card-border);border-radius:var(--k-radius-card);background:var(--k-card-bg);box-shadow:var(--k-card-shadow);flex-direction:column;display:flex}.sample__badge{background:var(--color-accent);color:var(--color-on-accent);border-radius:999px;align-self:flex-start;padding:3px 10px;font-size:.75rem;font-weight:700}.sample__h3{font-family:var(--k-font-heading);font-size:min(var(--k-text-h3), 1.6rem);font-weight:var(--k-weight-heading)}.sample__muted{font-size:var(--k-text-small)}.sample__label,.sample__ok,.sample__err{font-size:var(--k-text-small);font-weight:600}.sample__ok{color:var(--color-success)}.sample__err{color:var(--color-error)}.sample__check{align-items:center;gap:var(--space-2);font-size:var(--k-text-small);display:flex}.sample__box{border:var(--k-field-width) solid var(--k-field-line);border-radius:min(var(--k-radius-input), 5px);background:var(--color-primary);width:18px;height:18px}