@import "https://fonts.googleapis.com/css2?family=Sora:wght@400;600;700;800&family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap";:root{--navy-900:#0d0f33;--navy-800:#151956;--navy-700:#1c2172;--navy-600:#24299e;--cyan-300:#9ff;--cyan-400:#78c7db;--ice:#dcf3fa;--white:#fff;--bg-light:#f9fafb;--grey-100:#ebebef;--grey-400:#92929d;--grey-600:#728197;--grey-700:#5b6b80;--success:#20853b;--warning:#fbbd23;--error:#b1000f;--info:#3abff8;--success-on-dark:#4ade80;--warning-on-dark:#fbbd23;--error-on-dark:#ff6b6b;--info-on-dark:#7dd3fc;--navy-900-rgb:13, 15, 51;--navy-700-rgb:28, 33, 114;--navy-600-rgb:36, 41, 158;--cyan-300-rgb:153, 255, 255;--cyan-400-rgb:120, 199, 219;--ice-rgb:220, 243, 250;--white-rgb:255, 255, 255;--surface:var(--navy-700);--surface-deep:var(--navy-900);--surface-raised:var(--navy-600);--text-on-dark:var(--white);--text-on-dark-soft:var(--ice);--text-on-dark-muted:rgba(var(--ice-rgb), .62);--text-on-light:var(--navy-900);--text-on-light-soft:var(--grey-700);--text-on-light-muted:var(--grey-600);--font-display:"Sora", system-ui, -apple-system, sans-serif;--font-ui:"Inter", system-ui, -apple-system, sans-serif;--font-mono:"JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;--weight-regular:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;--weight-extrabold:800;--font-size-xs:12.5px;--font-size-sm:14.5px;--font-size-base:16px;--font-size-lg:19px;--font-size-xl:21px;--font-size-2xl:26px;--font-size-3xl:32px;--font-size-4xl:40px;--font-size-5xl:52px;--font-size-6xl:68px;--font-size-7xl:82px;--font-size-8xl:98px;--spacing-1:4px;--spacing-2:8px;--spacing-3:12px;--spacing-4:16px;--spacing-5:20px;--spacing-6:24px;--spacing-8:32px;--spacing-10:40px;--spacing-12:48px;--spacing-16:64px;--spacing-18:72px;--spacing-20:80px;--spacing-24:96px;--spacing-32:128px;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:18px;--radius-2xl:24px;--radius-full:9999px;--shadow-sm:0 2px 6px rgba(var(--navy-900-rgb), .06);--shadow-md:0 8px 24px rgba(var(--navy-900-rgb), .08);--shadow-lg:0 16px 40px rgba(var(--navy-900-rgb), .12);--glow-signal:0 0 32px rgba(var(--cyan-300-rgb), .28);--glow-signal-strong:0 0 48px rgba(var(--cyan-300-rgb), .45);--border-on-dark:1px solid rgba(var(--cyan-300-rgb), .18);--border-on-light:1px solid rgba(var(--navy-900-rgb), .1);--glass-dark:rgba(var(--navy-700-rgb), .55);--glass-light:rgba(var(--white-rgb), .72);--glass-blur:blur(12px);--gradient-signal:linear-gradient(135deg, #1c2172 0%, #24299e 42%, #78c7db 78%, #9ff 100%);--gradient-depth:linear-gradient(180deg, #0d0f33 0%, #1c2172 100%);--gradient-ice:linear-gradient(135deg, #dcf3fa 0%, #9ff 100%);--gradient-text:linear-gradient(100deg, #fff 0%, #9ff 52%, #78c7db 100%);--ease-smooth:cubic-bezier(.22, 1, .36, 1);--ease-spring:cubic-bezier(.34, 1.4, .64, 1);--duration-fast:.16s;--duration-base:.26s;--duration-slow:.42s;--signal-cycle:4s;--container-max:1200px;--container-narrow:780px}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font-ui);background-color:var(--surface);color:var(--text-on-dark);font-size:var(--font-size-base);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.6;overflow-x:hidden}img,video,svg{max-width:100%;height:auto;display:block}:focus-visible{outline:2px solid var(--cyan-300);outline-offset:3px;border-radius:var(--radius-sm)}::selection{background:rgba(var(--cyan-300-rgb), .3);color:var(--white)}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:var(--navy-900)}::-webkit-scrollbar-thumb{background:rgba(var(--cyan-300-rgb), .35);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:rgba(var(--cyan-300-rgb), .55)}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);font-weight:var(--weight-bold);letter-spacing:-1.5px;color:inherit;text-wrap:balance;line-height:1.06}h1{letter-spacing:-3px;font-size:clamp(42px,5.8vw,82px);line-height:1.02;font-weight:var(--weight-extrabold)}h2{letter-spacing:-2px;font-size:clamp(32px,4.2vw,56px)}h3{letter-spacing:-1.2px;font-size:clamp(24px,2.6vw,38px)}h4{font-size:var(--font-size-2xl);letter-spacing:-.8px}h5{font-size:var(--font-size-xl);letter-spacing:-.4px}h6{font-size:var(--font-size-lg);letter-spacing:-.2px}p{font-size:var(--font-size-base);color:var(--text-on-dark-soft);text-wrap:pretty;line-height:1.65}.lead{font-size:var(--font-size-lg);line-height:1.6}a{color:var(--cyan-300);transition:color var(--duration-fast) var(--ease-smooth);text-decoration:none}a:hover{color:var(--cyan-400)}.eyebrow{font-family:var(--font-ui);font-size:var(--font-size-xs);font-weight:var(--weight-bold);text-transform:uppercase;letter-spacing:2.2px;color:var(--cyan-300);display:inline-block}.mono{font-family:var(--font-mono);font-feature-settings:"liga" 0}.gradient-text{background:var(--gradient-text);-webkit-text-fill-color:transparent;color:#0000;background-clip:text}.on-light{color:var(--text-on-light)}.on-light p{color:var(--text-on-light-soft)}.on-light .eyebrow{color:var(--navy-600)}.signal{width:var(--signal-size,16px);height:var(--signal-size,16px);flex:none;justify-content:center;align-items:center;display:inline-flex;position:relative}.signal .core{background:var(--signal-color,var(--cyan-300));box-shadow:0 0 12px rgba(var(--cyan-300-rgb), .6);border-radius:50%;position:absolute;inset:0}.signal .ring{border:1.5px solid var(--signal-color,var(--cyan-300));opacity:0;animation:signal-emit var(--signal-cycle) var(--ease-smooth) infinite;border-radius:50%;position:absolute;inset:0}.signal .ring:nth-child(2){animation-delay:calc(var(--signal-cycle) / 3)}.signal .ring:nth-child(3){animation-delay:calc(var(--signal-cycle) / 3 * 2)}@keyframes signal-emit{0%{opacity:.75;transform:scale(1)}70%{opacity:.1}to{opacity:0;transform:scale(3.6)}}.signal-field{background:radial-gradient(circle, rgba(var(--cyan-300-rgb), .14) 0%, transparent 68%);filter:blur(28px);pointer-events:none;animation:signal-breathe calc(var(--signal-cycle) * 2) var(--ease-smooth) infinite;border-radius:50%;position:absolute}@keyframes signal-breathe{0%,to{opacity:.55;transform:scale(.94)}50%{opacity:.85;transform:scale(1.08)}}.blob{border-radius:62% 38% 46% 54%/54% 46% 58% 42%;overflow:hidden}.blob-alt{border-radius:42% 58% 62% 38%/46% 62% 38% 54%}.btn{justify-content:center;align-items:center;gap:var(--spacing-2);font-family:var(--font-ui);font-size:var(--font-size-sm);font-weight:var(--weight-semibold);padding:14px var(--spacing-6);border-radius:var(--radius-full);cursor:pointer;white-space:nowrap;transition:transform var(--duration-fast) var(--ease-spring), background-color var(--duration-base) var(--ease-smooth), border-color var(--duration-base) var(--ease-smooth), box-shadow var(--duration-base) var(--ease-smooth), color var(--duration-base) var(--ease-smooth);border:1px solid #0000;line-height:1;text-decoration:none;display:inline-flex}.btn:hover{transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn:disabled,.btn[aria-disabled=true]{opacity:.45;pointer-events:none}.btn-primary{background:var(--cyan-300);color:var(--navy-900);box-shadow:var(--glow-signal)}.btn-primary:hover{background:var(--ice);box-shadow:var(--glow-signal-strong);color:var(--navy-900)}.btn-secondary{background:rgba(var(--white-rgb), .1);color:var(--white);border-color:rgba(var(--cyan-300-rgb), .28)}.btn-secondary:hover{background:rgba(var(--white-rgb), .16);border-color:rgba(var(--cyan-300-rgb), .55);color:var(--white)}.btn-ghost{color:var(--ice);background:0 0}.btn-ghost:hover{background:rgba(var(--white-rgb), .08);color:var(--white)}.btn-solid-navy{background:var(--navy-700);color:var(--white)}.btn-solid-navy:hover{background:var(--navy-600);color:var(--white)}.btn-outline-navy{color:var(--navy-700);border-color:rgba(var(--navy-700-rgb), .35);background:0 0}.btn-outline-navy:hover{background:rgba(var(--navy-700-rgb), .06);border-color:var(--navy-700);color:var(--navy-700)}.btn-sm{font-size:var(--font-size-xs);padding:10px var(--spacing-4)}.btn-lg{font-size:var(--font-size-base);padding:17px var(--spacing-8)}.btn-block{width:100%}.card{background:rgba(var(--white-rgb), .05);border:var(--border-on-dark);border-radius:var(--radius-2xl);padding:var(--spacing-6);transition:border-color var(--duration-base) var(--ease-smooth), background-color var(--duration-base) var(--ease-smooth), transform var(--duration-base) var(--ease-smooth)}.card:hover{border-color:rgba(var(--cyan-300-rgb), .4);background:rgba(var(--white-rgb), .08)}.card-interactive:hover{box-shadow:var(--glow-signal);transform:translateY(-3px)}.card-light{background:var(--white);border:var(--border-on-light);border-radius:var(--radius-2xl);padding:var(--spacing-6);box-shadow:var(--shadow-sm);color:var(--text-on-light)}.card-light:hover{box-shadow:var(--shadow-md)}.card-glass{background:var(--glass-dark);-webkit-backdrop-filter:var(--glass-blur);border:var(--border-on-dark);border-radius:var(--radius-2xl);padding:var(--spacing-6)}.badge{align-items:center;gap:var(--spacing-2);font-size:var(--font-size-xs);font-weight:var(--weight-semibold);padding:6px var(--spacing-3);border-radius:var(--radius-full);background:rgba(var(--cyan-300-rgb), .14);border:1px solid rgba(var(--cyan-300-rgb), .32);color:var(--cyan-300);display:inline-flex}.badge-success{color:var(--success-on-dark);background:#4ade8024;border-color:#4ade8059}.badge-warning{color:var(--warning-on-dark);background:#fbbd2324;border-color:#fbbd2359}.badge-error{color:var(--error-on-dark);background:#ff6b6b24;border-color:#ff6b6b59}.badge-neutral{background:rgba(var(--white-rgb), .08);border-color:rgba(var(--white-rgb), .18);color:var(--text-on-dark-soft)}.field{gap:var(--spacing-2);flex-direction:column;display:flex}.field label{font-size:var(--font-size-sm);font-weight:var(--weight-medium);color:var(--text-on-dark-soft)}.field .hint{font-size:var(--font-size-xs);color:var(--text-on-dark-muted)}.field .error-text{font-size:var(--font-size-xs);color:var(--error-on-dark)}.input,.select,.textarea{font-family:var(--font-ui);font-size:var(--font-size-base);color:var(--white);background:rgba(var(--navy-900-rgb), .45);border:1px solid rgba(var(--white-rgb), .16);border-radius:var(--radius-md);padding:13px var(--spacing-4);width:100%;transition:border-color var(--duration-base) var(--ease-smooth), box-shadow var(--duration-base) var(--ease-smooth)}.input::placeholder,.textarea::placeholder{color:rgba(var(--ice-rgb), .42)}.input:hover,.select:hover,.textarea:hover{border-color:rgba(var(--cyan-300-rgb), .35)}.input:focus,.select:focus,.textarea:focus{border-color:var(--cyan-300);box-shadow:0 0 0 3px rgba(var(--cyan-300-rgb), .18);outline:none}.input[aria-invalid=true]{border-color:var(--error-on-dark)}.textarea{resize:vertical;min-height:120px}.select{appearance:none;cursor:pointer}.alert{gap:var(--spacing-3);padding:var(--spacing-4);border-radius:var(--radius-lg);border-left:3px solid var(--info-on-dark);font-size:var(--font-size-sm);background:#7dd3fc1a;display:flex}.alert-success{border-left-color:var(--success-on-dark);background:#4ade801a}.alert-warning{border-left-color:var(--warning-on-dark);background:#fbbd231a}.alert-error{border-left-color:var(--error-on-dark);background:#ff6b6b1a}.table{border-collapse:collapse;width:100%;font-size:var(--font-size-sm)}.table th{text-align:left;font-family:var(--font-ui);font-size:var(--font-size-xs);font-weight:var(--weight-semibold);text-transform:uppercase;letter-spacing:1.2px;color:var(--text-on-dark-muted);padding:var(--spacing-3) var(--spacing-4);border-bottom:1px solid rgba(var(--white-rgb), .14)}.table td{padding:var(--spacing-4);border-bottom:1px solid rgba(var(--white-rgb), .07);color:var(--text-on-dark-soft)}.table tr:last-child td{border-bottom:none}.table .num{text-align:right;font-family:var(--font-mono);color:var(--white)}.progress{border-radius:var(--radius-full);background:rgba(var(--white-rgb), .12);height:6px;overflow:hidden}.progress>span{border-radius:inherit;background:var(--gradient-signal);height:100%;display:block}.container{width:100%;max-width:var(--container-max);padding-inline:var(--spacing-6);margin-inline:auto}.container-narrow{max-width:var(--container-narrow)}.section{padding-block:clamp(var(--spacing-16), 9vw, var(--spacing-32));position:relative}.section-light{background:var(--bg-light);color:var(--text-on-light)}.section-deep{background:var(--gradient-depth)}.row{flex-wrap:wrap;display:flex}.col{flex-direction:column;display:flex}.grid{gap:var(--spacing-6);grid-template-columns:1fr;display:grid}@media (width>=720px){.grid-2,.grid-3,.grid-4{grid-template-columns:repeat(2,1fr)}}@media (width>=1040px){.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}}.gap-1{gap:var(--spacing-1)}.gap-2{gap:var(--spacing-2)}.gap-3{gap:var(--spacing-3)}.gap-4{gap:var(--spacing-4)}.gap-6{gap:var(--spacing-6)}.gap-8{gap:var(--spacing-8)}.text-center{text-align:center}.muted{color:var(--text-on-dark-muted)}.hr{background:rgba(var(--white-rgb), .1);border:0;height:1px}.hr-light{background:rgba(var(--navy-900-rgb), .1);border:0;height:1px}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.reveal{opacity:0;transition:opacity var(--duration-slow) var(--ease-smooth), transform var(--duration-slow) var(--ease-smooth);transform:translateY(24px)}.reveal.is-visible{opacity:1;transform:none}.demo-section{padding-block:var(--spacing-20);border-top:1px solid rgba(var(--white-rgb), .1)}.demo-section .head{justify-content:space-between;align-items:baseline;gap:var(--spacing-6);margin-bottom:var(--spacing-4);display:flex}.demo-section .head h2{font-size:clamp(28px,3.4vw,44px)}.demo-section .kind{font-size:var(--font-size-xs);color:var(--text-on-dark-muted);text-transform:uppercase;letter-spacing:1.4px;white-space:nowrap}@media (width<=619px){.demo-section .head{align-items:flex-start;gap:var(--spacing-2);flex-direction:column}.demo-section .kind{white-space:normal}}.demo-section .lead{max-width:62ch;font-size:var(--font-size-lg)}.demo-section .note{max-width:68ch;font-size:var(--font-size-sm);color:var(--text-on-dark-muted);margin-top:var(--spacing-3)}.demo-section .section-body{margin-top:var(--spacing-8)}.spec{background:rgba(var(--white-rgb), .04);border:1px solid rgba(var(--white-rgb), .1);border-radius:var(--radius-lg);padding:var(--spacing-5)}.spec>h3{font-family:var(--font-ui);font-size:var(--font-size-sm);font-weight:var(--weight-semibold);letter-spacing:0;color:var(--white)}.spec .desc{font-size:var(--font-size-xs);color:var(--text-on-dark-muted);margin-top:var(--spacing-1)}.spec .rule{background:rgba(var(--white-rgb), .1);height:1px;margin-block:var(--spacing-4)}.demo-misuse{margin-top:var(--spacing-8);padding:var(--spacing-5);border-radius:var(--radius-lg);border-left:3px solid var(--error-on-dark);background:#ff6b6b14}.demo-misuse h4{font-family:var(--font-ui);font-size:var(--font-size-sm);text-transform:uppercase;letter-spacing:1.4px;color:var(--error-on-dark);margin-bottom:var(--spacing-3)}.demo-misuse ul{gap:var(--spacing-2);flex-direction:column;list-style:none;display:flex}.demo-misuse li{font-size:var(--font-size-sm);color:var(--text-on-dark-soft)}.demo-misuse strong{color:var(--white);font-weight:var(--weight-semibold)}.demo-section.tone-light{background:var(--bg-light);color:var(--text-on-light);border-top-color:rgba(var(--navy-900-rgb), .1)}.tone-light p{color:var(--text-on-light-soft)}.tone-light .eyebrow{color:var(--navy-600)}.tone-light .kind,.tone-light .note,.tone-light .desc{color:var(--text-on-light-muted)}.tone-light .spec{background:var(--white);border-color:rgba(var(--navy-900-rgb), .1);box-shadow:var(--shadow-sm)}.tone-light .spec>h3{color:var(--navy-900)}.tone-light .spec .rule{background:rgba(var(--navy-900-rgb), .1)}.tone-light .mono{color:var(--text-on-light-muted)}.tone-light .demo-misuse{border-left-color:var(--error);background:#b1000f0f}.tone-light .demo-misuse h4{color:var(--error)}.tone-light .demo-misuse li{color:var(--text-on-light-soft)}.tone-light .demo-misuse strong{color:var(--navy-900)}.tone-light .invert{color:var(--text-on-dark)}.tone-light .invert p,.tone-light .invert .mono{color:var(--text-on-dark-soft)}.tone-light .invert .eyebrow{color:var(--cyan-300)}@media (prefers-reduced-motion:reduce){html:not([data-motion=enabled]) *,html:not([data-motion=enabled]) :before,html:not([data-motion=enabled]) :after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}html:not([data-motion=enabled]) .signal .ring{opacity:.35;transform:scale(2)}html:not([data-motion=enabled]) .reveal{opacity:1;transform:none}}.no-js .reveal{opacity:1;transform:none}