/* Dark analytical workspaces, matching the supplied violet/cyan reference. */
.template-demo-page{--nx-base:#0d0b18;--nx-surface:#171327;--nx-raised:#211b34;--nx-line:#342b49;--nx-text:#f1edf9;--nx-muted:#b0a7c3;--nx-purple:#ae82ff;--nx-cyan:#33dfd0;--nx-pink:#f574bf;--px-accent:#ae82ff!important;--px-ink:#f1edf9!important;--px-bg:#171327!important;color:var(--nx-text);background:radial-gradient(ellipse at 80% 0%,#27134180,transparent 55%),var(--nx-base);color-scheme:dark;font-size:14px}
.template-demo-page .px-app{--px-accent:#ae82ff!important;--px-ink:#f1edf9!important;--px-bg:#211b34!important;display:grid;grid-template-columns:192px minmax(0,1fr);max-width:1680px;margin:0 auto;align-items:start;min-height:calc(100vh - 195px)}
.template-demo-page[data-demo="orbit"],.template-demo-page[data-demo="care"]{--nx-purple:#54d6d3;--nx-cyan:#a58bff}.template-demo-page[data-demo="agenda"]{--nx-purple:#f574bf;--nx-cyan:#b291ff}.template-demo-page[data-demo="commerce"],.template-demo-page[data-demo="stock"]{--nx-purple:#6fafff;--nx-cyan:#4ce0c3}
.template-demo-page .demo-bar{height:48px;border-color:var(--nx-line);background:#100d1de8;font-size:12px;padding:0 28px}.template-demo-page .demo-bar>span{font-size:11px;letter-spacing:1.3px;color:#d7c9f0}.template-demo-page .demo-bar b{background:#2c2045;color:#c9a9ff;font-size:10px}.template-demo-page .demo-bar a:last-child{color:#c9a9ff}.template-demo-page .demo-skip{background:#352551;color:white}.template-demo-page .demo-intro{margin:0 auto;padding:24px 28px 22px 220px;max-width:1680px;align-items:center;gap:30px}.template-demo-page .demo-intro>div>span{font-size:11px;letter-spacing:1.2px;color:var(--nx-muted);opacity:1}.template-demo-page .demo-intro h1{font-size:28px;letter-spacing:-1px;line-height:1.2;margin-top:8px;font-weight:600}.template-demo-page .demo-intro>p{font-size:12px;color:var(--nx-muted);opacity:1;max-width:300px;line-height:1.6}.template-demo-page .demo-foot{max-width:1680px;margin:auto;padding:22px 28px 22px 220px;font-size:11px;color:var(--nx-muted);opacity:1}.template-demo-page .demo-foot a{color:#d4b9fa}.template-demo-page .demo-foot>a:first-child{font-size:19px}
/* Navigation stays out of the data grid. */
.template-demo-page .px-sidebar{position:sticky;top:20px;display:flex;flex-direction:column;align-items:stretch;gap:0;background:#120e20;border:1px solid #2c2340;border-left:0;border-radius:0 12px 12px 0;padding:25px 18px;min-height:580px;align-self:start}.template-demo-page .px-brand{display:block;color:#f7f3ff;font-size:23px;letter-spacing:-1px;white-space:nowrap}.template-demo-page .px-brand span{color:#c6a6f8}.template-demo-page .px-brand sup{color:var(--nx-cyan)}.template-demo-page .px-product-name{display:block;margin:30px 0 20px}.template-demo-page .px-product-name>span{display:block;color:#fff;font-size:17px}.template-demo-page .px-product-name small{display:block;font-size:12px;color:var(--nx-muted);margin-top:7px}.template-demo-page .px-sidebar nav{display:flex;flex-direction:column;align-items:stretch;justify-content:start;gap:7px;border:0;flex:0;margin:0 0 24px}.template-demo-page .px-sidebar nav button{display:flex;align-items:center;gap:8px;padding:13px 10px;white-space:normal;min-height:44px;color:#b5aac8;font-size:12px;line-height:1.45;text-align:left;opacity:1;border:1px solid transparent!important;border-radius:7px;background:transparent;box-shadow:none}.template-demo-page .px-sidebar nav button::before{content:'';height:6px;width:6px;flex-shrink:0;border:1px solid currentColor;border-radius:2px}.template-demo-page .px-sidebar nav button[aria-pressed=true]{border-color:#66468d!important;background:linear-gradient(90deg,#54317970,#2b204140);color:#e7d6ff;box-shadow:inset 2px 0 #b18aff}.template-demo-page .px-sidebar nav button:hover{background:#2a203d}.template-demo-page .px-sidebar nav b{font-size:10px;min-width:16px;border-radius:4px;background:#3a2754;color:#d2b5fa;margin-left:auto;padding:1px 4px}.template-demo-page .px-side-foot{display:flex;flex-direction:column;align-items:stretch;gap:8px;margin-top:auto;padding-top:30px;border-top:1px solid #2c2340}.template-demo-page .px-side-foot button{color:#b9accd;font-size:12px;text-align:left;padding:8px 0;white-space:normal}.template-demo-page .px-side-foot small{display:block;color:#9d90b4;font-size:11px;line-height:1.6;margin-top:8px}.template-demo-page .px-template-switch,.template-demo-page .px-legacy{display:none}
.template-demo-page .px-main{background:transparent}.template-demo-page .px-topbar{padding:0 28px 18px;background:none;align-items:center;min-height:44px}.template-demo-page .px-topbar>span{font-size:18px;font-weight:500;letter-spacing:-.5px;color:#e5dfee}.template-demo-page .px-topbar small{display:none}.template-demo-page .px-btn{background:linear-gradient(110deg,#8e57e5,#ab6ce7);border:1px solid #b37ded;box-shadow:0 5px 20px #8e57e522;color:white;font-size:12px;border-radius:7px;min-height:40px;padding:10px 16px}.template-demo-page .px-btn:hover{background:#a66ce9;box-shadow:0 5px 24px #8e57e540}.template-demo-page .px-btn.secondary{background:#251d36;border-color:#574266;color:#e2d0f8;box-shadow:none}.template-demo-page .px-content{padding:0 28px 0}.template-demo-page .px-status:not(:empty){background:#241c38;border-left-color:var(--nx-cyan);color:#dbf8f2;margin-bottom:18px;font-size:13px}.template-demo-page .px-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;border:0;background:none;margin:0 0 20px}.template-demo-page .px-metrics article,.template-demo-page .px-metrics article+article{position:relative;overflow:hidden;isolation:isolate;padding:20px 22px;border:1px solid #4a3565;border-radius:10px;background:linear-gradient(125deg,#392150,#1d1730);box-shadow:0 4px 20px #00000018;--metric-color:#b989ff}.template-demo-page .px-metrics article:nth-child(2){background:linear-gradient(125deg,#12383f,#151e2e);border-color:#225155;--metric-color:#41dccc}.template-demo-page .px-metrics article:nth-child(3){background:linear-gradient(125deg,#3e203b,#21172d);border-color:#5a3151;--metric-color:#f174bd}.template-demo-page .px-metrics article>span:first-child{display:block;font-size:12px;color:#d4c9e4;opacity:1;position:relative;z-index:2}.template-demo-page .px-metrics strong{font-size:clamp(23px,2.25vw,35px);letter-spacing:-1px;font-weight:600;line-height:1.3;margin-top:9px;color:#fff;position:relative;z-index:2}.nx-metric-mark{position:absolute;right:18px;bottom:18px;display:flex;align-items:end;gap:4px;height:30px;opacity:.5;z-index:-1}.nx-metric-mark i{width:5px;background:var(--metric-color);border-radius:2px;box-shadow:0 0 12px var(--metric-color)}.nx-metric-mark i:nth-child(1){height:25%}.nx-metric-mark i:nth-child(2){height:40%}.nx-metric-mark i:nth-child(3){height:32%}.nx-metric-mark i:nth-child(4){height:65%}.nx-metric-mark i:nth-child(5){height:50%}.nx-metric-mark i:nth-child(6){height:90%}
/* Charts use actual values from the interactive example data. */
.nx-overview{background:linear-gradient(130deg,#1d1630,#141123);border:1px solid #352843;border-radius:10px;padding:20px 24px 14px;margin-bottom:20px;overflow:hidden}.nx-chart-header{display:flex;justify-content:space-between;align-items:center;gap:20px}.nx-chart-header>div>span{font-size:10px;letter-spacing:1.6px;color:#aa95c8}.nx-chart-header h3{font-size:15px;font-weight:600;margin:6px 0 0;color:#ebe5f5;letter-spacing:-.2px}.nx-unit{font-size:11px;border:1px solid #4b365e;border-radius:5px;color:#baa7d3;padding:5px 9px}.nx-bars{height:149px;display:flex;gap:18px;align-items:stretch;padding-top:18px;background:repeating-linear-gradient(0deg,transparent 0,transparent 31px,#33264560 32px,#33264560 33px);margin-top:8px}.nx-bar-item{min-width:0;flex:1;display:flex;flex-direction:column;align-items:center;gap:9px}.nx-bar-track{position:relative;min-height:0;width:100%;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:end;gap:7px}.nx-bar-track>i{display:block;height:calc(var(--bar-size) * .72);min-height:2px;width:clamp(12px,4vw,42px);background:linear-gradient(0deg,color-mix(in srgb,var(--bar-color) 35%,transparent),var(--bar-color));border-top:2px solid var(--bar-color);box-shadow:0 -3px 20px color-mix(in srgb,var(--bar-color) 20%,transparent);border-radius:4px 4px 0 0}.nx-bar-track>span{font-size:12px;color:var(--bar-color);font-weight:600;white-space:nowrap}.nx-bar-item>b{font-size:11px;line-height:1.3;font-weight:400;color:#bbaecc;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}.nx-chart-note{font-size:11px;line-height:1.5;color:#ad9bbc;margin:12px 0 0}.nx-line svg{display:block;width:100%;height:140px;filter:drop-shadow(0 0 5px #aa70ef20)}.nx-line-labels{display:flex;justify-content:space-between;gap:16px}.nx-line-labels>div{display:flex;gap:10px;align-items:center}.nx-line-labels span{font-size:11px;color:#a89abb}.nx-line-labels b{font-size:12px;color:#ddc9fa;font-weight:500}
/* All existing working panels inherit the same dark surfaces. */
.template-demo-page .ix-dashboard{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:20px;margin:0}.template-demo-page .ix-panel{background:#171226;border:1px solid #352843;border-radius:10px;box-shadow:0 5px 20px #00000012;padding:22px;max-height:none;overflow:visible;color:#eee7fa}.template-demo-page .ix-panel h3{font-size:15px;margin-bottom:19px;color:#efebf9;font-weight:600}.template-demo-page .ix-panel p{color:#b9accb;opacity:1;font-size:12px;line-height:1.7}.template-demo-page .ix-pick{background:transparent;color:#e7def3;border-color:#392b49}.template-demo-page .ix-pick:hover{background:#2a1e3d}.template-demo-page .ix-pick strong,.template-demo-page .ix-approval strong{font-size:13px;color:#f0eafb}.template-demo-page .ix-pick small,.template-demo-page .ix-approval small{font-size:12px;color:#b3a4c7}.template-demo-page .ix-approval{border-color:#342740;padding:10px 0}.template-demo-page .ix-approval>b{color:#dcbbff;font-size:13px}.template-demo-page .ix-action{font-size:12px;color:#d5b3ff;background:#392253;border:1px solid #654189;border-radius:6px;min-height:36px;padding:8px 11px}.template-demo-page .ix-action:hover{background:#50316e}.template-demo-page .ix-ring{background:conic-gradient(#b77cff var(--progress),#34223f 0);box-shadow:0 0 25px #b77cff12;width:140px;height:140px;padding:8px;margin:10px auto}.template-demo-page .ix-ring>div{background:#171226}.template-demo-page .ix-ring strong{color:#fff}.template-demo-page .ix-ring span{font-size:12px;color:#b9a8cb}.template-demo-page .ix-ring-layout{gap:20px;flex-wrap:nowrap}.template-demo-page .ix-ring-layout>div:last-child{min-width:120px;flex:1}.template-demo-page .ix-bar{color:#b9aacd;font-size:12px;gap:10px;grid-template-columns:minmax(80px,.7fr) minmax(40px,1fr) auto;margin:18px 0}.template-demo-page .ix-bar b{font-size:12px;color:#e0d3ef;font-weight:500}.template-demo-page .ix-bar>div{background:#30223f;height:6px;border-radius:20px}.template-demo-page .ix-bar i{background:linear-gradient(90deg,#7852d4,#c186fb);border-radius:20px;box-shadow:0 0 12px #b178ff20}.template-demo-page .ix-bar:nth-of-type(3n+2) i{background:linear-gradient(90deg,#168d95,#37dfcf)}.template-demo-page .ix-bar:nth-of-type(3n+3) i{background:linear-gradient(90deg,#ae448d,#f58abf)}.template-demo-page .ix-note{background:#251a38;border:1px solid #413051;border-radius:6px;padding:14px}.template-demo-page .ix-note strong{font-size:13px;color:#dec7f8}.template-demo-page .ix-note p{font-size:12px;color:#bdaacb}.template-demo-page .ix-big{color:#c79dff;font-size:34px;letter-spacing:-1px}.template-demo-page .ix-big small{color:#baa6cb;font-size:14px;letter-spacing:0}.template-demo-page .ix-avatar{background:linear-gradient(135deg,#7753aa,#333158);color:#eee0ff;border:1px solid #8e64bc}.template-demo-page .ix-timeline .ix-pick{border-color:#352844}.template-demo-page .ix-sectors span{background:#251a37;border-color:#4b3260;color:#c6b1d7}.template-demo-page .ix-sectors b{color:#40d8ce}.template-demo-page .ix-roadmap i{border-color:#b180e5;background:#322145}.template-demo-page .ix-roadmap i.done{background:#41dccc}.template-demo-page .ix-funnel>div{background:linear-gradient(100deg,#594080,#36224e);color:#f0ddff;border-color:#765393}.template-demo-page .ix-funnel>div:nth-child(2){background:linear-gradient(100deg,#445890,#273859)}.template-demo-page .ix-funnel>div:nth-child(3){background:linear-gradient(100deg,#245b6a,#163f4a)}.template-demo-page .ix-funnel>div:nth-child(4){background:linear-gradient(100deg,#2e7665,#22483c)}.template-demo-page .ix-team em{color:#bb97dd}.template-demo-page .ix-dayplan>div{border-color:#352645}.template-demo-page .ix-dayplan>div>span{background:linear-gradient(90deg,#a879f5,#ee82c9);opacity:.7}.template-demo-page .ix-columns .ix-pair i:first-child{background:linear-gradient(0deg,#168d9e55,#3cd9cb)}.template-demo-page .ix-columns .ix-pair i:last-child{background:linear-gradient(0deg,#8e3b7755,#f282c2)}.template-demo-page .ix-columns strong{color:#e4d4f6}.template-demo-page .ix-columns small{color:#bba8cb}.template-demo-page .ix-docs .ix-pick{background:#251a35;border:1px solid #4b315e}.template-demo-page .ix-document-icon{background:#3c2555;color:#cca2fc;border-color:#8253ae}.template-demo-page .ix-docs em{color:#55ddca}.template-demo-page .ix-schedule section{border-color:#3a294c}.template-demo-page .ix-schedule h4{color:#dfc8f7;font-size:13px}.template-demo-page .ix-slots{height:235px;background:repeating-linear-gradient(transparent 0,transparent 38px,#39284760 38px,#39284760 39px)}.template-demo-page .ix-slot{background:#522746;color:#fad4f0;border-left:3px solid #ed80c1;box-shadow:0 2px 10px #0002}.template-demo-page .ix-slot strong,.template-demo-page .ix-slot small{color:inherit}.template-demo-page .ix-schedule section:nth-child(2) .ix-slot{background:#303050;border-color:#ac8afe;color:#e2d4ff}.template-demo-page .ix-schedule section:nth-child(3) .ix-slot{background:#153e42;border-color:#45d8cf;color:#c2fff6}.template-demo-page .ix-hours{color:#bbaccb;opacity:.7}.template-demo-page .salon-brand-note{background:#291d36}.template-demo-page .ix-stock-map .ix-pick{background:#221a34;border:1px solid #402d54;border-radius:7px}.template-demo-page .ix-stock-state{color:#50dfc5;background:#1c403c}.template-demo-page .ix-stock-state.warn{color:#ffbf7d;background:#44321f}.template-demo-page .ix-stock-map b{color:#dac0fd}.template-demo-page .ix-order-lanes section{background:#221a33;border:1px solid #3a294b}.template-demo-page .ix-order-lanes h4{color:#c1a4df;font-size:12px}.template-demo-page .ix-order-lanes h4 b{color:#4bdfd1}.template-demo-page .ix-order-lanes .ix-pick{background:#181125;border:1px solid #47315c;border-radius:6px;box-shadow:none}.template-demo-page .ix-order-lanes .ix-pick b{color:#c69afb;font-size:12px}.template-demo-page .ix-product-mini img{height:140px;opacity:.85}.template-demo-page .ix-channels .ix-pick{background:#261b38;border:1px solid #493159}.template-demo-page .ix-channels strong{color:#b98aff}.template-demo-page .ix-channels .ix-pick:nth-child(2) strong{color:#43dfd2}.template-demo-page .ix-channels .ix-pick:nth-child(3) strong{color:#f782c6}.template-demo-page .ix-channels span,.template-demo-page .ix-channels small{color:#bcabcf}.template-demo-page .ix-channels em{color:#c1b0d2}.template-demo-page .ix-panel blockquote{color:#e3d1f7;font-size:15px}.template-demo-page .ix-tickets .ix-pick{border-color:#392946}.template-demo-page .ix-priority{background:#2e2542;color:#cbb1e8}.template-demo-page .ix-priority.urgent{background:#4c233b;color:#ff97bf}.template-demo-page .ix-automations article{background:#241a34;border:1px solid #443055;padding:15px}.template-demo-page .ix-node-track span{border-color:#684784;color:#b79ccf;font-size:11px;padding:12px 4px}.template-demo-page .ix-node-track span.active{background:#4c2b6e;color:#e5c9ff;border-color:#a270d0;box-shadow:0 0 14px #a875ed15}.template-demo-page .ix-automations em{color:#54dcca}
/* Forms, lists and interaction states are dark too. */
.template-demo-page :is(.px-visual,.px-records,.px-activity,.px-detail){background:#181226;border:1px solid #433052;border-radius:10px;color:#e8def3;box-shadow:none}.template-demo-page .px-visual{padding:20px;margin-top:20px}.template-demo-page .px-focus{background:none}.template-demo-page .px-focus strong{color:#cd9dff;font-size:54px;font-weight:400;text-shadow:0 0 30px #a767de35}.template-demo-page .px-focus p,.template-demo-page .px-focus small{color:#b4a0c5}.template-demo-page .px-focus h4{color:#e7d2f7;font-size:20px}.template-demo-page :is(input,select,textarea){color:#f0e6fa!important;background:#21182f!important;border:1px solid #614575!important;border-radius:6px;font-size:14px!important;padding:10px;accent-color:#b483f9}.template-demo-page input::placeholder,.template-demo-page textarea::placeholder{color:#ab95bf}.template-demo-page :is(input,select,textarea):focus{border-color:#ae82ff!important}.template-demo-page .px-detail{padding:25px;max-width:100%;margin:0}.template-demo-page .ix-editor-page{padding:0 28px 20px}.template-demo-page .px-detail-heading h3{color:#efddff;font-size:25px}.template-demo-page .px-detail-heading>span,.template-demo-page .px-editor-guide{color:#b6a2c9}.template-demo-page .px-detail label{color:#d6c2e7;font-size:13px}.template-demo-page .px-form-title{color:#cfadee;font-size:14px}.template-demo-page .px-icon-button{color:#c8a8e7}.template-demo-page .px-field-value{background:#241832;color:#e2c9f5;border-color:#4e3260}.template-demo-page .px-form-error{color:#ffa8b8}.template-demo-page .px-action-box{border-color:#4b345c}.template-demo-page .px-action-box>small{color:#bea5ce}.template-demo-page .px-badge{background:#342342;color:#d5b9ec;border-color:#624377}.template-demo-page .px-row{background:transparent;border-color:#3b294b;color:#e1d1ef}.template-demo-page .px-row.selected,.template-demo-page .px-row:hover{background:#2c1d3b}.template-demo-page .px-row small{color:#bba4cb}.template-demo-page .px-monogram{background:#3e2656;color:#d6b0ff;border-color:#61447a}.template-demo-page .px-row-value{color:#c6a0ec}.template-demo-page .px-section-heading h3,.template-demo-page .px-activity h3{color:#efdefc;font-size:17px}.template-demo-page .px-activity article{background:#251a35;border-color:#4a315b}.template-demo-page .px-activity article>span{color:#54dcca}.template-demo-page .px-activity p{color:#bc9fd0}.template-demo-page .px-feature-title h4{color:#ead2fb}.template-demo-page .px-chart .px-grid{stroke:#50315f}.template-demo-page .px-chart .px-line{stroke:#bd8cff;filter:drop-shadow(0 0 5px #b77cfb40)}.template-demo-page .px-chart .px-area{fill:#a565e51c}.template-demo-page .px-chart circle{fill:#50e2d3}.template-demo-page .px-axis span{color:#b99ecf}.template-demo-page .px-axis b{color:#e3c6fb}.template-demo-page button:disabled{opacity:.42}.template-demo-page :focus-visible{outline:2px solid #51e7d6;outline-offset:4px}
@media(min-width:1600px){.template-demo-page .px-content,.template-demo-page .px-topbar{max-width:none}.nx-bars{height:165px}}
@media(max-width:1100px){.template-demo-page .px-app{grid-template-columns:165px minmax(0,1fr)}.template-demo-page .demo-intro{padding-left:187px}.template-demo-page .demo-foot{padding-left:187px}.template-demo-page .px-sidebar{padding:22px 13px;min-height:560px}.template-demo-page .px-brand{font-size:21px}.template-demo-page .px-sidebar nav{flex-basis:auto}.template-demo-page .px-sidebar nav button{font-size:11px;padding:11px 8px}.template-demo-page .px-side-foot{margin-left:0}.template-demo-page .px-content{padding:0 22px}.template-demo-page .px-topbar{padding:0 22px 18px}.template-demo-page .ix-editor-page{padding:0 22px 20px}.template-demo-page .px-metrics{gap:12px}.template-demo-page .px-metrics article,.template-demo-page .px-metrics article+article{padding:17px}.template-demo-page .px-metrics strong{font-size:25px}.template-demo-page .ix-dashboard{grid-template-columns:1fr 1fr;gap:16px}.template-demo-page .ix-ring-layout{display:block}.template-demo-page .ix-panel{padding:19px}.template-demo-page .ix-bar{grid-template-columns:minmax(65px,.8fr) minmax(35px,1fr) auto;font-size:11px}.nx-line-labels>div{display:block}.nx-line-labels b{display:block;margin-top:5px}}
@media(max-width:760px){.template-demo-page .demo-bar{padding:0 5%;font-size:11px}.template-demo-page .demo-bar>span{font-size:0}.template-demo-page .demo-bar b{font-size:9px}.template-demo-page .demo-intro{padding:22px 5% 20px;display:block}.template-demo-page .demo-intro h1{font-size:26px;letter-spacing:-.8px}.template-demo-page .demo-intro>p{font-size:12px;margin-top:10px;max-width:100%}.template-demo-page .px-app{display:block;min-height:0}.template-demo-page .px-sidebar{position:static;min-height:0;margin:0 5% 20px;padding:0;background:transparent;border:0;border-radius:0;display:block}.template-demo-page .px-brand,.template-demo-page .px-product-name,.template-demo-page .px-side-foot small{display:none}.template-demo-page .px-sidebar nav{flex-direction:row;overflow-x:auto;gap:6px;margin-bottom:0;justify-content:space-between}.template-demo-page .px-sidebar nav button{font-size:11px;white-space:nowrap;padding:11px 9px;min-height:44px;min-width:0;flex:1;justify-content:center;text-align:center;line-height:1.4}.template-demo-page .px-sidebar nav button::before{display:none}.template-demo-page .px-sidebar nav b{margin-left:3px}.template-demo-page .px-side-foot{border:0;flex-direction:row;justify-content:end;margin:0;padding:10px 0 0;gap:22px}.template-demo-page .px-side-foot button{font-size:11px;min-height:30px;padding:2px 0}.template-demo-page .px-topbar{padding:0 5% 16px;gap:12px}.template-demo-page .px-topbar>span{font-size:17px}.template-demo-page .px-topbar .px-btn{font-size:11px;min-height:42px;padding:10px 12px;max-width:160px}.template-demo-page .px-content{padding:0 5%}.template-demo-page .px-metrics{gap:8px;margin-bottom:16px}.template-demo-page .px-metrics article,.template-demo-page .px-metrics article+article{padding:14px 11px;border-radius:8px}.template-demo-page .px-metrics article>span:first-child{font-size:11px;line-height:1.4}.template-demo-page .px-metrics strong{font-size:clamp(19px,5vw,28px);letter-spacing:-.7px}.nx-metric-mark{right:10px;bottom:10px;height:19px;gap:3px;opacity:.3}.nx-metric-mark i{width:3px}.nx-overview{padding:18px 17px 13px;margin-bottom:16px;border-radius:8px}.nx-chart-header h3{font-size:14px;line-height:1.5}.nx-chart-header>div>span{font-size:9px}.nx-bars{gap:9px;height:135px;padding-top:13px}.nx-bar-track>span{font-size:10px}.nx-bar-item>b{font-size:10px}.nx-bar-track>i{width:25px}.nx-chart-note{font-size:11px;line-height:1.6}.nx-line-labels{gap:9px}.nx-line-labels b{font-size:10px}.nx-line-labels span{font-size:10px}.nx-line svg{height:120px}.template-demo-page .ix-dashboard{grid-template-columns:1fr;gap:16px}.template-demo-page .ix-panel{padding:20px;border-radius:8px}.template-demo-page .ix-ring-layout{display:flex;gap:20px}.template-demo-page .ix-ring{width:132px;height:132px;flex-shrink:0}.template-demo-page .ix-bar{font-size:12px}.template-demo-page .ix-approval>.ix-pick{min-width:100px}.template-demo-page .ix-approval strong{font-size:13px}.template-demo-page .ix-slots{height:280px}.template-demo-page .ix-slot strong{font-size:11px}.template-demo-page .ix-product-mini img{height:120px}.template-demo-page .ix-editor-page{padding:0 5% 20px}.template-demo-page .px-detail{padding:20px}.template-demo-page .px-search input,.template-demo-page .px-search select{font-size:14px!important}.template-demo-page .demo-foot{padding:25px 5%;font-size:11px;gap:14px}.template-demo-page .demo-foot>span{font-size:11px}.template-demo-page .px-visual{padding:18px}.template-demo-page .px-btn{font-size:12px!important}.template-demo-page .ix-node-track span{font-size:10px}}
@media(max-width:380px){.template-demo-page .px-sidebar nav button{font-size:10px;padding:10px 6px}.template-demo-page .px-metrics{grid-template-columns:1fr}.template-demo-page .px-metrics article,.template-demo-page .px-metrics article+article{display:flex;align-items:center;justify-content:space-between;padding:13px 15px}.template-demo-page .px-metrics strong{font-size:24px;margin:0}.template-demo-page .px-metrics article>span:first-child{max-width:50%;font-size:12px}.nx-metric-mark{display:none}.template-demo-page .ix-ring-layout{flex-wrap:wrap}.template-demo-page .ix-ring-layout>div:last-child{min-width:100%}}

.nx-opening{font-size:11px;color:#baa7d3;display:grid;gap:5px;flex-shrink:0}.template-demo-page .nx-opening input{width:132px;border:1px solid #4b365e;border-radius:5px;padding:7px 9px;background:#211b34;color:#f1edf9;font:inherit;font-size:13px}@media(max-width:760px){.nx-chart-header{gap:12px;flex-wrap:wrap}.nx-opening{margin:6px 0}.template-demo-page .nx-opening input{width:122px}}