.demo-main{padding-block:48px}.demo-intro{max-width:820px}.demo-intro h1{font-size:clamp(2rem,4vw,3.5rem);line-height:1.1;letter-spacing:-.04em;margin-block:18px}.demo-intro p,.demo-next p{font-size:1.08rem;line-height:1.7;color:#4d6476}.demo-home-link{color:#132b43}.demo-notice{margin-block:24px;padding:14px 20px;border:1px solid #c8e1d8;border-radius:12px;background:#edf7f2;color:#224c3e;font-size:.9rem;line-height:1.6}
.demo-workspace{--demo-bg:#f3f6fa;--demo-surface:#fff;--demo-text:#172e44;--demo-muted:#526579;--demo-border:#d9e2ea;--demo-accent:#067554;--demo-soft:#eaf6f0;--demo-on-soft:#195c43;--demo-input:#fff;border:1px solid var(--demo-border);border-radius:22px;box-shadow:0 24px 80px #142d4415;background:var(--demo-bg);color:var(--demo-text);overflow:hidden}.demo-workspace[data-theme=dark]{--demo-bg:#111d2b;--demo-surface:#1b2b3d;--demo-text:#f0f5fa;--demo-muted:#bdcad8;--demo-border:#3b4e62;--demo-soft:#143c32;--demo-on-soft:#b9efd5;--demo-input:#142335}.demo-workspace[data-palette=blue]{--demo-accent:#1d4ed8;--demo-soft:#eaf0ff;--demo-on-soft:#21449b}.demo-workspace[data-palette=violet]{--demo-accent:#7e22ce;--demo-soft:#f4eafa;--demo-on-soft:#722d95}.demo-workspace[data-theme=dark][data-palette=blue]{--demo-soft:#1b3157;--demo-on-soft:#c1d6ff}.demo-workspace[data-theme=dark][data-palette=violet]{--demo-soft:#39244f;--demo-on-soft:#ecd1ff}.demo-workspace *{box-sizing:border-box}.demo-workspace h2,.demo-workspace h3,.demo-workspace h4,.demo-workspace p{margin-block:0 12px}.demo-workspace h3{font-size:1.05rem;line-height:1.45}.demo-workspace :where(button,input,select){font:inherit}.demo-workspace button{cursor:pointer}.demo-workspace small{font-size:.8rem}.demo-workspace [hidden]{display:none!important}
.demo-appbar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 24px;background:var(--demo-surface);border-block-end:1px solid var(--demo-border)}.demo-shop-brand{display:flex;align-items:center;gap:12px;min-width:0}.demo-shop-brand strong{font-size:.95rem}.demo-shop-brand small{display:block;color:var(--demo-muted);margin-block-start:3px}.demo-brand-mark{display:grid;place-items:center;background:var(--demo-accent);color:#fff;min-width:42px;height:42px;border-radius:12px;font-size:1rem;font-weight:850;letter-spacing:-.05em}.demo-toolbar,#demo-appearance{display:flex;align-items:center;gap:8px}.demo-toolbar select{max-width:105px}#demo-reset{border:1px solid var(--demo-border);padding:9px 13px;border-radius:9px;background:var(--demo-surface);color:var(--demo-text);font-size:.82rem;font-weight:650}.demo-app-layout{display:grid;grid-template-columns:200px minmax(0,1fr)}.demo-sidebar{background:var(--demo-surface);padding:20px 12px;border-inline-end:1px solid var(--demo-border)}#demo-nav{display:grid;gap:5px}#demo-nav .demo-nav-button{display:flex;align-items:center;gap:11px;text-align:start;border:0;border-radius:10px;padding:12px;color:var(--demo-muted);background:transparent;font-size:.88rem;font-weight:650}.demo-nav-icon{width:20px;min-width:20px;text-align:center;font-size:1.15rem}#demo-nav .demo-nav-button[aria-current]{background:var(--demo-soft);color:var(--demo-on-soft)}.demo-guide{margin-block-start:28px;padding:14px 10px;border-block-start:1px solid var(--demo-border)}.demo-guide small{display:block;color:var(--demo-muted);margin-block-end:8px}.demo-guide>strong{display:block;font-size:.85rem;line-height:1.6}.demo-guide progress{width:100%;height:6px;accent-color:var(--demo-accent);margin-block:12px}.demo-guide-link{display:block;border:0;text-align:start;background:transparent;color:var(--demo-muted);font-size:.8rem;line-height:1.6;padding:6px 0;width:100%}.demo-stage{padding:24px;min-width:0;min-height:700px}.demo-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-block-end:14px}.demo-top small{color:var(--demo-muted);font-size:.66rem;font-weight:750;letter-spacing:.12em}.demo-top h2{font-size:1.65rem;letter-spacing:-.035em;margin-block:7px 0}.demo-step{color:var(--demo-muted);font-size:.9rem;line-height:1.7;max-width:780px}#demo-status{color:var(--demo-on-soft);font-size:.9rem;line-height:1.6}#demo-status:empty{display:none}#demo-status:not(:empty){background:var(--demo-soft);padding:12px 16px;border-radius:10px}.demo-error{color:#9d1d30!important;background:#fff1f3!important}#demo-content{display:grid;gap:20px;margin-block-start:22px}
.demo-button{display:inline-flex;justify-content:center;align-items:center;text-align:center;line-height:1.5;gap:7px;border:1px solid transparent;border-radius:9px;padding:10px 14px;background:var(--demo-accent);color:#fff;font-size:.85rem;font-weight:650;min-height:42px;white-space:normal}.demo-button-quiet{border-color:var(--demo-border);background:var(--demo-surface);color:var(--demo-text)}.demo-button:disabled{background:var(--demo-bg);border-color:var(--demo-border);color:var(--demo-muted);cursor:default}.demo-panel{padding:20px;background:var(--demo-surface);border:1px solid var(--demo-border);border-radius:14px;min-width:0}.demo-muted,.demo-panel>p,.demo-empty{color:var(--demo-muted);font-size:.87rem;line-height:1.6}.demo-badge{display:inline-flex;align-items:center;padding:5px 9px;border-radius:6px;color:var(--demo-muted);background:var(--demo-bg);font-size:.73rem;font-weight:650;line-height:1.4}.demo-badge.success{background:var(--demo-soft);color:var(--demo-on-soft)}.demo-badge.warning{background:#fff2db;color:#775015}.demo-summary-row{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding-block:10px;border-block-end:1px solid var(--demo-border);font-size:.86rem;line-height:1.6}.demo-summary-row span{color:var(--demo-muted)}.demo-summary-row strong{text-align:end;overflow-wrap:anywhere}.demo-summary-row:last-of-type{border-block-end:0}.demo-panel>.demo-button{margin-block-start:16px}.demo-panel>.demo-button+.demo-button{margin-inline-start:6px}
.demo-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.demo-stat{position:relative;background:var(--demo-surface);border:1px solid var(--demo-border);border-radius:12px;padding:18px 14px;overflow:hidden}.demo-stat:before{content:'';position:absolute;inset-block-start:0;inset-inline:0;height:3px;background:var(--demo-accent)}.demo-stat small,.demo-stat span{display:block;color:var(--demo-muted);font-size:.75rem;line-height:1.6}.demo-stat strong{display:block;font-size:clamp(1.15rem,2vw,1.65rem);margin-block:8px;letter-spacing:-.025em;overflow-wrap:anywhere}.demo-overview-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:16px}.demo-chart{display:flex;gap:12px;align-items:end;margin-block:24px 14px}.demo-chart-column{flex:1;min-width:0;text-align:center}.demo-chart-column small{display:block;color:var(--demo-muted);font-size:.65rem;white-space:nowrap}.demo-chart-column span{display:block;color:var(--demo-muted);font-size:.65rem;margin-block-start:8px}.demo-chart-track{height:110px;display:flex;align-items:end;margin-block-start:9px;border-block-end:1px solid var(--demo-border)}.demo-chart-bar{width:100%;min-width:8px;background:var(--demo-accent);border-radius:5px 5px 0 0}.demo-overview-grid .demo-panel>small{color:var(--demo-muted);line-height:1.6}.demo-paths{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.demo-paths .demo-panel{display:flex;flex-direction:column}.demo-paths p{flex:1}.demo-history{display:grid;gap:0}.demo-history-row{display:grid;grid-template-columns:100px minmax(0,1fr) auto;align-items:center;gap:14px;border-block-end:1px solid var(--demo-border);padding-block:13px;font-size:.82rem;line-height:1.6}.demo-history-row:last-child{border:0}.demo-history-row>span:not(.demo-badge){overflow-wrap:anywhere}.demo-history-row strong{text-align:end}
.demo-filters{display:flex;gap:12px}.demo-workspace :where(input:not([type=checkbox]),select){border:1px solid var(--demo-border);padding:11px 12px;border-radius:8px;background:var(--demo-input);color:var(--demo-text);min-width:0;max-width:100%;font-size:.88rem}.demo-filters input{flex:1;width:0}.demo-filters select{max-width:200px}.demo-field{display:grid;gap:7px;font-size:.84rem;font-weight:650;margin-block:12px}.demo-field input,.demo-field select{width:100%}.demo-stock-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.demo-product{padding:14px;background:var(--demo-surface);border:1px solid var(--demo-border);border-radius:14px;min-width:0}.demo-product-visual{position:relative;display:flex;justify-content:center;align-items:center;height:160px;background:var(--demo-bg);border-radius:10px;margin-block-end:16px;overflow:hidden}.demo-product-visual>.demo-badge{position:absolute;inset-block-start:9px;inset-inline-start:9px;background:var(--demo-surface);color:var(--demo-text)}.demo-product h3{font-size:.94rem}.demo-product p{font-size:.76rem;color:var(--demo-muted)}.demo-product-price{display:block;font-size:1.2rem;margin-block:10px}.demo-product-meta{display:flex;justify-content:space-between;gap:8px;font-size:.69rem!important}.demo-product-actions{display:flex;flex-wrap:wrap;gap:6px}.demo-product-actions>.demo-button{font-size:.75rem;padding:9px 10px;flex:1}.demo-device{width:67px;height:124px;position:relative;border:3px solid #25394d;border-radius:14px;box-shadow:0 14px 18px #10294026;background:linear-gradient(145deg,#d2f5e6 2%,#338a76 48%,#13344a);overflow:hidden;flex-shrink:0}.demo-device.violet{background:linear-gradient(140deg,#ece4fd,#8a65bc 55%,#253152)}.demo-device.ink{background:linear-gradient(140deg,#9aaec7,#485875 55%,#10283c)}.demo-device.peach{background:linear-gradient(140deg,#ffebdb,#d88b73 55%,#65424a)}.demo-device.blue{background:linear-gradient(140deg,#cdeeff,#4085b1 55%,#142b5b)}.demo-device.pink{background:linear-gradient(140deg,#fce4f4,#cc6aa3 55%,#562449)}.demo-device-island{position:absolute;inset-block-start:6px;inset-inline-start:22px;width:18px;height:5px;border-radius:5px;background:#142436}.demo-device-glow{position:absolute;width:90px;height:90px;border:15px solid #ffffff32;border-radius:50%;inset-block-start:35px;inset-inline-start:18px}.demo-device-line{position:absolute;width:24px;height:3px;inset-block-end:5px;inset-inline-start:18px;background:#fff9;border-radius:3px}.demo-device-detail{max-width:620px}.demo-device-detail>.demo-device{margin-block-end:22px}.demo-device-detail>.demo-badge{margin-block-end:15px}
.demo-sales-form{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:16px;align-items:start}.demo-sale-picker{display:grid;gap:8px}.demo-check{display:flex;align-items:center;gap:10px;padding:12px;border:1px solid var(--demo-border);border-radius:9px;font-size:.84rem;line-height:1.5;margin-block:8px}.demo-check input{width:18px;height:18px;flex-shrink:0;accent-color:var(--demo-accent)}.demo-check span{flex:1}.demo-check strong{font-size:.82rem;text-align:end;white-space:nowrap}.demo-sale-summary{background:var(--demo-bg);padding:12px;border-radius:10px;margin-block:16px}.demo-record{padding:16px;border:1px solid var(--demo-border);border-radius:10px;margin-block-start:12px;font-size:.88rem;line-height:1.65;overflow-wrap:anywhere}.demo-record h4{font-size:.95rem}.demo-record>.demo-button{margin-block-start:10px}.demo-quotes-form{max-width:720px}.demo-quote-preview>.demo-badge{margin-block-end:12px}.demo-clients-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:16px;align-items:start}.demo-avatar{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:10px;background:var(--demo-soft);color:var(--demo-on-soft);font-weight:750;font-size:.8rem;flex-shrink:0}.demo-client-button{display:flex;gap:10px;align-items:center;text-align:start;border:1px solid transparent;border-radius:10px;padding:12px 8px;background:transparent;color:var(--demo-text);width:100%;font-size:.82rem;margin-block:4px}.demo-client-button[aria-current]{background:var(--demo-soft);border-color:var(--demo-border)}.demo-client-button>span:nth-child(2){flex:1;min-width:0}.demo-client-button strong{text-align:end;font-size:.8rem}.demo-clients-layout .demo-panel>h3{margin-block:12px}.demo-payment-form{margin-block:20px}.demo-repair-form .demo-panel{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 16px;align-items:end}.demo-repair-form h3{grid-column:1/-1}.demo-repair-form .demo-button{justify-self:start}.demo-repairs-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}.demo-repairs-list h3{margin-block:12px}.demo-repair-stages{list-style:none;display:flex;flex-wrap:wrap;gap:8px;padding:0;margin-block:22px}.demo-repair-stages li{font-size:.7rem;line-height:1.5;padding:5px 8px;border:1px solid var(--demo-border);border-radius:6px;color:var(--demo-muted)}.demo-repair-stages li.complete{background:var(--demo-soft);color:var(--demo-on-soft)}.demo-repair-stages li[aria-current]{border-color:var(--demo-on-soft);font-weight:750}.demo-agenda-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.demo-next{margin-block-start:42px;max-width:800px}.demo-footer{padding-block:28px}.demo-page button:focus-visible,.demo-page input:focus-visible,.demo-page select:focus-visible{outline:3px solid #568fe4;outline-offset:3px}.demo-top h2:focus{outline:0}
.demo-workspace input::placeholder{color:var(--demo-muted);opacity:1}
@media(min-width:1400px){.demo-main.mkt-shell{max-width:1320px}}
@media(max-width:1050px){.demo-app-layout{grid-template-columns:170px minmax(0,1fr)}.demo-stage{padding:18px}.demo-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.demo-stock-list{grid-template-columns:repeat(2,minmax(0,1fr))}.demo-overview-grid,.demo-sales-form,.demo-clients-layout{grid-template-columns:1fr}.demo-paths{grid-template-columns:1fr}.demo-repair-form .demo-panel{grid-template-columns:1fr}.demo-chart-column small{font-size:.6rem}.demo-toolbar{flex-wrap:wrap;justify-content:end}}
@media(max-width:700px){.demo-main{padding-block:28px}.demo-appbar{padding:16px;align-items:start;flex-direction:column;gap:14px}.demo-toolbar{width:100%;justify-content:space-between;gap:8px}.demo-toolbar #demo-reset{font-size:.72rem;padding:10px}.demo-toolbar .demo-button{font-size:.72rem;padding:8px 10px}.demo-toolbar select{font-size:.75rem;padding:8px;max-width:92px}.demo-app-layout{grid-template-columns:1fr}.demo-sidebar{padding:12px;border-inline-end:0;border-block-end:1px solid var(--demo-border)}#demo-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}#demo-nav .demo-nav-button{padding:10px 5px;flex-direction:column;gap:5px;font-size:.7rem;text-align:center;line-height:1.4;min-height:62px}.demo-nav-icon{font-size:1rem}.demo-guide{margin-block:12px 0;padding:12px 6px 2px;display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px}.demo-guide small{margin:0}.demo-guide>strong{font-size:.74rem}.demo-guide progress{height:5px;margin:0;flex:1;min-width:45px}.demo-guide-link{display:none}.demo-stage{padding:18px 14px;min-height:550px}.demo-top{align-items:start}.demo-top h2{font-size:1.45rem}.demo-top small{font-size:.58rem;letter-spacing:.08em}.demo-top .demo-button{font-size:.74rem;padding:9px 10px;max-width:125px}.demo-step{font-size:.83rem}.demo-panel{padding:16px}.demo-stats{gap:10px}.demo-stat{padding:15px 12px}.demo-stat small{font-size:.7rem}.demo-stat strong{font-size:1.25rem}.demo-chart{gap:6px}.demo-chart-column small{font-size:.57rem}.demo-chart-column span{font-size:.58rem}.demo-chart-track{height:100px}.demo-history-row{grid-template-columns:minmax(0,1fr) auto;gap:8px}.demo-history-row>.demo-badge{justify-self:start}.demo-history-row>span:not(.demo-badge){grid-column:1/-1;grid-row:2}.demo-history-row>strong{grid-column:2;grid-row:1}.demo-product{padding:12px}.demo-product-visual{height:145px}.demo-product-meta{flex-direction:column;gap:4px}.demo-product-actions{flex-direction:column}.demo-stock-list{gap:10px}.demo-product h3{font-size:.82rem}.demo-product p{font-size:.69rem}.demo-product-actions .demo-button{font-size:.69rem;padding:8px}.demo-filters{flex-direction:column}.demo-filters input{width:100%;flex:auto}.demo-filters select{max-width:100%;width:100%}.demo-check{padding:10px;font-size:.79rem}.demo-check strong{font-size:.77rem}.demo-repairs-list,.demo-agenda-list{grid-template-columns:1fr}.demo-home-link{display:none}}
@media(prefers-reduced-motion:no-preference){.demo-product .demo-device{transition:transform .2s ease}.demo-product:hover .demo-device{transform:translateY(-4px)}.demo-chart-bar{transition:height .2s ease}}

.demo-workspace button.demo-button{font-size:.85rem;font-weight:650}.demo-workspace button.demo-guide-link{font-size:.8rem}.demo-workspace button.demo-client-button{font-size:.82rem}.demo-workspace .demo-product button.demo-button{font-size:.75rem}
@media(max-width:700px){.demo-workspace .demo-toolbar button.demo-button,.demo-workspace #demo-top-actions button.demo-button{font-size:.72rem}.demo-workspace .demo-product button.demo-button{font-size:.69rem}}