@import"https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap";:root{--navy-50: #EEF1F6;--navy-100: #D6DCE7;--navy-200: #AEB9CD;--navy-300: #8593B0;--navy-400: #5C6E94;--navy-500: #3A4F78;--navy-600: #283C61;--navy-700: #1E2D4D;--navy-800: #182440;--navy-900: #111B30;--gray-50: #F7F8FA;--gray-100: #EFF1F4;--gray-200: #E2E6EC;--gray-300: #CBD2DB;--gray-400: #9AA4B2;--gray-500: #6B7787;--gray-600: #4D5867;--gray-700: #38414E;--gray-800: #252C36;--gray-900: #161B22;--teal-50: #E7F6F3;--teal-100: #C4EAE3;--teal-200: #93D8CC;--teal-300: #5CC4B3;--teal-400: #1FB5A1;--teal-500: #0B8073;--teal-600: #096A5F;--teal-700: #07564D;--teal-800: #064640;--teal-900: #053730;--coral-400: #FF8566;--coral-500: #F2563A;--coral-600: #D8442B;--coral-700: #B5371F;--azure-400: #36B5F0;--azure-500: #0E84C4;--azure-600: #0A6CA3;--azure-700: #085684;--success-50: #E9F7EF;--success-500: #1FA855;--success-600: #15803D;--success-700: #136C34;--warning-50: #FBF1E0;--warning-500: #F59E0B;--warning-600: #B45309;--warning-700: #92400E;--error-50: #FBEAEA;--error-500: #EF4444;--error-600: #DC2626;--error-700: #B91C1C;--info-50: #E9F0FD;--info-500: #3B82F6;--info-600: #2563EB;--info-700: #1D4ED8;--bg: #FAFAFA;--white: #FFFFFF;--color-brand: var(--navy-700);--color-brand-hover: var(--navy-800);--color-brand-active: var(--navy-900);--color-accent: var(--teal-500);--color-accent-hover: var(--teal-600);--color-accent-active: var(--teal-700);--color-accent-bright: var(--teal-400);--color-accent-subtle: var(--teal-50);--surface-page: var(--bg);--surface-card: var(--white);--surface-sunken: var(--gray-50);--surface-hover: var(--gray-100);--text-strong: var(--navy-900);--text-body: var(--navy-800);--text-secondary: var(--gray-500);--text-muted: var(--gray-400);--text-on-brand: var(--white);--text-on-accent: var(--white);--text-link: var(--teal-500);--border-subtle: var(--gray-200);--border-default: var(--gray-300);--border-strong: var(--navy-700);--border-focus: var(--teal-500);--ring-accent: 0 0 0 3px rgba(11, 128, 115, .32);--ring-brand: 0 0 0 3px rgba(30, 45, 77, .28);--ring-error: 0 0 0 3px rgba(220, 38, 38, .28)}:root{--font-sans: "Plus Jakarta Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;--weight-regular: 400;--weight-medium: 500;--weight-semibold: 600;--weight-bold: 700;--weight-extra: 800;--text-display-2xl: 60px;--text-display-xl: 48px;--text-display-lg: 40px;--text-h1: 32px;--text-h2: 26px;--text-h3: 22px;--text-h4: 18px;--text-body-lg: 18px;--text-body: 16px;--text-body-sm: 14px;--text-caption: 13px;--text-overline: 12px;--leading-tight: 1.1;--leading-snug: 1.25;--leading-normal: 1.5;--leading-relaxed: 1.6;--tracking-tight: -.02em;--tracking-snug: -.01em;--tracking-normal: 0;--tracking-wide: .04em;--tracking-overline: .08em}:root{--space-0: 0;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-10: 40px;--space-12: 48px;--space-16: 64px;--space-20: 80px;--space-24: 96px;--space-32: 128px;--gutter: 24px;--section-y: 80px;--container-max: 1200px}:root{--radius-xs: 4px;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-2xl: 24px;--radius-full: 9999px}:root{--shadow-xs: 0 1px 2px rgba(30, 45, 77, .06);--shadow-sm: 0 1px 3px rgba(30, 45, 77, .08), 0 1px 2px rgba(30, 45, 77, .05);--shadow-md: 0 4px 12px rgba(30, 45, 77, .08), 0 1px 3px rgba(30, 45, 77, .05);--shadow-lg: 0 12px 28px rgba(30, 45, 77, .12), 0 2px 6px rgba(30, 45, 77, .06);--shadow-xl: 0 24px 48px rgba(30, 45, 77, .16), 0 4px 10px rgba(30, 45, 77, .06);--shadow-inset: inset 0 1px 2px rgba(30, 45, 77, .08)}:root{font-family:var(--font-sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:var(--font-sans);background:var(--surface-page);color:var(--text-body);-webkit-font-smoothing:antialiased;overflow-x:hidden}a{text-decoration:none;color:inherit}.wrap{max-width:1180px;margin:0 auto;padding:0 28px}.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums}.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}.eyebrow{font-size:var(--text-overline);font-weight:600;letter-spacing:var(--tracking-overline);text-transform:uppercase;color:var(--color-accent)}.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.22,.8,.3,1),transform .7s cubic-bezier(.22,.8,.3,1)}.reveal.in{opacity:1;transform:none}.reveal[data-d="1"]{transition-delay:.08s}.reveal[data-d="2"]{transition-delay:.16s}.reveal[data-d="3"]{transition-delay:.24s}.reveal[data-d="4"]{transition-delay:.32s}@media (prefers-reduced-motion: reduce){.reveal{opacity:1;transform:none;transition:none}}.tw-word{display:inline-block;white-space:nowrap}.tw-ch{opacity:0;transition:opacity .08s linear}.tw-ch.on{opacity:1}.tw-ch.cur{position:relative}.tw-ch.cur:after{content:"";position:absolute;top:.08em;bottom:.04em;right:-.06em;width:.07em;min-width:2px;border-radius:2px;background:var(--teal-500);animation:tw-blink .9s steps(1) infinite}@keyframes tw-blink{50%{opacity:0}}section{position:relative}.nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding-block:14px;padding-left:max(28px,calc((100% - 1180px)/4 + 28px));padding-right:max(28px,calc((100% - 1180px)/2 + 28px));border-bottom:1px solid transparent;transition:background .25s ease,box-shadow .25s ease,backdrop-filter .25s ease,border-color .25s ease}.nav[data-scrolled=true]{background:#fafafadb;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom-color:var(--border-subtle)}.brand{--brand-size: 26px;display:flex;align-items:center;gap:calc(var(--brand-size) * .4)}.brand__stack{display:flex;flex-direction:column;gap:calc(var(--brand-size) * .08);flex-shrink:0}.brand__stack span{display:block;height:calc(var(--brand-size) * .22);border-radius:calc(var(--brand-size) * .07)}.brand__stack span:nth-child(1){width:calc(var(--brand-size) * .88);background:var(--teal-500)}.brand__stack span:nth-child(2){width:calc(var(--brand-size) * .72);background:var(--navy-700)}.brand__stack span:nth-child(3){width:calc(var(--brand-size) * 1.04);background:var(--navy-700)}.brand__wm{font-weight:800;font-size:var(--brand-size);line-height:1;letter-spacing:-.02em;color:var(--navy-700)}.brand__wm i{color:var(--teal-500);font-style:normal}.brand--light .brand__stack span:nth-child(1){background:var(--teal-400)}.brand--light .brand__stack span:nth-child(n+2){background:var(--white)}.brand--light .brand__wm{color:var(--white)}.brand--light .brand__wm i{color:var(--teal-400)}.nav .brand{--brand-size: 27px}.nav__links{display:flex;align-items:center;gap:30px}.nav__links a{font-size:14px;font-weight:500;color:var(--gray-600);transition:color .15s}.nav__links a:hover{color:var(--navy-800)}.nav__actions{display:flex;align-items:center;gap:10px}.nav__toggle{display:none;align-items:center;justify-content:center;flex-shrink:0;width:38px;height:38px;border-radius:var(--radius-md);border:1px solid var(--border-default);background:#fff;color:var(--navy-800);cursor:pointer}.nav__toggle-icon{width:20px;height:20px}.nav__toggle-icon--close,.nav[data-menu-open=true] .nav__toggle-icon--open{display:none}.nav[data-menu-open=true] .nav__toggle-icon--close{display:block}.btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-sans);font-size:14px;font-weight:600;border-radius:var(--radius-md);cursor:pointer;padding:10px 18px;border:1px solid transparent;transition:all .16s cubic-bezier(.22,.8,.3,1)}.btn--primary{background:var(--teal-500);color:#fff}.btn--primary:hover{background:var(--teal-600);transform:translateY(.5px)}.btn--navy{background:var(--navy-700);color:#fff}.btn--navy:hover{background:var(--navy-800);transform:translateY(.5px)}.btn--ghost{background:#fff;color:var(--navy-800);border-color:var(--border-default)}.btn--ghost:hover{background:var(--gray-50);border-color:var(--gray-400)}.btn--danger{background:var(--error-500);color:#fff}.btn--danger:hover{background:var(--error-600);transform:translateY(.5px)}.btn--wa{background:var(--success-600);color:var(--white)}.btn--wa:hover{background:var(--success-700);transform:translateY(.5px)}.btn--light{background:#ffffff1f;color:#fff;border-color:#ffffff3d}.btn--light:hover{background:#fff3}.btn--lg{padding:13px 24px;font-size:15px}.btn--sm{padding:7px 14px;font-size:13px}.btn svg{width:16px;height:16px;flex-shrink:0}.mock{background:#fff;border:1px solid var(--border-subtle);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);overflow:hidden}.mock__bar{display:flex;align-items:center;gap:8px;padding:13px 18px;border-bottom:1px solid var(--border-subtle);background:var(--gray-50)}.mock__bar i{width:11px;height:11px;border-radius:50%;display:block}.mock__bar i:nth-child(1){background:var(--error-500)}.mock__bar i:nth-child(2){background:var(--warning-500)}.mock__bar i:nth-child(3){background:var(--success-500)}.mock__bar span{margin-left:12px;font-size:12px;color:var(--gray-600);font-family:var(--font-mono)}.mock__body{display:grid;grid-template-columns:210px 1fr;min-height:420px}.mock__side{background:var(--navy-700);padding:18px 14px;display:flex;flex-direction:column;gap:3px}.mock__side .g{font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--navy-300);padding:4px 8px 8px}.mock__side .it{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:var(--radius-md);font-size:13px;font-weight:500;color:var(--navy-200)}.mock__side .it svg{width:17px;height:17px;flex-shrink:0;display:block}.mock__side .it[data-on=true]{background:var(--navy-600);color:#fff;font-weight:600;box-shadow:inset 3px 0 0 var(--teal-400)}.mock__main{padding:22px;display:flex;flex-direction:column;gap:18px;overflow:hidden}.mock__kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.kpi{background:#fff;border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:14px;box-shadow:var(--shadow-xs)}.kpi__l{font-size:12px;color:var(--gray-500);font-weight:500}.kpi__row{display:flex;align-items:baseline;gap:8px;margin-top:7px}.kpi__v{font-size:23px;font-weight:800;letter-spacing:-.02em;color:var(--navy-900);font-variant-numeric:tabular-nums}.kpi__d{font-size:11px;font-weight:700;padding:2px 6px;border-radius:var(--radius-full)}.kpi__d--up{color:var(--success-700);background:var(--success-50)}.kpi__d--down{color:var(--warning-700);background:var(--warning-50)}.tbl{width:100%;border-collapse:collapse;background:#fff}.tbl thead th{text-align:left;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--gray-500);padding:11px 14px;border-bottom:1px solid var(--border-subtle)}.tbl tbody td{padding:13px 14px;border-bottom:1px solid var(--border-subtle);font-size:14px;color:var(--text-body)}.tbl tbody tr{transition:background .14s}.tbl tbody tr:hover{background:var(--gray-50)}.tbl tbody tr:last-child td{border-bottom:none}.tbl .name{font-weight:600;color:var(--navy-900)}.tbl .sku{font-family:var(--font-mono);font-size:13px;color:var(--gray-500)}.tbl .price,.tbl .stock{font-family:var(--font-mono);font-variant-numeric:tabular-nums}.tbl .stock{text-align:right}.tbl .price{text-align:right;color:var(--navy-800)}.pill{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;padding:3px 10px;border-radius:var(--radius-full)}.pill:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}.pill--in{color:var(--success-700);background:var(--success-50)}.pill--low{color:var(--warning-700);background:var(--warning-50)}.pill--out{color:var(--error-700);background:var(--error-50)}.sec{padding:96px 0}.sec__head{max-width:620px;margin-bottom:48px}.sec__head h2{font-size:clamp(30px,4vw,42px);line-height:1.1;letter-spacing:-.025em;font-weight:800;color:var(--navy-900);margin:12px 0 14px}.sec__head p{font-size:18px;line-height:1.6;color:var(--gray-600);margin:0}.swatches{display:grid;grid-template-columns:repeat(12,1fr);gap:0;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm);border:1px solid var(--border-subtle)}.sw{height:108px;display:flex;align-items:flex-end;padding:10px}.sw span{font-family:var(--font-mono);font-size:10px;font-weight:500}.palette-block{margin-bottom:20px}.palette-block .lbl{font-size:13px;font-weight:600;color:var(--navy-800);margin-bottom:9px;display:flex;align-items:center;gap:8px}.palette-block .lbl .tag{font-size:11px;font-weight:500;color:var(--gray-500);font-family:var(--font-mono)}.accent-row{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:32px}.accent-card{border:1px solid var(--border-subtle);border-radius:var(--radius-lg);overflow:hidden;background:#fff;box-shadow:var(--shadow-xs)}.accent-card .fill{height:88px}.accent-card .meta{padding:14px 16px}.accent-card .meta b{font-size:14px;color:var(--navy-900)}.accent-card .meta p{margin:3px 0 0;font-size:12.5px;color:var(--gray-500);font-family:var(--font-mono)}.comp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.comp{background:#fff;border:1px solid var(--border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);overflow:hidden;transition:transform .2s cubic-bezier(.22,.8,.3,1),box-shadow .2s}.comp:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}.comp__stage{padding:30px 24px;display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;min-height:138px;background:var(--gray-50);border-bottom:1px solid var(--border-subtle)}.comp__foot{padding:15px 20px}.comp__foot b{font-size:15px;color:var(--navy-900);font-weight:700}.comp__foot p{margin:3px 0 0;font-size:13px;color:var(--gray-500)}.badge{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;padding:3px 10px;border-radius:var(--radius-full)}.badge--success{color:var(--success-700);background:var(--success-50)}.badge--warning{color:var(--warning-700);background:var(--warning-50)}.badge--info{color:var(--info-700);background:var(--info-50)}.badge--neutral{color:var(--gray-600);background:var(--gray-100)}.fld{width:100%}.fld label{display:block;font-size:12px;font-weight:600;color:var(--navy-800);margin-bottom:6px}.fld--req label:after{content:" *";color:var(--teal-600)}.fld input,.fld select,.fld textarea{width:100%;font-family:var(--font-sans);font-size:14px;padding:10px 12px;border:1px solid var(--border-default);border-radius:var(--radius-md);color:var(--navy-900);background:var(--white);transition:border-color .15s,box-shadow .15s}.fld textarea{resize:vertical;min-height:104px;line-height:1.5}.fld select{-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;padding-right:36px;background-image:linear-gradient(45deg,transparent 50%,var(--gray-500) 50%),linear-gradient(135deg,var(--gray-500) 50%,transparent 50%);background-position:calc(100% - 18px) 50%,calc(100% - 13px) 50%;background-size:5px 5px;background-repeat:no-repeat}.fld input::placeholder,.fld textarea::placeholder{color:var(--gray-500)}.fld input:hover,.fld select:hover,.fld textarea:hover{border-color:var(--gray-400)}.fld input:focus,.fld select:focus,.fld textarea:focus{outline:none;border-color:var(--border-focus);box-shadow:var(--ring-accent)}.form-status{font-size:14px;line-height:1.5;border-radius:var(--radius-md);padding:10px 14px}.form-status:empty{display:none}.form-status--ok{color:var(--success-700);background:var(--success-50)}.form-status--err{color:var(--error-700);background:var(--error-50)}.form-status a{font-weight:600;text-decoration:underline}.btn:focus-visible,.nav__toggle:focus-visible,.social-ic:focus-visible{outline:none;box-shadow:var(--ring-accent)}.btn[disabled]{opacity:.7;cursor:progress}.swch{width:42px;height:24px;border-radius:var(--radius-full);background:var(--teal-500);position:relative}.swch:after{content:"";position:absolute;top:3px;left:21px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:var(--shadow-sm)}.chk{display:inline-flex;align-items:center;gap:9px;font-size:14px;color:var(--navy-800);font-weight:500}.chk b{width:20px;height:20px;border-radius:var(--radius-sm);background:var(--teal-500);display:inline-flex;align-items:center;justify-content:center}.chk b svg{width:13px;height:13px}footer{background:var(--navy-900);color:var(--navy-300);position:relative;overflow:hidden}footer:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:radial-gradient(circle at 1px 1px,rgba(255,255,255,.05) 1px,transparent 0);background-size:26px 26px}footer .wrap{position:relative}footer .brand__wm{color:var(--white)}footer .brand__wm i{color:var(--teal-400)}footer .brand__stack span:nth-child(1){background:var(--teal-400)}footer .brand__stack span:nth-child(n+2){background:var(--white)}.footer__grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px;padding:56px 0 36px}.footer__brand p{font-size:13.5px;line-height:1.6;color:var(--navy-300);max-width:34ch;margin:14px 0 20px}.footer__social{display:flex;gap:10px}.social-ic{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--radius-full);background:#ffffff0f;color:var(--navy-200);transition:background .18s,color .18s,transform .18s cubic-bezier(.22,.8,.3,1)}.social-ic svg{width:17px;height:17px;display:block}.social-ic:hover{background:var(--teal-500);color:#fff;transform:translateY(-2px)}.footer__col{display:flex;flex-direction:column;gap:11px}.footer__col b{font-size:11px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--navy-100);margin-bottom:3px}.footer__col a,.footer__col span{font-size:13.5px;color:var(--navy-300)}.footer__col a{transition:color .15s}.footer__col a:hover{color:#fff}.footer__col .ic-row{display:flex;align-items:center;gap:8px}.footer__col .ic-row svg{width:15px;height:15px;flex-shrink:0;color:var(--teal-400)}.footer__bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:18px 0;border-top:1px solid rgba(255,255,255,.08);font-size:12.5px;color:var(--navy-400)}.footer__bottom a{color:var(--navy-400)}.footer__bottom a:hover{color:#fff}@media (max-width: 900px){.nav__toggle{display:inline-flex}.nav .brand{--brand-size: 22px}.nav__links{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:2px;background:#fff;border-bottom:1px solid var(--border-subtle);box-shadow:var(--shadow-md);padding:10px 20px 18px}.nav__links a{padding:12px 10px;border-radius:var(--radius-md)}.nav__links a:hover{background:var(--gray-50)}.nav[data-menu-open=true] .nav__links{display:flex}.mock__body{grid-template-columns:1fr}.mock__side{display:none}.mock__kpis{grid-template-columns:repeat(2,1fr)}.comp-grid,.accent-row{grid-template-columns:1fr}.swatches{grid-template-columns:repeat(6,1fr)}.footer__grid{grid-template-columns:1fr 1fr;padding:44px 0 28px}.footer__bottom{justify-content:center;text-align:center}}@media (max-width: 560px){.footer__grid{grid-template-columns:1fr;gap:28px}}html,body{height:100%;overflow:hidden}body{display:flex;flex-direction:column}.app{display:flex;height:100%;min-height:0}.app__sidebar{width:240px;flex-shrink:0;background:var(--navy-700);display:flex;flex-direction:column;padding:14px 12px;transition:transform .22s cubic-bezier(.22,.8,.3,1),width .2s ease}.app__logo{display:flex;align-items:center;justify-content:center;gap:10px;padding:10px 8px 22px}.app__logo .brand{--brand-size: 32px}.app__nav{flex:1;display:flex;flex-direction:column;gap:3px;overflow-y:auto}.app__navitem{display:flex;align-items:center;gap:11px;padding:10px 11px;border-radius:var(--radius-md);font-family:var(--font-sans);font-size:14px;font-weight:500;color:var(--navy-200);background:transparent;border:none;cursor:pointer;text-align:left;width:100%;transition:background .15s,color .15s}.app__navitem svg{width:18px;height:18px;flex-shrink:0}.app__navitem:hover{background:var(--navy-600);color:#fff}.app__navitem[data-active=true]{background:var(--navy-600);color:#fff;font-weight:600;box-shadow:inset 3px 0 0 var(--teal-400)}.app__sidebar-foot{border-top:1px solid var(--navy-600);padding-top:10px;margin-top:8px}.app__navitem--exit{color:var(--navy-300)}.app__navitem--exit:hover{color:#fff}.app__sidebar-backdrop{display:none}.app__body{flex:1;display:flex;flex-direction:column;min-width:0}.app__header{height:64px;flex-shrink:0;display:flex;align-items:center;gap:16px;padding:0 24px;background:#fff;border-bottom:1px solid var(--border-subtle)}.app__menu-toggle{display:none;width:36px;height:36px;align-items:center;justify-content:center;border-radius:var(--radius-md);border:1px solid var(--border-default);background:#fff;color:var(--navy-800);cursor:pointer;flex-shrink:0}.app__menu-toggle svg{width:19px;height:19px}.app__exit{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--gray-600);padding:7px 10px;border-radius:var(--radius-md);flex-shrink:0}.app__exit:hover{background:var(--gray-100);color:var(--navy-800)}.app__exit svg{width:15px;height:15px}.app__demo-tag{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;color:var(--teal-700);background:var(--teal-50);padding:5px 11px;border-radius:var(--radius-full);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.app__demo-tag b{width:6px;height:6px;border-radius:50%;background:var(--teal-500);flex-shrink:0}.app__header-actions{display:flex;align-items:center;gap:10px;margin-left:auto;flex-shrink:0}.app__avatar{width:32px;height:32px;border-radius:50%;background:var(--teal-500);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:12.5px;font-weight:700;flex-shrink:0}.app__user-name{font-size:13.5px;font-weight:600;color:var(--navy-900)}.app__cta{margin-right:6px;white-space:nowrap}.app__main{flex:1;overflow-y:auto;padding:24px;background:var(--surface-page)}.view{display:none;flex-direction:column;gap:18px;max-width:1280px;margin:0 auto}.view:not([hidden]){display:flex}.view__head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.view__title{font-size:22px;font-weight:800;letter-spacing:-.02em;color:var(--navy-900);margin:0}.card{background:#fff;border:1px solid var(--border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);overflow:hidden}.card--pad{padding:18px}.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.kpi--wide{padding:20px;display:flex;align-items:flex-start;gap:16px}.kpi__icon{width:48px;height:48px;border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;flex-shrink:0}.kpi__icon svg{width:22px;height:22px}.kpi__icon--teal{background:var(--teal-50);color:var(--teal-600)}.kpi__icon--navy{background:var(--navy-50);color:var(--navy-700)}.kpi__icon--success{background:var(--success-50);color:var(--success-600)}.kpi__icon--warning{background:var(--warning-50);color:var(--warning-600)}.kpi__icon--error{background:var(--error-50);color:var(--error-600)}.kpi--wide .kpi__l{text-transform:uppercase;letter-spacing:.02em;font-weight:600}.kpi--wide .kpi__v{font-size:28px}.kpi__sub{font-size:11.5px;color:var(--text-muted);margin-top:2px}.chart-card{padding:24px}.chart-card h2{font-size:15px;font-weight:700;color:var(--navy-900);margin:0 0 16px}.chart-plot{display:flex;gap:10px}.chart-yaxis{display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end;height:160px;flex-shrink:0}.chart-yaxis span{font-size:11px;color:var(--gray-500);font-family:var(--font-mono)}.chart-plot__main{flex:1;min-width:0}.chart-bars{display:flex;align-items:flex-end;gap:10px;height:160px;background:repeating-linear-gradient(to top,var(--border-subtle) 0,var(--border-subtle) 1px,transparent 1px,transparent 33.333%);border-bottom:1px solid var(--border-default)}.chart-bar{flex:1;display:flex;flex-direction:column;align-items:center;gap:8px;height:100%;justify-content:flex-end}.chart-bar__col{width:100%;max-width:64px;background:var(--teal-500);border-radius:6px 6px 0 0;min-height:3px;transition:background .15s;position:relative}.chart-bar:hover .chart-bar__col{background:var(--teal-600)}.chart-bar__val{font-size:10.5px;color:var(--gray-500);font-family:var(--font-mono)}.chart-bar__lbl{font-size:11px;color:var(--gray-500);text-transform:capitalize}.card__head{display:flex;align-items:center;gap:8px;padding:15px 18px;border-bottom:1px solid var(--border-subtle)}.card__head--between{justify-content:space-between}.card__head h2{font-size:14.5px;font-weight:700;color:var(--navy-900);margin:0}.card__head svg{width:15px;height:15px;color:var(--warning-600)}.card__head .count{font-size:11px;font-weight:700;color:var(--warning-700);background:var(--warning-50);padding:1px 8px;border-radius:var(--radius-full)}.card__foot{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:12px 18px;border-top:1px solid var(--border-subtle);background:var(--gray-50);font-size:13px;color:var(--gray-500)}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}.tbl--app{table-layout:auto}.tbl--app thead th{background:var(--navy-700);color:#fff}.tbl-wrap{overflow-x:auto}.tbl--app tbody td{white-space:nowrap}.tbl--app .empty-row td{text-align:center;padding:40px 14px;color:var(--text-muted);white-space:normal}.tbl-actions{display:flex;gap:2px}.icon-btn{width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);border:none;background:transparent;color:var(--gray-500);cursor:pointer;transition:background .14s,color .14s}.icon-btn svg{width:15px;height:15px}.icon-btn:hover{background:var(--gray-100);color:var(--teal-600)}.icon-btn--danger:hover{background:var(--error-50);color:var(--error-600)}.icon-btn--info:hover{background:var(--info-50);color:var(--info-600)}.link-btn{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;color:var(--info-600);border:1px solid var(--border-default);border-radius:var(--radius-sm);padding:5px 9px;background:#fff;cursor:pointer}.link-btn svg{width:12px;height:12px}.link-btn:hover{background:var(--info-50)}.badge--pagada{color:var(--success-700);background:var(--success-50)}.badge--pendiente{color:var(--warning-700);background:var(--warning-50)}.badge--vencida{color:var(--error-700);background:var(--error-50)}.badge--cancelada{color:var(--gray-600);background:var(--gray-100)}.badge svg{width:11px;height:11px}.filters{display:flex;flex-wrap:wrap;align-items:center;gap:12px}.filters--end{align-items:flex-end}.filters .fld{flex:0 1 180px}.report-section{display:flex;flex-direction:column;gap:18px}.filters__search{flex:1;min-width:220px;display:flex;align-items:center;gap:8px;height:40px;padding:0 12px;border:1px solid var(--border-default);border-radius:var(--radius-md);background:#fff;transition:border-color .15s,box-shadow .15s}.filters__search:focus-within{border-color:var(--border-focus);box-shadow:var(--ring-accent)}.filters__search svg{width:16px;height:16px;color:var(--gray-400);flex-shrink:0}.filters__search input{flex:1;border:none;outline:none;background:transparent;font-family:var(--font-sans);font-size:14px;color:var(--navy-900)}.filters__search input::placeholder{color:var(--gray-400)}.chips{display:flex;flex-wrap:wrap;gap:8px}.chip{font-family:var(--font-sans);font-size:13px;font-weight:500;padding:6px 14px;border-radius:var(--radius-full);border:1px solid var(--border-default);background:#fff;color:var(--gray-600);cursor:pointer;transition:all .14s;text-transform:capitalize}.chip:hover{border-color:var(--gray-400);color:var(--navy-800)}.chip[data-active=true]{background:var(--navy-700);border-color:var(--navy-700);color:#fff;font-weight:600}.viewtoggle{display:flex;gap:2px;border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:2px}.viewtoggle .icon-btn[data-active=true]{background:var(--teal-500);color:#fff}.viewtoggle .icon-btn[data-active=true]:hover{background:var(--teal-600);color:#fff}.client-grid{display:none;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}.client-grid:not([hidden]){display:grid}.client-grid>.empty-state{grid-column:1 / -1}.client-card{padding:20px;display:flex;flex-direction:column;gap:10px;transition:box-shadow .16s}.client-card:hover{box-shadow:var(--shadow-md)}.client-card__top{display:flex;align-items:flex-start;justify-content:space-between}.client-card__avatar{width:40px;height:40px;border-radius:50%;background:var(--teal-500);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:14px;flex-shrink:0}.client-card__body{display:flex;flex-direction:column;gap:3px}.client-card__name,.client-card__meta,.client-card__rfc{margin:0}.client-card__name{font-weight:600;color:var(--text-body);font-size:14px}.client-card__meta{font-size:13.5px;color:var(--text-secondary);line-height:1.4}.client-card__rfc{font-family:var(--font-mono);font-size:12px;color:var(--text-secondary)}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:48px 20px;color:var(--text-muted);text-align:center}.empty-state svg{width:30px;height:30px;color:var(--gray-300)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--navy-900) 46%,transparent);padding:20px}.modal-overlay[hidden]{display:none}.modal{background:#fff;border-radius:var(--radius-xl);box-shadow:var(--shadow-xl);width:100%;max-width:560px;max-height:calc(100vh - 40px);display:flex;flex-direction:column;overflow:hidden}.modal--wide{max-width:760px}.modal__head{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--border-subtle);flex-shrink:0}.modal__head h2{font-size:17px;font-weight:700;color:var(--navy-900);margin:0}.modal__body{padding:22px;overflow-y:auto}.modal__foot{display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:16px 22px;border-top:1px solid var(--border-subtle);flex-shrink:0;background:var(--gray-50)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.form-grid .fld--full{grid-column:1 / -1}.form-grid--section{margin-bottom:16px}.form-hint{font-size:12px;color:var(--text-muted);margin:-4px 0 0}.form-note{font-size:13.5px;line-height:1.5;color:var(--gray-600);margin:0 0 14px}.capitalize{text-transform:capitalize}.item-picker{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;margin-bottom:14px}.item-picker .fld{flex:2;min-width:180px}.item-picker .fld--qty{flex:0 0 84px;min-width:84px}.items-tbl{width:100%;border-collapse:collapse;margin-bottom:14px}.items-tbl th{text-align:left;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--gray-500);padding:8px 10px;border-bottom:1px solid var(--border-subtle)}.items-tbl td{padding:9px 10px;border-bottom:1px solid var(--border-subtle);font-size:13.5px;color:var(--text-body)}.items-tbl .num{text-align:right;font-family:var(--font-mono)}.items-summary{display:flex;justify-content:flex-end}.items-summary table{border-collapse:collapse}.items-summary td{padding:4px 0 4px 24px;font-size:13.5px}.items-summary td:first-child{color:var(--gray-500)}.items-summary td:last-child{text-align:right;font-family:var(--font-mono);font-weight:600;color:var(--navy-900)}.items-summary tr.total td{font-size:16px;font-weight:800;color:var(--navy-900)}.items-card{border:1px solid var(--border-subtle);border-radius:var(--radius-lg);overflow:hidden;margin-bottom:16px}.items-card .tbl thead th,.items-card .tbl tbody td{padding:8px 14px}.section-label{font-size:13px;font-weight:600;color:var(--text-secondary);margin:0 0 8px}.totals-list{display:flex;flex-direction:column;gap:4px;font-size:13.5px;margin-bottom:16px}.totals-list__row{display:flex;justify-content:space-between;color:var(--text-secondary)}.totals-list__row--success{color:var(--success-600)}.totals-list__row--warning{color:var(--warning-600);font-weight:600}.totals-list__row--total{font-weight:700;color:var(--text-body);font-size:15px;border-top:1px solid var(--border-subtle);padding-top:8px;margin-top:4px}.confirm-danger{display:flex;align-items:center;gap:10px;padding:12px;border-radius:var(--radius-lg);background:var(--error-50);border:1px solid var(--error-500)}.confirm-danger svg{width:17px;height:17px;color:var(--error-600);flex-shrink:0}.confirm-danger p{flex:1;margin:0;font-size:13.5px;font-weight:500;color:var(--error-700)}.detail-foot{display:flex;justify-content:flex-end;padding-top:12px;border-top:1px solid var(--border-subtle)}.detail-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px 20px;margin-bottom:16px}.detail-item .lbl{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted);font-weight:600}.detail-item .val{font-size:14px;color:var(--navy-900);margin-top:2px}.detail-balance{display:flex;gap:18px;padding:14px 16px;background:var(--gray-50);border-radius:var(--radius-md);margin-bottom:16px}.detail-balance div b{display:block;font-size:11px;color:var(--text-muted);font-weight:600;text-transform:uppercase}.detail-balance div span{font-size:17px;font-weight:800;color:var(--navy-900);font-family:var(--font-mono)}.toast{position:fixed;bottom:22px;left:50%;transform:translate(-50%) translateY(8px);z-index:300;display:flex;align-items:center;gap:8px;background:var(--navy-900);color:#fff;font-size:13.5px;font-weight:500;padding:11px 18px;border-radius:var(--radius-md);box-shadow:var(--shadow-lg);opacity:0;pointer-events:none;transition:opacity .18s,transform .18s}.toast[data-show=true]{opacity:1;transform:translate(-50%) translateY(0)}.toast svg{width:15px;height:15px;color:var(--teal-400);flex-shrink:0}@media (max-width: 1080px){.kpis{grid-template-columns:repeat(2,1fr)}.grid-2{grid-template-columns:1fr}}@media (max-width: 900px){.app__sidebar{position:fixed;inset:0 auto 0 0;z-index:150;transform:translate(-100%);box-shadow:var(--shadow-xl)}.app[data-sidebar-open=true] .app__sidebar{transform:translate(0)}.app[data-sidebar-open=true] .app__sidebar-backdrop{display:block;position:fixed;top:0;right:0;bottom:0;left:0;z-index:140;background:color-mix(in srgb,var(--navy-900) 40%,transparent)}.app__menu-toggle{display:inline-flex}.app__demo-tag span,.app__user-name{display:none}}@media (max-width: 640px){.app__main{padding:16px}.app__header{padding:0 14px;gap:10px}.app__cta{margin-right:0;padding:8px 10px}.app__cta-text{display:none}.kpis{grid-template-columns:1fr 1fr;gap:10px}.kpi--wide{flex-direction:column;gap:10px;padding:14px;min-width:0}.kpi--wide>div:last-child{min-width:0}.kpi__icon{width:38px;height:38px}.kpi--wide .kpi__l{font-size:11px}.kpi--wide .kpi__v{font-size:19px}.form-grid,.detail-grid{grid-template-columns:1fr}.modal__body{padding:16px}.item-picker .fld{min-width:140px}}