@font-face{font-family:'Gilda Display';src:url('fonts/gilda-display-latin-400-normal.woff2') format('woff2');font-display:swap;font-weight:400}
@font-face{font-family:'Instrument Sans';src:url('fonts/instrument-sans-latin-400-normal.woff2') format('woff2');font-display:swap;font-weight:400}
@font-face{font-family:'Instrument Sans';src:url('fonts/instrument-sans-latin-600-normal.woff2') format('woff2');font-display:swap;font-weight:600}
*{box-sizing:border-box}html{scroll-behavior:auto;scroll-padding-top:100px}.an-library{margin:0;background:var(--an-color-surface-page);color:var(--an-color-text-primary);font:15px/1.65 var(--an-font-family-sans)}button,input,select{font:inherit}button,a,input,select,summary{-webkit-tap-highlight-color:transparent}a{color:var(--an-color-text-accent);text-underline-offset:4px}button{cursor:pointer}button:disabled{cursor:not-allowed}:focus-visible{outline:2px solid var(--an-color-focus);outline-offset:4px}.skip{position:fixed;top:-100px;left:16px;padding:12px;background:var(--an-color-surface-page);z-index:4}.skip:focus{top:16px}.lib-header{position:sticky;top:0;z-index:2;display:flex;justify-content:space-between;align-items:center;gap:24px;min-height:92px;padding:12px 36px;border-bottom:1px solid var(--an-color-border-subtle);background:var(--an-color-surface-page)}.lib-brand{display:flex;align-items:center;gap:28px;color:inherit;text-decoration:none}.lib-brand img{display:block;width:140px;height:auto}.lib-brand span{padding-left:24px;border-left:1px solid var(--an-color-border-strong)}.lib-header-actions{display:flex;align-items:center;gap:24px}.lib-header button,.secondary{padding:11px 18px;border:1px solid var(--an-color-border-strong);border-radius:var(--an-button-radius);color:var(--an-color-text-primary);background:var(--an-color-surface-page);min-height:44px}.lib-layout{display:grid;grid-template-columns:220px minmax(0,1fr);max-width:1600px;margin:auto}.lib-nav{align-self:start;position:sticky;top:116px;display:flex;flex-direction:column;gap:14px;padding:40px 28px}.lib-nav a{text-decoration:none;color:var(--an-color-text-secondary);font-size:14px}.lib-nav a:hover{color:var(--an-color-text-action)}main{min-width:0;padding:0 clamp(24px,4vw,64px) 0 32px}.lib-intro{padding:80px 0 64px}.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:12px;font-weight:600;color:var(--an-color-text-accent)}h1,h2,h3,h4,p,figure{margin-top:0}h1,h2,h3,h4{font-weight:400}h1{font:400 clamp(48px,5.3vw,80px)/1.05 var(--an-font-family-serif);letter-spacing:-.035em;margin-bottom:28px}h2{font:400 clamp(32px,3vw,48px)/1.12 var(--an-font-family-serif);letter-spacing:-.02em;margin-bottom:24px}h3{font:400 27px/1.2 var(--an-font-family-serif)}h4{font:400 30px/1.2 var(--an-font-family-serif);margin:20px 0 12px}p{max-width:76ch;color:var(--an-color-text-secondary)}.lead{font-size:19px;max-width:53ch}.lib-facts{display:flex;flex-wrap:wrap;gap:40px;margin:42px 0 28px}.lib-facts span{display:flex;flex-direction:column;font-size:13px;color:var(--an-color-text-secondary)}.lib-facts strong{font:400 44px/1.2 var(--an-font-family-serif);color:var(--an-color-text-primary)}.mode-note{font-size:13px;max-width:65ch}section{padding:64px 0;border-bottom:1px solid var(--an-color-border-subtle)}.principles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}.principles h3{font-size:25px}details{margin-top:20px;padding:16px 0;border-top:1px solid var(--an-color-border-subtle)}summary{cursor:pointer;font-weight:600;color:var(--an-color-text-primary);min-height:32px}details p,details .guidance{margin-top:16px}details code{display:block;white-space:normal;overflow-wrap:anywhere}code{font:12px/1.6 ui-monospace,Consolas,monospace;overflow-wrap:anywhere}.guidance h3{font-size:23px;margin:22px 0 8px}.foundation-pair{display:grid;grid-template-columns:1fr 1.15fr;gap:40px;align-items:center}.foundation-pair figure{margin:0}.foundation-pair img{display:block;width:100%;height:420px;object-fit:cover}.foundation-pair figcaption{font-size:12px;color:var(--an-color-text-tertiary);margin-top:12px}.swatch-strip{display:grid;grid-template-columns:repeat(4,1fr)}.swatch-strip span{display:flex;align-items:end;height:100px;padding:12px;font-size:12px}.type-display{font:400 clamp(36px,3.4vw,54px)/1.08 var(--an-font-family-serif);color:var(--an-color-text-primary);margin:30px 0}.section-heading{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:20px}.token-controls{display:grid;grid-template-columns:2fr 1fr 1fr;gap:16px;margin:28px 0 16px}label{display:block;color:var(--an-color-text-primary);font-size:13px;font-weight:600}input,select{display:block;width:100%;margin-top:8px;padding:11px 12px;min-height:46px;background:var(--an-field-bg);color:var(--an-field-fg);border:1px solid var(--an-field-border);border-radius:var(--an-field-radius);font-size:15px}input::placeholder{color:var(--an-field-placeholder)}#token-count{font-size:13px}#token-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.token{border:1px solid var(--an-color-border-subtle);min-width:0;background:var(--an-color-surface-page)}.token-preview{min-height:110px;max-height:140px;overflow:auto;background:var(--an-color-surface-subtle);padding:20px;display:flex;align-items:center;gap:16px}.token-preview p{margin:0;color:var(--an-color-text-primary)}.colour-preview{width:72px;min-width:72px;height:72px;border:1px solid var(--an-color-border-strong)}.token-body{padding:20px}.token h3{font:600 14px/1.5 var(--an-font-family-sans);overflow-wrap:anywhere;margin:0 0 6px}.token .token-meta{font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:var(--an-color-text-tertiary);margin:0 0 12px}.token p{font-size:13px;margin-bottom:12px}.token details{font-size:12px}.token details ul{padding-left:18px;overflow-wrap:anywhere}.token button{margin-top:12px;font-size:12px;padding:8px 12px;min-height:40px}.length-preview{height:20px;max-width:100%;min-width:2px;background:var(--an-color-action-primary)}.token-surface{padding:14px;background:var(--an-color-surface-page);color:var(--an-color-text-primary)}.component{margin-top:32px;padding:28px;background:var(--an-color-surface-subtle)}.state-row{display:flex;flex-wrap:wrap;gap:22px}.state-row>div{display:flex;flex-direction:column;gap:12px}.state-row small{color:var(--an-color-text-secondary)}.action{min-height:52px;padding:12px 24px;border:0;border-radius:var(--an-button-radius);background:var(--an-button-primary-bg);color:var(--an-button-primary-fg);font-weight:600;transition:background var(--an-motion-duration-standard)}.action:hover,.action.is-hover{background:var(--an-button-primary-bg-hover)}.action.is-focus{outline:2px solid var(--an-color-focus);outline-offset:4px}.action:disabled{background:var(--an-button-disabled-bg);color:var(--an-button-disabled-fg)}.product-spec{display:grid;grid-template-columns:minmax(140px,240px) 1fr;gap:28px;align-items:center}.product-spec figure{margin:0}.product-spec img{display:block;width:100%;height:300px;object-fit:cover;object-position:center 18%}.fabric-tag{display:inline-block;padding:4px 8px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;background:var(--an-card-tag-tissue);color:var(--an-card-tag-tissue-fg)}.helper{font-size:12px;margin:10px 0}.field{max-width:460px}.field[aria-invalid="true"]{border-color:var(--an-field-error)}.field-error{color:var(--an-field-error);font-size:13px}.architecture{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;padding:0;list-style:none}.architecture li{border-top:2px solid var(--an-color-border-strong);padding-top:20px}.architecture strong,.architecture span{display:block}.architecture span{margin-top:10px;color:var(--an-color-text-secondary)}.pipeline{display:flex;flex-wrap:wrap;gap:12px;margin:32px 0}.pipeline>*{padding:14px;background:var(--an-color-surface-subtle)}.quality-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px}.quality-grid strong{font:400 clamp(28px,3vw,42px)/1.2 var(--an-font-family-serif)}.quality-grid p{font-size:13px;margin-top:12px}footer{display:flex;justify-content:space-between;padding:40px 0;gap:20px;font-size:13px}dialog{width:min(440px,calc(100% - 32px));border:1px solid var(--an-color-border-strong);padding:28px;background:var(--an-color-surface-page);color:var(--an-color-text-primary)}dialog::backdrop{background:var(--an-color-surface-scrim)}dialog header{display:flex;justify-content:space-between;align-items:start;gap:20px}dialog h2{font-size:30px}.check{display:flex;align-items:center;gap:12px;padding:12px 0;font-size:15px}.check input{width:20px;min-height:20px;margin:0}dialog .action{margin-top:24px}.copy-status{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);margin:0;background:var(--an-color-surface-inverse);color:var(--an-color-text-inverse);padding:0 18px;z-index:3;font-size:13px}.copy-status:not(:empty){padding-block:12px}.load-error{color:var(--an-color-state-error)}[hidden]{display:none!important}
@media(max-width:1050px){.lib-layout{grid-template-columns:1fr}.lib-nav{position:static;flex-direction:row;flex-wrap:wrap;padding:20px 28px;border-bottom:1px solid var(--an-color-border-subtle)}main{padding:0 28px}.lib-intro{padding-top:52px}.principles{grid-template-columns:1fr 1fr}.principles article:last-child{grid-column:1/-1}.foundation-pair{gap:24px}.lib-header{padding:12px 24px}.lib-brand span{display:none}}
@media(max-width:640px){.lib-header{min-height:74px;padding:10px 18px;gap:14px}.lib-brand img{width:105px}.lib-header-actions{gap:12px;font-size:12px}.lib-header-actions button{padding:8px 10px;font-size:12px}.lib-nav{padding:18px;gap:12px 18px}.lib-nav a{font-size:12px}main{padding:0 18px}h1{font-size:47px}.lib-intro{padding:42px 0}.lead{font-size:17px}.lib-facts{gap:22px}.lib-facts strong{font-size:38px}section{padding:42px 0}.principles,.foundation-pair,.token-controls,#token-grid,.architecture,.quality-grid{grid-template-columns:1fr}.principles article:last-child{grid-column:auto}.principles{gap:16px}.foundation-pair img{height:300px}.token-controls{gap:12px}.token-controls input{font-size:16px}.token-controls label:not(:first-child){display:inline-block}.component{padding:20px}.product-spec{grid-template-columns:1fr}.product-spec img{height:380px}.product-spec figure{max-width:280px}.state-row{gap:24px}.quality-grid{gap:24px}.pipeline{display:grid}.lib-facts span{font-size:11px}footer{flex-direction:column}dialog header{align-items:center}dialog h2{margin:0;font-size:26px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}
