:root{color:#f4f4f4;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#070707;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{min-width:320px;margin:0;overflow-x:hidden}button,input,textarea,select{font:inherit}:root{--bg:#070707;--panel:#0d0d0d;--panel-2:#111;--line:#282828;--line-strong:#f2f2f2;--text:#f4f4f4;--muted:#9b9b9b;--soft:#171717;--hover:#1d1d1d}.app-shell{background:var(--bg);min-height:100vh;color:var(--text);grid-template-columns:268px minmax(0,1fr);display:grid}.sidebar{border-right:1px solid var(--line);background:#070707f0;height:100vh;padding:22px;position:sticky;top:0}.brand{min-height:42px;color:var(--text);align-items:center;gap:10px;font-size:.9rem;font-weight:760;text-decoration:none;display:flex}.brand__mark{border:1px solid var(--line-strong);background:linear-gradient(90deg, transparent 46%, var(--line-strong) 46% 54%, transparent 54%), linear-gradient(var(--line-strong) 0 0) 50% 50% / 70% 1px no-repeat;width:28px;height:28px}.category-nav{gap:4px;margin-top:36px;display:grid}.category-nav a{border-bottom:1px solid var(--line);min-height:42px;color:var(--muted);justify-content:space-between;align-items:center;font-size:.86rem;text-decoration:none;display:flex}.category-nav a:hover,.category-nav a:focus-visible{color:var(--text)}.category-nav small{color:#666;font-size:.75rem}.sidebar__meta{color:#666;gap:8px;margin-top:26px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.72rem;display:grid}.workspace{min-width:0}.intro{border-bottom:1px solid var(--line);grid-template-columns:minmax(0,1fr) minmax(220px,340px);align-items:end;gap:40px;min-height:44vh;padding:48px clamp(22px,5vw,72px);display:grid}.eyebrow{color:var(--muted);letter-spacing:.14em;text-transform:uppercase;margin:0 0 14px;font-size:.72rem;font-weight:800}h1,h2,h3,p{margin:0}h1{max-width:13ch;color:var(--text);letter-spacing:0;font-size:clamp(3.4rem,6.8vw,6.8rem);font-weight:840;line-height:.88}h2{max-width:780px;color:var(--text);letter-spacing:0;font-size:clamp(1.8rem,3vw,3.75rem);font-weight:760;line-height:.98}h3{color:var(--text);font-size:1rem;font-weight:720}p{color:var(--muted);line-height:1.55}.intro__meta{border-top:1px solid var(--line);display:grid}.intro__meta span{border-bottom:1px solid var(--line);color:var(--muted);padding:13px 0;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.82rem;display:block}.workbench-controls{z-index:5;border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#070707eb;grid-template-columns:minmax(240px,380px) minmax(0,1fr);align-items:end;gap:18px;padding:18px clamp(22px,5vw,72px);display:grid;position:sticky;top:0}.search-field{color:var(--muted);gap:8px;font-size:.76rem;display:grid}.search-field span{text-transform:uppercase;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.search-field input,.form-stack-demo input,.form-stack-demo select,.command-palette-demo input,.auth-split-demo input{border:1px solid var(--line);width:100%;min-height:40px;color:var(--text);background:#050505;padding:0 12px}.status-filter{flex-wrap:wrap;justify-content:flex-end;gap:8px;display:flex}.status-filter button,.component-card__top button,.card-tabs button,.code-panel button,.preview-modal button,.surface-card-demo button,.modal-demo button,.command-palette-demo button,.auth-split-demo button,.form-stack-demo button{border:1px solid var(--line);min-height:34px;color:var(--muted);background:0 0;padding:0 10px}.status-filter button[aria-pressed=true],.card-tabs button[aria-selected=true],.code-panel button:hover,.preview-modal button:hover{border-color:var(--line-strong);background:var(--text);color:var(--bg)}.category-section{border-bottom:1px solid var(--line);padding:56px clamp(22px,5vw,72px);scroll-margin-top:24px}.section-header{justify-content:space-between;align-items:start;gap:24px;margin-bottom:26px;display:flex}.section-header>span{color:#525252;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.84rem}.component-grid{background:var(--line);border:1px solid var(--line);grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;display:grid}.component-card{background:var(--panel);min-width:0}.component-card__top{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;min-height:44px;padding:0 12px;display:flex}.status-pill{border:1px solid var(--line);color:var(--muted);padding:4px 7px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.68rem}.status-pill--ready{color:var(--text)}.status-pill--new{border-color:var(--line-strong)}.card-tabs{border-bottom:1px solid var(--line);grid-template-columns:repeat(4,1fr);display:grid}.card-tabs button{border:0;border-right:1px solid var(--line);min-height:38px}.card-tabs button:last-child{border-right:0}.component-card__preview{border-bottom:1px solid var(--line);background:linear-gradient(90deg, #ffffff09 1px, transparent 1px), linear-gradient(#ffffff09 1px, transparent 1px), var(--panel);background-size:24px 24px;align-items:center;min-height:230px;padding:22px;display:grid}.code-panel{align-self:stretch;gap:14px;display:grid}.code-panel button{justify-self:end}.code-panel pre{border:1px solid var(--line);color:var(--text);background:#050505;margin:0;padding:14px;font-size:.78rem;overflow:auto}.props-panel{gap:8px;margin:0;padding:0;list-style:none;display:grid}.props-panel li{border-bottom:1px solid var(--line);color:var(--text);padding:9px 0;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.82rem}.notes-panel{align-self:center;max-width:44ch}.component-card__body{gap:18px;padding:18px;display:grid}.component-card__body p{margin-top:8px;font-size:.92rem}.tag-row{flex-wrap:wrap;gap:6px;display:flex}.tag-row span{border:1px solid var(--line);color:var(--muted);padding:4px 7px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.7rem}.empty-state{border-bottom:1px solid var(--line);padding:72px clamp(22px,5vw,72px)}button,a,input{font:inherit}button{cursor:pointer}.demo-header,.button-demo,.inline-actions,.loader-demo,.transition-demo,.metric-strip,.notice-panel,.tool-panel{width:100%}.demo-header{border:1px solid var(--line-strong);background:#090909;align-items:center;gap:14px;min-height:54px;padding:0 14px;display:flex}.demo-header strong{margin-right:auto}.demo-header nav{gap:14px;display:flex}.demo-header a,.demo-header span,.demo-header kbd{color:var(--muted);font-size:.78rem;text-decoration:none}.demo-header button,.mc-button,.inline-actions button,.segmented-control button,.tool-panel button{border:1px solid var(--line);min-height:36px;color:var(--text);background:0 0;padding:0 12px}.demo-header--command{justify-content:flex-start}.demo-header--command strong{margin-right:0}.demo-header--minimal{border-color:var(--line)}.demo-header--minimal strong{margin-right:auto}.status-dot{border:1px solid var(--line-strong);background:var(--line-strong);width:8px;height:8px}.button-demo,.inline-actions{flex-wrap:wrap;gap:10px;display:flex}.mc-button--primary,.segmented-control button[aria-pressed=true],.tool-panel button{background:var(--text);color:var(--bg)}.mc-button--quiet{color:var(--muted)}.mc-button:disabled{cursor:not-allowed;opacity:.34}.mc-button--loading:before{content:"";background:currentColor;width:8px;height:8px;margin-right:8px;animation:1s ease-in-out infinite pulse-dot;display:inline-block}.segmented-control{border:1px solid var(--line);grid-template-columns:repeat(3,minmax(0,1fr));width:min(100%,320px);display:inline-grid}.segmented-control button{border:0;border-right:1px solid var(--line)}.segmented-control button:last-child{border-right:0}.inline-actions button{min-height:32px;color:var(--muted)}.loader-demo{gap:14px;display:grid}.linear-loader{background:var(--line);height:3px;overflow:hidden}.linear-loader span{background:var(--text);width:42%;height:100%;animation:1.4s linear infinite slide-line;display:block}.step-loader{gap:10px;padding:0;list-style:none;display:grid}.step-loader li{color:var(--muted);align-items:center;gap:10px;font-size:.9rem;display:flex}.step-loader li:before{content:"";border:1px solid var(--line);width:12px;height:12px}.step-loader .is-done,.step-loader .is-active{color:var(--text)}.step-loader .is-done:before{background:var(--text)}.step-loader .is-active:before{animation:1.1s ease-in-out infinite pulse-box}.pulse-loader{align-items:center;gap:8px;display:flex}.pulse-loader span{background:var(--text);width:12px;height:12px;animation:1s ease-in-out infinite pulse-dot}.pulse-loader span:nth-child(2){animation-delay:.12s}.pulse-loader span:nth-child(3){animation-delay:.24s}.transition-demo{border:1px solid var(--line);background:var(--soft);align-content:end;gap:12px;min-height:142px;padding:16px;display:grid}.fade-demo{animation:2.2s ease-in-out infinite fade-lift}.rail-demo{position:relative;overflow:hidden}.rail-demo span{background:var(--text);width:34%;animation:1.8s cubic-bezier(.76,0,.24,1) infinite rail-sweep;position:absolute;inset:0 auto 0 0}.rail-demo strong{z-index:1;mix-blend-mode:difference;position:relative}.stack-demo{min-height:152px;position:relative}.stack-demo span{border:1px solid var(--line-strong);background:var(--panel-2);animation:2.4s ease-in-out infinite stack-shift;position:absolute;inset:18px}.stack-demo span:nth-child(2){animation-delay:.12s;inset:30px}.stack-demo span:nth-child(3){animation-delay:.24s;inset:42px}.metric-strip{border:1px solid var(--line);grid-template-columns:repeat(3,1fr);display:grid}.metric-strip span{border-right:1px solid var(--line);color:var(--muted);gap:4px;padding:14px;font-size:.76rem;display:grid}.metric-strip span:last-child{border-right:0}.metric-strip strong{color:var(--text);font-size:1.8rem;line-height:1}.notice-panel{border-left:2px solid var(--line-strong);background:var(--soft);padding:14px 16px}.notice-panel p{margin-top:8px}.tool-panel{border:1px solid var(--line);gap:14px;padding:16px;display:grid}.tool-panel label{color:var(--muted);gap:8px;font-size:.84rem;display:grid}.tool-panel input[type=range]{accent-color:var(--text)}.tool-panel input[type=checkbox]{width:16px;height:16px;accent-color:var(--text)}.surface-card-demo{border:1px solid var(--line);background:var(--soft);gap:20px;padding:16px;display:grid}.surface-card-demo header,.surface-card-demo footer,.modal-demo__frame header,.modal-demo__frame footer{justify-content:space-between;align-items:center;gap:10px;display:flex}.surface-card-demo small{color:var(--muted)}.modal-demo{border:1px solid var(--line);background:linear-gradient(#ffffff0a 1px, transparent 1px), var(--bg);background-size:24px 24px;place-items:center;min-height:180px;display:grid}.modal-demo__frame{border:1px solid var(--line-strong);background:#080808;gap:18px;width:min(100%,330px);padding:14px;display:grid}.hero-block-demo{border-left:1px solid var(--line-strong);gap:12px;padding:14px 0 14px 18px;display:grid}.hero-block-demo span,.auth-split-demo span{color:var(--muted);text-transform:uppercase;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.72rem}.hero-block-demo strong{max-width:9ch;color:var(--text);font-size:2.4rem;line-height:.92}.pricing-row-demo{border:1px solid var(--line);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.pricing-row-demo span{border-right:1px solid var(--line);color:var(--muted);gap:18px;padding:14px;display:grid}.pricing-row-demo span:last-child{border-right:0}.pricing-row-demo .is-featured{background:var(--text);color:var(--bg)}.pricing-row-demo strong{color:inherit;font-size:1.6rem}.form-stack-demo,.command-palette-demo,.auth-split-demo{gap:12px;display:grid}.form-stack-demo label{color:var(--muted);gap:7px;font-size:.8rem;display:grid}.data-table-demo{border-collapse:collapse;border:1px solid var(--line);width:100%;font-size:.82rem}.data-table-demo th,.data-table-demo td{border-bottom:1px solid var(--line);text-align:left;padding:10px}.data-table-demo th{color:var(--muted);font-weight:600}.command-palette-demo{border:1px solid var(--line);background:#050505;padding:12px}.command-palette-demo button{text-align:left}.auth-split-demo{border:1px solid var(--line);grid-template-columns:.8fr 1fr}.auth-split-demo section,.auth-split-demo form{gap:12px;padding:14px;display:grid}.auth-split-demo section{border-right:1px solid var(--line);background:var(--soft);align-content:end}.auth-split-demo strong{font-size:1.4rem}.preview-modal{z-index:20;background:#000000f0;grid-template-rows:auto 1fr;display:grid;position:fixed;inset:0}.preview-modal__bar{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:18px;padding:16px clamp(18px,4vw,48px);display:flex}.preview-modal__bar div{gap:4px;display:grid}.preview-modal__bar span{color:var(--muted);text-transform:uppercase;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.72rem}.preview-modal__canvas{background:linear-gradient(90deg, #ffffff09 1px, transparent 1px), linear-gradient(#ffffff09 1px, transparent 1px), var(--bg);background-size:32px 32px;place-items:center;padding:clamp(22px,6vw,80px);display:grid}.preview-modal__canvas>*{max-width:min(980px,100%)}@keyframes slide-line{0%{transform:translate(-100%)}to{transform:translate(240%)}}@keyframes pulse-box{50%{background:var(--text)}}@keyframes pulse-dot{0%,to{opacity:.28;transform:translateY(0)}50%{opacity:1;transform:translateY(-5px)}}@keyframes fade-lift{0%,to{opacity:.55;transform:translateY(8px)}50%{opacity:1;transform:translateY(0)}}@keyframes rail-sweep{0%{transform:translate(-110%)}55%,to{transform:translate(310%)}}@keyframes stack-shift{0%,to{transform:translate(0)}50%{transform:translate(12px,-12px)}}@media (width<=1120px){.component-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=820px){.app-shell,.intro{grid-template-columns:1fr}.sidebar{border-right:0;border-bottom:1px solid var(--line);height:auto;position:relative}.category-nav{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:18px}.intro{min-height:auto;padding-top:46px}h1{max-width:9ch;font-size:clamp(2.6rem,11vw,3.2rem);line-height:.94}.component-grid{grid-template-columns:1fr}.workbench-controls{grid-template-columns:1fr;position:static}.status-filter{justify-content:flex-start}}@media (width<=520px){.category-nav{grid-template-columns:1fr}.section-header{display:grid}.component-card__preview{min-height:190px;padding:16px}.demo-header{flex-wrap:wrap;min-height:88px}.metric-strip{grid-template-columns:1fr}.metric-strip span{border-right:0;border-bottom:1px solid var(--line)}}