:root{--bg: #0b1020;--panel: #121a2f;--panel-2: #18233d;--border: #24314f;--text: #e8eefc;--muted: #93a0c0;--accent: #818cf8;--accent-2: #22d3ee;--ok: #34d399;--warn: #fbbf24;--shadow: 0 10px 40px rgba(0,0,0,.35);--radius: 14px;--sidebar-w: 260px;--font: "Inter", "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif}*{box-sizing:border-box}html,body{height:100%;margin:0}body{font-family:var(--font);background:radial-gradient(1200px 600px at 10% -10%,#1a2450 0%,transparent 50%),radial-gradient(900px 500px at 100% 0%,#0f3a4a 0%,transparent 45%),var(--bg);color:var(--text);overflow:hidden}#app{display:flex;height:100%}.sidebar{width:var(--sidebar-w);flex-shrink:0;background:linear-gradient(180deg,#10182c,#0d1426);border-right:1px solid var(--border);display:flex;flex-direction:column;padding:18px 14px;z-index:20}.brand{display:flex;gap:12px;align-items:center;padding:6px 8px 18px}.brand-mark{width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,var(--accent),var(--accent-2));display:grid;place-items:center;font-weight:800;color:#0b1020;box-shadow:0 0 24px #818cf859}.brand-title{font-weight:700;letter-spacing:.02em}.brand-sub{font-size:12px;color:var(--muted)}.nav{display:flex;flex-direction:column;gap:4px;flex:1;overflow:auto}.nav-item,.nav-sub{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;color:var(--muted);text-decoration:none;font-size:14px;transition:.15s ease}.nav-item:hover,.nav-sub:hover{background:var(--panel-2);color:var(--text)}.nav-item.active,.nav-sub.active{background:linear-gradient(90deg,rgba(129,140,248,.18),transparent);color:var(--text);box-shadow:inset 3px 0 0 var(--accent)}.nav-sub{padding-left:36px;font-size:13px}.icon{width:1.2em;text-align:center;opacity:.9}.badge{margin-left:auto;font-style:normal;font-size:10px;background:#24314f;color:var(--warn);padding:2px 6px;border-radius:999px}.sidebar-foot{font-size:11px;color:#66748f;padding:12px 8px 4px}.main{flex:1;display:flex;flex-direction:column;min-width:0}.topbar{height:56px;display:flex;align-items:center;gap:12px;padding:0 18px;border-bottom:1px solid var(--border);background:#0b1020a6;backdrop-filter:blur(10px)}.menu-toggle{display:none;background:var(--panel);border:1px solid var(--border);color:var(--text);border-radius:8px;width:36px;height:36px;cursor:pointer}.breadcrumb{font-weight:600;font-size:15px}.topbar-right{margin-left:auto}.pill{font-size:11px;padding:4px 10px;border-radius:999px;background:#22d3ee1f;color:var(--accent-2);border:1px solid rgba(34,211,238,.25)}.content{flex:1;overflow:auto;padding:20px}.card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}.hero{padding:28px;margin-bottom:18px}.hero h1{margin:0 0 8px;font-size:26px}.hero p{margin:0;color:var(--muted);line-height:1.6;max-width:720px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}.tile{padding:18px;text-decoration:none;color:inherit;transition:.15s ease;display:block}.tile:hover{transform:translateY(-2px);border-color:var(--accent)}.tile h3{margin:0 0 6px;font-size:16px}.tile p{margin:0;color:var(--muted);font-size:13px;line-height:1.5}.tile .tag{display:inline-block;margin-top:12px;font-size:11px;color:var(--accent);background:#818cf81f;padding:3px 8px;border-radius:999px}.demo-wrap{display:grid;grid-template-rows:auto minmax(0,1fr);height:auto;gap:12px;min-height:0}.demo-toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:12px 14px}.demo-toolbar h2{margin:0;font-size:16px;flex:1}.btn{background:var(--panel-2);border:1px solid var(--border);color:var(--text);border-radius:8px;padding:6px 12px;font-size:12px;cursor:pointer}.btn:hover{border-color:var(--accent)}.canvas-host canvas{display:block;width:100%!important;height:100%!important}.placeholder{padding:40px 28px;text-align:center;color:var(--muted)}.placeholder h2{color:var(--text);margin-top:0}.hint{font-size:12px;color:var(--muted)}@media (max-width: 860px){.sidebar{position:fixed;inset:0 auto 0 0;transform:translate(-105%);transition:transform .2s ease}.sidebar.open{transform:translate(0)}.menu-toggle{display:inline-grid;place-items:center}}.ui-demo{color:var(--text)}.ui-demo h3{margin:0 0 12px;font-size:15px;color:var(--muted);font-weight:600}.ui-row{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:22px;align-items:center}.u-btn{border:1px solid var(--border);background:var(--panel-2);color:var(--text);border-radius:10px;padding:8px 14px;font-size:13px;cursor:pointer;transition:.15s ease}.u-btn:hover{border-color:var(--accent)}.u-btn.primary{background:linear-gradient(135deg,#6366f1,#22d3ee);color:#0b1020;border:none;font-weight:600}.u-btn.ghost{background:transparent}.u-btn.danger{background:#7f1d1d;border-color:#b91c1c}.u-btn:disabled{opacity:.45;cursor:not-allowed}.u-btn.sm{padding:5px 10px;font-size:12px}.u-btn.lg{padding:12px 18px;font-size:15px}.ui-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}.u-card{background:var(--panel-2);border:1px solid var(--border);border-radius:14px;padding:16px}.u-card h3{margin:0 0 8px;color:var(--text);font-size:16px}.u-card p{margin:0 0 14px;color:var(--muted);font-size:13px;line-height:1.5}.u-card.accent{border-color:#818cf88c;box-shadow:inset 0 0 0 1px #818cf826}.u-modal-backdrop{position:absolute;inset:0;background:#0000008c;display:grid;place-items:center;z-index:5}.u-modal{width:min(420px,92%);background:#121a2f;border:1px solid var(--border);border-radius:16px;padding:20px;box-shadow:var(--shadow)}.u-modal h3{margin:0 0 8px;color:var(--text)}.u-modal p{margin:0 0 16px;color:var(--muted);line-height:1.55}.canvas-host{position:relative}.nav-item .count{margin-left:auto;font-style:normal;font-size:10px;color:var(--muted);background:#ffffff0d;border:1px solid var(--border);padding:1px 7px;border-radius:999px}.nav-item.active .count{color:var(--accent);border-color:#818cf866}.tile-head{display:flex;align-items:center;gap:10px;margin-bottom:6px}.tile-head h3{margin:0}.tile-icon{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;background:linear-gradient(135deg,#818cf840,#22d3ee26);border:1px solid var(--border);font-size:15px;flex:none}.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}.chip{font-size:11px;padding:3px 9px;border-radius:999px;color:var(--muted);border:1px solid var(--border);background:#ffffff08;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.chip.accent{color:var(--accent-2);border-color:#22d3ee4d}.stats{display:flex;gap:28px;margin-top:18px;flex-wrap:wrap}.stats div{display:flex;flex-direction:column}.stats b{font-size:26px;background:linear-gradient(90deg,var(--accent),var(--accent-2));-webkit-background-clip:text;background-clip:text;color:transparent}.stats span{font-size:12px;color:var(--muted)}.overview{margin-top:18px;padding:20px}.overview h2{margin:0 0 12px;font-size:17px}.table-wrap{overflow-x:auto}.overview table{width:100%;border-collapse:collapse;font-size:13px}.overview th,.overview td{text-align:left;padding:9px 10px;border-bottom:1px solid var(--border);vertical-align:top}.overview th{color:var(--muted);font-weight:600;font-size:12px}.overview td a{color:var(--text);text-decoration:none;white-space:nowrap}.overview td a:hover{color:var(--accent)}.overview .num{text-align:center;width:60px}.overview .muted{color:var(--muted)}a.btn{text-decoration:none;display:inline-block}.loading{position:absolute;inset:0;display:grid;place-items:center;text-align:center;color:var(--muted);font-size:13px;padding:20px}.loading.err{color:#fca5a5}.sidebar-backdrop{display:none}.demo-wrap{height:auto;min-height:0}.canvas-host>.fx-root{position:absolute;inset:0}.canvas-host .fx-scroll{position:absolute;inset:0;overflow:auto;-webkit-overflow-scrolling:touch}.fx-bar{position:absolute;left:12px;top:12px;z-index:3;display:flex;gap:6px;flex-wrap:wrap;max-width:calc(100% - 24px)}.fx-bar .btn,.fx-bar select,.fx-bar input[type=color]{background:#121a2fd9;backdrop-filter:blur(6px)}.fx-bar select{color:var(--text);border:1px solid var(--border);border-radius:8px;padding:5px 8px;font-size:12px}.fx-bar input[type=color]{width:34px;height:30px;border:1px solid var(--border);border-radius:8px;padding:2px}.fx-bar input[type=range]{width:110px}.fx-bar label{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:6px;background:#121a2fd9;border:1px solid var(--border);border-radius:8px;padding:4px 8px}.btn.on{border-color:var(--accent);color:var(--accent)}@media (max-width: 860px){.sidebar{width:min(280px,84vw)}.sidebar-backdrop.show{display:block;position:fixed;inset:0;background:#00000080;z-index:15}.content{padding:12px}.hero{padding:20px}.hero h1{font-size:22px}.demo-wrap{height:auto;min-height:0}.demo-toolbar .hint{width:100%;order:5}.canvas-host{min-height:360px}.grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px}}@media (max-width: 420px){.grid{grid-template-columns:1fr}}html,body,#root{height:100%;max-height:100%;overflow:hidden}#app{height:100%;max-height:100dvh;overflow:hidden}.sidebar{min-height:0;max-height:100%;overflow:hidden;padding-bottom:8px}.sticky-brand{position:sticky;top:0;z-index:2;background:linear-gradient(180deg,#10182c,#10182cee);backdrop-filter:blur(8px);margin:-6px -8px 8px;padding:12px 16px 14px;border-bottom:1px solid var(--border)}.nav{flex:1 1 auto;min-height:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding-right:4px;scrollbar-gutter:auto}.main{min-height:0;overflow:hidden}.content{flex:1 1 auto;min-height:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scrollbar-gutter:auto;padding-bottom:20px}.nav,.content,.fx-scroll,.ksc,.ck,.ku,.kl,.kit-css{scrollbar-width:thin;scrollbar-color:#3b4a6e transparent}.nav::-webkit-scrollbar,.content::-webkit-scrollbar,.fx-scroll::-webkit-scrollbar,.ksc::-webkit-scrollbar,.ck::-webkit-scrollbar,.ku::-webkit-scrollbar{width:10px;height:10px}.nav::-webkit-scrollbar-thumb,.content::-webkit-scrollbar-thumb,.fx-scroll::-webkit-scrollbar-thumb,.ksc::-webkit-scrollbar-thumb,.ck::-webkit-scrollbar-thumb,.ku::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#4b5d8c,#334261);border-radius:999px;border:2px solid transparent;background-clip:padding-box}.nav::-webkit-scrollbar-thumb:hover,.content::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#6b7db0,#45567a);background-clip:padding-box;border:2px solid transparent}.nav::-webkit-scrollbar-track,.content::-webkit-scrollbar-track{background:transparent}.nav-item,.nav-sub,.tile,.btn{transition:background .15s ease,color .15s ease,border-color .15s ease,transform .15s ease,box-shadow .15s ease}.nav-item:focus-visible,.nav-sub:focus-visible,.tile:focus-visible,.btn:focus-visible,.topbar-search input:focus-visible,.cat-search input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.nav-empty{padding:12px;color:var(--muted);font-size:13px}.nav-sub.more{color:var(--accent-2);font-size:12px}.topbar{position:sticky;top:0;z-index:10;flex-shrink:0}.topbar-search{flex:1;max-width:320px;margin-left:8px}.topbar-search input,.cat-search input{width:100%;background:var(--panel);border:1px solid var(--border);color:var(--text);border-radius:10px;padding:8px 12px;font-size:13px}.topbar-search input:focus,.cat-search input:focus{border-color:var(--accent)}.topbar-right{display:flex;gap:8px;align-items:center}.pill.db.ok{background:#34d3991f;color:var(--ok);border-color:#34d3994d}.stats b.ok{background:none;color:var(--ok);-webkit-text-fill-color:var(--ok)}.stats b.bad{background:none;color:#fca5a5;-webkit-text-fill-color:#fca5a5}.cat-search{display:flex;gap:12px;align-items:center;margin-top:14px;max-width:420px}.cat-search .muted{font-size:12px;color:var(--muted);white-space:nowrap}.demo-wrap{min-height:0}.demo-toolbar{gap:12px;align-items:flex-start}.demo-title-block{flex:1;min-width:180px}.demo-title-block h2{margin:0 0 6px;font-size:17px}.demo-meta,.demo-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.btn.primary{background:linear-gradient(135deg,#6366f1,#22d3ee);color:#0b1020;border:none;font-weight:700}.btn.primary:hover{filter:brightness(1.05)}.canvas-host{position:relative;overflow:hidden;min-height:420px;background:#060a14}.demo-mount{position:absolute;inset:0}.loading{position:absolute;inset:0;z-index:2;display:grid;place-items:center;text-align:center;color:var(--muted);font-size:13px;padding:20px;background:#060a148c}.tile:active{transform:translateY(0) scale(.99)}.sidebar-foot{flex-shrink:0}@media (max-width: 860px){.topbar-search{max-width:none;flex:1}.pill:not(.db){display:none}.demo-actions{width:100%}}.fx-root.fx-layout{position:absolute;inset:0;display:flex;flex-direction:row;min-height:0;background:#060a14}.fx-main{flex:1 1 auto;min-width:0;min-height:0;display:flex;flex-direction:column;position:relative}.fx-toolbar.demo-controls{position:relative;left:auto;top:auto;max-width:none;max-height:none;flex:0 0 auto;z-index:6;display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;padding:10px 12px;background:linear-gradient(180deg,#0c1224f5,#0a0e1ce0);border-bottom:1px solid var(--border);backdrop-filter:blur(10px);overflow:visible}.fx-toolbar .fx-title{flex:0 0 auto}.btn-group{display:inline-flex;flex-wrap:wrap;align-items:center;gap:0;background:#121a2fbf;border:1px solid var(--border);border-radius:10px;padding:3px;max-width:100%}.btn-group.preset-group{flex:1 1 220px;min-width:0;max-height:76px;overflow:auto;scrollbar-width:thin}.btn-group .preset-btn,.btn-group .btn{border-radius:7px;border:0;background:transparent;margin:0;box-shadow:none}.btn-group .preset-btn{color:var(--muted);padding:5px 10px;font-size:12px;cursor:pointer;transition:.15s;white-space:nowrap}.btn-group .preset-btn:hover{color:var(--text);background:#24314f8c}.btn-group .preset-btn.on{color:#0b1020;background:linear-gradient(135deg,var(--accent),var(--accent-2));font-weight:700}.btn-group.action-group{flex:0 0 auto}.btn-group.action-group .btn{padding:5px 10px}.fx-ops-toggle.on{border-color:var(--accent);color:var(--accent)}.fx-main .kit-stage{position:relative!important;inset:auto!important;flex:1 1 auto;min-height:0;--c: #818cf8;--spd: 1;--sz: 1;--count: 40;--blur: 0}.fx-ops{flex:0 0 232px;width:232px;max-width:42vw;display:flex;flex-direction:column;min-height:0;border-left:1px solid var(--border);background:linear-gradient(180deg,#10182c,#0d1426);z-index:7}.fx-root.ops-collapsed .fx-ops{display:none}.fx-ops-head{display:flex;align-items:center;justify-content:space-between;padding:12px 14px 8px;font-size:12px;font-weight:700;color:var(--text);letter-spacing:.04em;text-transform:uppercase;border-bottom:1px solid var(--border)}.fx-ops-close{background:transparent;border:0;color:var(--muted);cursor:pointer;font-size:14px;line-height:1;padding:4px 6px;border-radius:6px}.fx-ops-close:hover{color:var(--text);background:var(--panel-2)}.fx-ops-body.param-row{flex:1 1 auto;min-height:0;overflow:auto;display:flex;flex-direction:column;flex-wrap:nowrap;gap:10px;padding:12px 12px 16px;scrollbar-width:thin}.fx-ops-body .param{font-size:12px;color:var(--muted);display:flex;flex-direction:column;align-items:stretch;gap:6px;background:#121a2fd9;border:1px solid var(--border);border-radius:10px;padding:10px 10px 12px}.fx-ops-body .param-label{color:var(--text);font-weight:600;font-size:12px}.fx-ops-body .param-ctrl{display:flex;align-items:center;gap:8px}.fx-ops-body .param input[type=range]{flex:1;width:auto;min-width:0}.fx-ops-body .param-step{flex:0 0 28px;width:28px;height:28px;padding:0;border-radius:8px;border:1px solid var(--border);background:#0d1426;color:var(--text);cursor:pointer;font-size:16px;line-height:1;font-weight:700}.fx-ops-body .param-step:hover{background:var(--panel-2);border-color:#3b4a6d;color:#fff}.fx-ops-body .param-step:active{transform:scale(.96)}.fx-ops-body .param em,.fx-ops-body .param code{font-style:normal;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;min-width:36px;text-align:right;color:var(--text);font-variant-numeric:tabular-nums;font-size:11px}.fx-ops-body .param input[type=color]{width:42px;height:32px;border:1px solid var(--border);border-radius:8px;padding:2px;background:#0d1426;cursor:pointer}.fx-ops-body .param select{flex:1;width:100%;color:var(--text);background:#0d1426;border:1px solid var(--border);border-radius:8px;padding:6px 8px;font-size:12px}.fx-ops-body .param.toggle{cursor:pointer}.fx-ops-body .param.toggle .param-ctrl{justify-content:flex-end}.fx-ops-actions{display:flex;flex-wrap:wrap;gap:6px;padding:10px 12px 14px;border-top:1px solid var(--border);background:transparent;border-radius:0;border-left:0;border-right:0;border-bottom:0}.fx-ops-empty{padding:16px;color:var(--muted);font-size:12px}.fx-bar.nested-actions{position:absolute;top:10px;right:10px;left:auto;width:auto;background:transparent;border:0;padding:0;z-index:5;display:flex;gap:6px;flex-wrap:wrap;max-width:calc(100% - 24px)}.kit-stage{--c: #818cf8;--spd: 1;--sz: 1;--count: 40;--blur: 0}.fx-bar:not(.nested-actions):not(.fx-toolbar){position:absolute;left:12px;top:12px;z-index:3;display:flex;gap:6px;flex-wrap:wrap;max-width:calc(100% - 24px)}@media (max-width: 860px){.fx-ops{position:absolute;right:0;top:0;bottom:0;width:min(240px,78vw);max-width:none;box-shadow:-12px 0 40px #00000073}.fx-root:not(.ops-collapsed) .fx-ops{display:flex}.btn-group.preset-group{max-height:64px}}html,body,#root{height:100%;height:100dvh;max-height:100%;max-height:100dvh;margin:0;overflow:hidden}#app{display:flex;height:100%;max-height:100%;max-height:100dvh;overflow:hidden;min-height:0}.sidebar{height:100%;max-height:100%;min-height:0;overflow:hidden}.main{flex:1 1 auto;min-width:0;min-height:0;height:100%;max-height:100%;overflow:hidden;display:flex;flex-direction:column}.topbar{flex:0 0 56px;height:56px;position:relative;top:auto}.content{flex:1 1 auto;min-height:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:auto;padding:16px 18px 20px}.content.content--demo,.content:has(.demo-wrap){display:flex;flex-direction:column;overflow:hidden;padding:12px 14px;scrollbar-gutter:auto}.demo-wrap{flex:1 1 auto;min-height:0;height:auto!important;max-height:100%;display:grid;grid-template-rows:auto minmax(0,1fr);gap:10px}.demo-toolbar{flex-shrink:0}.canvas-host{position:relative;min-height:0!important;height:auto;overflow:hidden;flex:1 1 auto}.fx-ops-body.param-row,.nav{overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain}@media (max-width: 860px){.demo-wrap{height:auto!important;min-height:0}.content.content--demo,.content:has(.demo-wrap){padding:10px}}:root{--sidebar-w: 280px}.sidebar{width:var(--sidebar-w);background:linear-gradient(180deg,#0e1629,#0b1222 55%,#0a101c);border-right:1px solid #1c2744}.brand.sticky-brand{display:flex;flex-direction:column;gap:12px;align-items:stretch;margin:-6px -8px 10px;padding:14px 14px 12px;background:linear-gradient(180deg,#121a30 0%,#10182cee 70%,transparent);border-bottom:1px solid #1c2744;position:sticky;top:0;z-index:3}.brand-link{display:flex;gap:12px;align-items:center;text-decoration:none;color:inherit}.brand-link:hover .brand-title{color:#fff}.brand-mark{width:38px;height:38px;border-radius:11px;box-shadow:0 0 0 1px #818cf840,0 8px 24px #818cf847}.sidebar-search{position:relative;display:block}.sidebar-search input{width:100%;background:#0d1426;border:1px solid #24314f;color:var(--text);border-radius:10px;padding:8px 32px 8px 12px;font-size:12px}.sidebar-search input:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 3px #818cf826}.sidebar-search-clear{position:absolute;right:6px;top:50%;transform:translateY(-50%);border:0;background:transparent;color:var(--muted);cursor:pointer;width:22px;height:22px;border-radius:6px;font-size:12px}.sidebar-search-clear:hover{background:var(--panel-2);color:var(--text)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.nav{gap:2px;padding:0 4px 8px}.nav-section-label{margin:12px 8px 6px;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#66748f}.nav-item-row{display:flex;align-items:center;gap:2px}.nav-item-row .nav-item{flex:1;min-width:0}.nav-item{padding:9px 10px;border-radius:10px;gap:10px;color:#9aa8c7;font-weight:500}.nav-item .nav-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nav-item:hover{background:#24314f8c;color:#e8eefc}.nav-item.active{background:linear-gradient(90deg,#818cf838,#818cf80d);color:#f4f7ff;box-shadow:inset 3px 0 0 var(--accent)}.nav-item.active .icon{filter:drop-shadow(0 0 6px rgba(129,140,248,.55))}.nav-item .count{margin-left:0;font-size:10px;color:#7f8db0;background:#ffffff0a;border:1px solid #24314f;padding:1px 7px;border-radius:999px;font-variant-numeric:tabular-nums}.nav-item.active .count{color:var(--accent-2);border-color:#22d3ee59;background:#22d3ee14}.nav-chevron{flex:0 0 28px;width:28px;height:28px;border-radius:8px;border:1px solid transparent;background:transparent;color:#66748f;cursor:pointer;display:grid;place-items:center;font-size:11px;transition:transform .15s ease,background .15s ease,color .15s ease}.nav-chevron:hover{background:#24314f99;color:var(--text);border-color:#24314f}.nav-chevron.open span{display:inline-block;transform:rotate(0)}.nav-chevron:not(.open) span{display:inline-block;transform:rotate(-90deg)}.nav-group{margin-bottom:2px}.nav-group.route-active>.nav-item-row .nav-item{color:#e8eefc}.nav-children{display:block;overflow:hidden;height:0;opacity:0;margin:0 0 0 14px;padding:0 0 0 10px;border-left:1px solid transparent;transform:translateY(-4px);transition:height .32s cubic-bezier(.4,0,.2,1),opacity .22s ease,margin .28s ease,padding .28s ease,border-color .22s ease,transform .28s ease;pointer-events:none;will-change:height,opacity}.nav-children-inner{overflow:hidden;min-height:0;display:flex;flex-direction:column;gap:1px}.nav-group.open .nav-children,.nav-children.open{opacity:1;margin:2px 0 8px 14px;padding:4px 0 4px 10px;border-left-color:#24314f;transform:translateY(0);pointer-events:auto}@media (prefers-reduced-motion: reduce){.nav-children{transition:none!important}}.nav-sub{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:8px;color:#8090b0;font-size:12.5px;text-decoration:none;position:relative}.nav-sub-dot{width:6px;height:6px;border-radius:50%;flex:none;background:#334261;box-shadow:0 0 0 2px transparent}.nav-sub-title{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nav-sub-tag{font-size:9px;color:#5d6c8f;opacity:0;transition:opacity .15s;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;max-width:64px;overflow:hidden;text-overflow:ellipsis}.nav-sub:hover{background:#24314f73;color:#e8eefc}.nav-sub:hover .nav-sub-tag{opacity:1}.nav-sub:hover .nav-sub-dot{background:var(--accent)}.nav-sub.active{background:linear-gradient(90deg,#22d3ee24,#818cf814);color:#f4f7ff;box-shadow:inset 0 0 0 1px #22d3ee38}.nav-sub.active .nav-sub-dot{background:var(--accent-2);box-shadow:0 0 0 3px #22d3ee33}.nav-sub.active .nav-sub-tag{opacity:1;color:var(--accent-2)}.nav-sub.more{color:var(--accent-2);font-size:12px;justify-content:flex-start}.sidebar-foot{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:10px 12px;border-top:1px solid #1c2744;font-size:11px;color:#66748f}.sidebar-foot-meta{font-variant-numeric:tabular-nums;padding:2px 7px;border-radius:999px;border:1px solid #24314f;background:#ffffff08}@media (max-width: 860px){.sidebar{width:min(300px,88vw)}.nav-sub-tag{display:none}}.nav-item-toggle{width:100%;border:0;background:transparent;cursor:pointer;text-align:left;font:inherit}.nav-item-toggle.expanded{color:#e8eefc;background:#24314f59}.nav-chevron-inline{flex:0 0 auto;width:18px;height:18px;display:inline-grid;place-items:center;font-size:11px;color:#66748f;transition:transform .18s ease,color .15s ease;transform:rotate(-90deg)}.nav-chevron-inline.open{transform:rotate(0);color:var(--accent-2)}.nav-item-toggle:hover .nav-chevron-inline{color:#c7d2fe}.nav-chevron-inline{transition:transform .28s ease,color .18s ease}.kit-stage .kit-inner{position:absolute;inset:0;min-height:120px}.kit-stage canvas,.kit-inner canvas{display:block;width:100%!important;height:100%!important}.kit-stage .loading.err{background:#060a14b8;color:#fda4af}:root{--safe-top: env(safe-area-inset-top, 0px);--safe-right: env(safe-area-inset-right, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px);--tap: 44px}html{-webkit-text-size-adjust:100%;text-size-adjust:100%}body{padding:0;overscroll-behavior:none}body.sidebar-open{overflow:hidden;touch-action:none}.canvas-host,.demo-mount,.kit-stage,.kit-inner{touch-action:none}.canvas-host .fx-scroll,.kit-stage .fx-scroll,.kit-stage .ksc,.kit-css,.ku,.kl{touch-action:pan-y;-webkit-overflow-scrolling:touch}@media (max-width: 860px){#app{padding-left:var(--safe-left);padding-right:var(--safe-right)}.sidebar{top:0;bottom:0;padding-top:calc(14px + var(--safe-top));padding-bottom:calc(8px + var(--safe-bottom));padding-left:calc(14px + var(--safe-left));width:min(300px,82vw);max-width:100vw;box-shadow:12px 0 40px #00000073}.sidebar-backdrop.show{top:0;padding:0;pointer-events:auto}.sidebar.open{max-width:calc(100vw - 56px)}.topbar{height:auto;min-height:calc(52px + var(--safe-top));padding:calc(8px + var(--safe-top)) 12px 8px;gap:8px;flex-wrap:wrap}.menu-toggle{width:var(--tap);height:var(--tap);min-width:var(--tap);border-radius:10px;font-size:18px}.breadcrumb{font-size:clamp(13px,3.6vw,15px);line-height:1.25;max-width:calc(100vw - 160px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.topbar-search{order:5;flex:1 1 100%;max-width:none;margin:0}.topbar-search input{min-height:40px;font-size:16px;border-radius:12px}.topbar-right{margin-left:auto}.pill{max-width:42vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.content{padding:10px 10px calc(14px + var(--safe-bottom))}.content.content--demo,.content:has(.demo-wrap){padding:8px 8px calc(8px + var(--safe-bottom))}.hero{padding:16px;margin-bottom:12px}.hero h1{font-size:clamp(18px,5.4vw,22px);line-height:1.25}.hero p{font-size:13px;line-height:1.55}.stats{gap:16px;margin-top:12px}.stats b{font-size:22px}.grid{grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:10px}.tile{padding:14px;min-height:var(--tap)}.tile h3{font-size:14px}.tile p{font-size:12px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.nav-item,.nav-item-toggle{min-height:44px;padding:10px 12px}.nav-sub{min-height:40px;padding:10px 12px;font-size:13px}.btn,.u-btn,a.btn{min-height:40px;padding:8px 12px;font-size:13px;display:inline-flex;align-items:center;justify-content:center}.demo-toolbar{padding:10px;gap:10px}.demo-title-block{min-width:0;width:100%}.demo-title-block h2{font-size:clamp(14px,4.2vw,16px);line-height:1.3;overflow-wrap:anywhere}.demo-meta .hint{font-size:11px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.demo-actions{width:100%;gap:6px}.demo-actions .btn{flex:1 1 auto;min-width:calc(50% - 6px)}.fx-toolbar.demo-controls{padding:8px;gap:6px;max-height:none}.fx-toolbar .fx-title{max-width:100%}.btn-group.preset-group{flex:1 1 100%;max-height:88px;overflow:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}.btn-group .preset-btn,.btn-group .btn,.fx-ops-toggle{min-height:36px;padding:8px 12px;font-size:13px}.fx-ops{position:absolute;inset:auto 0 0;width:100%!important;max-width:none;max-height:min(52vh,420px);border-left:0;border-top:1px solid var(--border);border-radius:16px 16px 0 0;box-shadow:0 -16px 48px #00000073;padding-bottom:var(--safe-bottom)}.fx-root:not(.ops-collapsed) .fx-ops{display:flex}.fx-ops-head{padding:14px 16px 10px;cursor:grab}.fx-ops-head:before{content:"";display:block;width:36px;height:4px;border-radius:999px;background:#3b4a6e;margin:0 auto 10px}.fx-ops-body .param{padding:12px}.fx-ops-body .param-step{width:36px;height:36px;flex-basis:36px}.fx-ops-body .param input[type=range]{min-height:28px}.fx-bar.nested-actions{inset:auto 10px 10px;justify-content:flex-end}.overview{padding:14px}.overview .muted{display:none}.cat-search{max-width:none;flex-wrap:wrap}.cat-search input{min-height:40px;font-size:16px}.ui-cards{grid-template-columns:1fr}.table-wrap{margin:0 -4px}}@media (max-width: 480px){.grid{grid-template-columns:1fr 1fr}.tile-icon{width:28px;height:28px;font-size:13px}.demo-actions .btn{min-width:calc(33.33% - 6px);font-size:12px;padding:8px}.breadcrumb{max-width:calc(100vw - 120px)}.hero .chips{gap:4px}}@media (max-width: 360px){.grid{grid-template-columns:1fr}.pill.db{font-size:10px;padding:3px 8px}}@media (max-width: 860px) and (orientation: landscape){.fx-ops{inset:0 0 0 auto;width:min(260px,46vw)!important;max-height:none;border-radius:0;border-top:0;border-left:1px solid var(--border);padding-bottom:0}.fx-ops-head:before{display:none}.topbar{min-height:48px;padding-top:6px;padding-bottom:6px}.topbar-search{order:0;flex:1 1 auto;max-width:220px}}.brand-top{display:flex;align-items:flex-start;gap:8px}.brand-top .brand-link{flex:1;min-width:0}.sidebar-close{display:none;flex:0 0 var(--tap, 44px);width:var(--tap, 44px);height:var(--tap, 44px);border-radius:10px;border:1px solid var(--border);background:var(--panel);color:var(--text);cursor:pointer;font-size:16px}@media (max-width: 860px){.sidebar-close{display:inline-grid;place-items:center}.menu-toggle{position:relative;z-index:25}.sidebar-backdrop.show{z-index:18}.sidebar{z-index:22}}@media (max-width: 860px){body:has(.content--demo) .topbar-search,.main:has(.content--demo) .topbar-search{display:none}.main:has(.content--demo) .topbar{min-height:calc(48px + var(--safe-top));padding-top:calc(6px + var(--safe-top));padding-bottom:6px;flex-wrap:nowrap}.main:has(.content--demo) .breadcrumb{max-width:calc(100vw - 140px)}.content.content--demo .demo-toolbar{padding:8px;gap:8px}.content.content--demo .demo-title-block h2{margin-bottom:4px}.content.content--demo .demo-actions .btn{min-height:36px;padding:6px 10px;font-size:12px}.content.content--demo .fx-toolbar.demo-controls{padding:6px 8px}.content.content--demo .btn-group.preset-group{max-height:56px}.content.content--demo .fx-title{display:none}}@media (max-width: 480px){.content.content--demo .demo-meta .hint{display:none}}.btn-short{display:none}@media (max-width: 860px){.demo-actions .btn-full{display:none}.demo-actions .btn-short{display:inline}.demo-actions .btn{min-width:0;flex:0 1 auto}.demo-actions .btn.primary{flex:1 1 auto}}