:root{
    --red:#e3151a;
    --red-dark:#b8080c;
    --red-soft:#fdeceb;
    --ink:#231f20;
    --ink-soft:#6b6462;
    --line:#ece6e3;
    --bg:#faf8f6;
    --card:#ffffff;
    --ok:#1c7a3d;
  }
  *{box-sizing:border-box;}
  html,body{margin:0;padding:0;}
  body{
    background:var(--bg);
    color:var(--ink);
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    padding-bottom:84px;
  }
  a{color:inherit;}
  img{max-width:100%;display:block;}
  button{font-family:inherit;cursor:pointer;}
  #root{max-width:1180px;margin:0 auto;}

  /* header */
  .topbar{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:40;}
  .topbar-inner{max-width:1180px;margin:0 auo;display:flex;align-items:center;gap:14px;padding:10px 16px;}
  .logo-img{height:48px;width:48px;object-fit:contain;border-radius:10px;background:#fff;}
  .brand-name{font-weight:800;font-size:17px;letter-spacing:.3px;}
  .brand-sub{font-size:11.5px;color:var(--ink-soft);margin-top:1px;}
  .share-btn{
    margin-left:auto;display:flex;align-items:center;gap:6px;flex:0 0 auto;
    background:var(--red-soft);color:var(--red-dark);border:1px solid #f7cfcd;
    padding:8px 10px;border-radius:999px;font-size:11.5px;font-weight:700;white-space:nowrap;
  }
  @media (max-width:420px){
    .brand-sub{display:none;}
    .brand-name{font-size:14.5px;}
    .logo-img{height:38px;width:38px;}
    .topbar-inner{padding:8px 12px;gap:8px;}
  }
  .share-btn:active{transform:scale(.97);}
  .cart-icon-btn{
    position:relative;flex:0 0 auto;background:var(--red);color:#fff;border:none;
    width:38px;height:38px;border-radius:10px;font-size:17px;display:flex;align-items:center;justify-content:center;
  }
  .cart-icon-btn:active{transform:scale(.94);}
  .cart-badge{
    position:absolute;top:-6px;right:-6px;background:var(--ink);color:#fff;
    font-size:10px;font-weight:800;min-width:17px;height:17px;border-radius:999px;
    display:flex;align-items:center;justify-content:center;padding:0 3px;border:2px solid #fff;
  }
  @media (max-width:420px){ .share-btn-txt{display:none;} }

  /* banner */
  .banner-photo{width:100%;height:150px;overflow:hidden;background:var(--bg);}
  .banner-photo img{width:100%;height:100%;object-fit:cover;display:block;}
  @media (min-width:700px){ .banner-photo{height:260px;} }
  .banner{
    background:linear-gradient(135deg,var(--red) 0%,var(--red-dark) 100%);
    color:#fff;padding:26px 18px 22px;
  }
  .banner-inner{max-width:1180px;margin:0 auto;}
  .banner h1{margin:0 0 10px;font-size:clamp(20px,3.4vw,28px);font-weight:800;}
  .banner-min{
    display:inline-block;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.35);
    padding:6px 12px;border-radius:8px;font-weight:700;font-size:13.5px;margin-bottom:12px;
  }
  .banner-list{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:8px 22px;}
  .banner-list li{font-size:13px;opacity:.96;display:flex;align-items:center;gap:6px;}
  .banner-list li:before{content:"✓";font-weight:800;}

  /* controls */
  .controls{
    position:sticky;top:var(--topbar-h,64px);z-index:30;background:var(--bg);
    padding:12px 16px 8px;border-bottom:1px solid var(--line);
  }
  .search-row{max-width:1180px;margin:0 auto 10px;}
  .search-row input{
    width:100%;padding:11px 14px;border-radius:10px;border:1px solid var(--line);
    font-size:14px;background:#fff;
  }
  .search-row input:focus{outline:2px solid var(--red);outline-offset:1px;}
  .cats{max-width:1180px;margin:0 auto;display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin;}
  .cat-chip{
    flex:0 0 auto;padding:7px 13px;border-radius:999px;border:1px solid var(--line);
    background:#fff;font-size:12.5px;font-weight:600;color:var(--ink-soft);white-space:nowrap;
  }
  .cat-chip.active{background:var(--red);border-color:var(--red);color:#fff;}
  .result-count{max-width:1180px;margin:8px auto 0;padding:0 16px;font-size:12px;color:var(--ink-soft);}

  /* grid */
  .grid{
    max-width:1180px;margin:0 auto;padding:14px 16px 10px;
    display:grid;grid-template-columns:repeat(auto-fill,minmax(155px,1fr));gap:10px;
  }
  @media (max-width:420px){
    .grid{gap:8px;padding:12px 10px 8px;}
    .card{padding:9px;}
  }
  .card{
    background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px;
    display:flex;flex-direction:column;gap:8px;min-width:0;position:relative;
  }
  .card-edit-btn{
    position:absolute;top:6px;right:6px;z-index:5;width:28px;height:28px;border-radius:50%;
    background:rgba(255,255,255,.94);border:1px solid var(--line);box-shadow:0 2px 6px rgba(0,0,0,.15);
    display:flex;align-items:center;justify-content:center;font-size:13px;padding:0;
  }
  .card-edit-btn:active{transform:scale(.92);}
  .grid[data-view="compact"] .card-edit-btn{display:none;}
  .card-thumb{
    position:relative;height:96px;border-radius:10px;background:var(--red-soft);
    display:flex;align-items:center;justify-content:center;color:var(--red-dark);
    font-weight:800;font-size:11px;text-align:center;letter-spacing:.3px;padding:6px;
    overflow:hidden;
  }
  .card-thumb.has-img{background:var(--bg);padding:0;cursor:zoom-in;}
  .card-thumb img{width:100%;height:100%;object-fit:cover;}
  .card-thumb-badge{
    position:absolute;bottom:4px;right:4px;background:rgba(0,0,0,.6);color:#fff;
    font-size:9.5px;font-weight:700;padding:2px 6px;border-radius:999px;letter-spacing:.2px;
  }
  .card-cat{font-size:10.5px;font-weight:700;color:var(--red-dark);text-transform:uppercase;letter-spacing:.4px;}
  .card-name{font-size:13.5px;font-weight:700;line-height:1.28;min-height:34px;}
  .card-code{font-size:10.5px;color:var(--ink-soft);}
  .card-desc{
    font-size:11.5px;line-height:1.35;color:var(--ink-soft);margin-top:1px;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  }
  .tier-table{width:100%;border-collapse:collapse;font-size:11px;margin-top:2px;}
  .tier-table td{padding:2px 0;color:var(--ink-soft);}
  .tier-table td.tv{text-align:right;font-weight:700;color:var(--ink);}
  .tier-table tr.active td{color:var(--red-dark);}
  .tier-table tr.active td.tv{color:var(--red-dark);}
  .active-price{
    margin-top:2px;background:var(--red-soft);border-radius:8px;padding:6px 8px;
    display:flex;justify-content:space-between;align-items:baseline;
  }
  .active-price .lbl{font-size:10.5px;color:var(--red-dark);font-weight:700;}
  .active-price .val{font-size:15px;font-weight:800;color:var(--red-dark);}
  .qty-row{display:flex;align-items:center;gap:6px;margin-top:2px;}
  .qty-btn{
    width:30px;height:30px;border-radius:8px;border:1px solid var(--line);background:#fff;
    font-size:16px;font-weight:700;display:flex;align-items:center;justify-content:center;color:var(--ink);
  }
  .qty-input{
    flex:1;min-width:0;text-align:center;padding:6px 4px;border-radius:8px;border:1px solid var(--line);
    font-size:14px;font-weight:700;
  }
  .subtotal{font-size:11px;color:var(--ink-soft);text-align:right;min-height:14px;}
  .empty-state{max-width:1180px;margin:40px auto;text-align:center;color:var(--ink-soft);padding:0 20px;}

  /* selector de vista */
  .result-count-row{
    max-width:1180px;margin:8px auto 0;padding:0 16px;
    display:flex;align-items:center;justify-content:space-between;gap:10px;
  }
  .result-count-row .result-count{margin:0;padding:0;flex:0 0 auto;}
  .view-switch{display:flex;gap:4px;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:3px;flex:0 0 auto;}
  .view-btn{
    display:flex;align-items:center;gap:4px;border:none;background:transparent;border-radius:999px;
    padding:5px 9px;font-size:12px;font-weight:700;color:var(--ink-soft);
  }
  .view-btn.active{background:var(--red);color:#fff;}
  .view-btn-icon{font-size:13px;line-height:1;}
  .view-btn-label{display:none;}
  @media (min-width:560px){ .view-btn-label{display:inline;} }

  /* estructura interna de la tarjeta (misma info, distinto layout según la vista) */
  .card-body{display:contents;}
  .card-main{display:contents;}

  /* vista: cuadrícula (por defecto) — responsive por breakpoints */
  @media (min-width:600px){
    .grid[data-view="grid"]{grid-template-columns:repeat(3,1fr);}
  }
  @media (min-width:900px){
    .grid[data-view="grid"]{grid-template-columns:repeat(4,1fr);}
  }

  /* vista: lista */
  .grid[data-view="list"]{grid-template-columns:1fr;}
  .grid[data-view="list"] .card{flex-direction:row;align-items:flex-stretch;gap:12px;}
  .grid[data-view="list"] .card-thumb{width:104px;height:104px;flex:0 0 104px;}
  .grid[data-view="list"] .card-body{display:flex;flex-direction:column;gap:8px;flex:1;min-width:0;justify-content:center;}
  @media (max-width:420px){
    .grid[data-view="list"] .card-thumb{width:80px;height:80px;flex:0 0 80px;}
  }

  /* vista: compacta */
  .grid[data-view="compact"]{grid-template-columns:1fr;gap:6px;}
  .grid[data-view="compact"] .card{flex-direction:row;align-items:center;gap:8px;padding:7px 9px;border-radius:10px;}
  .grid[data-view="compact"] .card-thumb{width:42px;height:42px;flex:0 0 42px;border-radius:8px;font-size:8px;padding:2px;}
  .grid[data-view="compact"] .card-thumb-badge{display:none;}
  .grid[data-view="compact"] .card-body{display:flex;align-items:center;gap:8px;flex:1;min-width:0;}
  .grid[data-view="compact"] .card-main{display:flex;flex-direction:column;justify-content:center;min-width:0;flex:1 1 auto;gap:1px;}
  .grid[data-view="compact"] .card-cat{display:none;}
  .grid[data-view="compact"] .card-name{font-size:12px;min-height:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .grid[data-view="compact"] .card-code{font-size:10px;}
  .grid[data-view="compact"] .card-desc{display:none;}
  .grid[data-view="compact"] .tier-table{display:none;}
  .grid[data-view="compact"] .active-price{margin:0;background:none;padding:0;flex:0 0 auto;display:flex;flex-direction:column;align-items:flex-end;}
  .grid[data-view="compact"] .active-price .lbl{display:none;}
  .grid[data-view="compact"] .active-price .val{font-size:13px;}
  .grid[data-view="compact"] .qty-row{flex:0 0 auto;margin:0;gap:4px;}
  .grid[data-view="compact"] .qty-btn{width:24px;height:24px;font-size:13px;border-radius:6px;}
  .grid[data-view="compact"] .qty-input{width:34px;flex:none;padding:4px 2px;font-size:12px;border-radius:6px;}
  .grid[data-view="compact"] .subtotal{display:none;}
  .more-wrap{max-width:1180px;margin:6px auto 30px;text-align:center;}
  .more-btn{
    background:#fff;border:1px solid var(--line);border-radius:999px;padding:10px 22px;
    font-weight:700;font-size:13px;color:var(--ink);
  }

  /* cart bar */
  .cart-bar{
    position:fixed;left:0;right:0;bottom:0;z-index:50;background:#fff;border-top:1px solid var(--line);
    box-shadow:0 -6px 18px rgba(0,0,0,.06);
  }
  .cart-bar-inner{max-width:1180px;margin:0 auto;padding:10px 16px;display:flex;align-items:center;gap:12px;}
  .cart-summary{flex:1;min-width:0;cursor:pointer;background:none;border:none;text-align:left;padding:4px 0;}
  .cart-summary .cs-top{font-size:12px;color:var(--ink-soft);}
  .cart-summary .cs-total{font-size:17px;font-weight:800;}
  .send-btn{
    background:var(--ok);color:#fff;border:none;border-radius:10px;padding:12px 16px;
    font-weight:800;font-size:13.5px;display:flex;align-items:center;gap:8px;white-space:nowrap;
    text-decoration:none;
  }
  .send-btn[data-disabled="1"]{background:#cfcac7;color:#8a8582;pointer-events:none;}
  .min-note{font-size:10.5px;color:var(--red-dark);margin-top:2px;}

  /* cart panel */
  .cart-panel{
    position:fixed;inset:0;background:rgba(20,16,15,.45);z-index:60;display:none;
  }
  .cart-panel.open{display:flex;align-items:flex-end;justify-content:center;}
  .cart-sheet{
    background:#fff;width:100%;max-width:560px;max-height:82vh;border-radius:16px 16px 0 0;
    display:flex;flex-direction:column;
  }
  .cart-sheet-head{padding:14px 16px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;}
  .cart-sheet-head h3{margin:0;font-size:15px;}
  .close-x{background:none;border:none;font-size:20px;color:var(--ink-soft);padding:4px;}
  .cart-items{overflow-y:auto;padding:8px 16px;flex:1;}
  .cart-item{display:flex;gap:10px;padding:10px 0;border-bottom:1px solid var(--line);align-items:center;}
  .cart-item .ci-name{font-size:12.5px;font-weight:700;flex:1;}
  .cart-item .ci-meta{font-size:11px;color:var(--ink-soft);}
  .cart-item .ci-sub{font-size:12.5px;font-weight:800;white-space:nowrap;}
  .ci-remove{background:none;border:none;color:var(--red-dark);font-size:11px;font-weight:700;padding:4px;}
  .cart-sheet-foot{padding:12px 16px 16px;border-top:1px solid var(--line);}
  .foot-row{display:flex;justify-content:space-between;font-size:13.5px;margin-bottom:4px;}
  .foot-row.total{font-size:16px;font-weight:800;margin:6px 0 10px;}
  .progress-wrap{height:6px;border-radius:999px;background:var(--line);overflow:hidden;margin-bottom:10px;}
  .progress-bar{height:100%;background:var(--ok);width:0%;}

  #checkout-modal .cart-items label{display:block;font-size:12px;font-weight:700;color:var(--ink-soft);margin:12px 0 4px;}
  #checkout-modal .cart-items input[type=text],#checkout-modal .cart-items input[type=tel]{
    width:100%;padding:10px 11px;border-radius:9px;border:1px solid var(--line);font-size:14px;font-family:inherit;
  }
  .chk-radio-row{display:flex;gap:14px;margin-top:2px;}
  .chk-radio{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--ink);margin:0;}
  .chk-radio input{width:auto;}

  /* info footer */
  .info-footer{max-width:1180px;margin:20px auto 0;padding:16px;font-size:11.5px;color:var(--ink-soft);text-align:center;}
  .admin-link{background:none;border:none;color:var(--ink-soft);font-size:11px;text-decoration:underline;padding:6px;}

  /* admin */
  .admin-wrap{max-width:640px;margin:0 auto 40px;padding:0 16px;}
  .admin-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px;margin-top:14px;}
  .admin-card h3{margin:0 0 10px;font-size:14.5px;}
  .admin-card label{display:block;font-size:12px;font-weight:700;color:var(--ink-soft);margin:10px 0 4px;}
  .admin-card input[type=text],.admin-card input[type=number],.admin-card textarea{
    width:100%;padding:9px 10px;border-radius:8px;border:1px solid var(--line);font-size:13px;font-family:inherit;
  }
  .admin-card textarea{min-height:70px;resize:vertical;}
  .admin-btn{
    margin-top:12px;background:var(--red);color:#fff;border:none;border-radius:9px;padding:10px 16px;
    font-weight:700;font-size:13px;
  }
  .admin-btn.secondary{background:#fff;color:var(--ink);border:1px solid var(--line);}
  .admin-msg{font-size:12px;margin-top:8px;padding:8px 10px;border-radius:8px;}
  .admin-msg.ok{background:#e9f6ee;color:var(--ok);}
  .admin-msg.err{background:var(--red-soft);color:var(--red-dark);}
  .admin-msg.info{background:#f0f0ee;color:var(--ink-soft);}
  .file-drop{
    border:1.5px dashed var(--line);border-radius:10px;padding:16px;text-align:center;font-size:12.5px;
    color:var(--ink-soft);margin-top:8px;
  }
  .edit-results{max-height:220px;overflow-y:auto;border:1px solid var(--line);border-radius:8px;margin-top:8px;}
  .edit-result-item{
    display:block;width:100%;text-align:left;background:#fff;border:none;border-bottom:1px solid var(--line);
    padding:9px 10px;font-size:12.5px;font-family:inherit;
  }
  .edit-result-item:last-child{border-bottom:none;}
  .edit-result-item:active{background:var(--bg);}
  .edit-result-code{color:var(--ink-soft);font-size:11px;}
  .edit-form{margin-top:14px;padding-top:14px;border-top:1px dashed var(--line);}
  .edit-form-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:4px;font-size:13.5px;}
  .order-item{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-top:10px;}
  .order-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;}
  .order-status{font-size:10.5px;font-weight:800;padding:3px 9px;border-radius:999px;text-transform:uppercase;letter-spacing:.3px;}
  .order-status.pending{background:#fff3e0;color:#b56a00;}
  .order-status.done{background:#e9f6ee;color:var(--ok);}
  .order-date{font-size:11px;color:var(--ink-soft);}
  .order-cliente{font-weight:700;font-size:13px;margin-bottom:3px;}
  .order-detalle{font-size:12.5px;color:var(--ink);white-space:pre-wrap;line-height:1.4;margin-bottom:6px;}
  .order-total{font-weight:800;font-size:13px;margin-bottom:8px;}
  .order-actions{display:flex;gap:8px;flex-wrap:wrap;}
  .order-actions .admin-btn{margin-top:0;padding:7px 12px;font-size:12px;}
  .order-toggle-btn{margin-top:0;padding:7px 12px;font-size:12px;}
  .toast{
    position:fixed;top:14px;left:50%;transform:translateX(-50%);background:var(--ink);color:#fff;
    padding:9px 16px;border-radius:999px;font-size:12.5px;z-index:99;box-shadow:0 6px 16px rgba(0,0,0,.2);
  }

  /* lightbox gallery */
  #lightbox-body{flex:1;min-height:0;overflow-y:auto;}
  .lightbox-main{position:relative;}
  .lightbox-main img{max-width:100%;max-height:60vh;object-fit:contain;margin:0 auto;}
  .lightbox-nav{
    position:absolute;top:50%;transform:translateY(-50%);width:34px;height:34px;border-radius:50%;
    background:rgba(0,0,0,.5);color:#fff;border:none;font-size:19px;line-height:1;
    display:flex;align-items:center;justify-content:center;
  }
  .lightbox-nav.prev{left:20px;}
  .lightbox-nav.next{right:20px;}
  .lightbox-counter{
    position:absolute;bottom:20px;right:20px;background:rgba(0,0,0,.55);color:#fff;
    font-size:11px;padding:3px 9px;border-radius:999px;
  }
  .lightbox-thumbs{display:flex;gap:6px;padding:0 12px 12px;overflow-x:auto;}
  .lightbox-thumbs img{
    width:52px;height:52px;object-fit:cover;border-radius:8px;border:2px solid transparent;
    flex:0 0 auto;cursor:pointer;opacity:.7;
  }
  .lightbox-thumbs img.active{border-color:var(--red);opacity:1;}

  /* editor: varias fotos por producto */
  .edit-img-grid{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:4px;}
  .edit-img-item{position:relative;width:84px;height:84px;}
  .edit-img-item img{width:100%;height:100%;object-fit:cover;border-radius:8px;display:block;}
  .edit-img-remove{
    position:absolute;top:-6px;right:-6px;width:22px;height:22px;border-radius:50%;
    background:var(--red);color:#fff;border:2px solid #fff;font-size:12px;font-weight:800;
    display:flex;align-items:center;justify-content:center;padding:0;line-height:1;
  }

  /* pdf download button */
  .pdf-btn{
    flex:0 0 auto;display:flex;align-items:center;gap:5px;background:#e6f5f2;color:#0f7a6a;
    border:1px solid #bfe6df;padding:8px 10px;border-radius:999px;font-size:11.5px;font-weight:700;white-space:nowrap;
  }
  .pdf-btn:active{transform:scale(.97);}
  @media (max-width:420px){ .pdf-btn-txt{display:none;} }

  /* badges: Nuevo / Más vendido */
  .card-badge{
    position:absolute;top:6px;left:6px;z-index:4;font-size:9px;font-weight:800;text-transform:uppercase;
    letter-spacing:.2px;padding:3px 8px;border-radius:999px;
  }
  .card-badge.nuevo{background:#0f7a6a;color:#fff;}
  .card-badge.vendido{background:#a3730c;color:#fff;}

  /* ofertas */
  .cat-chip-oferta{border-color:#e3c27a;color:#a3730c;background:#fbf1de;}
  .cat-chip-oferta.active{background:#a3730c;border-color:#a3730c;color:#fff;}
  .card-cat.oferta{color:#a3730c;}
  .active-price.oferta{background:#fbf1de;}
  .active-price.oferta .lbl,.active-price.oferta .val{color:#a3730c;}
  .old-price-sm{color:var(--ink-soft);text-decoration:line-through;font-weight:600;font-size:10.5px;margin-right:5px;}

  /* admin: pestañas del panel */
  .admin-tabbar{
    display:flex;gap:4px;overflow-x:auto;border-bottom:1px solid var(--line);margin-bottom:14px;padding-bottom:1px;
  }
  .admin-tab{
    flex:0 0 auto;background:none;border:none;border-bottom:2px solid transparent;padding:9px 12px;
    font-size:12.5px;font-weight:700;color:var(--ink-soft);white-space:nowrap;
  }
  .admin-tab.active{color:var(--red-dark);border-color:var(--red-dark);}
  .admin-panel[hidden]{display:none;}
  .admin-msg.tip{background:var(--red-soft);color:var(--red-dark);}
  .vendor-banner{margin-bottom:14px;}

  /* admin: estadísticas */
  .stats-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:14px;}
  .stats-tiles .tile{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px;}
  .stats-tiles .t-label{font-size:10.5px;font-weight:700;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.03em;}
  .stats-tiles .t-value{font-size:23px;font-weight:800;margin-top:5px;font-variant-numeric:tabular-nums;}
  .stats-tiles .t-sub{font-size:11px;color:var(--ink-soft);margin-top:3px;}
  .stats-tiles .t-name{font-size:13.5px;font-weight:800;margin-top:5px;line-height:1.3;}
  .stats-panels{display:grid;grid-template-columns:1fr;gap:12px;}
  @media (min-width:640px){ .stats-panels{grid-template-columns:1fr 1fr;} }
  .rc-sub{font-size:11.5px;color:var(--ink-soft);margin:0 0 12px;}
  .rank-row{display:flex;align-items:center;gap:9px;margin-bottom:11px;}
  .rank-row:last-child{margin-bottom:0;}
  .rank-num{width:16px;flex:0 0 auto;font-size:11px;font-weight:800;color:var(--ink-faint,var(--ink-soft));}
  .rank-body{flex:1;min-width:0;}
  .rank-name{font-size:12px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:4px;}
  .rank-bar-track{height:6px;border-radius:999px;background:var(--red-soft);overflow:hidden;}
  .rank-bar-fill{height:100%;border-radius:999px;background:var(--red);}
  .rank-value{flex:0 0 auto;font-size:11.5px;font-weight:800;font-variant-numeric:tabular-nums;}