.pp-demo *{box-sizing:border-box}.pp-demo{margin:0;padding:0;height:100%;background:var(--bg-0);color:var(--fg-1);font-family:var(--font-ui);font-size:14px;-webkit-font-smoothing:antialiased;transition:background .3s,color .3s}.pp-demo button,.pp-demo input,.pp-demo select{font:inherit;color:inherit;border:0;background:none;cursor:pointer}.pp-demo a{color:var(--acc);text-decoration:none}.pp-demo a:hover{color:var(--acc-2)}.pp-demo ::-webkit-scrollbar{width:9px;height:9px}.pp-demo ::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:99px}.pp-demo ::-webkit-scrollbar-track{background:transparent}.pp-demo .num{font-family:var(--font-num);font-variant-numeric:tabular-nums}.pp-demo[data-demo-layout=classic]{--font-ui:"Space Grotesk",ui-sans-serif,system-ui,sans-serif;--font-num:"JetBrains Mono",ui-monospace,monospace;--font-mono:"JetBrains Mono",ui-monospace,monospace;--r-lg:18px;--r-md:13px;--r-sm:9px;--r-pill:999px;--pad-panel:20px;--gap:16px;--acc-h:268;--acc-c:.16}.pp-demo[data-demo-layout=classic][data-demo-theme=dark]{--bg-0:oklch(.13 .008 260);--bg-1:oklch(.17 .008 260);--bg-2:oklch(.205 .009 260);--bg-3:oklch(.25 .010 260);--panel:oklch(.17 .008 260);--panel-2:oklch(.205 .009 260);--line:oklch(.30 .010 260/.55);--line-2:oklch(.36 .012 260/.7);--fg-1:oklch(.97 .004 260);--fg-2:oklch(.80 .010 260);--fg-3:oklch(.62 .010 260);--fg-4:oklch(.48 .010 260);--acc:oklch(.74 var(--acc-c) var(--acc-h));--acc-2:oklch(.64 var(--acc-c) var(--acc-h));--acc-soft:oklch(.74 var(--acc-c) var(--acc-h)/.15);--acc-glow:oklch(.74 var(--acc-c) var(--acc-h)/.32);--acc-ink:oklch(.13 .01 260);--pos:oklch(.78 .15 162);--pos-soft:oklch(.78 .15 162/.15);--warn:oklch(.80 .14 82);--warn-soft:oklch(.80 .14 82/.15);--neg:oklch(.68 .19 22);--neg-soft:oklch(.68 .19 22/.15);--info:oklch(.76 .13 220);--info-soft:oklch(.76 .13 220/.15);--shadow:0 18px 44px -22px oklch(0 0 0/.8)}.pp-demo[data-demo-layout=classic][data-demo-theme=light]{--bg-0:oklch(.975 .004 260);--bg-1:oklch(1 0 0);--bg-2:oklch(.965 .005 260);--bg-3:oklch(.93 .006 260);--panel:oklch(1 0 0);--panel-2:oklch(.975 .004 260);--line:oklch(.88 .006 260);--line-2:oklch(.82 .008 260);--fg-1:oklch(.22 .012 260);--fg-2:oklch(.38 .012 260);--fg-3:oklch(.53 .010 260);--fg-4:oklch(.64 .010 260);--acc:oklch(.52 .19 var(--acc-h));--acc-2:oklch(.44 .19 var(--acc-h));--acc-soft:oklch(.52 .19 var(--acc-h)/.10);--acc-glow:oklch(.52 .19 var(--acc-h)/.26);--acc-ink:oklch(1 0 0);--pos:oklch(.52 .15 162);--pos-soft:oklch(.52 .15 162/.12);--warn:oklch(.58 .13 70);--warn-soft:oklch(.58 .13 70/.14);--neg:oklch(.55 .19 25);--neg-soft:oklch(.55 .19 25/.12);--info:oklch(.55 .14 235);--info-soft:oklch(.55 .14 235/.12);--shadow:0 12px 32px -18px oklch(.35 .03 260/.35)}.pp-demo[data-demo-layout=minimalist]{--font-ui:"Schibsted Grotesk",ui-sans-serif,system-ui,sans-serif;--font-num:"Schibsted Grotesk",ui-sans-serif,sans-serif;--font-mono:"JetBrains Mono",ui-monospace,monospace;--r-lg:0px;--r-md:0px;--r-sm:0px;--r-pill:999px;--pad-panel:0px;--gap:0px}.pp-demo[data-demo-layout=minimalist][data-demo-theme=light]{--bg-0:oklch(.99 .002 100);--bg-1:oklch(1 0 0);--bg-2:oklch(.975 .003 100);--bg-3:oklch(.95 .004 100);--panel:oklch(1 0 0);--panel-2:oklch(.975 .003 100);--line:oklch(.90 .004 100);--line-2:oklch(.82 .006 100);--fg-1:oklch(.18 .006 100);--fg-2:oklch(.40 .006 100);--fg-3:oklch(.58 .006 100);--fg-4:oklch(.70 .005 100);--acc:oklch(.28 .02 100);--acc-2:oklch(.18 .02 100);--acc-soft:oklch(.28 .02 100/.07);--acc-glow:transparent;--acc-ink:oklch(1 0 0);--pos:oklch(.50 .13 155);--pos-soft:oklch(.50 .13 155/.10);--warn:oklch(.58 .12 70);--warn-soft:oklch(.58 .12 70/.10);--neg:oklch(.52 .18 25);--neg-soft:oklch(.52 .18 25/.10);--info:oklch(.52 .12 235);--info-soft:oklch(.52 .12 235/.10);--shadow:0 30px 60px -34px oklch(.2 .01 100/.16),0 2px 8px -4px oklch(.2 .01 100/.06)}.pp-demo[data-demo-layout=minimalist][data-demo-theme=dark]{--bg-0:oklch(.145 .003 100);--bg-1:oklch(.175 .003 100);--bg-2:oklch(.20 .003 100);--bg-3:oklch(.24 .004 100);--panel:oklch(.185 .003 100);--panel-2:oklch(.19 .003 100);--line:oklch(.30 .004 100);--line-2:oklch(.38 .005 100);--fg-1:oklch(.96 .002 100);--fg-2:oklch(.78 .004 100);--fg-3:oklch(.60 .004 100);--fg-4:oklch(.47 .004 100);--acc:oklch(.94 .004 100);--acc-2:oklch(.82 .004 100);--acc-soft:oklch(.94 .004 100/.10);--acc-glow:transparent;--acc-ink:oklch(.14 .003 100);--pos:oklch(.76 .14 158);--pos-soft:oklch(.76 .14 158/.13);--warn:oklch(.80 .13 82);--warn-soft:oklch(.80 .13 82/.13);--neg:oklch(.70 .18 24);--neg-soft:oklch(.70 .18 24/.13);--info:oklch(.76 .12 225);--info-soft:oklch(.76 .12 225/.13);--shadow:0 30px 60px -34px oklch(0 0 0/.5),0 2px 8px -4px oklch(0 0 0/.3)}.pp-demo[data-demo-layout=futuristic-retro]{--font-ui:"JetBrains Mono",ui-monospace,monospace;--font-num:"JetBrains Mono",ui-monospace,monospace;--font-mono:"JetBrains Mono",ui-monospace,monospace;--r-lg:0px;--r-md:0px;--r-sm:0px;--r-pill:0px;--pad-panel:16px;--gap:14px;--bevel:12px;letter-spacing:.02em}.pp-demo[data-demo-layout=futuristic-retro][data-demo-theme=dark]{--bg-0:oklch(.14 .045 300);--bg-1:oklch(.18 .05 300);--bg-2:oklch(.225 .055 300);--bg-3:oklch(.27 .06 300);--panel:oklch(.19 .05 300/.75);--panel-2:oklch(.23 .055 300/.8);--line:oklch(.72 .21 330/.38);--line-2:oklch(.76 .22 330/.72);--fg-1:oklch(.95 .045 320);--fg-2:oklch(.85 .08 322);--fg-3:oklch(.72 .09 300);--fg-4:oklch(.56 .08 288);--acc:oklch(.78 .24 335);--acc-2:oklch(.66 .22 333);--acc-soft:oklch(.78 .24 335/.14);--acc-glow:oklch(.78 .24 335/.55);--acc-ink:oklch(.13 .04 300);--pos:oklch(.82 .19 168);--pos-soft:oklch(.82 .19 168/.14);--warn:oklch(.84 .16 88);--warn-soft:oklch(.84 .16 88/.14);--neg:oklch(.72 .22 18);--neg-soft:oklch(.72 .22 18/.16);--info:oklch(.78 .16 196);--info-soft:oklch(.78 .16 196/.14);--shadow:0 0 0 1px oklch(.78 .24 335/.15),0 18px 50px -26px oklch(.78 .24 335/.5);--scan:oklch(.78 .24 335/.030)}.pp-demo[data-demo-layout=futuristic-retro][data-demo-theme=light]{--bg-0:oklch(.96 .02 320);--bg-1:oklch(.975 .015 320);--bg-2:oklch(.93 .025 318);--bg-3:oklch(.885 .032 315);--panel:oklch(.975 .015 320/.8);--panel-2:oklch(.93 .022 318);--line:oklch(.53 .19 330/.40);--line-2:oklch(.46 .21 332/.85);--fg-1:oklch(.30 .13 330);--fg-2:oklch(.40 .14 330);--fg-3:oklch(.52 .12 326);--fg-4:oklch(.62 .10 320);--acc:oklch(.50 .23 335);--acc-2:oklch(.40 .23 334);--acc-soft:oklch(.50 .23 335/.12);--acc-glow:oklch(.50 .23 335/.28);--acc-ink:oklch(.98 .015 320);--pos:oklch(.46 .15 160);--pos-soft:oklch(.46 .15 160/.12);--warn:oklch(.55 .15 78);--warn-soft:oklch(.55 .15 78/.14);--neg:oklch(.50 .21 25);--neg-soft:oklch(.50 .21 25/.13);--info:oklch(.48 .17 198);--info-soft:oklch(.48 .17 198/.12);--shadow:0 0 0 1px oklch(.50 .20 332/.18),0 10px 26px -18px oklch(.44 .20 332/.5);--scan:oklch(.50 .20 332/.030)}.pp-demo[data-demo-layout=futuristic-retro] .shell{position:relative}.pp-demo[data-demo-layout=futuristic-retro] .shell:before{content:"";position:absolute;top:-14px;left:-14px;right:-14px;height:3px;background:linear-gradient(90deg,var(--acc),var(--info),var(--acc));box-shadow:0 0 16px var(--acc-glow);z-index:5}@media(max-width:900px){.pp-demo[data-demo-layout=futuristic-retro] .shell:before{display:none}}.pp-demo[data-demo-layout=futuristic-retro] .btn,.pp-demo[data-demo-layout=futuristic-retro] .kpi .lbl,.pp-demo[data-demo-layout=futuristic-retro] .nav-item .lbl,.pp-demo[data-demo-layout=futuristic-retro] .panel-hd .t,.pp-demo[data-demo-layout=futuristic-retro] .tbl th,.pp-demo[data-demo-layout=futuristic-retro] .ui-upper{text-transform:uppercase;letter-spacing:.09em}.pp-demo .app{min-height:var(--demo-h,100vh);background:var(--bg-0);position:relative;transition:background .3s}.pp-demo[data-demo-layout=futuristic-retro] .app:before{content:"";position:absolute;inset:0;pointer-events:none;z-index:60;background:repeating-linear-gradient(to bottom,var(--scan) 0 1px,transparent 1px 3px)}.pp-demo[data-demo-layout=futuristic-retro] .app:after{content:"";position:absolute;inset:0;pointer-events:none;z-index:59;background:radial-gradient(ellipse at 50% 45%,transparent 55%,oklch(0 0 0/.28) 100%)}.pp-demo[data-demo-layout=futuristic-retro][data-demo-theme=light] .app:after{background:radial-gradient(ellipse at 50% 45%,transparent 60%,oklch(.45 .12 55/.13) 100%)}.pp-demo .shell{display:grid;min-height:var(--demo-h,100vh)}.pp-demo[data-demo-layout=classic] .shell{grid-template-columns:250px 1fr}.pp-demo[data-demo-layout=futuristic-retro] .shell{grid-template-columns:242px 1fr;padding:14px;gap:14px}.pp-demo[data-demo-layout=minimalist] .shell{grid-template-columns:1fr}.pp-demo .sidebar{display:flex;flex-direction:column;gap:4px;padding:18px 14px;overflow-y:auto;background:var(--bg-1);border-right:1px solid var(--line);position:sticky;top:0;height:var(--demo-h,100vh)}.pp-demo[data-demo-layout=futuristic-retro] .sidebar{border:1px solid var(--line-2);background:var(--panel);height:calc(var(--demo-h,100vh) - 28px);clip-path:polygon(0 var(--bevel),var(--bevel) 0,100% 0,100% calc(100% - var(--bevel)),calc(100% - var(--bevel)) 100%,0 100%)}.pp-demo .brand{display:flex;align-items:center;gap:11px;padding:6px 8px 18px}.pp-demo .brand-mark{width:32px;height:32px;display:grid;place-items:center;flex-shrink:0;border-radius:var(--r-sm);background:var(--acc-soft);border:1px solid var(--line);color:var(--acc)}.pp-demo[data-demo-layout=futuristic-retro] .brand-mark{box-shadow:0 0 12px var(--acc-glow)}.pp-demo .brand-name{font-size:14.5px;font-weight:600;letter-spacing:-.01em;line-height:1.2}.pp-demo[data-demo-layout=futuristic-retro] .brand-name{letter-spacing:.06em;text-transform:uppercase;text-shadow:0 0 10px var(--acc-glow)}.pp-demo .brand-tag{font-family:var(--font-mono);font-size:10px;color:var(--fg-4);margin-top:2px}.pp-demo .ws-pill{display:flex;align-items:center;gap:9px;padding:9px 10px;margin-bottom:16px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--bg-2)}.pp-demo[data-demo-layout=futuristic-retro] .ws-pill{background:var(--acc-soft)}.pp-demo .ws-avatar{width:26px;height:26px;border-radius:var(--r-sm);background:var(--acc);color:var(--acc-ink);display:grid;place-items:center;font-size:12px;font-weight:600;flex-shrink:0}.pp-demo .ws-pill .n{font-size:12.5px;font-weight:500;line-height:1.25}.pp-demo .ws-pill .s{font-size:10.5px;color:var(--fg-4)}.pp-demo .nav-label{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--fg-4);padding:14px 10px 6px}.pp-demo .nav-item{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:8px 10px;border-radius:var(--r-md);color:var(--fg-3);font-size:13px;transition:background .15s,color .15s;border:1px solid transparent}.pp-demo .nav-item:hover{background:var(--bg-2);color:var(--fg-1)}.pp-demo .nav-item.active{background:var(--acc-soft);color:var(--fg-1);border-color:var(--line-2)}.pp-demo[data-demo-layout=futuristic-retro] .nav-item.active{box-shadow:inset 0 0 14px var(--acc-soft)}.pp-demo[data-demo-layout=futuristic-retro] .nav-item.active:before{content:"▸";margin-right:-4px;color:var(--acc)}.pp-demo[data-demo-layout=futuristic-retro] .nav-item{font-size:11.5px;gap:8px;padding:8px}.pp-demo[data-demo-layout=futuristic-retro] .ws-pill .n{font-size:11.5px;line-height:1.35}.pp-demo .nav-item .lbl{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pp-demo .nav-item .badge{font-family:var(--font-mono);font-size:10px;padding:2px 6px;border-radius:var(--r-pill);background:var(--bg-3);color:var(--fg-3)}.pp-demo .nav-item .badge.warn{background:var(--warn-soft);color:var(--warn)}.pp-demo .side-foot{margin-top:auto;padding-top:16px}.pp-demo .usage{border:1px solid var(--line);border-radius:var(--r-md);padding:12px;background:var(--bg-2);margin-bottom:8px}.pp-demo .usage .t{font-size:11.5px;font-weight:500}.pp-demo .bar{height:5px;border-radius:var(--r-pill);background:var(--bg-3);overflow:hidden;margin:8px 0 6px}.pp-demo .bar i{display:block;height:100%;background:var(--acc);border-radius:inherit}.pp-demo[data-demo-layout=futuristic-retro] .bar{border:1px solid var(--line);background:transparent;height:8px}.pp-demo[data-demo-layout=futuristic-retro] .bar i{box-shadow:0 0 8px var(--acc-glow)}.pp-demo .topbar{display:flex;align-items:center;gap:10px;padding:0 20px;height:58px;flex-shrink:0;border-bottom:1px solid var(--line);background:var(--bg-1);position:sticky;top:0;z-index:30}.pp-demo[data-demo-layout=futuristic-retro] .topbar{background:var(--panel);border:1px solid var(--line-2);height:52px;margin-bottom:14px;clip-path:polygon(0 0,100% 0,100% calc(100% - var(--bevel)),calc(100% - var(--bevel)) 100%,0 100%)}.pp-demo[data-demo-layout=minimalist] .topbar{background:var(--bg-0);border-bottom:1px solid var(--line);height:64px;padding:0 32px}.pp-demo .crumbs{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--fg-3);min-width:0}.pp-demo .crumbs .sep{color:var(--fg-4)}.pp-demo .crumbs .cur{color:var(--fg-1);font-weight:500}.pp-demo .searchbar{display:flex;align-items:center;gap:9px;flex:1;max-width:420px;margin:0 auto;padding:8px 12px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--bg-2);color:var(--fg-3);font-size:12.5px}.pp-demo .searchbar:hover{border-color:var(--line-2)}.pp-demo .kbd{font-family:var(--font-mono);font-size:10px;padding:2px 6px;border:1px solid var(--line);border-radius:4px;color:var(--fg-4)}.pp-demo .icon-btn{width:32px;height:32px;display:grid;place-items:center;border-radius:var(--r-sm);color:var(--fg-3);border:1px solid transparent;position:relative}.pp-demo .icon-btn:hover{background:var(--bg-2);color:var(--fg-1);border-color:var(--line)}.pp-demo .avatar{width:28px;height:28px;border-radius:var(--r-sm);display:grid;place-items:center;font-size:11px;font-weight:600;background:var(--acc);color:var(--acc-ink);flex-shrink:0}.pp-demo[data-demo-layout=minimalist] .avatar{border-radius:999px}.pp-demo .mini-nav{display:flex;align-items:center;gap:2px}.pp-demo .mini-nav button{padding:7px 13px;font-size:13.5px;color:var(--fg-3);border-radius:var(--r-pill);transition:color .15s}.pp-demo .mini-nav button:hover{color:var(--fg-1)}.pp-demo .mini-nav button.active{color:var(--fg-1);font-weight:500}.pp-demo .mini-nav button.active:after{content:"";display:block;height:1.5px;background:var(--fg-1);margin-top:3px}.pp-demo .retro-strip{display:flex;align-items:center;gap:12px;font-size:10.5px;color:var(--fg-3);text-transform:uppercase;letter-spacing:.12em}.pp-demo .retro-strip .live{display:inline-flex;align-items:center;gap:5px;color:var(--acc)}.pp-demo .blip{width:6px;height:6px;background:var(--acc);border-radius:50%;box-shadow:0 0 8px var(--acc);animation:ppd-blip 1.6s infinite}@keyframes ppd-blip{0%,to{opacity:1}50%{opacity:.25}}.pp-demo .main,.pp-demo .page{display:flex;flex-direction:column;min-width:0}.pp-demo .page{padding:22px;gap:16px}.pp-demo[data-demo-layout=minimalist] .page{padding:44px 32px 90px;max-width:1120px;margin:0 auto;width:100%;gap:52px}.pp-demo[data-demo-layout=classic] .page{padding-bottom:100px}.pp-demo[data-demo-layout=futuristic-retro] .page{gap:14px;padding:0 0 100px}.pp-demo .page-hd{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap}.pp-demo .h-title{font-size:20px;font-weight:600;letter-spacing:-.02em;margin:0}.pp-demo[data-demo-layout=minimalist] .h-title{font-size:36px;font-weight:700;letter-spacing:-.03em}.pp-demo[data-demo-layout=futuristic-retro] .h-title{font-size:17px;text-transform:uppercase;letter-spacing:.12em;text-shadow:0 0 12px var(--acc-glow)}.pp-demo .h-sub{font-size:12.5px;color:var(--fg-3);margin-top:5px}.pp-demo[data-demo-layout=minimalist] .h-sub{font-size:14.5px;margin-top:9px}.pp-demo .panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow)}.pp-demo[data-demo-layout=minimalist] .panel{border:0;background:var(--panel);border-radius:20px;box-shadow:var(--shadow);overflow:visible;transition:box-shadow .25s var(--ease-out),transform .25s var(--ease-out)}.pp-demo[data-demo-layout=minimalist] .g-3>.panel{padding:26px 26px 28px}.pp-demo[data-demo-layout=futuristic-retro] .panel{position:relative;border:1px solid var(--line-2);background:var(--panel);clip-path:polygon(0 var(--bevel),var(--bevel) 0,100% 0,100% calc(100% - var(--bevel)),calc(100% - var(--bevel)) 100%,0 100%)}.pp-demo .panel-hd{display:flex;align-items:center;gap:12px;padding:14px var(--pad-panel);border-bottom:1px solid var(--line)}.pp-demo[data-demo-layout=minimalist] .panel-hd{padding:0 0 18px;border-bottom:1px solid var(--line);margin-bottom:30px;flex-wrap:wrap;row-gap:10px}.pp-demo[data-demo-layout=futuristic-retro] .panel-hd{background:var(--acc-soft)}.pp-demo .panel-hd .t{font-size:13.5px;font-weight:600;letter-spacing:-.005em}.pp-demo[data-demo-layout=minimalist] .panel-hd .t{font-size:19px;font-weight:700;letter-spacing:-.015em}.pp-demo .panel-hd .s{font-size:11.5px;color:var(--fg-3);margin-top:2px}.pp-demo .panel-hd .right{margin-left:auto;display:flex;align-items:center;gap:10px}.pp-demo .panel-bd{padding:var(--pad-panel)}.pp-demo[data-demo-layout=minimalist] .panel-bd{padding:0}.pp-demo .kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap)}.pp-demo[data-demo-layout=minimalist] .kpis{gap:18px}.pp-demo .kpi{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-lg);padding:16px 18px;position:relative;overflow:hidden;box-shadow:var(--shadow)}.pp-demo .kpi.clickable{cursor:pointer;transition:transform .18s var(--ease-out),box-shadow .18s var(--ease-out)}.pp-demo .kpi.clickable:hover{transform:translateY(-2px)}.pp-demo .kpi.clickable:focus-visible{outline:2px solid var(--acc);outline-offset:2px}.pp-demo[data-demo-layout=minimalist] .kpi{background:var(--panel);border:0;border-radius:20px;box-shadow:var(--shadow);padding:28px 26px}.pp-demo[data-demo-layout=futuristic-retro] .kpi{border:1px solid var(--line-2);background:var(--panel);clip-path:polygon(0 10px,10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%)}.pp-demo .kpi .lbl{display:flex;align-items:center;gap:5px;font-size:11.5px;color:var(--fg-3)}.pp-demo[data-demo-layout=minimalist] .kpi .lbl{font-size:12.5px;text-transform:uppercase;letter-spacing:.09em;color:var(--fg-4)}.pp-demo[data-demo-layout=futuristic-retro] .kpi .lbl{font-size:10px}.pp-demo .kpi .v{font-family:var(--font-num);font-size:25px;font-weight:600;letter-spacing:-.025em;margin-top:8px;display:flex;align-items:baseline;gap:4px;flex-wrap:nowrap}.pp-demo .kpi .v,.pp-demo .kpi .v .num{white-space:nowrap}.pp-demo[data-demo-layout=minimalist] .kpi .v{font-size:40px;font-weight:700;letter-spacing:-.04em;margin-top:12px}.pp-demo[data-demo-layout=futuristic-retro] .kpi .v{font-size:24px;text-shadow:0 0 14px var(--acc-glow)}.pp-demo .kpi .v .unit{font-size:13px;color:var(--fg-3);font-weight:400;margin-right:3px}.pp-demo .kpi .v .frac{font-size:15px;color:var(--fg-3);font-weight:400}.pp-demo .kpi .meta{display:flex;align-items:center;gap:8px;margin-top:9px;font-size:11px;color:var(--fg-4)}.pp-demo .kpi .spark{margin-top:12px;height:32px}.pp-demo[data-demo-layout=minimalist] .kpi .spark{height:26px;opacity:.85;margin-top:16px}.pp-demo .chip{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:var(--r-pill);font-size:10.5px;font-weight:500;font-family:var(--font-mono);background:var(--bg-3);color:var(--fg-3);white-space:nowrap}.pp-demo .chip.pos{background:var(--pos-soft);color:var(--pos)}.pp-demo .chip.warn{background:var(--warn-soft);color:var(--warn)}.pp-demo .chip.neg{background:var(--neg-soft);color:var(--neg)}.pp-demo .chip.info{background:var(--info-soft);color:var(--info)}.pp-demo .chip.acc{background:var(--acc-soft);color:var(--acc)}.pp-demo[data-demo-layout=futuristic-retro] .chip{border:1px solid;background:transparent;text-transform:uppercase;letter-spacing:.08em}.pp-demo[data-demo-layout=minimalist] .chip{background:transparent;padding:0;font-family:var(--font-ui);font-size:12px;font-weight:500}.pp-demo .btn{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:var(--r-md);border:1px solid var(--line);background:var(--bg-2);color:var(--fg-1);font-size:12.5px;font-weight:500;transition:background .15s,transform .1s,border-color .15s;white-space:nowrap}.pp-demo .btn:hover{background:var(--bg-3);border-color:var(--line-2)}.pp-demo .btn:active{transform:scale(.97)}.pp-demo .btn.primary{background:var(--acc);color:var(--acc-ink);border-color:transparent}.pp-demo[data-demo-layout=classic] .btn.primary{box-shadow:0 6px 18px -8px var(--acc-glow)}.pp-demo[data-demo-layout=futuristic-retro] .btn.primary{box-shadow:0 0 16px var(--acc-glow)}.pp-demo .btn.primary:hover{filter:brightness(1.08);background:var(--acc)}.pp-demo .btn.ghost{background:transparent;border-color:transparent;color:var(--fg-3)}.pp-demo .btn.ghost:hover{color:var(--fg-1);background:var(--bg-2)}.pp-demo .btn.sm{padding:6px 10px;font-size:11.5px}.pp-demo[data-demo-layout=minimalist] .btn{border-radius:999px;padding:9px 18px}.pp-demo[data-demo-layout=minimalist] .btn.ghost{padding:9px 4px}.pp-demo[data-demo-layout=futuristic-retro] .btn{clip-path:polygon(0 7px,7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%)}.pp-demo .seg{display:inline-flex;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;background:var(--bg-2)}.pp-demo .seg button{padding:6px 11px;font-size:11.5px;color:var(--fg-3);font-family:var(--font-mono)}.pp-demo .seg button:hover{color:var(--fg-1)}.pp-demo .seg button.on{background:var(--acc-soft);color:var(--acc)}.pp-demo[data-demo-layout=minimalist] .seg{border-radius:999px}.pp-demo .tbl-wrap{overflow-x:auto}.pp-demo .tbl{width:100%;border-collapse:collapse;font-size:12.5px}.pp-demo .tbl th{text-align:left;font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--fg-4);font-weight:400;padding:10px var(--pad-panel);border-bottom:1px solid var(--line);white-space:nowrap}.pp-demo[data-demo-layout=minimalist] .tbl th{padding:10px 16px 12px 0;font-family:var(--font-ui);letter-spacing:.08em;font-size:11px}.pp-demo .tbl td{padding:12px var(--pad-panel);border-bottom:1px solid var(--line);color:var(--fg-2);vertical-align:middle}.pp-demo[data-demo-layout=minimalist] .tbl td{padding:16px 16px 16px 0;font-size:14px}.pp-demo[data-demo-layout=minimalist] .tbl td:last-child,.pp-demo[data-demo-layout=minimalist] .tbl th:last-child{padding-right:0}.pp-demo .tbl tbody tr:last-child td{border-bottom:0}.pp-demo .tbl tbody tr{transition:background .12s;cursor:pointer}.pp-demo .tbl tbody tr:hover{background:var(--bg-2)}.pp-demo[data-demo-layout=futuristic-retro] .tbl tbody tr:hover{background:var(--acc-soft)}.pp-demo .tbl .r{text-align:right}.pp-demo .cust{display:flex;align-items:center;gap:10px;min-width:0}.pp-demo .cust-mark{width:28px;height:28px;border-radius:var(--r-sm);display:grid;place-items:center;flex-shrink:0;font-size:10.5px;font-weight:600;color:oklch(.16 .01 260);font-family:var(--font-mono)}.pp-demo[data-demo-layout=minimalist] .cust-mark{border-radius:999px}.pp-demo[data-demo-layout=futuristic-retro] .cust-mark{border-radius:0;background:var(--acc-soft)!important;color:var(--acc)!important;border:1px solid var(--line-2)}.pp-demo .cust .n{font-weight:500;color:var(--fg-1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pp-demo .cust .s{font-family:var(--font-mono);font-size:10.5px;color:var(--fg-4)}.pp-demo .list-row{display:flex;align-items:center;gap:12px;padding:12px var(--pad-panel);border-bottom:1px solid var(--line)}.pp-demo[data-demo-layout=minimalist] .list-row{padding:16px 0}.pp-demo .list-row:last-child{border-bottom:0}.pp-demo .dot-ico{width:26px;height:26px;border-radius:var(--r-sm);display:grid;place-items:center;flex-shrink:0;background:var(--info-soft);color:var(--info)}.pp-demo .dot-ico.pos{background:var(--pos-soft);color:var(--pos)}.pp-demo .dot-ico.warn{background:var(--warn-soft);color:var(--warn)}.pp-demo .dot-ico.neg{background:var(--neg-soft);color:var(--neg)}.pp-demo[data-demo-layout=minimalist] .dot-ico{border-radius:999px;background:transparent!important}.pp-demo[data-demo-layout=futuristic-retro] .dot-ico{border:1px solid;background:transparent!important}.pp-demo .mono-sm{font-family:var(--font-mono);font-size:10.5px;color:var(--fg-4)}.pp-demo .ai-card{border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--pad-panel);position:relative;overflow:hidden;background:linear-gradient(160deg,var(--acc-soft),var(--panel));box-shadow:var(--shadow)}.pp-demo[data-demo-layout=minimalist] .ai-card{background:var(--panel-2);border:0;border-radius:20px;padding:28px 30px;box-shadow:var(--shadow)}.pp-demo[data-demo-layout=futuristic-retro] .ai-card{clip-path:polygon(0 var(--bevel),var(--bevel) 0,100% 0,100% calc(100% - var(--bevel)),calc(100% - var(--bevel)) 100%,0 100%)}.pp-demo .ai-line{display:flex;gap:11px;padding:10px 0;border-bottom:1px solid var(--line)}.pp-demo .ai-line:last-of-type{border-bottom:0}.pp-demo .ai-line .t{font-size:12.5px;font-weight:500;line-height:1.35}.pp-demo .ai-line .s{font-size:11.5px;color:var(--fg-3);margin-top:3px;line-height:1.45}.pp-demo .g-2{display:grid;grid-template-columns:1.65fr 1fr;gap:var(--gap)}.pp-demo .g-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}.pp-demo[data-demo-layout=minimalist] .g-2{gap:48px}.pp-demo[data-demo-layout=minimalist] .g-3{gap:44px}.pp-demo .between{display:flex;align-items:center;justify-content:space-between;gap:12px}.pp-demo .stack{display:flex;flex-direction:column;gap:var(--gap)}.pp-demo[data-demo-layout=minimalist] .stack{gap:52px}.pp-demo .mobile-bar{display:none;align-items:center;gap:10px;padding:0 16px;height:56px;position:sticky;top:0;z-index:40;background:var(--bg-1);border-bottom:1px solid var(--line)}.pp-demo[data-demo-layout=futuristic-retro] .mobile-bar{background:var(--panel);border:1px solid var(--line-2);margin:10px;height:50px}.pp-demo .drawer-scrim{position:absolute;inset:0;background:oklch(0 0 0/.55);z-index:70;backdrop-filter:blur(2px)}.pp-demo .drawer{position:absolute;top:0;left:0;bottom:0;width:270px;z-index:71;background:var(--bg-1);border-right:1px solid var(--line);padding:16px 12px;overflow-y:auto;display:flex;flex-direction:column;animation:ppd-slideIn .22s cubic-bezier(.2,.8,.2,1)}@keyframes ppd-slideIn{0%{transform:translateX(-100%)}to{transform:none}}.pp-demo .tabbar{display:none;position:sticky;bottom:0;z-index:40;background:var(--bg-1);border-top:1px solid var(--line);padding:6px 4px calc(6px + env(safe-area-inset-bottom))}.pp-demo .tabbar-in{display:grid;grid-template-columns:repeat(5,1fr);gap:2px}.pp-demo .tabbar button{display:flex;flex-direction:column;align-items:center;gap:3px;padding:7px 2px;font-size:9.5px;color:var(--fg-4);border-radius:var(--r-sm)}.pp-demo .tabbar button.active{color:var(--acc)}.pp-demo[data-demo-layout=minimalist] .tabbar button.active{color:var(--fg-1)}.pp-demo .retro-scroller{display:flex;gap:8px;overflow-x:auto;padding:10px;scrollbar-width:none}.pp-demo .retro-scroller::-webkit-scrollbar{display:none}.pp-demo .switcher{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);z-index:90;display:flex;align-items:center;gap:8px;padding:8px;border-radius:16px;background:oklch(.16 .008 260/.92);border:1px solid oklch(.42 .01 260/.6);box-shadow:0 20px 50px -18px oklch(0 0 0/.75);backdrop-filter:blur(14px);font-family:Space Grotesk,sans-serif}.pp-demo .switcher .lab{font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:oklch(.62 .01 260);padding:0 4px 0 6px;font-family:JetBrains Mono,monospace}.pp-demo .sw-group{display:flex;gap:3px;background:oklch(.22 .01 260);border-radius:11px;padding:3px}.pp-demo .sw-group button{padding:7px 13px;border-radius:9px;font-size:12px;color:oklch(.72 .01 260);transition:background .18s,color .18s;white-space:nowrap}.pp-demo .sw-group button:hover{color:oklch(.97 0 0)}.pp-demo .sw-group button.on{background:oklch(.98 0 0);color:oklch(.16 .01 260);font-weight:500}.pp-demo .sw-div{width:1px;height:22px;background:oklch(.4 .01 260/.6)}@media (max-width:1140px){.pp-demo .kpis{grid-template-columns:repeat(2,1fr)}.pp-demo .g-2,.pp-demo .g-3{grid-template-columns:1fr}}@media (max-width:900px){.pp-demo .app{padding-top:66px}.pp-demo .mobile-bar{top:66px}.pp-demo .switcher{width:max-content;max-width:calc(100vw - 16px)}.pp-demo .drawer{padding-top:74px}.pp-demo[data-demo-layout=classic] .shell,.pp-demo[data-demo-layout=futuristic-retro] .shell{grid-template-columns:1fr}.pp-demo[data-demo-layout=futuristic-retro] .shell{padding:0;gap:0}.pp-demo .sidebar,.pp-demo .topbar{display:none}.pp-demo .mobile-bar{display:flex}.pp-demo .tabbar{display:block}.pp-demo .page{gap:14px;padding:16px 16px 20px}.pp-demo[data-demo-layout=classic] .page{padding-bottom:20px}.pp-demo[data-demo-layout=minimalist] .page{padding:26px 20px 30px;gap:38px}.pp-demo[data-demo-layout=futuristic-retro] .page{padding:10px 10px 20px}.pp-demo .kpis{grid-template-columns:repeat(2,1fr);gap:10px}.pp-demo[data-demo-layout=minimalist] .kpis{gap:10px}.pp-demo[data-demo-layout=minimalist] .kpi{padding:18px}.pp-demo[data-demo-layout=minimalist] .h-title{font-size:28px}.pp-demo .switcher{bottom:auto;top:10px;padding:6px;gap:5px;max-width:calc(100vw - 20px);overflow-x:auto;border-radius:13px}.pp-demo .switcher .lab{display:none}.pp-demo .sw-group button{padding:6px 10px;font-size:11px}.pp-demo .panel-hd{flex-wrap:wrap}.pp-demo .h-title{font-size:18px}}@media (max-width:520px){.pp-demo .kpis{grid-template-columns:1fr}.pp-demo .page-hd{align-items:flex-start;flex-direction:column}}.pp-demo{--ease-out:cubic-bezier(.16,1,.3,1);--dur-fast:150ms;--dur-med:280ms;--dur-slow:480ms}@media (prefers-reduced-motion:reduce){.pp-demo *{animation-duration:.001ms!important;transition-duration:.001ms!important}}.pp-demo .page{animation:ppd-pageIn var(--dur-slow) var(--ease-out) backwards}@keyframes ppd-pageIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}.pp-demo .g-2>*,.pp-demo .g-3>*,.pp-demo .kpis>.kpi{animation:ppd-cardIn var(--dur-slow) var(--ease-out) backwards}.pp-demo .kpis>.kpi:first-child{animation-delay:.02s}.pp-demo .kpis>.kpi:nth-child(2){animation-delay:.06s}.pp-demo .kpis>.kpi:nth-child(3){animation-delay:.1s}.pp-demo .kpis>.kpi:nth-child(4){animation-delay:.14s}@keyframes ppd-cardIn{0%{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}@supports (view-transition-name:none){.pp-demo ::view-transition-new(root),.pp-demo ::view-transition-old(root){animation-duration:var(--dur-slow);animation-timing-function:var(--ease-out)}.pp-demo ::view-transition-old(root){animation-name:ppd-vt-fade-out}.pp-demo ::view-transition-new(root){animation-name:ppd-vt-fade-in}@keyframes ppd-vt-fade-out{to{opacity:0}}@keyframes ppd-vt-fade-in{0%{opacity:0}}}.pp-demo .route-loader{position:absolute;top:0;left:0;height:2px;width:0;z-index:100;pointer-events:none;background:linear-gradient(90deg,var(--acc),var(--info));box-shadow:0 0 10px var(--acc-glow);transition:width .35s var(--ease-out),opacity .25s linear .1s;opacity:0}.pp-demo .route-loader.on{opacity:1}.pp-demo .skel{position:relative;overflow:hidden;background:var(--bg-2);border-radius:var(--r-sm);isolation:isolate}.pp-demo .skel:after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,var(--bg-3) 50%,transparent 70%);background-size:200% 100%;animation:ppd-shimmer 1.3s ease-in-out infinite}@keyframes ppd-shimmer{0%{background-position:150% 0}to{background-position:-50% 0}}.pp-demo .switch{position:relative;display:inline-flex;align-items:center;width:38px;height:22px;border-radius:999px;background:var(--bg-3);border:1px solid var(--line);flex-shrink:0;cursor:pointer;transition:background .2s var(--ease-out),border-color .2s}.pp-demo .switch i{position:absolute;top:1px;left:1px;width:18px;height:18px;border-radius:50%;background:var(--fg-4);transition:transform .22s var(--ease-out),background .2s}.pp-demo .switch.on{background:var(--acc-soft);border-color:var(--acc)}.pp-demo .switch.on i{transform:translateX(16px);background:var(--acc)}.pp-demo[data-demo-layout=futuristic-retro] .switch,.pp-demo[data-demo-layout=futuristic-retro] .switch i{border-radius:0}.pp-demo .auth-shell{min-height:var(--demo-h,100vh);display:grid;place-items:center;background:var(--bg-0);padding:24px;position:relative}.pp-demo .auth-card{width:100%;max-width:380px;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-lg);padding:32px 30px;box-shadow:var(--shadow);animation:ppd-cardIn var(--dur-slow) var(--ease-out)}.pp-demo[data-demo-layout=minimalist] .auth-card{border:0;border-radius:22px;padding:44px 38px;max-width:400px}.pp-demo[data-demo-layout=futuristic-retro] .auth-card{clip-path:polygon(0 var(--bevel),var(--bevel) 0,100% 0,100% calc(100% - var(--bevel)),calc(100% - var(--bevel)) 100%,0 100%);border:1px solid var(--line-2)}.pp-demo .auth-brand{display:flex;flex-direction:column;align-items:center;gap:10px;margin-bottom:26px;text-align:center}.pp-demo .auth-brand .mk{width:44px;height:44px;display:grid;place-items:center;border-radius:var(--r-md);background:var(--acc-soft);color:var(--acc);border:1px solid var(--line)}.pp-demo[data-demo-layout=futuristic-retro] .auth-brand .mk{box-shadow:0 0 14px var(--acc-glow)}.pp-demo .fld{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}.pp-demo .fld label{font-size:11.5px;color:var(--fg-3);font-weight:500}.pp-demo[data-demo-layout=futuristic-retro] .fld label{text-transform:uppercase;letter-spacing:.09em;font-size:10px}.pp-demo .fld input{padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--bg-2);color:var(--fg-1);font-size:13px;transition:border-color .15s,background .15s}.pp-demo .fld input:focus{outline:none;border-color:var(--acc)}.pp-demo[data-demo-layout=minimalist] .fld input{border-radius:0;border:0;border-bottom:1px solid var(--line);background:transparent;padding:8px 0}.pp-demo[data-demo-layout=futuristic-retro] .fld input{clip-path:polygon(0 6px,6px 0,100% 0,100% 100%,0 100%)}.pp-demo .auth-divider{display:flex;align-items:center;gap:10px;margin:18px 0;font-size:11px;color:var(--fg-4)}.pp-demo .auth-divider:after,.pp-demo .auth-divider:before{content:"";flex:1;height:1px;background:var(--line)}.pp-demo .landing-shell{min-height:var(--demo-h,100vh);background:var(--bg-0)}.pp-demo .landing-hero{padding:100px 24px 70px;text-align:center;max-width:720px;margin:0 auto}.pp-demo .landing-hero h1{font-size:44px;letter-spacing:-.03em;line-height:1.08;margin:20px 0 16px;font-weight:700}.pp-demo[data-demo-layout=minimalist] .landing-hero h1{font-weight:800;font-size:52px}.pp-demo[data-demo-layout=futuristic-retro] .landing-hero h1{text-transform:uppercase;letter-spacing:.02em;text-shadow:0 0 20px var(--acc-glow);font-size:36px}.pp-demo .landing-hero p{font-size:15.5px;color:var(--fg-3);max-width:520px;margin:0 auto 28px;line-height:1.6}.pp-demo .landing-features{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:1000px;margin:0 auto;padding:0 24px 90px}.pp-demo .feature-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-lg);padding:24px;box-shadow:var(--shadow)}.pp-demo[data-demo-layout=minimalist] .feature-card{border:0;border-radius:20px}.pp-demo[data-demo-layout=futuristic-retro] .feature-card{clip-path:polygon(0 var(--bevel),var(--bevel) 0,100% 0,100% calc(100% - var(--bevel)),calc(100% - var(--bevel)) 100%,0 100%);border:1px solid var(--line-2)}.pp-demo .feature-card .ico{width:36px;height:36px;border-radius:var(--r-sm);background:var(--acc-soft);color:var(--acc);display:grid;place-items:center;margin-bottom:14px}.pp-demo .feature-card h3{font-size:14.5px;margin:0 0 6px;font-weight:600}.pp-demo .feature-card p{font-size:12.5px;color:var(--fg-3);line-height:1.55;margin:0}@media (max-width:800px){.pp-demo .landing-features{grid-template-columns:1fr}.pp-demo .landing-hero{padding:70px 20px 40px}.pp-demo .landing-hero h1{font-size:32px}}.pp-demo .settings-grid{display:grid;grid-template-columns:220px 1fr;gap:22px;align-items:start}.pp-demo .settings-tabs{display:flex;flex-direction:column;gap:2px;position:sticky;top:78px}.pp-demo .settings-tabs button{display:flex;align-items:center;gap:9px;padding:9px 12px;border-radius:var(--r-md);font-size:13px;color:var(--fg-3);text-align:left;transition:background .15s,color .15s}.pp-demo .settings-tabs button:hover{background:var(--bg-2);color:var(--fg-1)}.pp-demo .settings-tabs button.active{background:var(--acc-soft);color:var(--fg-1)}.pp-demo .settings-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 0;border-bottom:1px solid var(--line)}.pp-demo .settings-row:last-child{border-bottom:0}.pp-demo .settings-row .lbl{font-size:13px;font-weight:500}.pp-demo .settings-row .desc{font-size:11.5px;color:var(--fg-3);margin-top:3px;max-width:420px;line-height:1.5}@media (max-width:800px){.pp-demo .settings-grid{grid-template-columns:1fr}.pp-demo .settings-tabs{position:static;flex-direction:row;overflow-x:auto;gap:4px}.pp-demo .settings-tabs button{white-space:nowrap}}@media (min-width:1440px){.pp-demo[data-demo-layout=classic] .shell{grid-template-columns:270px 1fr}.pp-demo[data-demo-layout=futuristic-retro] .shell{grid-template-columns:262px 1fr}.pp-demo .page{padding:28px 36px 110px}.pp-demo[data-demo-layout=minimalist] .page{max-width:1280px;padding:56px 40px 100px}.pp-demo .g-2{grid-template-columns:1.9fr 1fr}.pp-demo .kpis{gap:20px}.pp-demo .settings-grid{grid-template-columns:250px 1fr;gap:32px}}.pp-demo[data-demo-layout=futuristic-retro][data-demo-theme=dark][data-demo-variant=green]{--bg-0:oklch(.16 .028 175);--bg-1:oklch(.20 .034 175);--bg-2:oklch(.235 .038 175);--bg-3:oklch(.28 .042 175);--panel:oklch(.195 .032 175/.78);--panel-2:oklch(.235 .038 175/.8);--line:oklch(.80 .19 158/.38);--line-2:oklch(.80 .19 158/.72);--fg-1:oklch(.93 .13 158);--fg-2:oklch(.84 .16 158);--fg-3:oklch(.70 .14 162);--fg-4:oklch(.58 .11 165);--acc:oklch(.86 .19 158);--acc-2:oklch(.74 .17 160);--acc-soft:oklch(.86 .19 158/.14);--acc-glow:oklch(.86 .19 158/.55);--acc-ink:oklch(.15 .03 175);--pos:oklch(.86 .19 158);--pos-soft:oklch(.86 .19 158/.14);--warn:oklch(.86 .17 92);--warn-soft:oklch(.86 .17 92/.14);--neg:oklch(.72 .21 18);--neg-soft:oklch(.72 .21 18/.16);--info:oklch(.82 .15 200);--info-soft:oklch(.82 .15 200/.14);--shadow:0 0 0 1px oklch(.80 .19 158/.15),0 18px 50px -26px oklch(.80 .19 158/.5);--scan:oklch(.86 .19 158/.03)}.pp-demo[data-demo-layout=futuristic-retro][data-demo-theme=light][data-demo-variant=green]{--bg-0:oklch(.955 .022 95);--bg-1:oklch(.975 .016 95);--bg-2:oklch(.925 .028 95);--bg-3:oklch(.89 .034 90);--panel:oklch(.975 .016 95/.8);--panel-2:oklch(.925 .028 95);--line:oklch(.45 .12 55/.35);--line-2:oklch(.42 .14 50/.85);--fg-1:oklch(.30 .10 55);--fg-2:oklch(.40 .11 55);--fg-3:oklch(.50 .10 58);--fg-4:oklch(.60 .08 62);--acc:oklch(.48 .16 48);--acc-2:oklch(.38 .16 45);--acc-soft:oklch(.48 .16 48/.12);--acc-glow:oklch(.48 .16 48/.28);--acc-ink:oklch(.98 .015 95);--pos:oklch(.44 .14 150);--pos-soft:oklch(.44 .14 150/.12);--warn:oklch(.50 .14 70);--warn-soft:oklch(.50 .14 70/.14);--neg:oklch(.48 .19 25);--neg-soft:oklch(.48 .19 25/.13);--info:oklch(.44 .13 230);--info-soft:oklch(.44 .13 230/.12);--shadow:0 0 0 1px oklch(.48 .16 48/.18),0 10px 26px -18px oklch(.42 .14 50/.5);--scan:oklch(.48 .16 48/.03)}.pp-root .pp-demo-controls{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px 18px;margin-bottom:14px}.pp-root .pp-demo-group{display:flex;align-items:center;gap:8px}.pp-root .pp-demo-group>span{font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-dim)}.pp-root .pp-demo-seg{display:inline-flex;border:2px solid var(--ink)}.pp-root .pp-demo-seg button{padding:6px 12px;font-family:var(--font-mono);font-size:12px;text-transform:uppercase;letter-spacing:.03em}.pp-root .pp-demo-seg button+button{border-left:2px solid var(--ink)}.pp-root .pp-demo-seg button[aria-checked=true]{background:var(--acc);color:var(--acc-ink)}.pp-root .pp-demo-reset{font-family:var(--font-mono);font-size:12px;text-transform:uppercase;text-decoration:underline;text-underline-offset:3px}.pp-root .pp-demo-note{margin:12px 0 0;text-align:center;font-family:var(--font-mono);font-size:11.5px;color:var(--ink-dim)}.pp-root .pp-demo{--demo-h:720px;position:relative;height:var(--demo-h);overflow:hidden;font-family:var(--font-ui);text-align:left;line-height:normal;color:var(--fg-1);background:var(--bg-0)}.pp-root .pp-demo:focus{outline:none}.pp-root .pp-demo .pp-demo-scroll{height:100%;overflow:auto}.pp-root .pp-demo .app{position:static;min-height:100%}.pp-root .pp-demo :is(h1,h2,h3,h4){font-family:inherit;text-wrap:wrap}.pp-root .pp-demo a{color:var(--acc)}@media (max-width:900px){.pp-root .pp-demo{--demo-h:640px}.pp-root .pp-demo .app{padding-top:0}.pp-root .pp-demo .mobile-bar{top:0}}.pp-demo .btn:disabled{opacity:.5;cursor:not-allowed}.pp-demo .demo-form{display:grid;gap:12px}.pp-demo .demo-form label{display:grid;gap:6px;font-size:12px;color:var(--fg-3)}.pp-demo .demo-form input,.pp-demo .demo-form select{border:1px solid var(--line-2);background:var(--bg-2);border-radius:var(--r-sm);padding:9px 11px;color:var(--fg-1);font-size:13.5px;cursor:text;width:100%}.pp-demo .demo-form select{cursor:pointer}.pp-demo .demo-form input:focus-visible,.pp-demo .demo-form select:focus-visible{outline:2px solid var(--acc);outline-offset:1px}.pp-demo .demo-error{color:var(--neg);font-size:12.5px}.pp-demo .demo-summary{display:grid;gap:8px;margin:0}.pp-demo .demo-summary>div{display:flex;justify-content:space-between;gap:12px;font-size:13px}.pp-demo .demo-summary dt{color:var(--fg-3)}.pp-demo .demo-summary dd{margin:0}.pp-demo .demo-modal-scrim{position:absolute;inset:0;z-index:80;display:grid;place-items:center;padding:16px;background:oklch(0 0 0/.55);backdrop-filter:blur(2px)}.pp-demo .demo-modal{width:min(440px,100%);max-height:calc(100% - 32px);overflow:auto;box-shadow:var(--shadow)}