:root{--tb-white:#fff;--tb-board-bg:#e5e5e5;--tb-frame-bg:#fcfcfd;--tb-surface-muted:#f1f3f7;--tb-ghost-fill:#fbfbfd;--tb-panel-header:#24335f;--tb-dark-500:#565656;--tb-light-500:#f8f9fa;--tb-ink-strong:#223769;--tb-ink-body:#394869;--tb-ink-muted:#7d84a2;--tb-input-text:#4d5875;--tb-placeholder:#a5aac1;--tb-primary-600:#744fe6;--tb-primary-500:#8764f2;--tb-primary-300:#c5b2ff;--tb-primary-100:#f4efff;--tb-secondary-500:#ff9b43;--tb-secondary-100:#fff2e5;--tb-warning-500:#ffc107;--tb-warning-100:#fff7db;--tb-info-500:#17a2b8;--tb-info-outline:#0dcaf0;--tb-accent-500:#17a2b8;--tb-accent-100:#e7f8fb;--tb-purple-500:#8a63f6;--tb-success-500:#25b955;--tb-success-ui:#31cf5c;--tb-danger-500:#dc3545;--tb-disabled:#d0cfcf;--tb-input-border:#d8dce7;--tb-line-soft:#dde1ea;--tb-line-strong:#bcc3d3;--tb-footer-bg:#565656;--tb-focus-ring:#8764f22e;--tb-shadow-soft:0 12px 26px #1d274a0f;--tb-shadow-large:0 22px 48px #1d274a1f;--tb-shadow-small:0 6px 14px #1d274a12;--tb-shadow-line:0 1px 0 #1d274a14;--tb-shadow-avatar:0 0 0 3px #ffffffe6;--tb-shadow-purple:0 0 0 3px #8764f238;--tb-shadow-focus:0 0 0 3px #8764f22e;--tb-motion-fast:.16s;--tb-motion-base:.22s;--tb-motion-slow:.32s;--tb-ease-standard:cubic-bezier(.2, 0, 0, 1);--tb-radius-xs:.25rem;--tb-radius-sm:.25rem;--tb-radius-md:.5rem;--tb-radius-lg:.75rem;--tb-radius-pill:999px;--tb-space-1:.25rem;--tb-space-2:.5rem;--tb-space-3:.75rem;--tb-space-4:1rem;--tb-space-5:1.25rem;--tb-space-6:1.5rem;--tb-space-8:2rem;--tb-space-10:2.5rem;--tb-space-12:3rem;--tb-frame-xxl:1720px;--tb-frame-xl:1440px;--tb-frame-lg:1280px;--tb-frame-md:1024px;--tb-frame-sm:820px;--tb-frame-xs:390px;--tb-breakpoint-xl:1200px;--tb-breakpoint-lg:992px;--tb-breakpoint-md:768px;--tb-breakpoint-sm:576px;--tb-breakpoint-xs:0px;--tb-canvas-max:1720px;--tb-container-fhd:1360px;--tb-container:1280px;--tb-shell-max:1290px;--tb-shell-wide:1360px;--tb-shell-left-rail-offset:6.875rem;--tb-shell-surface-radius:1.5rem;--tb-shell-panel-radius:1.35rem;--tb-shell-card-radius:1rem;--tb-shell-surface-bg:#fffffff5;--tb-shell-border:#21254314;--tb-shell-page-bg:radial-gradient(circle at top left, #865ff52e, transparent 20%), radial-gradient(circle at bottom right, #17a2b81f, transparent 18%), linear-gradient(180deg, #faf7ff 0%, #fff 55%, #f7f4ff 100%);--tb-shell-header-bg:linear-gradient(180deg, #f7f9fbf2 0%, #ffffffdb 100%);--tb-shell-purple-strip:linear-gradient(180deg, #7d5ce8 0%, #865ff5 100%);--tb-font-sans:"Source Sans Pro", "Segoe UI", sans-serif;--tb-font-display:"Poetsen One", var(--tb-font-sans);--tb-font-script:"Caveat", cursive;--tb-font-brand:"League Spartan", var(--tb-font-sans);--tb-font-serif:"PT Serif", Georgia, serif;--tb-type-display-1:800 6rem / 1.1 var(--tb-font-sans);--tb-type-display-2:800 5.5rem / 1.2 var(--tb-font-sans);--tb-type-display-3:800 4.5rem / 1.2 var(--tb-font-sans);--tb-type-display-4:800 3.5rem / 1.2 var(--tb-font-sans);--tb-type-h1:800 2.5rem / 1.2 var(--tb-font-sans);--tb-type-h2:800 2rem / 1.2 var(--tb-font-sans);--tb-type-h3:700 1.75rem / 1.2 var(--tb-font-sans);--tb-type-h4:700 1.5rem / 1.2 var(--tb-font-sans);--tb-type-h5:700 1.25rem / 1.2 var(--tb-font-sans);--tb-type-h6:700 1rem / 1.2 var(--tb-font-sans);--tb-type-mobile-h3:700 1.5rem / 1.3 var(--tb-font-sans);--tb-type-mobile-h4:700 1.25rem / 1.3 var(--tb-font-sans);--tb-type-body-lg:400 1rem / 1.3 var(--tb-font-sans);--tb-type-body-md:400 1rem / 1.3 var(--tb-font-sans);--tb-type-body-sm:400 .8rem / 1.5 var(--tb-font-sans);--tb-type-component:600 .6875rem / 1.2 var(--tb-font-sans);--tb-type-button:400 1rem / 1.5 var(--tb-font-sans);--tb-type-button-sm:400 .875rem / 1.5 var(--tb-font-sans);--tb-type-button-md:400 1rem / 1.5 var(--tb-font-sans);--tb-type-button-lg:400 1rem / 1.875 var(--tb-font-sans);--tb-type-label:400 .8rem / 1.5 var(--tb-font-sans);--tb-type-caption:400 .8rem / 1.5 var(--tb-font-sans);--tb-type-link:600 .875rem / 1.4 var(--tb-font-sans)}*,:before,:after{box-sizing:border-box}html{color:var(--tb-ink-body);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;scroll-behavior:smooth;background:var(--tb-white)}body{min-width:320px;font:var(--tb-type-body-md);color:var(--tb-ink-body);background:var(--tb-white);margin:0}.tb-visually-hidden{clip:rect(0, 0, 0, 0);clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.app-skip-link{z-index:220;border-radius:var(--tb-radius-pill);color:var(--tb-white);box-shadow:var(--tb-shadow-large);font:var(--tb-type-link);transition:transform var(--tb-motion-fast) var(--tb-ease-standard), box-shadow var(--tb-motion-fast) var(--tb-ease-standard);background:#212543f5;padding:.75rem 1rem;text-decoration:none;position:fixed;top:.75rem;left:1rem;transform:translateY(-180%)}.app-skip-link:focus,.app-skip-link:focus-visible{box-shadow:var(--tb-shadow-large), var(--tb-shadow-focus);transform:translateY(0)}button,input,select,textarea{font:inherit}#app{min-height:100vh}.tb-shell-page{min-height:100vh;color:var(--tb-ink-body);background:var(--tb-shell-page-bg)}.tb-shell-container{width:min(calc(100% - 2rem), var(--tb-shell-wide));margin:0 auto}.tb-shell-panel{border:1px solid var(--tb-shell-border);border-radius:var(--tb-shell-panel-radius);background:var(--tb-shell-surface-bg);box-shadow:var(--tb-shadow-soft)}.tb-shell-card{border-radius:var(--tb-shell-card-radius);box-shadow:var(--tb-shadow-soft);background:#fffffffa;border:1px solid #21254314}.tb-mode-switch{background:#f7f4ffcc;border:1px solid #21254314;border-radius:999px;flex-wrap:wrap;gap:.4rem;padding:.35rem;display:inline-flex}.tb-mode-switch__button{min-height:2.25rem;color:var(--tb-ink-muted);cursor:pointer;font:700 .8rem/1 var(--tb-font-sans);transition:background-color var(--tb-motion-fast) var(--tb-ease-standard), color var(--tb-motion-fast) var(--tb-ease-standard), box-shadow var(--tb-motion-fast) var(--tb-ease-standard), transform var(--tb-motion-fast) var(--tb-ease-standard);background:0 0;border:none;border-radius:999px;padding:0 .95rem}.tb-mode-switch__button:hover,.tb-mode-switch__button:focus-visible{color:var(--tb-primary-500);outline:none;transform:translateY(-1px)}.tb-mode-switch__button--active{color:var(--tb-ink-strong);background:linear-gradient(135deg,#7d5ce829,#fd984324);box-shadow:inset 0 0 0 1px #865ff529}.tb-surface-transition-enter-active,.tb-surface-transition-leave-active{transition:opacity var(--tb-motion-base) var(--tb-ease-standard), transform var(--tb-motion-base) var(--tb-ease-standard)}.tb-surface-transition-enter-from,.tb-surface-transition-leave-to{opacity:0;transform:translateY(.75rem)}.foundation-shell{width:min(calc(100% - 2rem), var(--tb-canvas-max));padding:var(--tb-space-8) 0 var(--tb-space-10);gap:var(--tb-space-6);margin:0 auto;display:grid}.board-intro{justify-content:space-between;align-items:end;gap:var(--tb-space-4);flex-wrap:wrap;display:flex}.board-intro__copy{max-width:44rem}.board-intro h1,.kit-frame__bar h2,.kit-frame__bar h3,.palette-header h4,.type-display-1,.type-display-2,.type-display-3,.type-display-4,.type-h1,.type-h2,.type-h3,.type-h4,.type-h5,.type-h6,.type-mobile-h3,.type-mobile-h4{color:var(--tb-ink-strong);margin:0}.board-intro h1{font:var(--tb-type-h1)}.board-intro p,.variant-card p,.layout-item p,.style-item p,.palette-header p,.legacy-card p,.section-source{margin:0}.eyebrow{align-items:center;gap:var(--tb-space-2);margin:0 0 var(--tb-space-2);color:var(--tb-primary-500);font:var(--tb-type-label);display:inline-flex}.eyebrow:before{content:"";background:currentColor;border-radius:50%;width:.5rem;height:.5rem}.board-note{min-width:18rem;max-width:25rem;padding:var(--tb-space-3) var(--tb-space-4);color:var(--tb-ink-body);border-radius:var(--tb-radius-lg);box-shadow:var(--tb-shadow-line);background:#fafafab8;border:1px solid #343c4414}.board-grid{gap:var(--tb-space-6);display:grid}.board-grid--three{grid-template-columns:repeat(3,minmax(0,1fr))}.split-grid{gap:var(--tb-space-5);grid-template-columns:minmax(0,1.2fr) minmax(18rem,.8fr);display:grid}.kit-frame{background:var(--tb-frame-bg);box-shadow:var(--tb-shadow-soft);border:1px solid #343c440f;position:relative}.kit-frame__label{color:#68a8ff;font:var(--tb-type-label);position:absolute;top:-1.125rem;left:0}.kit-frame__bar{padding:var(--tb-space-4) var(--tb-space-5);color:var(--tb-white);background:var(--tb-panel-header)}.kit-frame__bar h2,.kit-frame__bar h3{color:var(--tb-white)}.kit-frame__bar h2{font:var(--tb-type-h3)}.kit-frame__bar h3{font:var(--tb-type-h4)}.kit-frame__body{padding:var(--tb-space-5);gap:var(--tb-space-4);display:grid}.variant-grid{gap:var(--tb-space-4);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.variant-card,.legacy-card,.effect-card{padding:var(--tb-space-4);gap:var(--tb-space-2);border:1px solid var(--tb-line-soft);background:linear-gradient(#ffffffeb,#fbfbfcd9);display:grid}.variant-card strong,.style-item strong,.layout-item strong,.effect-card strong,.legacy-card strong,.token-name{color:var(--tb-ink-strong);font:var(--tb-type-label)}.token-value{color:var(--tb-primary-500);font:var(--tb-type-caption)}.layout-list,.style-list,.control-stack{gap:var(--tb-space-3);display:grid}.layout-item,.style-item{padding-bottom:var(--tb-space-3);gap:var(--tb-space-2);border-bottom:1px solid var(--tb-line-soft);display:grid}.layout-item:last-child,.style-item:last-child{border-bottom:none;padding-bottom:0}.layout-item{grid-template-columns:minmax(0,1fr) auto;align-items:baseline}.style-item__meta{justify-content:space-between;align-items:baseline;gap:var(--tb-space-3);display:flex}.type-display-1{font:var(--tb-type-display-1)}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@media (width<=767px){.tb-mode-switch{width:100%}.tb-mode-switch__button{flex:1 1 0;justify-content:center}}.type-display-2{font:var(--tb-type-display-2)}.type-display-3{font:var(--tb-type-display-3)}.type-display-4{font:var(--tb-type-display-4)}.type-h1{font:var(--tb-type-h1)}.type-h2{font:var(--tb-type-h2)}.type-h3{font:var(--tb-type-h3)}.type-h4{font:var(--tb-type-h4)}.type-h5{font:var(--tb-type-h5)}.type-h6{font:var(--tb-type-h6)}.type-mobile-h3{font:var(--tb-type-mobile-h3)}.type-mobile-h4{font:var(--tb-type-mobile-h4)}.type-body-md{font:var(--tb-type-body-md)}.palette-group{gap:var(--tb-space-3);display:grid}.palette-header h4{font:var(--tb-type-h6)}.swatch-grid,.icon-grid{gap:var(--tb-space-3);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.swatch-card{gap:var(--tb-space-2);display:grid}.swatch-preview{min-height:4.75rem;padding:var(--tb-space-3);font:var(--tb-type-label);border:1px solid #343c440a;align-items:flex-end;display:flex}.style-effects{gap:var(--tb-space-3);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.effect-card__preview{border-radius:var(--tb-radius-md);background:var(--tb-white);border:1px solid #343c440a;min-height:2rem}.control-group{gap:var(--tb-space-3);display:grid}.matrix-grid{gap:var(--tb-space-4);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.matrix-column{gap:var(--tb-space-3);align-content:start;display:grid}.matrix-column>strong{color:var(--tb-ink-strong);font:var(--tb-type-label)}.control-row,.selection-row,.tag-cluster{gap:var(--tb-space-2);flex-wrap:wrap;display:flex}.section-source{color:var(--tb-primary-500);font:var(--tb-type-caption)}.icon-grid,.icon-grid--custom{grid-template-columns:repeat(3,minmax(0,1fr))}.icon-card{min-height:5.25rem;padding:var(--tb-space-3);place-items:center;gap:var(--tb-space-2);border:1px solid var(--tb-line-soft);background:var(--tb-white);color:var(--tb-ink-body);font:var(--tb-type-caption);text-align:center;display:grid}.icon-card--boxed{background:var(--tb-panel-header);color:var(--tb-white)}@media (width<=1280px){.board-grid--three,.split-grid,.variant-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=992px){.foundation-shell{width:min(calc(100% - 1.25rem), var(--tb-container));padding-top:var(--tb-space-6)}.board-grid--three,.split-grid,.variant-grid,.style-effects,.swatch-grid,.icon-grid,.matrix-grid{grid-template-columns:1fr}.kit-frame__body,.kit-frame__bar{padding-inline:var(--tb-space-4)}}@media (width<=640px){.foundation-shell{gap:var(--tb-space-5);width:calc(100% - 1rem)}.style-item__meta,.layout-item{justify-content:stretch;display:grid}}