@import url("https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500&display=swap");.system-layout{min-height:100vh;background:var(--background);color:var(--foreground);font-family:var(--font-archivo),"Archivo",sans-serif}.system-logo{position:fixed;top:24px;left:24px;z-index:100;mix-blend-mode:difference}.system-logo a{display:block;line-height:0;transition:opacity .3s ease}.system-logo a:hover{opacity:.6}.system-logo img,.system-logo-lottie{filter:invert(1) contrast(1000)}.system-logo-lottie{width:100px;height:100px}.system-page{max-width:760px;margin:0 auto;padding:48px 24px 96px}.system-header{margin-bottom:56px;padding-bottom:40px;border-bottom:1px solid #e0e0e0}.system-header-eyebrow{font-family:var(--font-homemade-apple),"Homemade Apple",cursive;font-weight:500;font-size:20px;color:#1a1a1a;margin-bottom:6px}.system-header h1{font-family:var(--font-archivo),"Archivo",sans-serif;font-weight:800;font-size:44px;line-height:1.1;letter-spacing:-.5px;margin:0}.system-header-desc{font-size:17px;line-height:1.6;color:#666;margin:16px 0 0;max-width:60ch}.system-prose{font-size:16px;line-height:1.75;color:#333}.system-prose>:last-child{margin-bottom:0}.system-prose h2{font-size:28px;font-weight:700;margin:64px 0 16px;letter-spacing:-.3px;scroll-margin-top:32px}.system-prose h3{font-size:20px;font-weight:600;margin:40px 0 12px;scroll-margin-top:32px}.anchor-heading{display:flex;align-items:center;gap:10px}.anchor-heading-link{display:inline-flex;align-items:center;justify-content:center;flex:none;width:32px;height:32px;padding:0;border:none;border-radius:50%;background:#f2f2f2;color:#8a8a8a;cursor:pointer;opacity:0;transform:scale(.85);transition:opacity .2s ease,transform .2s ease,color .2s ease,background .2s ease}.anchor-heading-link:focus-visible,.anchor-heading:hover .anchor-heading-link{opacity:1;transform:scale(1)}.anchor-heading-link:hover{color:#1a1a1a;background:#e9e9e9}.anchor-heading-link:active{transform:scale(.92)}.anchor-heading-icon{display:inline-flex;align-items:center;justify-content:center}.anchor-heading-icon svg{display:block}.system-prose p{margin:0 0 24px}.system-prose a{color:#1a1a1a;text-decoration:underline;text-underline-offset:3px;transition:opacity .2s}.system-prose a:hover{opacity:.6}.system-prose strong{font-weight:600}.system-prose ol,.system-prose ul{margin:0 0 24px;padding-left:1.5em}.system-prose ul{list-style-type:disc}.system-prose ol{list-style-type:decimal}.system-prose li{margin-bottom:8px}.system-prose code{font-family:JetBrains Mono,monospace;font-size:.875em;background:#f5f5f5;padding:2px 6px;border-radius:4px}.system-prose hr{border:none;border-top:1px solid #e0e0e0;margin:56px 0}.token-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:16px;margin:8px 0 32px}.token{display:flex;flex-direction:column;gap:6px}.token--wide{grid-column:1/-1}.token-chip{border-radius:10px;border:1px solid rgba(0,0,0,.08)}.token-chip,.token-radius{width:100%;aspect-ratio:3/2}.token-radius{background:#1a1a1a}.token-name{font-size:13px;font-weight:600;color:#1a1a1a}.token-value{font-family:JetBrains Mono,monospace;font-size:12px;color:#666;background:#f5f5f5;padding:2px 6px;border-radius:4px;align-self:flex-start}.token-value--block{align-self:stretch;white-space:pre-wrap;word-break:break-all}.token-note{font-size:12px;color:#999;line-height:1.4}.scale{margin:8px 0 28px}.scale-row{display:grid;grid-template-columns:repeat(7,1fr);gap:10px}.scale-swatch{position:relative;display:block;width:100%;min-width:0;padding:0;border:none;background:none;font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}.scale-chip{display:block;width:100%;height:88px;border-radius:10px;border:1px solid rgba(15,23,43,.08);transition:transform .2s ease,box-shadow .2s ease}.scale-swatch:hover .scale-chip{transform:translateY(-2px);box-shadow:0 6px 14px rgba(15,23,43,.12)}.scale-swatch:active .scale-chip{transform:translateY(0) scale(.97)}.scale-swatch:focus-visible{outline:none}.scale-swatch:focus-visible .scale-chip{box-shadow:0 0 0 2px var(--background),0 0 0 4px var(--accent)}.scale-tip{position:absolute;bottom:calc(100% + 10px);left:50%;z-index:5;display:flex;align-items:center;justify-content:center;padding:6px 12px;border-radius:8px;background:var(--surface);border:1px solid #e5e5e5;box-shadow:0 4px 16px rgba(0,0,0,.08);color:#1a1a1a;font-family:var(--font-archivo),"Archivo",sans-serif;font-size:13px;line-height:normal;white-space:nowrap;pointer-events:none;opacity:0;transform:translateX(-50%) translateY(4px);transition:opacity .2s ease,transform .28s cubic-bezier(.22,1,.36,1)}.scale-swatch:focus-visible .scale-tip,.scale-swatch:hover .scale-tip,.scale-swatch[data-copied] .scale-tip{opacity:1;transform:translateX(-50%) translateY(0)}.scale-tip-inner{display:inline-flex;align-items:center;gap:5px}.scale-tip-inner svg{display:block}@media (max-width:640px){.scale-row{grid-template-columns:repeat(4,1fr);gap:8px}}.type-specimen{padding:20px 0;border-bottom:1px solid #f0f0f0}.type-specimen-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}.type-specimen-name{font-size:13px;font-weight:600}.type-specimen-sample{color:#1a1a1a;line-height:1.2}.component-preview{margin:24px 0 40px;border:1px solid #e5e7eb;border-radius:16px;overflow:hidden}.component-preview-canvas{display:flex;align-items:center;justify-content:center;min-height:160px;padding:40px 24px}.component-preview-canvas--light{background:var(--surface)}.component-preview-canvas--dark{background:#1a1a1a;color:#fff}.component-preview-canvas--checker{background-color:#fafafa;background-image:linear-gradient(45deg,#f0f0f0 25%,transparent 0),linear-gradient(-45deg,#f0f0f0 25%,transparent 0),linear-gradient(45deg,transparent 75%,#f0f0f0 0),linear-gradient(-45deg,transparent 75%,#f0f0f0 0);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0}.component-preview-canvas--glass{background-color:#f4f4f5;background-image:radial-gradient(circle at 18% 28%,rgba(255,86,120,.55),transparent 42%),radial-gradient(circle at 82% 22%,rgba(70,140,255,.55),transparent 42%),radial-gradient(circle at 68% 82%,rgba(96,214,150,.5),transparent 42%),radial-gradient(circle at 28% 78%,rgba(255,196,64,.5),transparent 42%)}.component-preview-canvas--tall{min-height:280px;align-items:flex-start;padding-top:28px}.navbar-demo-frame{display:block;width:100%;height:520px;margin:24px 0 40px;border:1px solid #e5e7eb;border-radius:16px;background:var(--surface)}.logo-demo-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:40px 0 12px}.logo-demo-header h2{margin:0}.logo-demo{width:88px;height:88px}.logo-demo svg{display:block}.segmented{display:inline-flex;padding:3px;gap:2px;background:rgba(0,0,0,.05);border:1px solid rgba(0,0,0,.08);border-radius:999px}.segmented-option{appearance:none;border:none;background:transparent;cursor:pointer;padding:6px 16px;border-radius:999px;font:inherit;font-size:13px;font-weight:500;line-height:1;color:#555;transition:background .2s ease,color .2s ease,box-shadow .2s ease}.segmented-option:hover{color:#1a1a1a}.segmented-option--active{background:var(--surface);color:#1a1a1a;box-shadow:0 1px 2px rgba(0,0,0,.12)}.ui-button-row{display:flex;flex-wrap:wrap;align-items:center;gap:12px}.ui-button{appearance:none;font-family:var(--font-archivo),"Archivo",sans-serif;font-size:14px;font-weight:600;line-height:1;letter-spacing:.2px;padding:13px 22px;border-radius:40px;border:1px solid transparent;cursor:pointer;transition:background .2s ease,border-color .2s ease,color .2s ease,opacity .2s ease,transform .1s ease}.ui-button:active{transform:translateY(1px)}.ui-button:disabled{opacity:.35;cursor:not-allowed}.ui-button:disabled:active{transform:none}.ui-button--primary{background:#1a1a1a;color:#fff}.ui-button--primary:not(:disabled):hover{background:#333}.ui-button--secondary{background:var(--surface);border-color:#e5e7eb;color:#1a1a1a}.ui-button--secondary:not(:disabled):hover{background:#f5f5f5}.ui-button--ghost{background:transparent;color:#1a1a1a}.ui-button--ghost:not(:disabled):hover{background:#f5f5f5}.ui-field-stack{gap:20px;width:100%;max-width:380px}.ui-field,.ui-field-stack{display:flex;flex-direction:column}.ui-field{gap:8px}.ui-field-label{font-size:12px;font-weight:600;letter-spacing:.3px;color:#666}.ui-input{width:100%;height:52px;padding:0 18px;font-family:var(--font-archivo),"Archivo",sans-serif;font-size:16px;color:#1a1a1a;background:var(--surface);border:2px solid rgba(0,0,0,.15);border-radius:16px;outline:none;transition:border-color .2s ease,box-shadow .2s ease}.ui-input::placeholder{color:#999}.ui-input:focus{border-color:#1a1a1a;box-shadow:0 0 0 3px rgba(26,26,26,.08)}.ui-composer{position:relative;display:flex;align-items:center}.ui-composer-input{padding-right:56px}.ui-composer-submit{position:absolute;right:8px;display:flex;align-items:center;justify-content:center;width:38px;height:38px;padding:0;border:none;border-radius:999px;background:#1a1a1a;color:#fff;cursor:pointer;transition:opacity .2s ease,background .2s ease}.ui-composer-submit:not(:disabled):hover{background:#333}.ui-composer-submit:disabled{opacity:.25;cursor:not-allowed}.ui-card{width:100%;max-width:340px;aspect-ratio:3/2;padding:24px;background:var(--surface);border-radius:16px;box-shadow:0 20px 40px rgba(0,0,0,.08),0 12px 24px rgba(0,0,0,.08),inset 0 0 0 1px rgba(0,0,0,.04);transition:transform .2s ease,box-shadow .2s ease}.ui-card:hover{transform:translateY(-2px);box-shadow:0 28px 52px rgba(0,0,0,.1),0 16px 30px rgba(0,0,0,.1),inset 0 0 0 1px rgba(0,0,0,.04)}.chat-demo-thread{display:flex;flex-direction:column;gap:16px;width:100%;max-width:600px}.chat-demo-thread p{margin:0;padding:0}.chatQueryContainer{display:flex;align-items:flex-end;justify-content:flex-end;max-width:600px;width:100%}.chatQuery{background-color:#f5f5f5;border-radius:24px;padding:16px 24px}.chatBlurb{display:flex;flex-direction:row;gap:12px;align-items:center;justify-content:flex-start;text-align:left}.chatResponseLogoContainer{display:flex;align-items:center;justify-content:center;width:40px;height:40px;min-width:40px;min-height:40px;margin:0;border:2px solid rgba(0,0,0,.15);border-radius:100%;background-color:#f5f5f5}.chatResponseLogo{height:30px;width:30px}.chatCardURL{width:100%}.chatCardURL a,.chatCardURL a:hover{text-decoration:none;opacity:1}.chatSuggestionCard{display:flex;flex-direction:row;max-width:600px;width:100%;height:200px;background-color:#f5f5f5;border-radius:40px;padding:0;border:2px solid rgba(0,0,0,.15);box-shadow:0 4px 30px rgba(0,0,0,.1);transition:border .5s}.chatSuggestionCard:hover{border:2px solid #06aeef}.chatCardImageContainer{display:flex;align-items:center;justify-content:center;width:150px;height:200px;border-radius:40px 0 0 40px;overflow:hidden}.chatCardImage{height:100%}.chatCardTextBlock{display:flex;flex-direction:column;height:100%;width:100%;align-items:flex-start;justify-content:left;padding:24px}.chatCardHeader{margin:0 0 8px}.chatCardHeaderTitle{font-family:Arial,Helvetica,sans-serif;font-size:20px;font-weight:900;letter-spacing:0;line-height:1.2;text-align:left}.chatCardDescription{margin:0}.chatCardDescriptionText{text-align:left;font-size:14px;line-height:1.2}.minimap{position:fixed;top:50%;left:24px;transform:translateY(-50%);z-index:100;gap:8px}.minimap,.minimap-notches{display:flex;align-items:flex-start}.minimap-notches{flex-direction:column;gap:6px;padding:8px 6px;cursor:pointer}.minimap-notch{width:16px;height:2px;background:#ccc;border-radius:1px;transition:background .2s,width .2s}.minimap-notch--sub{width:10px}.minimap-notch--active{background:#1a1a1a}.minimap:hover .minimap-notch{background:#999}.minimap:hover .minimap-notch--active{background:#1a1a1a}.minimap-popover{position:absolute;top:0;left:100%;margin-left:8px;background:var(--surface);border:1px solid #e5e5e5;border-radius:8px;padding:8px 0;min-width:200px;box-shadow:0 4px 16px rgba(0,0,0,.08);white-space:nowrap}.minimap-popover--demo{position:static;left:auto;margin-left:0}.minimap-popover--demo .minimap-link{text-decoration:none}.minimap-popover--demo .minimap-link:hover{opacity:1}.minimap-link{display:block;padding:6px 16px;font-size:13px;color:#666;text-decoration:none;transition:color .15s,background .15s}.minimap-link--sub{padding-left:28px;font-size:12px}.minimap-link:hover{color:#1a1a1a;background:#f5f5f5}.minimap-link--active{color:#1a1a1a;font-weight:600}.minimap--reverb .minimap-notches{position:relative;gap:2px;padding:0;align-items:flex-start}.minimap-notch-row{position:relative;display:flex;align-items:center;justify-content:flex-start;width:34px;padding:3px 0;cursor:pointer;text-decoration:none}.minimap--reverb .minimap-notch{display:block}.minimap--reverb:hover .minimap-notch{background:#ccc}.minimap--reverb .minimap-notch-row--hovered .minimap-notch{background:#1a1a1a}.minimap-label{--minimap-label-blur:2px;position:absolute;left:100%;top:0;margin-left:12px;box-sizing:content-box;background:var(--surface);border:1px solid #e5e5e5;border-radius:8px;padding:6px 12px;font-size:13px;color:#1a1a1a;white-space:nowrap;overflow:hidden;box-shadow:0 4px 16px rgba(0,0,0,.08);pointer-events:none;opacity:0;transition:transform .28s cubic-bezier(.22,1,.36,1),width .28s cubic-bezier(.22,1,.36,1),opacity .2s ease}.minimap-label--visible{opacity:1}.minimap-label-reel{position:relative;display:inline-block}.minimap-label-text{display:inline-block;white-space:nowrap}.minimap-label-text--out{position:absolute;top:0;left:0}.minimap-label-text--in.is-down{animation:minimap-label-in-down .3s cubic-bezier(.22,1,.36,1)}.minimap-label-text--in.is-up{animation:minimap-label-in-up .3s cubic-bezier(.22,1,.36,1)}.minimap-label-text--out.is-down{animation:minimap-label-out-down .3s cubic-bezier(.22,1,.36,1) forwards}.minimap-label-text--out.is-up{animation:minimap-label-out-up .3s cubic-bezier(.22,1,.36,1) forwards}@keyframes minimap-label-in-down{0%{opacity:0;filter:blur(var(--minimap-label-blur));transform:translateY(70%)}to{opacity:1;filter:blur(0);transform:none}}@keyframes minimap-label-in-up{0%{opacity:0;filter:blur(var(--minimap-label-blur));transform:translateY(-70%)}to{opacity:1;filter:blur(0);transform:none}}@keyframes minimap-label-out-down{0%{opacity:1;filter:blur(0);transform:none}to{opacity:0;filter:blur(var(--minimap-label-blur));transform:translateY(-70%)}}@keyframes minimap-label-out-up{0%{opacity:1;filter:blur(0);transform:none}to{opacity:0;filter:blur(var(--minimap-label-blur));transform:translateY(70%)}}@media (prefers-reduced-motion:reduce){.minimap-label{transition:opacity .2s ease}.minimap-label-text--in,.minimap-label-text--out{animation:none}.minimap-label-text--out{display:none}}@media (max-width:768px){.minimap{display:none}}@media (max-width:960px){.system-logo{top:10px;left:10px}.system-logo img,.system-logo-lottie{width:76px;height:76px}.system-page{padding-top:102px}}@media (max-width:640px){.system-header h1{font-size:30px}.system-prose{font-size:15px}}