:root{
    --bg:#F5F6F8; --surface:#FFFFFF; --surface-soft:#F1F2F4;
    --ink:#1B1E23; --ink-soft:#5B616A; --ink-faint:#8D939B; --line:#E2E4E8; --line-strong:#CED1D6;
    --teal:#3B434E; --teal-dark:#1F252C; --teal-soft:#E9EBEE;
    --gold:#B8873C; --gold-soft:#F7EEDD;
    --danger:#B23A2E; --danger-soft:#FBEAE7;
    --success:#1C8A4F; --success-soft:#E4F5EA;
    --violet:#5F6672; --violet-soft:#ECEEF1;
    --sidebar-bg:#1A1D21; --sidebar-bg-soft:#262A30;
    --font-display:'Inter', sans-serif;
    --font-body:'Inter', sans-serif;
    --font-mono:'Inter', sans-serif;
    --radius:8px;
    --shadow-card:0 1px 2px rgba(20,24,30,0.06);
    --shadow-hover:0 6px 18px rgba(20,24,30,0.12);
  }
  [data-theme="dark"]{
    --bg:#121417; --surface:#1A1D21; --surface-soft:#23272C;
    --ink:#EDEEF0; --ink-soft:#A8ADB5; --ink-faint:#767C85; --line:#2B2F35; --line-strong:#3B4048;
    --teal:#6A7482; --teal-dark:#C5CAD1; --teal-soft:#252A31;
    --gold:#E0AC5C; --gold-soft:#3B2E1B;
    --danger:#E36657; --danger-soft:#3D211E;
    --success:#3FC077; --success-soft:#1C3527;
    --violet:#A3A9B3; --violet-soft:#2A2E35;
    --sidebar-bg:#0E1013; --sidebar-bg-soft:#1A1D21;
    --shadow-card:0 1px 2px rgba(0,0,0,0.35);
    --shadow-hover:0 6px 18px rgba(0,0,0,0.5);
  }
  [data-theme="dark"] .p-social, [data-theme="dark"] .p-care{ color:inherit; }
  *{box-sizing:border-box;}
  body{margin:0; background:var(--bg); color:var(--ink); font-family:var(--font-body); min-height:100vh; -webkit-font-smoothing:antialiased; font-variant-numeric:tabular-nums;}
  input, select, textarea{background:var(--surface-soft); color:var(--ink);}
  input:focus, select:focus, textarea:focus{background:#fff;}
  [data-theme="dark"] input:focus, [data-theme="dark"] select:focus, [data-theme="dark"] textarea:focus{background:var(--surface);}
  input[type="password"]{text-transform:none;}
  ::selection{background:var(--gold-soft); color:var(--gold);}
  button{font-family:var(--font-body); cursor:pointer;}
  input, select, textarea{font-family:var(--font-body);}
  a{color:var(--teal-dark);}
  h1,h2,h3{font-family:var(--font-display); letter-spacing:-0.01em;}
  svg{display:block;}

  #print-area{ display:none; }
  #print-area .p-wrap{ max-width:360px; margin:0 auto; padding:18px; border:1.5px solid #1F252C; border-radius:6px; background:#fff; box-shadow:none; font-family:Arial, Helvetica, sans-serif; color:#12181D; }
  #print-area .p-topbar{ height:4px; background:#3B434E; margin:-18px -18px 14px -18px; border-radius:6px 6px 0 0; }
  #print-area .p-header{ text-align:center; margin-bottom:6px; }
  #print-area .p-header img{ width:46px; height:46px; object-fit:contain; }
  #print-area .p-header h1{ font-family:'Poppins', sans-serif; font-size:18px; margin:7px 0 2px; letter-spacing:0.02em; font-weight:700; text-transform:uppercase; }
  #print-area .p-header .p-contact{ font-size:10.5px; color:#5C6670; }
  #print-area .p-eyebrow{ text-align:center; font-size:9.5px; font-weight:bold; letter-spacing:0.1em; text-transform:uppercase; color:#3B434E; margin:8px 0 12px; }
  #print-area hr{ border:none; border-top:1px dashed #CBCFC9; margin:10px 0; }
  #print-area .p-row{ display:flex; justify-content:space-between; font-size:11.5px; margin-bottom:4px; gap:10px; }
  #print-area .p-label{ color:#5C6670; }
  #print-area .p-sub{ font-size:11.5px; text-transform:uppercase; letter-spacing:0.05em; margin:13px 0 5px; color:#5C6670; }
  #print-area .p-final{ font-size:15.5px; font-weight:bold; display:flex; justify-content:space-between; margin-top:7px; padding-top:7px; border-top:1.5px solid #12181D; }
  #print-area .p-badge{ display:block; text-align:center; font-size:10.5px; font-weight:bold; letter-spacing:0.06em; text-transform:uppercase; color:#3B434E; background:#ECEEF1; border-radius:6px; padding:5px 9px; margin-bottom:12px; }
  #print-area .p-box{ background:#F7EEDD; border:1px solid #B8873C; border-radius:8px; padding:10px 12px; margin-top:12px; font-size:11px; box-shadow:none; }
  #print-area .p-disclaimer{ font-size:9.5px; color:#5C6670; margin-top:7px; line-height:1.4; }
  #print-area .p-due{ color:#B23A2E; font-weight:600; }
  #print-area .p-sign{ margin-top:28px; border-top:1px solid #12181D; padding-top:5px; font-size:10.5px; text-align:center; color:#5C6670; }
  #print-area .p-care{ text-align:center; font-size:10.5px; font-weight:500; color:#1C6E4E; background:#E4F5EA; border:1px solid #9BCFB2; border-radius:8px; padding:9px 11px; margin-top:10px; line-height:1.45; box-shadow:none; }
  #print-area .p-care strong{ font-size:11.5px; }
  #print-area .p-social{ text-align:center; font-size:10.5px; font-weight:500; color:#1F252C; background:#ECEEF1; border:1px solid #D3D6DB; border-radius:8px; padding:10px 12px; margin-top:12px; line-height:1.4; box-shadow:none; }
  #print-area .p-social strong{ font-size:11.5px; }
  #print-area .p-footer{ text-align:center; font-size:10px; color:#98A1A8; margin-top:9px; }
  #print-area .p-wrap-label{ border:none; padding:8px; max-width:220px; background:#fff; }
  #print-area .p-wrap-wide{ max-width:680px; }
  #print-area .p-wrap-a4{ max-width:720px; width:100%; min-height:900px; padding:50px 60px; box-sizing:border-box; }
  #print-area .p-wrap-shipping{ max-width:620px; width:100%; min-height:0; padding:40px 30px; box-sizing:border-box; border:none; }
  #print-area .p-price-table{ width:100%; border-collapse:collapse; margin-top:6px; }
  #print-area .p-price-table th{ text-align:left; font-size:10px; text-transform:uppercase; letter-spacing:0.04em; color:#5C6670; padding:5px 6px; border-bottom:1.5px solid #12181D; }
  #print-area .p-price-table td{ padding:6px 6px; font-size:12px; border-bottom:1px dashed #CBCFC9; }
  #print-area .p-price-table td.p-price-cell{ text-align:right; font-weight:700; }
  #print-area .p-price-group{ font-size:11px; text-transform:uppercase; letter-spacing:0.05em; font-weight:bold; color:#3B434E; background:#ECEEF1; padding:5px 8px; margin-top:10px; border-radius:4px; }
  #print-area .p-label-ticket{ text-align:center; }
  #print-area .p-label-ticket .p-shop{ font-size:9px; text-transform:uppercase; letter-spacing:0.04em; color:#333; margin-bottom:2px; }
  #print-area .p-label-ticket .p-big{ font-size:30px; font-weight:bold; letter-spacing:1px; line-height:1; margin:2px 0; }
  #print-area .p-label-ticket .p-line{ font-size:10.5px; margin-top:2px; color:#333; }
  @media print{
    @page{ margin: 10mm; }
    html, body{ position:static !important; top:0 !important; left:0 !important; right:auto !important; height:auto !important; overflow:visible !important; background:#fff !important; }
    body > *:not(#print-area){ display:none !important; }
    #print-area{ display:block !important; position:absolute; top:0; left:0; width:100%; background:#fff !important; color:#12181D; font-family:Arial, Helvetica, sans-serif; }
  }

  .app-shell{display:flex; min-height:100vh; align-items:stretch;}

  .sidebar{width:232px; background:var(--sidebar-bg); color:#EAEBE7; display:flex; flex-direction:column; flex-shrink:0; position:sticky; top:0; height:100vh; z-index:20; box-shadow:2px 0 14px rgba(0,0,0,0.10);}
  .sidebar-brand{display:flex; align-items:center; gap:11px; padding:20px 18px; border-bottom:1px solid rgba(255,255,255,0.08);}
  .logo-box{width:52px; height:52px; border-radius:var(--radius); overflow:hidden; display:flex; align-items:center; justify-content:center; background:transparent; color:#fff; font-family:var(--font-display); font-weight:700; font-size:20px; flex-shrink:0;}
  .logo-box img{width:100%; height:100%; object-fit:contain; display:block;}
  .brand-text h1{font-family:var(--font-display); font-size:17px; font-weight:600; letter-spacing:0; text-transform:none; margin:0; line-height:1.2; color:#fff;}
  .brand-text .sub{font-size:10.5px; color:#9AA0A8; font-family:var(--font-mono); text-transform:none; letter-spacing:0;}

  .branch-badge{display:flex; align-items:center; gap:7px; margin:0 12px 8px; padding:7px 11px; border-radius:7px; background:var(--sidebar-bg-soft); color:#D5D9DF; font-size:11.5px; font-weight:600; font-family:var(--font-mono);}
  .branch-badge svg{width:14px; height:14px; flex-shrink:0;}
  .branch-badge-all{color:#B4B2BA;}
  .sidebar-nav{flex:1; padding:14px 10px; display:flex; flex-direction:column; gap:2px; overflow-y:auto;}
  .nav-group-label{font-family:var(--font-mono); font-size:10px; font-weight:600; text-transform:uppercase; letter-spacing:0.07em; color:#7D838B; padding:14px 12px 6px;}
  .nav-item{display:flex; align-items:center; gap:11px; padding:10px 12px; border-radius:8px; color:#AEB6B0; font-size:13.5px; font-weight:500; background:none; border:none; border-left:2px solid transparent; text-align:left; width:100%; transition:background .12s ease, color .12s ease, border-color .12s ease;}
  .nav-badge{margin-left:auto; background:var(--danger); color:#fff; font-size:10.5px; font-weight:700; min-width:18px; height:18px; border-radius:var(--radius); display:inline-flex; align-items:center; justify-content:center; padding:0 5px; flex-shrink:0;}
  .nav-item svg{width:17px; height:17px; flex-shrink:0; opacity:0.85;}
  .nav-item-big{padding:14px 12px; font-size:15.5px; font-weight:700; color:#fff; border-radius:var(--radius); margin-bottom:4px;}
  .nav-item-big svg{width:19px; height:19px; opacity:1;}
  .nav-item-big-violet{background:var(--teal);}
  .nav-item-big-violet:hover{background:var(--teal-dark);}
  .nav-item-big-violet.active{background:var(--teal-dark); border-left-color:transparent;}
  .nav-item-big-gold{background:#B8873C;}
  .nav-item-big-gold:hover{background:#96702E;}
  .nav-item-big-gold.active{background:#96702E; border-left-color:transparent;}
  .nav-item:hover{background:rgba(255,255,255,0.055); color:#fff;}
  .nav-item.active{background:rgba(255,255,255,0.09); color:#fff; border-left-color:#9CA3AF; font-weight:600;}
  .nav-item.active svg{opacity:1;}

  .sidebar-footer{padding:12px; border-top:1px solid rgba(255,255,255,0.08); display:flex; flex-direction:column; gap:6px;}
  .sidebar-role{font-family:var(--font-mono); font-size:10.5px; text-transform:uppercase; letter-spacing:0.05em; color:#9AA0A8; padding:4px 12px 8px;}
  .sidebar-btn{display:flex; align-items:center; gap:9px; width:100%; padding:9px 12px; border-radius:8px; background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.09); color:#EAEBE7; font-size:12.5px; font-weight:500;}
  .sidebar-btn:hover{background:rgba(255,255,255,0.09);}
  .sidebar-btn svg{width:15px; height:15px; flex-shrink:0;}

  .app-content{flex:1; min-width:0; display:flex; flex-direction:column;}
  .topbar-utility{display:flex; justify-content:flex-end; align-items:center; padding:14px 30px 0; gap:10px;}
  .notif-wrap{position:relative;}
  .notif-badge{position:absolute; top:-3px; right:-3px; background:var(--danger); color:#fff; font-size:10px; font-weight:700; border-radius:10px; min-width:16px; height:16px; display:flex; align-items:center; justify-content:center; padding:0 3px; font-family:var(--font-mono); box-shadow:0 0 0 2px var(--surface);}
  .notif-panel{position:absolute; top:calc(100% + 8px); right:0; width:300px; background:var(--surface); border:1px solid var(--line); border-radius:12px; box-shadow:0 12px 30px rgba(0,0,0,0.18); padding:8px; z-index:40;}
  .notif-item{display:block; width:100%; text-align:left; padding:10px 12px; border-radius:8px; font-size:12.5px; background:none; border:none;}
  .notif-item:hover{background:var(--surface-soft);}
  .notif-item .n-title{font-weight:600; margin-bottom:2px; color:var(--ink);}
  .notif-item .n-sub{color:var(--ink-soft); font-size:11.5px;}
  .notif-empty{padding:18px; text-align:center; font-size:12px; color:var(--ink-soft);}
  .page-header{padding:24px 30px 20px; border-bottom:1px solid var(--line); background:var(--surface);}
  .page-header .eyebrow{font-family:var(--font-body); font-size:12px; font-weight:500; text-transform:none; letter-spacing:0; color:var(--teal-dark); margin:0 0 6px;}
  .page-header h1{font-size:22px; font-weight:700; margin:0 0 5px; color:var(--ink); letter-spacing:-0.015em;}
  .page-header p{font-size:13px; color:var(--ink-soft); margin:0;}

  ::-webkit-scrollbar{width:10px; height:10px;}
  ::-webkit-scrollbar-track{background:transparent;}
  ::-webkit-scrollbar-thumb{background:var(--line-strong); border-radius:6px; border:2px solid var(--bg);}
  ::-webkit-scrollbar-thumb:hover{background:var(--ink-faint);}
  .sidebar-nav::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.15);}
  .sidebar-nav::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,0.25);}

  main{padding:20px 30px 36px; max-width:1360px; width:100%; margin:0 auto;}

  button{font-family:var(--font-body); cursor:pointer;}
  .btn{border:1px solid var(--line-strong); background:var(--surface); color:var(--ink); padding:8px 15px; border-radius:var(--radius); font-size:13px; font-weight:500; transition:transform 0.08s ease, background 0.15s ease, border-color .15s ease; display:inline-flex; align-items:center; gap:7px;}
  .btn svg{width:15px; height:15px;}
  .btn:hover{background:var(--surface-soft); border-color:var(--ink-faint);}
  .btn:active{transform:scale(0.97);}
  .btn.primary{background:var(--teal); color:#fff; border-color:var(--teal-dark);}
  .btn.primary:hover{background:var(--teal-dark);}
  .btn.danger{background:var(--danger); color:#fff; border-color:#7c2820;}
  .btn.small{padding:5px 11px; font-size:12px;}
  .btn:disabled{opacity:0.5; cursor:not-allowed;}
  .field input:disabled, .field textarea:disabled, .field select:disabled{color:var(--ink); -webkit-text-fill-color:var(--ink); opacity:1; background:var(--surface-soft);}

  .alert-cards{display:grid; grid-template-columns:repeat(auto-fit, minmax(160px,1fr)); gap:12px; margin-bottom:20px;}
  .alert-card{border-radius:10px; padding:16px 18px; color:var(--ink); background:var(--surface-soft); box-shadow:none; display:flex; flex-direction:column; gap:4px;}
  .alert-card.red{background:var(--danger-soft); color:var(--danger);}
  .alert-card.good{background:var(--success-soft); color:var(--success);}
  .alert-card.teal{background:var(--teal-soft); color:var(--teal-dark);}
  .alert-card.gold{background:var(--gold-soft); color:#8F6A2C;}
  .alert-card .top-row{display:flex; justify-content:space-between; align-items:center;}
  .alert-card .top-row svg{width:22px; height:22px; opacity:0.85;}
  .alert-card .count{font-family:var(--font-display); font-size:28px; font-weight:700; letter-spacing:-0.01em;}
  .alert-card .label{font-size:12px; opacity:0.85; font-weight:500; color:var(--ink-soft);}
  .alert-card .link{font-size:11.5px; text-decoration:underline; cursor:pointer; opacity:0.92; align-self:flex-start; background:none; border:none; color:inherit; padding:0; margin-top:2px;}
  .alert-card .stage-row{display:flex; gap:16px; flex-wrap:wrap; margin-top:6px;}
  .alert-card .stage-item{font-size:10.5px; opacity:0.95;}
  .alert-card .stage-item b{font-size:15px; display:block; font-family:var(--font-display);}

  .view-toggle{display:flex; gap:2px; background:var(--surface-soft); border-radius:8px; padding:3px; flex-shrink:0;}
  .view-toggle button{border:none; background:none; padding:7px 13px; border-radius:6px; font-size:12.5px; font-weight:500; color:var(--ink-soft);}
  .view-toggle button.active{background:var(--surface); color:var(--ink); box-shadow:var(--shadow-card);}

  .status-pills{display:flex; gap:6px; flex-wrap:wrap; margin-bottom:16px;}
  .board-filter-bar{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; margin:-4px 0 12px; padding:9px 13px; background:var(--surface-soft); border:1px solid var(--line); border-radius:var(--radius);}
  .board-filter-controls{display:flex; gap:16px; flex-wrap:wrap;}
  .board-filter-field{display:flex; align-items:center; gap:7px;}
  .board-filter-field span{font-size:12px; font-weight:600; text-transform:none; letter-spacing:0; color:var(--ink-soft); white-space:nowrap;}
  .board-filter-field select{border:1px solid var(--line-strong); border-radius:6px; padding:5px 8px; font-size:12.5px; background:var(--surface); color:var(--ink); font-family:var(--font-body);}
  .status-pill-btn{border:1px solid var(--line-strong); background:var(--surface); padding:6px 12px; border-radius:6px; font-size:12px; font-weight:500; display:inline-flex; align-items:center; gap:6px; color:var(--ink);}
  .status-pill-btn .dot{width:7px; height:7px; border-radius:50%; flex-shrink:0;}
  .status-pill-btn.active{background:var(--ink); color:#fff; border-color:var(--ink);}

  .board-status-wrap{position:relative; margin-bottom:14px;}
  .board-status-scroll{display:flex; gap:8px; flex-wrap:nowrap; overflow-x:auto; scroll-behavior:smooth; padding-right:26px; -ms-overflow-style:none; scrollbar-width:none;}
  .board-status-scroll::-webkit-scrollbar{display:none;}
  .board-pill{border:1px solid var(--line-strong); background:var(--surface); padding:8px 14px; border-radius:8px; font-size:12.5px; font-weight:500; text-transform:none; letter-spacing:0; font-family:var(--font-body); display:inline-flex; align-items:center; gap:6px; color:var(--ink-soft); white-space:nowrap; flex-shrink:0; flex-grow:1; justify-content:center;}
  .board-pill .dot{width:6px; height:6px; border-radius:50%; flex-shrink:0;}
  .board-pill.active{background:var(--ink); color:#fff; border-color:var(--ink);}
  .board-status-hint{position:absolute; right:0; top:0; bottom:0; width:24px; display:flex; align-items:center; justify-content:center; background:var(--surface); border:none; cursor:pointer; color:var(--ink-soft); padding:0;}
  .board-status-hint svg{width:13px; height:13px;}
  .board-status-hint.hidden{display:none;}

  .icon-btn{width:30px; height:30px; border-radius:var(--radius); border:1px solid var(--line-strong); background:var(--surface); display:inline-flex; align-items:center; justify-content:center; color:var(--ink-soft); flex-shrink:0;}
  .icon-btn.compact{width:26px; height:26px; padding:0;}
  .icon-btn.danger{color:var(--danger); border-color:var(--danger-soft);}
  .btn.large{font-size:15px; padding:14px 20px; font-weight:700;}
  .icon-btn:hover{background:var(--surface-soft); color:var(--ink);}
  .icon-btn svg{width:15px; height:15px;}

  .priority-dot{width:9px; height:9px; border-radius:50%; display:inline-block;}

  .board-stats{display:flex; gap:12px; margin-bottom:20px; flex-wrap:wrap;}
  .stat-card{background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow-card); border-radius:var(--radius); padding:14px 16px; min-width:170px; display:flex; align-items:center; gap:13px; flex:1;}
  .stat-icon{width:38px; height:38px; border-radius:var(--radius); display:flex; align-items:center; justify-content:center; flex-shrink:0; background:var(--surface-soft); color:var(--ink-soft);}
  .stat-icon svg{width:18px; height:18px;}
  .stat-icon.teal{background:var(--teal-soft); color:var(--teal-dark);}
  .stat-icon.gold{background:var(--gold-soft); color:var(--gold);}
  .stat-icon.violet{background:var(--violet-soft); color:var(--violet);}
  .stat-icon.danger{background:var(--danger-soft); color:var(--danger);}
  .stat-icon.success{background:var(--success-soft); color:var(--success);}
  .stat-card .num{font-family:var(--font-display); font-size:22px; font-weight:700; letter-spacing:-0.01em; line-height:1.1;}
  .stat-card .label{font-size:11.5px; color:var(--ink-soft); margin-top:2px;}

  .toolbar{display:flex; gap:10px; margin-bottom:18px; flex-wrap:wrap; align-items:center;}
  .search-input{flex:1; min-width:220px; padding:10px 13px; border:1px solid var(--line-strong); border-radius:var(--radius); background:var(--surface); font-size:14px;}
  .search-input:focus{outline:2px solid var(--teal); outline-offset:1px;}

  .board{display:flex; gap:16px; overflow-x:auto; padding-bottom:14px;}
  .column{min-width:272px; max-width:272px; flex-shrink:0;}
  .column-head{display:flex; align-items:center; justify-content:space-between; padding:6px 2px; margin-bottom:10px; position:sticky; top:0;}
  .column-head .name{font-family:var(--font-body); font-size:13px; font-weight:600; text-transform:none; letter-spacing:0;}
  .column-head .count{font-family:var(--font-mono); font-size:11.5px; background:var(--surface); border:1px solid var(--line); border-radius:6px; padding:1px 8px; color:var(--ink-soft);}
  .column-list{display:flex; flex-direction:column; gap:10px; min-height:40px;}

  .ticket{background:var(--surface); border:1px solid var(--line); border-left:4px solid var(--ink-faint); border-radius:10px; padding:13px 14px; cursor:pointer; box-shadow:var(--shadow-card); transition:box-shadow 0.15s ease, transform 0.1s ease;}
  .ticket:hover{box-shadow:var(--shadow-hover); transform:translateY(-1px);}
  .ticket-num{font-family:var(--font-mono); font-size:11px; color:var(--ink-faint); font-weight:600; letter-spacing:0.02em;}
  .ticket-client{font-family:var(--font-display); font-size:14.5px; font-weight:600; margin:3px 0 2px;}
  .ticket-device{font-size:12.5px; color:var(--ink-soft); margin-bottom:6px;}
  .repair-tag{display:inline-block; font-size:10.5px; font-weight:600; color:var(--teal-dark); background:var(--teal-soft); padding:2px 8px; border-radius:6px; margin-bottom:7px;}
  .ticket-problem{font-size:12px; color:var(--ink-soft); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
  .ticket-stub{border-top:1px solid var(--line); margin-top:10px; padding-top:8px; display:flex; justify-content:space-between; align-items:center; font-size:11px; color:var(--ink-faint); font-family:var(--font-mono);}
  .ticket-price{font-weight:600; color:var(--ink);}
  .ticket-price.missing{color:var(--danger); font-weight:600;}

  .empty-col{font-size:12px; color:var(--ink-faint); padding:16px 8px; text-align:center; border:1px dashed var(--line-strong); border-radius:10px;}

  .flat-list{display:flex; flex-direction:column; gap:8px;}
  .flat-item{background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow-card); border-radius:10px; padding:11px 15px; display:flex; justify-content:space-between; align-items:center; cursor:pointer; gap:12px;}
  .flat-item:hover{box-shadow:var(--shadow-hover);}
  .sale-item{background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow-card); border-radius:10px; padding:11px 15px; display:flex; justify-content:space-between; align-items:center; gap:12px;}
  .cart-row{display:flex; align-items:center; gap:12px; padding:9px 0; border-bottom:1px solid var(--line);}
  .cart-row:last-of-type{border-bottom:none;}
  .cart-row .main{flex:1; min-width:0;}
  .cart-row .main .name{font-weight:600; font-size:13.5px; display:block;}
  .qty-stepper{display:flex; align-items:center; gap:8px; flex-shrink:0;}
  .stepper-input-wrap{display:flex; align-items:center; gap:6px;}
  .stepper-input-wrap input{text-align:center;}
  .stepper-btn{width:32px; height:32px; flex-shrink:0; border-radius:8px; border:1px solid var(--line-strong); background:var(--surface-soft); color:var(--ink); font-size:16px; font-weight:700; cursor:pointer; display:flex; align-items:center; justify-content:center;}
  .stepper-btn:active{background:var(--teal-soft); border-color:var(--teal);}
  .price-preview-live{font-size:13px; font-weight:600; color:var(--teal-dark); background:var(--teal-soft); border-radius:8px; padding:9px 12px; margin:0 0 12px;}
  .qty-btn{width:26px; height:26px; border-radius:6px; border:1px solid var(--line-strong); background:var(--surface-soft); font-size:15px; font-weight:700; line-height:1; color:var(--ink); display:flex; align-items:center; justify-content:center;}
  .qty-val{min-width:20px; text-align:center; font-weight:600; font-size:13.5px;}
  .cart-price-input{width:90px; flex-shrink:0; padding:6px 8px; border:1px solid var(--line-strong); border-radius:6px; font-size:13px; text-align:right;}
  .cart-subtotal{width:90px; flex-shrink:0; text-align:right; font-weight:600; font-size:13.5px;}
  .cart-total-line{display:flex; justify-content:space-between; font-size:15px; font-weight:700; margin-top:12px; padding-top:12px; border-top:1px solid var(--line-strong);}
  .flat-item .main, .sale-item .main{display:flex; flex-direction:column; gap:2px;}
  .flat-item .main .name, .sale-item .main .name{font-family:var(--font-display); font-weight:600; font-size:14.5px;}
  .flat-item .main .meta, .sale-item .main .meta{font-size:12px; color:var(--ink-soft);}
  .status-pill{font-family:var(--font-mono); font-size:11px; font-weight:600; padding:3px 10px; border-radius:6px; white-space:nowrap;}
  .status-pill-wrap{position:relative; display:inline-block;}
  .status-pill-wrap::after{content:''; position:absolute; right:9px; top:50%; width:7px; height:7px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:translateY(-65%) rotate(45deg); pointer-events:none;}
  .status-pill-select{font-family:var(--font-mono); font-size:11px; font-weight:700; padding:5px 26px 5px 10px; border-radius:6px; white-space:nowrap; border-width:1.5px; cursor:pointer; -webkit-appearance:none; -moz-appearance:none; appearance:none;}
  .location-select{font-size:12px; padding:6px 8px; border:1px solid var(--line-strong); border-radius:6px; background:var(--surface-soft); color:var(--ink); cursor:pointer; max-width:130px;}

  .overlay{position:fixed; inset:0; background:rgba(18,24,29,0.6); display:flex; align-items:flex-start; justify-content:center; padding:5vh 16px; overflow-y:auto; z-index:50;}
  .modal{background:var(--surface); border-radius:12px; max-width:560px; width:100%; padding:24px; margin-bottom:5vh; box-shadow:0 20px 50px rgba(0,0,0,0.25);}
  .modal h2{font-size:17px; margin:0 0 4px; font-weight:600;}
  .modal .modal-sub{font-size:12px; color:var(--ink-soft); margin-bottom:18px;}
  .field{margin-bottom:13px;}
  .field label{display:block; font-size:12px; font-weight:600; color:var(--ink-soft); margin-bottom:4px;}
  .field input, .field select, .field textarea{width:100%; padding:9px 11px; border:1px solid var(--line-strong); border-radius:8px; font-size:14px; background:var(--surface-soft); color:var(--ink);}
  .field textarea{resize:vertical; min-height:56px;}
  .field input:focus, .field select:focus, .field textarea:focus{outline:2px solid var(--teal); outline-offset:0; background:#fff;}
  .row2{display:grid; grid-template-columns:1fr 1fr; gap:10px;}
  .row3{display:grid; grid-template-columns:1fr 1fr 1fr; gap:10px;}
  .modal-actions{display:flex; justify-content:flex-end; gap:8px; margin-top:20px; padding-top:16px; border-top:1px solid var(--line);}
  .modal-actions.spread{justify-content:space-between;}

  .chip-row{display:flex; flex-wrap:wrap; gap:8px;}
  .chip{border:1.5px solid var(--line-strong); background:var(--surface-soft); color:var(--ink); padding:7px 12px; border-radius:6px; font-size:12px; font-weight:500; transition:background .15s ease, border-color .15s ease, transform .1s ease, box-shadow .15s ease;}
  .chip:hover{background:#E2E5DE; transform:translateY(-1px); box-shadow:0 2px 6px rgba(27,21,51,0.08);}
  .chip.active{background:var(--teal); color:#fff; border-color:var(--teal-dark); box-shadow:0 2px 8px rgba(91,58,158,0.28);}

  .intake-card{max-width:660px; margin:0 auto; background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow-card); border-radius:12px; padding:26px;}

  .tn-wrap{max-width:980px; margin:0 auto 90px;}
  .tn-header{margin-bottom:14px;}
  .tn-header h2{font-size:19px; margin:0 0 4px;}
  .tn-header p{font-size:13px; color:var(--ink-soft); margin:0;}
  .tn-grid-2col{display:grid; grid-template-columns:1fr 1fr; gap:14px; align-items:start;}
  .canje-grid-3col{display:grid; grid-template-columns:1fr 1fr 1fr; gap:14px; align-items:start;}
  .tn-section{background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow-card); border-radius:10px; padding:13px 15px; margin-bottom:9px;}
  .tn-section-title{font-family:var(--font-mono); font-size:12.5px; font-weight:600; text-transform:none; letter-spacing:0; color:var(--teal-dark); margin-bottom:9px; display:flex; align-items:center; gap:7px;}
  .tn-section-title svg{width:14px; height:14px; flex-shrink:0;}
  .tn-section .field{margin-bottom:9px;}
  .tn-section .row2{margin-bottom:0; gap:9px;}
  .tn-section .row2 .field{margin-bottom:0;}
  .tn-section label{font-size:11.5px; margin-bottom:3px;}
  .tn-section input, .tn-section select, .tn-section textarea{padding:8px 10px; font-size:13px;}
  .tn-section .chip{padding:6px 12px; font-size:12px;}

  .model-dropdown{position:absolute; top:100%; left:0; right:0; margin-top:4px; background:var(--surface); border:1px solid var(--line-strong); border-radius:10px; box-shadow:0 8px 24px rgba(27,21,51,0.16); max-height:260px; overflow-y:auto; overflow-x:hidden; z-index:20;}
  .model-dropdown-item{display:flex; flex-direction:column; gap:3px; width:100%; padding:9px 12px; border:none; border-bottom:1px solid var(--line); background:var(--surface); text-align:left; cursor:pointer;}
  .model-dropdown-item:last-child{border-bottom:none;}
  .model-dropdown-item:hover{background:var(--teal-soft);}
  .model-dropdown-item .md-model{font-weight:600; font-size:12.5px; white-space:normal; word-break:break-word; line-height:1.3;}
  .model-dropdown-item .md-meta{display:flex; justify-content:space-between; align-items:baseline; gap:10px;}
  .model-dropdown-item .md-type{font-size:11.5px; color:var(--ink-soft); white-space:normal; word-break:break-word;}
  .model-dropdown-item .md-price{font-weight:700; font-size:12.5px; color:var(--teal-dark); flex-shrink:0; white-space:nowrap;}
  .tn-section .chip-row{gap:6px;}
  .modal-wide{max-width:960px !important;}
  .tn-section-title .tn-num{width:20px; height:20px; border-radius:6px; background:var(--teal-soft); color:var(--teal-dark); display:inline-flex; align-items:center; justify-content:center; font-size:11px; font-weight:700; flex-shrink:0;}
  .tn-section-title .tn-optional-tag{font-weight:400; text-transform:none; letter-spacing:0; color:var(--ink-faint); margin-left:auto;}
  .tn-section:last-of-type{margin-bottom:0;}
  .tn-section .field:last-child, .tn-section .row2:last-child{margin-bottom:0;}
  .tn-sticky-footer{position:sticky; bottom:0; left:0; right:0; background:linear-gradient(to top, var(--bg) 60%, transparent); padding:16px 0 4px; margin-top:-10px; z-index:5;}
  .tn-sticky-footer-inner{max-width:640px; margin:0 auto; background:var(--surface); border:1px solid var(--line); box-shadow:0 -4px 20px rgba(27,21,51,0.10); border-radius:12px; padding:12px;}
  .tn-sticky-footer .btn.primary{width:100%; justify-content:center; font-size:14.5px; padding:13px;}
  .price-highlight{font-size:19px !important; font-weight:700; color:var(--teal-dark); background:var(--teal-soft); border:1.5px solid var(--teal) !important; text-align:center;}
  .price-highlight::placeholder{color:var(--danger); opacity:0.55; font-weight:500; font-size:12.5px;}
  .intake-card .ticket-badge{display:inline-block; font-family:var(--font-mono); font-size:12px; color:var(--teal-dark); background:var(--teal-soft); padding:4px 11px; border-radius:6px; margin-bottom:18px; font-weight:600;}

  .price-box{background:var(--surface-soft); border:1px solid var(--line); border-radius:10px; padding:14px; margin-bottom:14px;}
  .price-box .final-line{display:flex; justify-content:space-between; align-items:baseline; margin-top:9px; padding-top:9px; border-top:1px solid var(--line);}
  .price-box .final-line .lbl{font-size:12px; color:var(--ink-soft); font-weight:600;}
  .price-box .final-line .val{font-family:var(--font-display); font-size:19px; font-weight:700;}
  .price-box .tag-missing{display:inline-block; font-size:11px; font-weight:600; color:var(--danger); background:var(--danger-soft); padding:2px 9px; border-radius:6px; margin-left:8px;}

  .delivery-warning{display:none; margin-top:10px; padding:10px 12px; background:var(--danger-soft); color:var(--danger); border-radius:8px; font-size:12.5px; font-weight:500;}
  .delivery-warning.show{display:block;}

  .admin-box{margin-top:16px; padding-top:16px; border-top:1px dashed var(--line-strong);}
  .admin-box .flag{font-family:var(--font-mono); font-size:11px; color:var(--gold); font-weight:600; margin-bottom:8px; display:block; text-transform:none; letter-spacing:0;}

  .pay-section{margin-top:18px; padding-top:18px; border-top:1px solid var(--line);}
  .pay-section h3{font-family:var(--font-display); font-size:14px; margin:0 0 10px; font-weight:600;}
  .pay-row{display:flex; justify-content:space-between; align-items:center; padding:9px 12px; background:var(--surface-soft); border-radius:8px; margin-bottom:6px; font-size:12.5px;}
  .pay-row .info{display:flex; flex-direction:column; gap:1px;}
  .pay-row .info .method{font-weight:600;}
  .pay-row .info .meta{color:var(--ink-soft); font-size:11.5px;}
  .pay-row .amount{font-family:var(--font-mono); font-weight:600; display:flex; align-items:center; gap:8px;}
  .pay-summary{display:flex; justify-content:space-between; font-size:12.5px; margin-top:9px; padding-top:9px; border-top:1px solid var(--line);}
  .pay-summary .paid{color:var(--success); font-weight:600;}
  .pay-summary .due{color:var(--danger); font-weight:600;}
  .pay-summary .due.zero{color:var(--success);}

  .wa-btn{display:inline-flex; align-items:center; gap:7px; background:#1F8A3D; color:#fff; border:none; padding:10px 16px; border-radius:var(--radius); font-size:13px; font-weight:600; text-decoration:none;}
  .wa-btn:hover{background:#186e30;}
  .wa-btn svg{width:15px; height:15px;}

  .finance-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(180px,1fr)); gap:12px; margin-bottom:22px;}
  .fin-card{background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow-card); border-radius:var(--radius); padding:15px 17px; display:flex; align-items:center; gap:13px;}
  .fin-card .label{font-size:11.5px; color:var(--ink-soft); margin-bottom:3px;}
  .fin-card .value{font-family:var(--font-display); font-size:20px; font-weight:700;}
  .fin-card.pos .value{color:var(--success);}
  .fin-card.neg .value{color:var(--danger);}

  .range-btns{display:flex; gap:6px; margin-bottom:18px; flex-wrap:wrap;}
  .cal-header{display:flex; align-items:center; justify-content:center; gap:16px; margin:10px 0 12px;}
  .cal-grid{display:grid; grid-template-columns:repeat(7, 1fr); gap:5px;}
  .cal-grid-labels{margin-bottom:6px;}
  .cal-weekday{text-align:center; font-size:10.5px; font-weight:700; color:var(--ink-soft); text-transform:uppercase; letter-spacing:0.04em;}
  .cal-cell{min-height:78px; background:var(--surface); border:1px solid var(--line); border-radius:6px; padding:5px; overflow:hidden; cursor:pointer;}
  .cal-cell:hover{border-color:var(--teal);}
  .cal-cell.cal-empty{background:transparent; border:none; cursor:default;}
  .cal-cell.cal-today{border:1.5px solid var(--teal); background:var(--teal-soft);}
  .cal-daynum{font-size:11.5px; font-weight:700; color:var(--ink-soft); margin-bottom:3px;}
  .cal-tasks{display:flex; flex-direction:column; gap:2px;}
  .cal-task{font-size:10px; background:var(--teal); color:#fff; border-radius:4px; padding:2px 5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  .cal-task.cal-task-done{background:var(--line-strong); color:var(--ink-soft); text-decoration:line-through;}
  .cal-more{font-size:9.5px; color:var(--ink-soft); padding-left:3px;}
  .board-cards-wrap{display:none;}
  .board-card{display:flex; align-items:center; justify-content:space-between; gap:10px; background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:11px 13px; margin-bottom:8px; cursor:pointer;}
  .board-card:active{background:var(--surface-soft);}
  .board-card-title{font-size:13.5px; font-weight:600; color:var(--ink);}
  .board-card-sub{font-size:11.5px; color:var(--ink-soft); margin-top:2px;}
  .board-card-tag{font-family:var(--font-mono); font-size:9.5px; font-weight:600; padding:2px 6px; border-radius:6px; margin-left:4px;}
  .board-card-side{display:flex; flex-direction:column; align-items:stretch; gap:6px; flex-shrink:0; min-width:118px;}
  .board-card-side .location-select{font-size:11px; padding:4px 8px;}
  .board-card-side .icon-btn{align-self:center;}
  .board-card-side .status-pill-select{font-size:10.5px; padding:4px 8px;}
  @media (max-width:700px){
    .board-table-wrap{display:none;}
    .board-cards-wrap{display:block;}
  }
  @media (max-width:600px){ .cal-cell{min-height:56px;} .cal-task{font-size:8.5px;} }
  .range-btn{padding:7px 14px; font-size:12.5px; border-radius:6px; border:1px solid var(--line-strong); background:var(--surface); font-weight:500;}
  .range-btn.active{background:var(--ink); color:#fff; border-color:var(--ink);}

  .section-head{display:flex; justify-content:space-between; align-items:center; margin:18px 0 8px; flex-wrap:wrap; gap:8px;}
  .section-head h3{font-family:var(--font-display); font-size:15px; margin:0; font-weight:600;}
  .section-note{font-size:12px; color:var(--ink-soft); margin:0 0 10px;}

  .two-col-tables{display:grid; grid-template-columns:1fr 1fr; gap:16px;}

  table.data-table{width:100%; border-collapse:collapse; background:var(--surface); border-radius:10px; overflow:hidden; border:1px solid var(--line); box-shadow:var(--shadow-card);}
  table.data-table th{text-align:left; font-size:11.5px; text-transform:none; letter-spacing:0; color:var(--ink-soft); padding:10px 13px; background:var(--surface-soft); font-family:var(--font-mono); font-weight:600; position:sticky; top:0; z-index:3; box-shadow:0 1px 0 var(--line);}
  table.data-table td{padding:10px 13px; font-size:13px; font-family:var(--font-mono); border-top:1px solid var(--line); vertical-align:middle;}
  table.data-table tbody tr:nth-child(even) td{background:var(--surface-soft);}
  table.data-table tr.tr-priority td{background:#FFE0DC !important;}
  [data-theme="dark"] table.data-table tr.tr-priority td{background:#4A2320 !important;}
  table.data-table tr:hover td{background:#E9EBEE;}
  table.data-table td input{width:100%; padding:6px 8px; border:1px solid var(--line-strong); border-radius:6px; font-size:12.5px; background:var(--surface-soft);}
  @keyframes rowFlash{ 0%{ background-color:var(--teal-soft); } 100%{ background-color:transparent; } }
  tr.row-flash td{ animation:rowFlash 1.3s ease-out; }
  .field{ position:relative; }
  .autosave-badge{
    position:absolute; top:0; right:0; font-size:10.5px; font-weight:700; color:var(--success);
    background:var(--success-soft); padding:2px 8px; border-radius:10px; animation:fadeOutBadge 1.6s ease-in forwards;
  }
  table.data-table td{ position:relative; }
  @keyframes fadeOutBadge{ 0%,70%{ opacity:1; } 100%{ opacity:0; } }
  .data-table-compact th, .data-table-compact td{padding:9px 10px;}
  .data-table-compact th{font-size:10px; padding:9px 10px;}
  .data-table-compact td{font-size:12.5px;}
  .data-table-compact td input{padding:6px 8px; font-size:12px; border-radius:6px;}
  .data-table-compact td input[type="number"]::-webkit-outer-spin-button,
  .data-table-compact td input[type="number"]::-webkit-inner-spin-button{-webkit-appearance:none; margin:0;}
  .data-table-compact td input[type="number"]{-moz-appearance:textfield;}
  .data-table-compact .stepper-btn{width:26px; height:26px; font-size:14px; font-weight:700; border-radius:6px; flex-shrink:0;}
  .data-table-compact .stepper-input-wrap{gap:5px;}
  .data-table-compact .stepper-input-wrap input{font-size:13px !important; font-weight:700; padding:6px 3px !important;}
  .price-final-cell input{background:var(--teal-soft) !important; border:1.5px solid var(--teal) !important; color:var(--teal-dark) !important; font-weight:800 !important; font-size:12.5px !important;}
  .num-cell{font-family:var(--font-mono); text-align:right;}
  .bar-cell{width:120px;}
  .bar-track{background:var(--surface-soft); border-radius:6px; height:8px; overflow:hidden;}
  .bar-fill{background:var(--teal); height:100%;}

  .accounts-box{background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow-card); border-radius:var(--radius); padding:12px 14px; margin-bottom:10px;}

  .gasto-breakdown-box{background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow-card); border-radius:var(--radius); padding:16px 18px; margin-bottom:16px;}
  .gasto-breakdown-row{margin-bottom:12px;}
  .gasto-breakdown-row:last-child{margin-bottom:0;}
  .gasto-breakdown-labels{display:flex; justify-content:space-between; font-size:12.5px; margin-bottom:5px;}
  .gasto-breakdown-track{height:7px; background:var(--surface-soft); border-radius:5px; overflow:hidden;}
  .gasto-breakdown-fill{height:100%; border-radius:5px;}

  .gasto-list{background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow-card); border-radius:var(--radius); overflow:hidden;}
  .gasto-row{display:flex; align-items:center; gap:13px; padding:13px 16px; border-bottom:1px solid var(--line);}
  .gasto-row:last-child{border-bottom:none;}
  .gasto-row:hover{background:var(--surface-soft);}
  .gasto-row-icon{width:36px; height:36px; border-radius:9px; display:flex; align-items:center; justify-content:center; flex-shrink:0;}
  .gasto-row-icon svg{width:18px; height:18px;}
  .gasto-row-main{flex:1; min-width:0;}
  .gasto-row-cat{font-size:13px; font-weight:700;}
  .gasto-row-desc{font-size:11.5px; color:var(--ink-soft); margin-top:2px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .gasto-row-amount{text-align:right; flex-shrink:0;}
  .gasto-row-amount .amt{font-size:13.5px; font-weight:700;}
  .gasto-row-amount .dt{font-size:10.5px; color:var(--ink-soft); margin-top:2px;}
  .gasto-row-actions{display:flex; gap:6px; flex-shrink:0;}
  .accounts-box[data-open-salary-person]:hover{box-shadow:var(--shadow-hover); border-color:var(--teal);}
  .account-chip{display:inline-flex; align-items:center; gap:8px; background:var(--surface-soft); border:1px solid var(--line-strong); border-radius:6px; padding:5px 8px 5px 13px; font-size:12.5px; margin:0 6px 6px 0;}
  .account-chip button{border:none; background:none; color:var(--danger); font-weight:700; font-size:13px; padding:0 2px; line-height:1;}
  .add-account-row{display:flex; gap:8px; margin-top:9px; flex-wrap:wrap;}
  .add-account-row input{flex:1; min-width:140px; padding:8px 11px; border:1px solid var(--line-strong); border-radius:8px; font-size:13px;}

  .empty-state{text-align:center; padding:48px 20px; color:var(--ink-soft);}
  .empty-state .empty-icon{width:40px; height:40px; margin:0 auto 12px; border-radius:10px; background:var(--surface-soft); display:flex; align-items:center; justify-content:center; color:var(--ink-faint);}
  .empty-state .empty-icon svg{width:19px; height:19px;}
  .empty-state .big{font-family:var(--font-display); font-size:16px; font-weight:600; color:var(--ink); margin-bottom:5px;}

  .logo-preview-box{width:64px; height:64px; border-radius:12px; overflow:hidden; background:var(--surface-soft); border:1px solid var(--line-strong); display:flex; align-items:center; justify-content:center; margin-bottom:10px;}
  .logo-preview-box img{width:100%; height:100%; object-fit:cover;}

  .venta-grid{display:grid; grid-template-columns:280px 1fr; gap:16px; align-items:start;}
  .venta-col-left{background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow-card); border-radius:var(--radius); padding:18px;}
  .venta-col-left h3{font-size:14px; text-transform:none; letter-spacing:0; color:var(--ink-soft); margin:0 0 14px;}

  #hamburger-btn{ display:none; }
  #sidebar-scrim{ display:none; }

  @media (max-width:880px){
    .app-shell{flex-direction:column;}
    #hamburger-btn{ display:flex; }
    .topbar-utility{ justify-content:space-between; }
    .sidebar{
      width:270px; height:100vh; position:fixed; top:0; left:0; z-index:60;
      flex-direction:column; align-items:stretch; flex-wrap:nowrap;
      transform:translateX(-100%); transition:transform .22s ease;
      box-shadow:4px 0 24px rgba(0,0,0,0.25);
    }
    .sidebar.open{ transform:translateX(0); }
    .sidebar-brand{border-bottom:1px solid rgba(255,255,255,0.08); padding:20px 18px;}
    .sidebar-nav{flex-direction:column; overflow-x:visible; overflow-y:auto; padding:10px 12px; flex:1;}
    .nav-item{white-space:normal; width:100%; padding:13px 12px; font-size:14.5px;}
    .sidebar-footer{border-top:1px solid rgba(255,255,255,0.08); flex-direction:column; align-items:stretch; padding:14px 18px;}
    #sidebar-scrim{
      display:block; position:fixed; inset:0; background:rgba(18,24,29,0.55); z-index:55;
      opacity:0; pointer-events:none; transition:opacity .22s ease;
    }
    #sidebar-scrim.open{ opacity:1; pointer-events:auto; }
    .page-header{padding:16px 16px 4px;}
    main{padding:14px 16px 30px;}
    .venta-grid{grid-template-columns:1fr;}
    .tn-grid-2col{grid-template-columns:1fr;}
    .canje-grid-3col{grid-template-columns:1fr;}
    .modal-wide{max-width:100% !important;}

    /* Evita que Safari/Chrome hagan zoom automático al tocar un campo */
    .field input, .field select, .field textarea,
    .search-input, .cart-price-input, #quick-add-input, #manual-add-name, #manual-add-price{
      font-size:16px;
    }
    /* Objetivos táctiles más grandes */
    .icon-btn{ width:40px; height:40px; }
    .chip{ padding:11px 15px; font-size:13.5px; }
    .qty-btn{ width:34px; height:34px; font-size:17px; }
    .btn{ padding:10px 16px; }
    .status-pill-btn{ padding:9px 14px; }
  }
  @media (max-width:720px){
    .row2, .row3{grid-template-columns:1fr;}
    .two-col-tables{grid-template-columns:1fr;}
  }
  @media (max-width:480px){
    .alert-cards{grid-template-columns:1fr;}
    .sidebar{ width:85vw; }
    .modal{ padding:18px; border-radius:12px; }
    .overlay{ padding:0; align-items:stretch; }
    .modal{ margin-bottom:0; min-height:100vh; border-radius:0; }

    /* Modo compacto: menos aire, letra más chica, para que entre más sin scrollear */
    .page-header{padding:12px 12px 2px;}
    .page-header h1{font-size:18px;}
    .page-header p{font-size:12px;}
    .eyebrow{font-size:10px;}
    main{padding:10px 12px 24px;}
    .tn-header h2{font-size:16px; margin-bottom:2px;}
    .tn-header p{font-size:11.5px;}
    .tn-section{padding:11px 12px; margin-bottom:8px; border-radius:10px;}
    .tn-section-title{font-size:9.5px; margin-bottom:7px;}
    .field{margin-bottom:9px;}
    .field label{font-size:11px; margin-bottom:3px;}
    .field input, .field select, .field textarea{padding:7px 9px;}
    .accounts-box{padding:12px 14px; margin-bottom:10px;}
    .fin-card{padding:12px 14px;}
    .fin-card .value{font-size:16px;}
    .fin-card .label{font-size:10.5px;}
    .section-head h3{font-size:13px;}
    .chip{ padding:7px 12px; font-size:12px; }
    .icon-btn{ width:32px; height:32px; }
    .icon-btn svg{ width:14px; height:14px; }
    .btn{ padding:8px 13px; font-size:12.5px; }
    .btn.small{ padding:6px 10px; font-size:11.5px; }
    .status-pill-btn{ padding:7px 11px; font-size:11.5px; }
    .qty-btn{ width:28px; height:28px; font-size:15px; }
    .data-table th{ padding:7px 9px; font-size:9px; }
    .data-table td{ padding:7px 9px; font-size:12px; }
    .modal h2{font-size:16px;}
    .modal-sub{font-size:12px;}
    .sale-item, .flat-item, .cart-row{padding:9px 10px;}
  }

/* ---- Widget flotante de notas del equipo ---- */
.tn-widget-btn{
  position:fixed; bottom:22px; right:22px; z-index:60;
  width:54px; height:54px; border-radius:50%; border:none;
  background:var(--teal); color:#fff; cursor:pointer;
  box-shadow:0 6px 18px rgba(0,0,0,0.25);
  display:flex; align-items:center; justify-content:center;
}
.tn-widget-btn svg{ width:24px; height:24px; }
.tn-widget-badge{
  position:absolute; top:-4px; right:-4px; background:var(--danger); color:#fff;
  font-size:10.5px; font-weight:700; min-width:19px; height:19px; border-radius:10px;
  display:flex; align-items:center; justify-content:center; padding:0 4px; border:2px solid var(--bg);
}
.tn-widget-panel{
  position:fixed; bottom:88px; right:22px; z-index:60;
  width:340px; max-width:calc(100vw - 32px); height:460px; max-height:calc(100vh - 130px);
  background:var(--surface); border:1px solid var(--line); border-radius:14px;
  box-shadow:0 16px 40px rgba(0,0,0,0.25); display:flex; flex-direction:column; overflow:hidden;
}
.tn-widget-header{
  padding:14px 16px; background:var(--sidebar-bg); color:#fff; font-weight:700; font-size:13.5px;
  display:flex; justify-content:space-between; align-items:center; flex-shrink:0;
}
.tn-widget-header button{ background:none; border:none; color:#fff; cursor:pointer; opacity:0.75; padding:2px; }
.tn-widget-toggle-resolved{ font-size:11px; font-weight:600; color:var(--teal-dark); background:none; border:none; cursor:pointer; padding:10px 16px 0; text-align:left; flex-shrink:0; }
.tn-widget-feed{ flex:1; overflow-y:auto; padding:12px 14px; display:flex; flex-direction:column; gap:9px; }
.tn-note-bubble{ background:var(--surface-soft); border-radius:10px; padding:8px 11px; font-size:12.5px; line-height:1.4; max-width:88%; align-self:flex-start; }
.tn-note-bubble.resolved{ opacity:0.5; text-decoration:line-through; }
.tn-note-meta{ display:flex; justify-content:space-between; align-items:center; gap:8px; margin-top:4px; }
.tn-note-meta span{ font-size:10px; color:var(--ink-faint); font-weight:600; }
.tn-note-resolve-btn{ font-size:10px; font-weight:700; color:var(--success); background:none; border:none; cursor:pointer; padding:0; flex-shrink:0; }
.tn-widget-input-row{ display:flex; gap:8px; padding:12px 14px; border-top:1px solid var(--line); flex-shrink:0; }
.tn-widget-input-row input{ flex:1; border:1px solid var(--line-strong); border-radius:8px; padding:9px 11px; font-size:12.5px; background:var(--bg); color:var(--ink); }
.tn-widget-input-row button{ background:var(--teal); color:#fff; border:none; border-radius:8px; padding:0 14px; font-weight:700; font-size:12.5px; cursor:pointer; }
@media (max-width:700px){
  .tn-widget-btn{ bottom:16px; right:16px; }
  .tn-widget-panel{ bottom:80px; right:12px; width:calc(100vw - 24px); }
}

/* ---- Marketing: calendario de contenido + banco de ideas al costado ---- */
.marketing-cal-layout{ display:flex; gap:18px; align-items:flex-start; }
.marketing-cal-main{ flex:1; min-width:0; }
.marketing-cal-sidebar{
  width:260px; flex-shrink:0; background:var(--surface); border:1px solid var(--line);
  border-radius:var(--radius); padding:14px; max-height:640px; overflow-y:auto;
}
.idea-card{ background:var(--surface-soft); border-radius:8px; padding:9px 10px; margin-bottom:8px; font-size:12.5px; }
@media (max-width:860px){
  .marketing-cal-layout{ flex-direction:column; }
  .marketing-cal-sidebar{ width:100%; max-height:none; }
}

/* ---- Taller: panel unificado (acciones + buscadores) ---- */
.board-panel{ background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:20px; margin-bottom:16px; box-shadow:0 2px 8px rgba(24,20,37,0.04); }
.action-row{ display:flex; gap:12px; margin-bottom:18px; }
.action-tile{ flex:1; display:flex; align-items:center; gap:12px; border-radius:12px; padding:14px 16px; cursor:pointer; border:1.5px solid transparent; transition:transform .1s; }
.action-tile:active{ transform:scale(0.98); }
.action-tile.ingreso{ background:linear-gradient(135deg, var(--teal-dark), var(--teal)); color:#fff; }
.action-tile.venta{ background:var(--surface); border-color:var(--line-strong); }
.action-tile .ic-circle{ width:38px; height:38px; border-radius:10px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.action-tile.ingreso .ic-circle{ background:rgba(255,255,255,0.18); }
.action-tile.ingreso .ic-circle svg{ stroke:#fff; }
.action-tile.venta .ic-circle{ background:var(--surface-soft); }
.action-tile.venta .ic-circle svg{ stroke:#9A6A1F; }
.action-tile .ic-circle svg{ width:19px; height:19px; }
.action-tile .at-title{ font-size:13.5px; font-weight:700; }
.action-tile.venta .at-title{ color:var(--ink); }
.action-tile .at-caption{ font-size:11px; opacity:0.85; margin-top:1px; }
.action-tile.ingreso .at-caption{ color:rgba(255,255,255,0.78); }
.action-tile.venta .at-caption{ color:var(--ink-faint); }
.board-panel-divider{ height:1px; background:var(--line); margin-bottom:18px; }
.search-grid{ display:flex; gap:14px; flex-wrap:wrap; }
.search-col{ flex:1; min-width:260px; }
.search-caption{ font-size:11px; color:var(--ink-faint); padding:5px 2px 0; line-height:1.4; }
.dual-search-box{ background:var(--surface); border:1.5px solid var(--line); border-radius:12px; padding:11px 15px; position:relative; }
.dual-search-box.tickets{ border-color:var(--teal); box-shadow:0 0 0 3px rgba(59,67,78,0.10); }
.dual-search-box.products{ border-color:var(--line-strong); box-shadow:0 0 0 3px rgba(59,67,78,0.06); }
.dual-search-lbl{ display:flex; align-items:center; gap:6px; font-size:12px; font-weight:600; text-transform:none; letter-spacing:0; margin-bottom:4px; }
.dual-search-box.tickets .dual-search-lbl{ color:var(--teal); }
.dual-search-box.products .dual-search-lbl{ color:var(--ink-soft); }
.dual-search-lbl svg{ width:13px; height:13px; }
.dual-search-box input.search-input{ border:none !important; padding:2px 0 !important; box-shadow:none !important; font-size:13.5px; }
#product-quick-results{ display:none; position:absolute; top:100%; left:-1.5px; right:-1.5px; margin-top:6px; background:var(--surface); border:1.5px solid var(--line-strong); border-radius:10px; box-shadow:0 10px 24px rgba(59,67,78,0.18); z-index:30; max-height:320px; overflow-y:auto; }
#product-quick-results.open{ display:block; }
.dual-search-result{ display:flex; justify-content:space-between; align-items:center; gap:10px; padding:10px 14px; border-bottom:1px solid var(--line); }
.dual-search-result:last-child{ border-bottom:none; }
.dsr-name{ font-size:12.5px; font-weight:600; }
.dsr-meta{ font-size:11px; color:var(--ink-faint); margin-top:1px; }
.dsr-meta .ok{ color:var(--success); font-weight:600; }
.dsr-meta .low{ color:var(--danger); font-weight:600; }
.dsr-add-btn{ background:var(--surface-soft); color:var(--ink); border:1px solid var(--line-strong); border-radius:7px; padding:6px 11px; font-size:11px; font-weight:700; white-space:nowrap; cursor:pointer; }
.dual-search-empty{ padding:14px; font-size:12px; color:var(--ink-faint); text-align:center; }
@media (max-width:700px){ .action-row, .search-grid{ flex-direction:column; } }


/* ---- Acción sugerida: WhatsApp destacado cuando el ticket está listo para retirar ---- */
.icon-btn.wa-suggested{ background:#1F8A3D; color:#fff; border-color:#1F8A3D; }


  /* ---- Configuración con secciones ---- */
  .stabs{display:flex; flex-wrap:wrap; gap:4px; margin:8px 0 18px; border-bottom:1px solid var(--line);}
  .stabs button{border:none; background:none; padding:9px 13px; font-size:13px; font-weight:500; color:var(--ink-soft); border-bottom:2px solid transparent; margin-bottom:-1px; cursor:pointer;}
  .stabs button.active{color:var(--teal-dark); border-bottom-color:var(--teal);}
  .plan-status{background:var(--teal-soft); border-radius:10px; padding:12px 14px; font-size:13.5px; margin-bottom:14px; text-transform:none;}
  .plan-status.warn{background:var(--gold-soft);}
  .plan-status.ok{background:var(--success-soft);}
  .plan-grid{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:14px;}
  .plan-card{border:1px solid var(--line-strong); border-radius:12px; padding:16px; background:var(--surface);}
  .plan-card.featured{border-color:var(--teal); box-shadow:0 0 0 1px var(--teal);}
  .plan-name{font-size:12px; letter-spacing:.08em; font-weight:700; color:var(--ink-soft);}
  .plan-price{font-size:26px; font-weight:700; margin:4px 0 10px;}
  .plan-price span{font-size:13px; font-weight:500; color:var(--ink-soft);}
  .plan-card ul{margin:0; padding-left:18px; font-size:13px; line-height:1.5; text-transform:none;}
  .plan-card li{margin-bottom:5px;}
  .plan-note{background:var(--surface-soft); border-radius:10px; padding:12px 14px; font-size:13px; margin-bottom:14px; text-transform:none;}
  .guide-list{margin:0; padding-left:0; list-style:none; counter-reset:g;}
  .guide-list li{counter-increment:g; display:flex; flex-direction:column; gap:2px; padding:10px 0 10px 40px; position:relative; border-bottom:1px solid var(--line); text-transform:none;}
  .guide-list li::before{content:counter(g); position:absolute; left:0; top:10px; width:26px; height:26px; border-radius:50%; background:var(--teal-soft); color:var(--teal-dark); font-weight:700; font-size:13px; display:flex; align-items:center; justify-content:center;}
  .guide-list li span{font-size:13px; color:var(--ink-soft);}
  .guide-list.compact li{border-bottom:none; padding:6px 0 6px 40px;}
  .guide-list.compact li::before{top:6px;}
  .wa-demo-title{font-size:12px; font-weight:600; color:var(--ink-soft); margin-bottom:6px; text-transform:none;}
  .wa-bubble{background:#DCF8C6; color:#1B2B1B; border-radius:12px 12px 12px 2px; padding:12px 14px; font-size:13px; line-height:1.45; white-space:pre-wrap; max-width:420px; text-transform:none;}
  [data-theme="dark"] .wa-bubble{background:#1F3A2A; color:#E5F3E5;}
  .acc-email{font-size:14px; padding:9px 0; text-transform:none;}
  @media (max-width:640px){ .plan-grid{grid-template-columns:1fr;} .stabs button{padding:8px 9px; font-size:12.5px;} }
  [data-spane="whatsapp"], [data-spane="plan"], [data-spane="guia"], [data-spane="privacidad"], [data-spane="cuenta"]{text-transform:none;}
  [data-spane="whatsapp"] .section-note, [data-spane="cuenta"] .section-note, [data-spane="guia"] .section-note{text-transform:none; font-size:12.5px;}
  /* El logo del ingreso se ve en grises (quitá esta línea si tu logo ya es gris o querés color) */

  /* ---- Pulido profesional ---- */
  .btn{border-radius:7px; font-weight:500;}
  .btn.primary{box-shadow:none;}
  .intake-card, .modal{border-radius:12px;}
  h1,h2,h3{font-weight:600;}

  /* ---- Pantalla de ingreso ---- */
  body.auth-mode{background:#FFFFFF;}
  #login-root.auth-root{display:block; max-width:none; margin:0; padding:0;}
  .auth-page{display:grid; grid-template-columns:minmax(0,5fr) minmax(0,6fr); min-height:100vh; font-family:'Inter',sans-serif; color:#1B1E23; text-transform:none; background:#fff;}
  .auth-page *{text-transform:none;}
  .auth-aside{position:relative; overflow:hidden; background:#1A1D21; color:#fff; padding:40px 56px; display:flex; flex-direction:column; justify-content:space-between; gap:32px;}
  .auth-aside::before{content:''; position:absolute; inset:0; pointer-events:none; background-image:linear-gradient(rgba(255,255,255,0.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.035) 1px, transparent 1px); background-size:44px 44px; -webkit-mask-image:linear-gradient(180deg,#000 0%,transparent 90%); mask-image:linear-gradient(180deg,#000 0%,transparent 90%);}
  .auth-aside > *{position:relative;}
  .auth-brand{display:flex; align-items:center; gap:12px; font-size:18px; font-weight:600; letter-spacing:-0.01em;}
  .auth-brand img{width:38px; height:38px; border-radius:10px; display:block;}
  .auth-pitch h2{font-size:38px; line-height:1.1; font-weight:600; letter-spacing:-0.025em; margin:0 0 14px; max-width:12em; color:#fff; text-wrap:balance;}
  .auth-pitch p{font-size:16px; line-height:1.55; color:#A9AFB8; margin:0; max-width:30em;}
  .auth-slip{position:relative; margin-top:40px; width:100%; max-width:340px; background:#F4F5F7; color:#1B1E23; border-radius:10px; padding:18px 20px 0; box-shadow:0 22px 44px rgba(0,0,0,0.38);}
  .auth-slip-head{display:flex; justify-content:space-between; align-items:center; gap:10px; padding-bottom:12px; border-bottom:1px solid #E2E4E8; font-size:14px;}
  .auth-slip-status{font-size:12px; font-weight:500; color:#14633B; background:#E1F3E8; border-radius:999px; padding:3px 10px; white-space:nowrap;}
  .auth-slip-row{display:flex; justify-content:space-between; gap:16px; padding:9px 0; border-bottom:1px solid #E7E9EC; font-size:13.5px;}
  .auth-slip-row span:first-child{color:#6B7280;}
  .auth-slip-row span:last-child{font-weight:500; text-align:right;}
  .auth-slip-foot{display:flex; align-items:center; gap:8px; margin:0 -20px; padding:13px 20px 14px; border-top:2px dashed #CED1D6; font-size:12.5px; color:#14633B; position:relative;}
  .auth-slip-foot::before, .auth-slip-foot::after{content:''; position:absolute; top:-10px; width:18px; height:18px; border-radius:50%; background:#1A1D21;}
  .auth-slip-foot::before{left:-9px;} .auth-slip-foot::after{right:-9px;}
  .auth-aside-foot{font-size:13px; color:#80868F;}
  .auth-main{position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:48px 28px 72px;}
  .auth-form-wrap{width:100%; max-width:380px;}
  .auth-h1{font-size:27px; line-height:1.2; font-weight:600; letter-spacing:-0.02em; margin:0 0 8px; color:#1B1E23;}
  .auth-sub{font-size:14.5px; line-height:1.5; color:#5B616A; margin:0 0 26px;}
  .auth-field{margin-bottom:16px;}
  .auth-field label{display:block; font-size:13px; font-weight:500; color:#2F353D; margin-bottom:6px;}
  .auth-opt{font-weight:400; color:#8D939B;}
  .auth-page .auth-field input{width:100%; height:44px; padding:0 14px; font-size:15px; font-family:inherit; color:#1B1E23; background:#fff; border:1px solid #CED1D6; border-radius:8px; outline:none; transition:border-color .15s, box-shadow .15s;}
  .auth-page .auth-field input::placeholder{color:#9AA0A8;}
  .auth-page .auth-field input:focus{background:#fff; border-color:#1F252C; box-shadow:0 0 0 3px rgba(31,37,44,0.12);}
  .auth-pass-wrap{position:relative;}
  .auth-pass-wrap input{padding-right:84px !important;}
  .auth-pass-toggle{position:absolute; right:6px; top:6px; height:32px; padding:0 10px; border:none; background:transparent; border-radius:6px; font-size:13px; font-weight:500; color:#5B616A; cursor:pointer;}
  .auth-pass-toggle:hover{background:#F1F2F4; color:#1B1E23;}
  .auth-btn{display:block; width:100%; height:46px; margin-top:6px; border:none; border-radius:8px; background:#1F252C; color:#fff; font-family:inherit; font-size:15px; font-weight:500; cursor:pointer; transition:background .15s;}
  .auth-btn:hover{background:#2B323A;}
  .auth-btn:disabled{opacity:.6; cursor:wait;}
  .auth-links{display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px 16px; margin-top:18px; font-size:13.5px; color:#5B616A;}
  .auth-link{border:none; background:none; padding:0; font:inherit; font-weight:500; color:#1B1E23; text-decoration:underline; text-underline-offset:3px; text-decoration-color:#B5BAC1; cursor:pointer;}
  .auth-link:hover{text-decoration-color:#1B1E23;}
  .auth-msg{font-size:13.5px; line-height:1.45; padding:10px 12px; border-radius:8px; margin:0 0 16px;}
  .auth-msg.err{background:#FBEAE7; color:#8E2A20;}
  .auth-msg.ok{background:#E4F5EA; color:#14633B;}
  .auth-privacy{display:flex; gap:10px; margin-top:34px; padding-top:18px; border-top:1px solid #E2E4E8; font-size:12.5px; line-height:1.5; color:#5B616A;}
  .auth-privacy p{margin:0;}
  .auth-privacy-ic{color:#5B616A; padding-top:1px; flex-shrink:0;}
  .auth-copy{position:absolute; bottom:22px; left:0; right:0; text-align:center; font-size:12px; color:#8D939B;}
  .auth-page button:focus-visible, .auth-modal button:focus-visible{outline:2px solid #1F252C; outline-offset:2px;}
  .auth-modal-bg{position:fixed; inset:0; z-index:10000; display:flex; align-items:center; justify-content:center; padding:20px; background:rgba(20,24,30,0.55); font-family:'Inter',sans-serif; text-transform:none;}
  .auth-modal{background:#fff; color:#1B1E23; border-radius:12px; max-width:520px; width:100%; max-height:86vh; overflow:auto; padding:26px; text-transform:none;}
  .auth-modal h3{font-size:19px; font-weight:600; letter-spacing:-0.01em; margin:0 0 10px;}
  .auth-modal .privacy-list{font-size:14px; line-height:1.55; padding-left:20px;}
  @media (max-width:959px){
    .auth-page{grid-template-columns:1fr; grid-template-rows:auto 1fr;}
    .auth-aside{padding:16px 20px; flex-direction:row; align-items:center; gap:0;}
    .auth-aside::before{display:none;}
    .auth-pitch, .auth-aside-foot{display:none;}
    .auth-main{justify-content:flex-start; padding:32px 20px 64px;}
  }