:root{
  --bg:#04090b;--bg2:#08151a;--bg3:#0c1f25;--line:#12403a;--line2:#1d6a5d;
  --teal:#19e6b5;--teal2:#0fb592;--text:#d9f4ee;--muted:#7da79f;--warn:#f5c542;--bad:#ff5d6c;--ok:#19e6b5;
  --chrome:linear-gradient(180deg,#fff 0%,#c9d3d6 45%,#7f8d92 100%);
  --f-head:'Chakra Petch',system-ui,sans-serif;--f-body:'Outfit',system-ui,sans-serif;--f-mono:'JetBrains Mono',ui-monospace,monospace;
  --cut:14px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font:400 16px/1.55 var(--f-body);min-height:100vh;
  background-image:radial-gradient(900px 500px at 85% -10%,rgba(25,230,181,.16),transparent 60%),radial-gradient(700px 500px at -10% 40%,rgba(15,181,146,.10),transparent 60%),
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='49' viewBox='0 0 28 49'%3E%3Cpath d='M14 0l14 8v16l-14 8L0 24V8zM14 32l14 8v9M14 32L0 40v9' fill='none' stroke='%2319e6b5' stroke-opacity='.06'/%3E%3C/svg%3E");
  background-attachment:fixed}
a{color:var(--teal);text-decoration:none}a:hover{text-decoration:underline}
h1,h2,h3{font-family:var(--f-head);margin:0;line-height:1.12;letter-spacing:.2px}
img{max-width:100%}
.ico{flex:none}
.muted{color:var(--muted)}.sm{font-size:13.5px}.center{text-align:center}.mono{font-family:var(--f-mono)}.bad-t{color:var(--bad)}
code{font-family:var(--f-mono);background:var(--bg3);padding:1px 6px;border-radius:5px;font-size:.88em;word-break:break-all}

/* ===== Shell / dock ===== */
.shell{display:grid;grid-template-columns:200px 1fr;min-height:100vh}
.dock{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;padding:18px 14px;border-right:1px solid var(--line);background:linear-gradient(180deg,rgba(8,21,26,.92),rgba(4,9,11,.92))}
.brand img{width:100%;max-width:172px;display:block;margin:0 auto 18px;filter:drop-shadow(0 0 18px rgba(25,230,181,.35))}
.dock nav{display:flex;flex-direction:column;gap:6px}
.dock nav a{display:flex;align-items:center;gap:12px;padding:11px 14px;color:var(--muted);font:600 15px var(--f-head);clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px));border-left:2px solid transparent;transition:.15s}
.dock nav a:hover{color:var(--text);background:var(--bg3);text-decoration:none}
.dock nav a.on{color:var(--teal);background:linear-gradient(90deg,rgba(25,230,181,.16),transparent);border-left-color:var(--teal)}
.dock-foot{margin-top:auto;font:500 12px var(--f-mono);color:var(--muted);display:flex;align-items:center;gap:8px}
.dot{width:8px;height:8px;border-radius:50%;background:var(--teal);box-shadow:0 0 10px var(--teal);animation:pulse 2s infinite}
@keyframes pulse{50%{opacity:.35}}
main{min-width:0;display:flex;flex-direction:column}
.topbar{display:flex;gap:14px;align-items:center;justify-content:space-between;padding:14px 28px;border-bottom:1px solid var(--line);background:rgba(4,9,11,.75);backdrop-filter:blur(8px);position:sticky;top:0;z-index:20}
.search{flex:1;max-width:520px;display:flex;align-items:center;gap:10px;background:var(--bg2);border:1px solid var(--line);padding:0 14px;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px));color:var(--muted)}
.search input{flex:1;background:none;border:0;color:var(--text);padding:11px 0;font:inherit;outline:none}
.chip{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border:1px solid var(--line2);border-radius:99px;color:var(--text);font-weight:500}
.chip small{color:var(--muted)}
.content{padding:28px;max-width:1240px;width:100%;margin:0 auto;flex:1}
.content.wide{max-width:1400px}
.foot{padding:26px 28px 90px;border-top:1px solid var(--line);color:var(--muted);font-size:14px;display:grid;gap:4px}
.tabbar{display:none}

/* ===== Botones ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;cursor:pointer;font:700 15px var(--f-head);letter-spacing:.4px;padding:11px 20px;color:#02110d;
  background:linear-gradient(180deg,#43ffd0,var(--teal2));clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px));transition:.15s;text-transform:uppercase}
.btn:hover{filter:brightness(1.12);text-decoration:none;transform:translateY(-1px)}
.btn.ghost{background:transparent;color:var(--teal);box-shadow:inset 0 0 0 1px var(--line2);clip-path:none;border-radius:8px}
.btn.ghost:hover{background:rgba(25,230,181,.1)}
.btn.sm{padding:7px 13px;font-size:13px}.btn.xl{padding:15px 28px;font-size:17px}.btn.block{width:100%}
.btn.link{background:none;color:var(--muted);clip-path:none;text-transform:none;font:500 14px var(--f-body);text-decoration:underline;padding:8px}
.copy{display:inline-flex;align-items:center;gap:7px;background:var(--bg3);color:var(--teal);border:1px solid var(--line2);border-radius:8px;padding:8px 12px;cursor:pointer;font:600 13px var(--f-body);white-space:nowrap;transition:.15s}
.copy:hover{background:rgba(25,230,181,.14)}.copy.ok{background:var(--teal);color:#021;border-color:var(--teal)}
.copy.mini{padding:5px 8px}.copy.mini span{display:none}

/* ===== Mensajes ===== */
.flash{padding:12px 16px;margin:0 0 16px;border-left:3px solid var(--ok);background:rgba(25,230,181,.08)}
.flash.warn{border-color:var(--warn);background:rgba(245,197,66,.08)}.flash.bad{border-color:var(--bad);background:rgba(255,93,108,.09)}
.badge{display:inline-block;padding:3px 10px;border-radius:99px;font:600 12px var(--f-head);text-transform:uppercase;letter-spacing:.5px;background:rgba(25,230,181,.14);color:var(--ok)}
.badge.warn{background:rgba(245,197,66,.14);color:var(--warn)}.badge.bad{background:rgba(255,93,108,.14);color:var(--bad)}
#toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,30px);background:var(--teal);color:#021;padding:10px 20px;font:700 14px var(--f-head);opacity:0;pointer-events:none;transition:.25s;z-index:99;clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px))}
#toast.on{opacity:1;transform:translate(-50%,0)}

/* ===== Hero ===== */
.eyebrow{font:500 12.5px var(--f-mono);letter-spacing:2px;color:var(--teal)}
.hero{display:grid;grid-template-columns:1.25fr 1fr;gap:34px;align-items:center;padding:30px 0 26px}
.hero h1{font-size:clamp(38px,5.4vw,66px);margin:12px 0 16px;font-weight:700;background:var(--chrome);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero h1 em{font-style:normal;white-space:nowrap;background:linear-gradient(90deg,#43ffd0,#0fb592);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 14px rgba(25,230,181,.5))}
.hero p{max-width:560px;color:var(--muted);font-size:17px}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.mission{list-style:none;margin:0;padding:0;display:grid;gap:12px;counter-reset:m}
.mission li{display:flex;gap:16px;align-items:center;padding:16px 18px;background:linear-gradient(90deg,var(--bg3),var(--bg2));border:1px solid var(--line);clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px))}
.mission li:nth-child(2){margin-left:22px}.mission li:nth-child(3){margin-left:44px}
.mission b{font:700 26px var(--f-head);color:var(--teal);text-shadow:0 0 16px rgba(25,230,181,.6)}
.mission strong{display:block;font:700 17px var(--f-head)}.mission span{color:var(--muted);font-size:14px}
.ticker{overflow:hidden;border-block:1px solid var(--line);margin:8px 0 34px;background:rgba(12,31,37,.5)}
.ticker div{display:flex;gap:0;width:max-content;animation:tick 28s linear infinite}
.ticker span{font:600 13px var(--f-head);letter-spacing:3px;color:var(--muted);padding:10px 26px;white-space:nowrap}
.ticker span::after{content:'◆';margin-left:52px;color:var(--teal)}
@keyframes tick{to{transform:translateX(-50%)}}

/* ===== Catálogo ===== */
.sec-head{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:18px}
.sec-head h2{font-size:26px}.slashes{color:var(--teal);font-family:var(--f-mono)}
.tabs{display:flex;gap:8px;flex-wrap:wrap}
.tabs a{padding:7px 16px;border:1px solid var(--line);color:var(--muted);font:600 14px var(--f-head);border-radius:99px}
.tabs a.on,.tabs a:hover{background:var(--teal);color:#021;border-color:var(--teal);text-decoration:none}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px}
.card{position:relative;display:flex;flex-direction:column;color:var(--text);background:linear-gradient(180deg,var(--bg3),var(--bg2));border:1px solid var(--line);
  clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,var(--cut) 100%,0 calc(100% - var(--cut)));transition:transform .2s,box-shadow .2s}
.card::before{content:'';position:absolute;inset:0;pointer-events:none;border-top:2px solid var(--teal);opacity:.0;transition:.2s}
.card:hover{transform:translateY(-5px);text-decoration:none;filter:drop-shadow(0 6px 8px rgba(0,0,0,.28)) drop-shadow(0 18px 24px rgba(0,0,0,.42))}.card:hover::before{opacity:1}
.card.soldout{opacity:.6}
.art{aspect-ratio:16/10;overflow:hidden;position:relative;background:var(--bg3)}
.art img{width:100%;height:100%;object-fit:cover;display:block}
.art.gen{display:grid;place-items:center;background:linear-gradient(135deg,hsl(var(--h) 70% 14%),hsl(calc(var(--h) + 40) 80% 30%))}
.art.gen span{font:700 64px var(--f-head);color:rgba(255,255,255,.88);text-shadow:0 0 30px hsl(var(--h) 100% 60%)}
.art.gen .ico{position:absolute;right:12px;bottom:10px;opacity:.35}
.art.big{aspect-ratio:4/3;border:1px solid var(--line)}.art.mini{width:60px;aspect-ratio:1;flex:none}.art.mini span{font-size:22px}.art.mini .ico{display:none}
.tags{position:absolute;top:10px;left:10px;display:flex;gap:6px;flex-wrap:wrap}
.tag{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;background:rgba(4,9,11,.82);border:1px solid var(--line2);font:600 11.5px var(--f-head);color:var(--text);border-radius:4px;text-transform:uppercase;letter-spacing:.4px}
.tag.bad{color:var(--bad);border-color:var(--bad)}
.card-body{padding:14px 16px 16px;display:flex;flex-direction:column;gap:6px;flex:1}
.cat{font:500 12px var(--f-mono);color:var(--teal);text-transform:uppercase;letter-spacing:1px}
.card h3{font-size:18px}.card p{margin:0;color:var(--muted);font-size:14px;flex:1}
.price-row{display:flex;align-items:flex-end;justify-content:space-between;margin-top:8px}
.price{display:flex;align-items:baseline;gap:7px}
.price b{font:700 24px var(--f-head);background:var(--chrome);-webkit-background-clip:text;background-clip:text;color:transparent}
.price s{color:var(--muted);font-size:14px}.price i{font:500 11px var(--f-mono);color:var(--muted);font-style:normal}
.go{color:var(--teal);font:700 14px var(--f-head)}
.empty{text-align:center;padding:60px 20px;color:var(--muted);display:grid;gap:14px;justify-items:center}

/* ===== Producto ===== */
.back{display:inline-block;margin-bottom:16px;color:var(--muted)}
.pdp{display:grid;grid-template-columns:1fr 1.1fr;gap:34px;align-items:start}
.perks{display:grid;gap:8px;margin-top:14px}
.perks div{display:flex;gap:12px;align-items:center;padding:11px 14px;background:var(--bg2);border:1px solid var(--line);color:var(--muted);font-size:14.5px}
.perks .ico{color:var(--teal)}
.pdp-info h1{font-size:clamp(28px,3.4vw,40px);margin:6px 0 10px}
.price.big b{font-size:40px}.price.big{margin-bottom:18px}
.spec{border:1px solid var(--line);margin-bottom:16px;background:var(--bg2)}
.spec-h{padding:8px 14px;border-bottom:1px solid var(--line);font:500 12px var(--f-mono);letter-spacing:2px;color:var(--teal);background:var(--bg3)}
.spec-b{padding:14px 16px;color:#c0e0da}
.buybox{display:flex;flex-wrap:wrap;gap:14px;align-items:center;padding:16px;border:1px dashed var(--line2);background:rgba(25,230,181,.04)}
.buybox small{flex-basis:100%}
.qty{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:14px}
.stepper{display:inline-flex;border:1px solid var(--line2);border-radius:8px;overflow:hidden}
.stepper button{width:38px;background:var(--bg3);border:0;color:var(--teal);font:700 20px var(--f-head);cursor:pointer}
.stepper input{width:46px;text-align:center;background:var(--bg);border:0;color:var(--text);font:600 16px var(--f-mono)}

/* ===== Formularios / paneles ===== */
.panel{background:linear-gradient(180deg,var(--bg3),var(--bg2));border:1px solid var(--line);padding:20px;margin-bottom:18px;
  clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px))}
.ph{font-size:19px;margin-bottom:14px}
label{display:block;font-size:14px;color:var(--muted);margin:0 0 12px}
label>input,label>select,label>textarea,.phone input,.pw input,.filters input,.filters select,.mini-in,.tbl input,details textarea,.panel textarea{
  width:100%;margin-top:6px;padding:11px 13px;background:var(--bg);border:1px solid var(--line2);border-radius:8px;color:var(--text);font:inherit;outline:none}
input:focus,select:focus,textarea:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(25,230,181,.15)}
textarea{resize:vertical;font-family:var(--f-mono);font-size:14px}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}.fgrid .span2{grid-column:span 2}
label.chk{display:flex;gap:10px;align-items:center}label.chk input{width:auto;margin:0}
.phone{display:flex;gap:8px;align-items:stretch;margin-top:6px}.phone input{margin:0;flex:1}
.pw{position:relative}.pw input{padding-right:46px}.pw-t{position:absolute;right:6px;top:11px;background:none;border:0;color:var(--muted);cursor:pointer;padding:6px}

/* País */
.cpick{position:relative}
.cpick>button{height:100%;display:flex;align-items:center;gap:8px;padding:0 12px;background:var(--bg);border:1px solid var(--line2);border-radius:8px;color:var(--text);font:600 15px var(--f-mono);cursor:pointer;white-space:nowrap}
.cpick img{width:22px;height:16px;object-fit:cover;border-radius:2px}
.cpick .iso{font:700 11px var(--f-head);background:var(--bg3);padding:2px 5px;border-radius:3px;color:var(--teal)}
.cpick-pop{position:absolute;z-index:40;top:calc(100% + 6px);left:0;width:290px;max-width:80vw;background:var(--bg2);border:1px solid var(--line2);box-shadow:0 20px 50px rgba(0,0,0,.6);display:none}
.cpick.open .cpick-pop{display:block}
.cpick-pop input{width:100%;border:0;border-bottom:1px solid var(--line);background:var(--bg3);color:var(--text);padding:12px;font:inherit;outline:none}
.cpick-list{max-height:260px;overflow:auto}
.cpick-list div{display:flex;align-items:center;gap:10px;padding:9px 12px;cursor:pointer;font-size:14.5px}
.cpick-list div:hover,.cpick-list div.on{background:rgba(25,230,181,.12)}.cpick-list em{margin-left:auto;color:var(--teal);font:600 13px var(--f-mono);font-style:normal}

/* Auth */
.auth{display:grid;grid-template-columns:1fr minmax(320px,440px);gap:44px;align-items:center;min-height:60vh}
.auth-side h1{font-size:clamp(30px,4vw,48px);margin:12px 0 16px;background:var(--chrome);-webkit-background-clip:text;background-clip:text;color:transparent}
.auth-side h1 em{font-style:normal;color:var(--teal);-webkit-text-fill-color:var(--teal)}
.ticks{list-style:none;padding:0;display:grid;gap:10px;color:var(--muted)}.ticks li{display:flex;gap:10px;align-items:center}.ticks .ico{color:var(--teal)}

/* ===== Checkout ===== */
.steps{list-style:none;display:flex;gap:10px;padding:0;margin:0 0 22px;flex-wrap:wrap}
.steps li{display:flex;gap:10px;align-items:center;padding:8px 16px;border:1px solid var(--line);color:var(--muted);font:600 14px var(--f-head);text-transform:uppercase;letter-spacing:.6px;clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px))}
.steps b{color:var(--teal);font-family:var(--f-mono)}.steps .on{border-color:var(--teal);color:var(--text);background:rgba(25,230,181,.1)}.steps .done{color:var(--text)}
.checkout{display:grid;grid-template-columns:1fr 340px;gap:22px;align-items:start}
.sticky{position:sticky;top:84px}
.methods{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px;margin-bottom:16px}
.method input{position:absolute;opacity:0;pointer-events:none}
.method-card{display:flex;flex-direction:column;gap:2px;padding:14px;border:1px solid var(--line2);background:var(--bg);cursor:pointer;transition:.15s;position:relative}
.method-card small{color:var(--muted)}.method-card strong{font:700 17px var(--f-head);color:var(--text)}
.mdot{width:10px;height:10px;border-radius:50%;background:var(--mc,var(--teal));box-shadow:0 0 12px var(--mc,var(--teal));display:inline-block}
.method-card .mdot{position:absolute;top:12px;right:12px}
.method input:checked+.method-card{border-color:var(--mc,var(--teal));box-shadow:inset 0 0 0 1px var(--mc,var(--teal)),0 0 24px -6px var(--mc,var(--teal));background:linear-gradient(180deg,rgba(255,255,255,.04),transparent)}
.method input:focus-visible+.method-card{outline:2px solid var(--teal)}
.mpanel{display:none}.mpanel.on{display:block}
.drow{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;border-top:1px dashed var(--line)}
.drow small{color:var(--muted);display:block}.drow.plain .copy{display:none}
.mono.big{font:600 24px var(--f-mono);letter-spacing:.5px;word-break:break-all;color:#fff}
.sum-item{display:flex;gap:12px;align-items:center;margin-bottom:14px}.sum-item strong{display:block;font-size:15px}
.sum-row{display:flex;justify-content:space-between;align-items:baseline;padding:12px 0;border-top:1px solid var(--line);margin-bottom:8px}
.sum-row b{font:700 28px var(--f-head);color:var(--teal)}

/* ===== Pedido ===== */
.order-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;gap:12px}
.order-head h1{font-size:34px}.order-head .badge{font-size:14px;padding:6px 14px}
.order-grid{display:grid;grid-template-columns:1fr 330px;gap:22px;align-items:start}
.radar-panel{display:flex;gap:22px;align-items:center}
.radar{width:86px;height:86px;border-radius:50%;border:1px solid var(--line2);position:relative;display:grid;place-items:center;color:var(--teal);flex:none;background:radial-gradient(circle,rgba(25,230,181,.2),transparent 70%)}
.radar i{position:absolute;inset:0;border-radius:50%;border:2px solid var(--teal);animation:ping 2.4s ease-out infinite;opacity:0}.radar i:nth-child(2){animation-delay:.8s}.radar i:nth-child(3){animation-delay:1.6s}
@keyframes ping{0%{transform:scale(.4);opacity:.9}100%{transform:scale(1.5);opacity:0}}
.timer{margin-top:8px;font-size:14px;color:var(--muted)}.timer b{font:600 20px var(--f-mono);color:var(--warn);margin-left:6px}
.actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:14px}.actions form{margin:0}
.unlock{border-color:var(--teal);box-shadow:0 0 40px -10px rgba(25,230,181,.5)}
.unlock-h{display:flex;gap:16px;align-items:center;margin-bottom:16px;color:var(--teal)}.unlock-h h2{color:var(--text);font-size:22px}
.terminal{background:#02070a;border:1px solid var(--line2);padding:6px 14px 14px;margin-bottom:16px;position:relative;overflow:hidden}
.terminal::after{content:'';position:absolute;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--teal),transparent);animation:scan 3s ease-in-out 1;opacity:.7}
@keyframes scan{from{top:0}to{top:100%}}
.term-item{padding-top:10px;animation:unl .6s both;animation-delay:var(--d)}
@keyframes unl{from{opacity:0;transform:translateY(8px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
.term-top{display:flex;justify-content:space-between;align-items:center;font:500 12px var(--f-mono);color:var(--teal);letter-spacing:2px;margin-bottom:6px}
.term-line{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:7px 0;border-bottom:1px dashed #0f2b2a}
.term-line code{background:none;color:#e8fff9;font-size:15px;padding:0;white-space:pre-wrap}
.dl{display:grid;grid-template-columns:auto 1fr;gap:8px 14px;margin:0;font-size:14.5px}.dl dt{color:var(--muted)}.dl dd{margin:0;text-align:right}

/* ===== Tablas ===== */
.table-wrap{overflow-x:auto;border:1px solid var(--line);background:var(--bg2);margin-bottom:18px}
.tbl{width:100%;border-collapse:collapse;font-size:14.5px}
.tbl th{text-align:left;padding:11px 14px;font:600 12px var(--f-head);text-transform:uppercase;letter-spacing:1px;color:var(--teal);background:var(--bg3);white-space:nowrap}
.tbl td{padding:11px 14px;border-top:1px solid var(--line);vertical-align:top}
.tbl tr:hover td{background:rgba(25,230,181,.03)}
.tbl input{margin:0;padding:8px 10px}
.acc-pass summary{cursor:pointer;font:600 16px var(--f-head);color:var(--teal)}.acc-pass form{margin-top:14px}
.snip{max-width:340px;color:var(--muted);word-break:break-word}
.pre{margin:0;white-space:pre-wrap;font:13px var(--f-mono)}

/* ===== Admin ===== */
.adminbar{display:flex;align-items:center;gap:18px;padding:10px 24px;border-bottom:1px solid var(--line);background:var(--bg2);position:sticky;top:0;z-index:30;flex-wrap:wrap}
.abrand{display:flex;align-items:center;gap:10px;color:var(--text);font:700 16px var(--f-head);letter-spacing:2px}.abrand img{width:30px}
.adminbar nav{display:flex;gap:4px;flex-wrap:wrap}.adminbar nav a{padding:8px 14px;color:var(--muted);font:600 14px var(--f-head)}
.adminbar nav a.on,.adminbar nav a:hover{color:var(--teal);background:var(--bg3);text-decoration:none}
.h1{font-size:30px;margin-bottom:18px}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin-bottom:20px}
.stat{padding:16px 18px;background:var(--bg2);border:1px solid var(--line);border-top:2px solid var(--teal)}.stat.hot{border-top-color:var(--warn)}
.stat small{color:var(--muted);display:block}.stat b{font:700 30px var(--f-head);display:block}.stat em{color:var(--muted);font-style:normal;font-size:13px}
.two{display:grid;grid-template-columns:1.3fr 1fr;gap:18px;align-items:start}
.filters{display:flex;gap:10px;margin-bottom:14px;flex-wrap:wrap}.filters select,.filters input{width:auto;min-width:200px;margin:0}
.inline{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin:0}.mini-in{width:150px!important;margin:0!important;padding:7px 10px!important}
.log{background:#02070a;border:1px solid var(--line);padding:12px;font:13px var(--f-mono);white-space:pre-wrap;color:var(--teal)}.log.err{color:var(--bad)}
details summary{cursor:pointer}details[open]>summary{margin-bottom:8px}

/* ===== Responsive ===== */
@media (max-width:980px){
  .shell{grid-template-columns:1fr}
  .dock{display:none}
  .topbar{padding:12px 16px}.content{padding:18px 16px}
  .hero{grid-template-columns:1fr}.mission li:nth-child(n){margin-left:0}
  .pdp,.auth,.checkout,.order-grid,.two{grid-template-columns:1fr}.sticky{position:static}
  .tabbar{display:grid;grid-template-columns:repeat(4,1fr);position:fixed;bottom:0;left:0;right:0;z-index:50;background:rgba(4,9,11,.96);border-top:1px solid var(--line2);backdrop-filter:blur(8px)}
  .tabbar a{display:flex;flex-direction:column;align-items:center;gap:2px;padding:9px 4px 11px;color:var(--muted);font:600 11.5px var(--f-head)}
  .tabbar a:hover{color:var(--teal);text-decoration:none}
  .foot{padding-bottom:100px}
  .chip small{display:none}
}
@media (max-width:560px){
  .fgrid{grid-template-columns:1fr}.fgrid .span2{grid-column:auto}
  .grid{grid-template-columns:1fr 1fr;gap:12px}.card h3{font-size:15px}.card p{display:none}.price b{font-size:19px}
  .art.gen span{font-size:44px}
  .radar-panel{flex-direction:column;text-align:center}
  .mono.big{font-size:20px}.order-head h1{font-size:26px}
  .adminbar{padding:8px 12px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

.topbar .btn{white-space:nowrap}.search{min-width:0}
@media (max-width:560px){.hero h1{font-size:38px}}

/* Iconos de acción (ver / borrar) */
.iconbtn{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:8px;border:1px solid var(--line2);background:var(--bg3);color:var(--teal);cursor:pointer;padding:0;transition:.15s}
.iconbtn:hover{background:rgba(25,230,181,.14)}.iconbtn.danger{color:var(--bad);border-color:rgba(255,93,108,.45)}.iconbtn.danger:hover{background:rgba(255,93,108,.14)}
.iconbtn.on{background:var(--teal);color:#021}
.rowacts{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.rowacts form{margin:0;display:flex;gap:6px;align-items:center}
.detail-row td{background:#02070a!important;color:var(--muted);font-size:13.5px;word-break:break-word;white-space:normal}
.tbl.compact td{padding:8px 12px;vertical-align:middle}

/* ===== Anti-desbordamiento horizontal (la página nunca debe moverse de lado) ===== */
html,body{max-width:100%;overflow-x:clip}
.shell{grid-template-columns:200px minmax(0,1fr)}
main,.content,.hero>*,.pdp>*,.checkout>*,.order-grid>*,.auth>*,.two>*,.grid>*{min-width:0}
main{max-width:100%;overflow-x:clip}
.ticker{max-width:100%;contain:paint}
.card{min-width:0}.card h3,.card p{overflow-wrap:break-word}
.mono.big,.dl dd,.term-line code{overflow-wrap:break-word}
@media (max-width:980px){.shell{grid-template-columns:minmax(0,1fr)}}
@media (max-width:560px){
  .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tag{font-size:10px;padding:2px 6px}.tags{left:6px;top:6px}
  .price{flex-wrap:wrap;gap:2px 6px}.price-row .go{display:none}
  .topbar{gap:8px}.topbar .btn{padding:8px 12px;font-size:12px}
}

/* ===== Ancho completo: el contenido va de extremo a extremo ===== */
.content,.content.wide{max-width:none;padding-left:clamp(16px,2.6vw,48px);padding-right:clamp(16px,2.6vw,48px)}
.foot{padding-left:clamp(16px,2.6vw,48px);padding-right:clamp(16px,2.6vw,48px)}
.grid{grid-template-columns:repeat(auto-fill,minmax(270px,1fr))}
/* Páginas de formulario/lectura: se mantienen legibles y centradas */
.pdp,.checkout,.order-grid,.auth,.order-head,.steps,.back{width:100%;max-width:1320px;margin-left:auto;margin-right:auto}
.steps{display:flex}.back{display:block}
.order-head{display:flex}
@media (max-width:560px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ===== Hero v2 (banner de marca) ===== */
.hero2{position:relative;isolation:isolate;overflow:hidden;min-height:430px;display:flex;align-items:center;margin:6px 0 16px;border:1px solid var(--line2);border-radius:18px;background:#02080a;box-shadow:0 0 40px rgba(25,230,181,.12)}
.hero2-img{position:absolute;inset:0;z-index:-1}
.hero2-img img{position:absolute;right:0;top:0;height:100%;width:auto;min-width:68%;object-fit:cover;object-position:right center;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 34%);mask-image:linear-gradient(90deg,transparent 0,#000 34%)}
.hero2-txt{padding:34px clamp(18px,3vw,44px);max-width:min(620px,56%)}
.badge-pill{display:inline-block;border:1px solid var(--teal2);border-radius:99px;padding:5px 16px;font:600 12px var(--f-head);letter-spacing:2.5px;color:var(--teal);background:rgba(4,9,11,.6)}
.hero2 h1{margin:14px 0 12px;font:700 clamp(34px,4.6vw,66px)/1 var(--f-head);font-style:italic;letter-spacing:-.5px;text-transform:uppercase}
.hero2 h1 span{display:block}
.hero2 h1 .l1{background:var(--chrome);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 0 rgba(0,0,0,.5))}
.hero2 h1 .l2{background:linear-gradient(90deg,#43ffd0,#0fb592);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 14px rgba(25,230,181,.45))}
.hero2 p{margin:0 0 18px;max-width:430px;color:#c5dcd7;font-size:clamp(15px,1.3vw,18px)}
.hero2-feats{list-style:none;margin:0 0 22px;padding:0;display:flex;flex-wrap:wrap;gap:14px 20px}
.hero2-feats li{display:flex;align-items:center;gap:9px;font-size:13px;line-height:1.2;color:var(--text)}
.hero2-feats i,.strip i{flex:none;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;border:1px solid var(--teal2);color:var(--teal);background:rgba(25,230,181,.08)}
.hero2 .btn{display:inline-flex;align-items:center;gap:8px}

.strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:0 0 26px;border:1px solid var(--line);border-radius:14px;background:rgba(8,21,26,.7)}
.strip>div{display:flex;align-items:center;gap:12px;padding:14px 16px;min-width:0}
.strip>div+div{border-left:1px solid var(--line)}
.strip i{border-radius:10px;width:40px;height:40px}
.strip p{margin:0;min-width:0}.strip b{display:block;font:600 11.5px var(--f-head);letter-spacing:2px;color:var(--teal)}
.strip span{display:block;color:var(--muted);font-size:13px;line-height:1.3}

.cats{margin:0 0 30px}
.cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.cat-card{position:relative;display:flex;align-items:center;gap:14px;padding:22px 18px;min-height:96px;border-radius:14px;color:var(--text);border:1px solid hsl(var(--h) 60% 38%);background:linear-gradient(120deg,hsl(var(--h) 55% 14%),hsl(var(--h) 40% 7%));transition:.18s;min-width:0;overflow:hidden}
.cat-card:hover{text-decoration:none;transform:translateY(-3px);box-shadow:0 8px 28px hsl(var(--h) 70% 40% / .3)}
.cat-card i{flex:none;display:grid;place-items:center;width:48px;height:48px;border-radius:12px;background:hsl(var(--h) 60% 35%);color:#fff}
.cat-card div{min-width:0;flex:1}.cat-card strong{display:block;font:700 17px var(--f-head);text-transform:uppercase;overflow-wrap:break-word}
.cat-card span{color:var(--muted);font-size:13px}
.cat-card em{font-style:normal;flex:none;width:30px;height:30px;display:grid;place-items:center;border-radius:50%;border:1px solid hsl(var(--h) 70% 55%);color:#fff}

.how{margin:0 0 30px}
.how-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.how-grid li{display:flex;gap:16px;align-items:center;padding:16px 18px;background:linear-gradient(90deg,var(--bg3),var(--bg2));border:1px solid var(--line);clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px))}
.how-grid b{font:700 26px var(--f-head);color:var(--teal);text-shadow:0 0 16px rgba(25,230,181,.6)}
.how-grid strong{display:block;font:700 17px var(--f-head)}.how-grid span{color:var(--muted);font-size:14px}

@media (max-width:1100px){.strip{grid-template-columns:repeat(2,minmax(0,1fr))}.strip>div:nth-child(3){border-left:0}.strip>div:nth-child(n+3){border-top:1px solid var(--line)}}
@media (max-width:860px){
  .hero2{flex-direction:column;align-items:stretch;min-height:0}
  .hero2-img{position:relative;inset:auto;z-index:0}
  .hero2-img img{position:static;width:100%;min-width:0;height:auto;-webkit-mask-image:linear-gradient(180deg,#000 70%,transparent);mask-image:linear-gradient(180deg,#000 70%,transparent)}
  .hero2-txt{max-width:none;padding:0 18px 24px;margin-top:-6px}
  .how-grid{grid-template-columns:1fr}
}
@media (max-width:560px){
  .hero2 h1{font-size:34px}.hero2-feats{gap:12px}.hero2-feats li{flex:1 1 44%}
  .hero2 .btn{flex:1 1 100%;justify-content:center}
  .strip{grid-template-columns:1fr}.strip>div+div{border-left:0;border-top:1px solid var(--line)}
  .cat-grid{grid-template-columns:1fr 1fr;gap:10px}.cat-card{flex-wrap:wrap;padding:14px;min-height:0}.cat-card em{display:none}.cat-card i{width:40px;height:40px}
}
/* ajustes hero v2 */
.hero2-img img{width:64%;min-width:0;object-position:right center}
.hero2-txt{max-width:44%}
.hero2 h1{font-size:clamp(30px,3.7vw,58px)}
.hero2-feats{display:grid;grid-template-columns:repeat(2,max-content);gap:12px 28px}
.cat-card strong{overflow-wrap:normal;word-break:normal}
@media (max-width:1100px){.hero2-img img{width:70%}.hero2-txt{max-width:48%}}
@media (max-width:860px){.hero2-img img{width:100%}.hero2-txt{max-width:none}.hero2-feats{grid-template-columns:repeat(4,max-content)}}
@media (max-width:560px){.hero2-feats{grid-template-columns:1fr 1fr}.cat-grid{grid-template-columns:1fr}.cat-card{flex-wrap:nowrap}.cat-card em{display:grid}}

/* ===== Home: banner de borde a borde detrás de la barra superior ===== */
.tb-right{display:flex;align-items:center;gap:14px}
.tbico{position:relative;display:grid;place-items:center;width:40px;height:40px;color:var(--text)}
.tbico:hover{color:var(--teal);text-decoration:none}
.tbico b{position:absolute;top:0;right:-2px;min-width:18px;height:18px;padding:0 4px;border-radius:99px;background:var(--teal);color:#021;font:700 11px/18px var(--f-head);text-align:center}
.tbico b.dot{min-width:0;width:9px;height:9px;padding:0;top:6px;right:8px}
.search{border-color:var(--teal2);box-shadow:0 0 14px rgba(25,230,181,.18) inset}
body.home main{position:relative}
body.home .topbar{position:absolute;left:0;right:0;top:0;background:transparent;border-bottom:0;backdrop-filter:none}
body.home .search{background:rgba(4,9,11,.55)}
body.home .chip{background:rgba(4,9,11,.6)}
body.home .content{padding-top:0}
body.home .hero2{margin:0 calc(-1*clamp(16px,2.6vw,48px)) 18px;border:0;border-radius:0;box-shadow:none;min-height:500px;padding-top:78px;align-items:center}
body.home .hero2::after{content:"";position:absolute;left:0;right:0;bottom:0;height:90px;background:linear-gradient(transparent,var(--bg));z-index:-1;pointer-events:none}
body.home .hero2-img img{width:66%;min-width:0}
body.home .hero2-txt{padding-left:clamp(16px,2.6vw,48px)}
@media (max-width:860px){
  body.home .topbar{position:relative;background:rgba(4,9,11,.75)}
  body.home .hero2{padding-top:0;min-height:0}
  body.home .hero2-img img{width:100%}
  .tb-right{gap:6px}
}
/* hero: que el logo del banner se vea completo */
body.home .hero2{min-height:470px}
body.home .hero2-img img{width:76%;object-position:right center;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 16%);mask-image:linear-gradient(90deg,transparent 0,#000 16%)}
body.home .hero2-txt{max-width:42%}
@media (max-width:1100px){body.home .hero2-img img{width:84%}body.home .hero2-txt{max-width:46%}}
@media (max-width:860px){body.home .hero2-img img{width:100%;-webkit-mask-image:linear-gradient(180deg,#000 70%,transparent);mask-image:linear-gradient(180deg,#000 70%,transparent)}body.home .hero2-txt{max-width:none}}
/* hero: legibilidad y apilado en pantallas medianas */
.hero2::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(2,8,10,.88) 0,rgba(2,8,10,.55) 38%,transparent 56%)}
@media (max-width:1240px){
  .hero2{flex-direction:column;align-items:stretch;min-height:0!important}
  .hero2::before{display:none}
  .hero2-img{position:relative;inset:auto;z-index:0}
  body.home .hero2-img img,.hero2-img img{position:static;width:100%;min-width:0;height:auto;-webkit-mask-image:linear-gradient(180deg,#000 70%,transparent);mask-image:linear-gradient(180deg,#000 70%,transparent)}
  body.home .hero2{padding-top:0}
  body.home .hero2-txt,.hero2-txt{max-width:none;padding-bottom:26px;margin-top:-6px}
  body.home .topbar{position:relative;background:rgba(4,9,11,.75)}
  .hero2-feats{grid-template-columns:repeat(4,max-content)}
}
@media (max-width:560px){.hero2-feats{grid-template-columns:1fr 1fr}}
/* hero v2 final: columna de texto angosta en escritorio, apilado ≤1240px */
@media (min-width:1241px){
  body.home .hero2-txt{max-width:none;width:clamp(320px,30vw,460px)}
  body.home .hero2 h1{font-size:clamp(30px,3.4vw,52px)}
  body.home .hero2 p{max-width:340px}
  body.home .hero2 .hero-cta{flex-direction:column;align-items:flex-start;gap:10px}
  body.home .hero2 .hero-cta .btn{min-width:230px;justify-content:center}
}
@media (max-width:1240px){body.home .hero2{align-items:stretch}}
/* título con imagen de marca */
.hero2 h1{font-size:0;line-height:0;margin:14px 0 14px}
.title-img{display:block;width:min(100%,520px);height:auto;filter:drop-shadow(0 4px 14px rgba(0,0,0,.6))}
@media (min-width:1241px){body.home .title-img{width:clamp(280px,26vw,420px)}}
@media (max-width:560px){.title-img{width:min(100%,320px)}}
@media (min-width:1241px){body.home .title-img{width:clamp(260px,22.5vw,380px)}}

/* Pie de página compacto */
.foot{padding-top:10px;padding-bottom:10px;font-size:12.5px;line-height:1.4;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:2px 20px}
@media (max-width:980px){.foot{padding-bottom:84px;display:grid}}
/* Pie compacto en celular */
@media (max-width:980px){
  .hide-m{display:none}
  .foot{padding:8px 16px;font-size:12px;display:flex;justify-content:space-between;align-items:center;gap:8px}
  body{padding-bottom:62px}
}
/* Tarjeta de categoría con imagen de fondo */
.cat-card.has-bg{background:linear-gradient(90deg,rgba(2,8,10,.9) 0,rgba(2,8,10,.62) 45%,rgba(2,8,10,.15) 100%),var(--bg) center/cover no-repeat;min-height:110px}
.cat-card.has-bg:hover{box-shadow:0 8px 28px rgba(25,230,181,.25)}
.cat-card.has-bg span{color:#cfe3de}
.cat-card.has-bg{background:linear-gradient(90deg,rgba(2,8,10,.94) 0,rgba(2,8,10,.8) 48%,rgba(2,8,10,.35) 100%),var(--bg) center/cover no-repeat}
.cat-card.has-bg strong{text-shadow:0 1px 6px #000}
/* Tarjeta de categoría con diseño completo en la imagen */
.cat-card.has-art{background:var(--bg) center/100% 100% no-repeat;border:0;border-radius:18px;aspect-ratio:1808/572;min-height:0;padding:0}
.cat-card.has-art>*{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.cat-card.has-art:hover{box-shadow:0 8px 28px rgba(25,230,181,.28)}

/* Nombre de quien envía el pago (dentro de métodos de pago) */
.btn:disabled{opacity:.45;cursor:not-allowed;filter:grayscale(.4);box-shadow:none}
#buy-hint{color:#ffe08a;margin-top:8px}

/* ===== Ajuste completo para celular ===== */
@media (max-width:700px){
  /* Barra superior compacta */
  .topbar{padding:10px 12px;gap:6px}
  .search{padding:0 10px}.search input{font-size:15px;padding:10px 0}
  .tbico{width:34px;height:34px}.tb-right{gap:2px}
  .chip{padding:7px 10px}.chip svg{display:none}
  /* Pasos del pedido en una sola línea */
  .steps{flex-wrap:nowrap;gap:6px;overflow-x:auto;scrollbar-width:none}
  .steps::-webkit-scrollbar{display:none}
  .steps li{flex:none;padding:7px 10px;font-size:11.5px;gap:6px;letter-spacing:.3px}
  /* Ficha de producto */
  .pdp{gap:18px}.pdp-art .art{aspect-ratio:16/10;max-height:230px}
  .pdp-info .btn.xl,.pdp-info .btn.block,.pdp-info form .btn{width:100%;justify-content:center}
  .pdp-info h1{font-size:26px}
  /* Contenido con aire justo */
  .content{padding:14px 14px}
  .panel{padding:16px 14px}
  .h1{font-size:26px}
  .btn.xl{padding:15px 18px}
  /* Panel de administración */
  .adminbar{padding:8px 12px;gap:8px;flex-wrap:nowrap;overflow-x:auto}
  .abrand{flex:none}.adminbar nav{flex-wrap:nowrap;flex:none;gap:0}.adminbar nav a{padding:8px 11px;white-space:nowrap;font-size:13px}
  .adminbar::-webkit-scrollbar{display:none}.adminbar{scrollbar-width:none}
  .content.wide{padding:14px 12px 30px}
  .filters{flex-direction:column;align-items:stretch}.filters>*{width:100%!important}
  /* Tablas como tarjetas */
  .table-wrap{overflow:visible;border:0;background:none}
  .tbl,.tbl tbody{display:block;width:100%}
  .tbl thead{display:none}
  .tbl tr{display:block;margin:0 0 12px;padding:4px 14px;border:1px solid var(--line);border-radius:12px;background:var(--bg2)}
  .tbl tr[hidden]{display:none!important}
  .tbl tr:hover td{background:none}
  .tbl td,.tbl.compact td{display:flex;justify-content:space-between;align-items:center;gap:14px;text-align:right;padding:9px 0;border:0;border-bottom:1px dashed var(--line);min-width:0}
  .tbl td:last-child{border-bottom:0}
  .tbl td::before{content:attr(data-label);flex:none;max-width:42%;text-align:left;color:var(--teal);font:600 11px var(--f-head);letter-spacing:1.2px;text-transform:uppercase}
  .tbl td[data-label=""]::before,.tbl td[colspan]::before{display:none}
  .tbl td[data-label=""]{justify-content:flex-end}
  .tbl td[colspan]{display:block;text-align:left;padding:10px 0}
  .tbl td>*{min-width:0}
  .tbl td input:not([type=checkbox]):not([type=radio]){flex:1;width:auto;min-width:0;text-align:left}
  .tbl td input[type=number]{flex:none;width:80px!important}
  .detail-row{border-style:dashed!important}
  .rowacts{justify-content:flex-end}
  .rowacts .mini-in{width:100px!important}
  .tbl td .actions,.tbl td form{flex-wrap:wrap;justify-content:flex-end}
  /* Cuadrícula de resumen del admin */
  .stats,.cards4{grid-template-columns:1fr 1fr!important}
}
@media (max-width:380px){
  .steps li{font-size:10.5px;padding:6px 8px}
  .search input::placeholder{font-size:14px}
}
@media (max-width:700px){
  .tbl td.is-empty{display:none}
  .tbl td .cell{flex:1;min-width:0;text-align:right;overflow-wrap:break-word}
  .tbl td .cell small{display:block}
  .tbl td .cell input:not([type=checkbox]):not([type=radio]){width:100%;text-align:left}
  .tbl td .cell input[type=number]{width:90px!important;display:block;margin-left:auto}
  .tbl td .cell input[type=checkbox]{margin:0}
  .tbl td .rowacts{justify-content:flex-end}
  .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;overflow:visible}
  .steps li{justify-content:center;text-align:center;flex-wrap:wrap;gap:2px 6px;padding:7px 4px;font-size:10.5px;letter-spacing:.2px;line-height:1.2}
}
@media (max-width:700px){.tbl td .cell small,.tbl td .cell .muted{margin:0;line-height:1.4}.tbl td .cell>*{margin-top:0;margin-bottom:0}}

/* ===== Ficha de producto estilo panel HUD ===== */
.spec{position:relative;border:0;background:linear-gradient(180deg,rgba(8,26,32,.92),rgba(5,16,20,.96));margin-bottom:16px;
  clip-path:polygon(0 12px,12px 0,calc(100% - 12px) 0,100% 12px,100% calc(100% - 12px),calc(100% - 12px) 100%,12px 100%,0 calc(100% - 12px));
  box-shadow:inset 0 0 0 1px #1d7f73,inset 0 0 22px rgba(25,230,181,.12)}
.spec-h{display:flex;align-items:center;gap:14px;padding:11px 16px;border-bottom:1px solid #1d6a5d;background:linear-gradient(90deg,rgba(25,230,181,.14),rgba(25,230,181,.03) 70%,transparent);
  font:700 13px var(--f-mono);letter-spacing:3.5px;color:#27f0ff;text-shadow:0 0 10px rgba(39,240,255,.55)}
.spec-h i{font-style:normal;font-size:18px;letter-spacing:-2px;transform:skewX(-12deg);color:#2ff6ff}
.spec-h u{margin-left:auto;width:34px;height:3px;background:repeating-linear-gradient(90deg,#27f0ff 0 3px,transparent 3px 7px);opacity:.8}
.spec-b{padding:16px 18px;color:#d3ece7;font-size:17px;line-height:1.5}
.buybox{position:relative;border:0;gap:16px 20px;padding:20px;background:linear-gradient(180deg,rgba(8,26,32,.92),rgba(5,16,20,.96));
  clip-path:polygon(0 14px,14px 0,calc(100% - 14px) 0,100% 14px,100% calc(100% - 14px),calc(100% - 14px) 100%,14px 100%,0 calc(100% - 14px));
  box-shadow:inset 0 0 0 1px #1d7f73,inset 0 0 22px rgba(25,230,181,.12);flex-wrap:nowrap;flex-direction:row;align-items:center;flex-wrap:wrap}
.buybox .qty{color:#e5f6f2;font-size:17px;gap:16px}
.stepper{border:1px solid #1d8f80;border-radius:8px;box-shadow:0 0 0 3px rgba(25,230,181,.07)}
.stepper button{width:46px;height:44px;color:#3df0d0;font-size:24px;background:rgba(25,230,181,.08)}
.stepper input{width:70px;background:#02080a;font:700 22px var(--f-head);color:#fff}
.buy-wrap{flex:1 1 260px;filter:drop-shadow(0 0 14px rgba(25,230,181,.55))}
.btn.buy-now{width:100%;padding:16px 22px;font:700 22px var(--f-head);letter-spacing:1.5px;gap:18px;justify-content:space-between;
  background:linear-gradient(180deg,#5ffbe0 0%,#22e8c4 55%,#14c9a8 100%);clip-path:polygon(0 14px,14px 0,calc(100% - 14px) 0,100% 14px,100% calc(100% - 14px),calc(100% - 14px) 100%,14px 100%,0 calc(100% - 14px))}
.btn.buy-now em{width:1px;height:34px;background:rgba(2,17,13,.45);flex:none}
.btn.buy-now span{flex:1;text-align:center}
.btn.buy-now b{font-size:30px;line-height:1;color:#c9fff4;text-shadow:0 0 8px #fff}
.btn.buy-now svg{flex:none;fill:#02110d;stroke:#02110d}
.stock-note{display:flex;align-items:center;gap:12px;color:#b6d6d0;font-size:16px}
.stock-note .ico{color:#27f0ff;flex:none}
@media (max-width:700px){.spec-h{letter-spacing:2px;font-size:12px}.spec-b{font-size:16px}.btn.buy-now{font-size:18px}.buy-wrap{flex-basis:100%}}
/* botón comprar: una sola línea, sin cortes */
.btn.buy-now{padding:14px 16px;gap:12px;font-size:clamp(15px,4.6vw,22px);letter-spacing:1px;white-space:nowrap}
.btn.buy-now span{white-space:nowrap;flex:1 1 auto;min-width:0}
.btn.buy-now b{font-size:clamp(20px,5vw,30px);color:#e9fffa}
.btn.buy-now svg{width:22px;height:22px;fill:#02110d;stroke:#02110d;stroke-width:1}
@media (max-width:420px){.btn.buy-now{gap:8px;padding:13px 12px;letter-spacing:.5px}.btn.buy-now em{height:26px}}
/* admin en celular: menú hacia abajo (vertical), no hacia el lado */
@media (max-width:700px){
  .adminbar{flex-direction:column;align-items:stretch;flex-wrap:nowrap;overflow:visible;position:static;gap:6px;padding:10px 14px}
  .adminbar nav{flex-direction:column;flex-wrap:nowrap;gap:2px;width:100%}
  .adminbar nav a{display:block;padding:11px 12px;font-size:15px;border-left:2px solid transparent}
  .adminbar nav a.on{border-left-color:var(--teal)}
  .adminbar .abrand{flex:none}
}
/* admin en computador: menú lateral, opciones hacia abajo */
@media (min-width:701px){
  body.admin .adminbar{position:fixed;left:0;top:0;bottom:0;width:220px;flex-direction:column;align-items:stretch;flex-wrap:nowrap;gap:14px;padding:18px 12px;border-bottom:0;border-right:1px solid var(--line);overflow-y:auto}
  body.admin .adminbar nav{flex-direction:column;flex-wrap:nowrap;gap:2px;width:100%}
  body.admin .adminbar nav a{display:block;padding:11px 14px;font-size:15px;border-left:2px solid transparent}
  body.admin .adminbar nav a.on{border-left-color:var(--teal)}
  body.admin .abrand{padding:0 6px 12px;border-bottom:1px solid var(--line)}
  body.admin .content.wide{margin-left:220px;width:calc(100% - 220px);max-width:none}
  body.admin #toast{left:calc(50% + 110px)}
}

/* stock: modo de carga */
.modes{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:12px 0}
.mode{display:flex;gap:12px;align-items:flex-start;padding:14px;border:1px solid var(--line2);background:var(--bg2);cursor:pointer;border-radius:8px}
.mode:has(input:checked){border-color:var(--teal);background:rgba(25,230,181,.08);box-shadow:0 0 0 1px var(--teal) inset}
.mode input{margin-top:4px;accent-color:var(--teal);width:auto}
.mode b{display:block;color:var(--text);font:700 15px var(--f-head)}.mode small{display:block;color:var(--muted);margin-top:4px;line-height:1.4}
@media (max-width:700px){.modes{grid-template-columns:1fr}}
/* stock: opciones más compactas */
.modes{grid-template-columns:repeat(2,minmax(0,380px));gap:8px;margin:8px 0}
.mode{padding:8px 12px;gap:8px;border-radius:6px}
.mode b{font-size:13px}
.mode small{font-size:11.5px;margin-top:2px;line-height:1.35}
.mode input{margin-top:2px;width:14px;height:14px}
@media (max-width:700px){.modes{grid-template-columns:1fr}}
.mode code{white-space:nowrap;font-size:11px;padding:0 4px}

/* admin: ficha de cliente */
.row-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px 14px;margin-bottom:10px}
.ord-edit{padding:0}.ord-edit>summary{padding:12px 16px;cursor:pointer;list-style:none;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.ord-edit>summary::-webkit-details-marker{display:none}.ord-edit[open]>summary{border-bottom:1px solid var(--line)}
.ord-edit>form{padding:16px}
.chk{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}.chk input{width:auto}
@media (max-width:700px){.ord-edit>summary{font-size:13px}}
/* ===== Ficha de cliente: estilo HUD ===== */
.ficha .fstats{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-bottom:16px}
.ficha .fstat{display:flex;align-items:center;gap:16px;padding:14px 18px;background:linear-gradient(180deg,rgba(10,32,38,.95),rgba(5,17,21,.95));
  clip-path:polygon(0 10px,10px 0,calc(100% - 10px) 0,100% 10px,100% calc(100% - 10px),calc(100% - 10px) 100%,10px 100%,0 calc(100% - 10px));
  box-shadow:inset 0 0 0 1px #1f9c8c,inset 0 0 26px rgba(25,230,181,.16)}
.ficha .fstat i{flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:10px;color:#3df0d0;background:rgba(25,230,181,.08);box-shadow:inset 0 0 0 1px #1f9c8c}
.ficha .fstat p{margin:0;display:flex;flex-direction:column}.ficha .fstat small{color:var(--muted);font-size:13px}.ficha .fstat b{font:700 26px var(--f-head);color:#fff;line-height:1.15}
.ficha .panel{position:relative;border:0;padding:18px 20px;background:linear-gradient(180deg,rgba(9,28,34,.95),rgba(5,16,20,.97));
  clip-path:polygon(0 12px,12px 0,calc(100% - 12px) 0,100% 12px,100% calc(100% - 12px),calc(100% - 12px) 100%,12px 100%,0 calc(100% - 12px));
  box-shadow:inset 0 0 0 1px #1f9c8c,inset 0 0 30px rgba(25,230,181,.13)}
.ficha .ord-edit{padding:0}
.ficha .ph.hi{display:flex;align-items:center;gap:10px;font-size:20px;margin:0 0 12px}
.ficha .ph.hi i{display:grid;place-items:center;width:38px;height:38px;border-radius:8px;color:#3df0d0;background:rgba(25,230,181,.08);box-shadow:inset 0 0 0 1px #1f9c8c}
.ficha .fl{display:block;margin-bottom:12px}.ficha .fl>span{display:block;color:#a9cdc6;font-size:13px;margin-bottom:5px}
.ficha .fi{display:flex;align-items:stretch;background:#030b0e;border-radius:8px;box-shadow:inset 0 0 0 1px #1f8f80;overflow:hidden}
.ficha .fi .ico{flex:none;width:46px;padding:0 14px;box-sizing:content-box;align-self:center;color:#3df0d0}
.ficha .fi>.ico{border-right:1px solid #12403a;height:100%;padding:11px 14px;width:18px}
.ficha .fi input,.ficha .fi select,.ficha .fi textarea{flex:1;min-width:0;border:0!important;background:transparent!important;box-shadow:none!important;border-radius:0;padding:12px 14px;color:var(--text)}
.ficha .fi.ta{align-items:flex-start}.ficha .fi.ta>.ico{height:auto;align-self:stretch}
.ficha .fi:focus-within{box-shadow:inset 0 0 0 1px var(--teal),0 0 10px rgba(25,230,181,.25)}
.ficha .btn .ico{margin-right:2px}
.ficha .btn.ghost.danger{color:#ff7a86;box-shadow:inset 0 0 0 1px #8d3a45}
.ficha .btn.ghost.danger:hover{background:rgba(255,93,108,.1)}

.clean-old{margin:0 0 12px}.btn.ghost.danger{color:#ff7a86;box-shadow:inset 0 0 0 1px #8d3a45}.btn.ghost.danger:hover{background:rgba(255,93,108,.1)}
/* ===== Cuentas vendidas: LED de vencimiento ===== */
.led{display:inline-block;flex:none;width:12px;height:12px;border-radius:50%;vertical-align:middle;background:#555;box-shadow:inset 0 0 2px rgba(255,255,255,.5)}
.led.green{background:#19e65a;box-shadow:0 0 6px 1px #19e65a,0 0 14px 2px rgba(25,230,90,.45)}
.led.amber{background:#ffb81c;box-shadow:0 0 6px 1px #ffb81c,0 0 14px 2px rgba(255,184,28,.5);animation:ledSlow 1.8s ease-in-out infinite}
.led.red{background:#ff3347;box-shadow:0 0 7px 2px #ff3347,0 0 18px 3px rgba(255,51,71,.6);animation:ledFast .7s steps(2,end) infinite}
.led.off{background:#3a4a4c;box-shadow:none}
@keyframes ledSlow{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes ledFast{0%{opacity:1}50%{opacity:.15}}
.nbadge{margin-left:4px;padding:0 6px;border-radius:9px;background:#ff3347;color:#fff;font:700 11px var(--f-head)}
.led-sum{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-bottom:16px}
.led-box{display:flex;align-items:center;gap:14px;padding:14px 18px;background:linear-gradient(180deg,rgba(10,32,38,.95),rgba(5,17,21,.95));box-shadow:inset 0 0 0 1px #1f9c8c;border-radius:8px;color:var(--text)}
.led-box:hover{text-decoration:none;box-shadow:inset 0 0 0 1px var(--teal)}.led-box.on{box-shadow:inset 0 0 0 2px var(--teal)}
.led-box .led{width:18px;height:18px}.led-box p{margin:0;display:flex;flex-direction:column}.led-box b{font:700 26px var(--f-head);line-height:1.1}.led-box small{color:var(--muted)}
.acc-list{display:grid;gap:8px;margin-bottom:0}
.acc{background:linear-gradient(180deg,rgba(9,28,34,.95),rgba(5,16,20,.97));box-shadow:inset 0 0 0 1px #1f6a60;border-radius:8px}
.acc.amber{box-shadow:inset 0 0 0 1px #8a6a1c}.acc.red{box-shadow:inset 0 0 0 1px #8d2a36}
.acc>summary{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;padding:12px 16px;cursor:pointer;list-style:none}
.acc>summary::-webkit-details-marker{display:none}
.acc-svc{font:700 16px var(--f-head);min-width:120px}.acc-cust{color:#cfe8e3;flex:1 1 140px}
.acc-left{font:600 13px var(--f-head);padding:2px 10px;border-radius:12px;background:rgba(255,255,255,.06)}
.acc-left.green{color:#19e65a}.acc-left.amber{color:#ffb81c}.acc-left.red{color:#ff6577}
.acc-body{padding:0 16px 16px;border-top:1px solid var(--line)}
.acc-data{display:flex;gap:10px;align-items:flex-start;margin:12px 0}.acc-data .pre{flex:1;margin:0}
.acc .actions{margin:8px 0}.acc-edit{margin-top:8px}.acc-edit>form{margin-top:10px}
.quick{display:flex;gap:6px;margin-top:6px;flex-wrap:wrap}.quick button{padding:3px 10px;border:1px solid var(--line2);background:var(--bg3);color:var(--teal);border-radius:12px;cursor:pointer;font:600 12px var(--f-head)}
.quick button:hover{background:rgba(25,230,181,.15)}
body.admin .adminbar nav a{display:flex;align-items:center;gap:8px;white-space:nowrap}
body.admin .adminbar nav a .nbadge{margin-left:auto}

.track-box{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;padding:12px 14px;border:1px solid var(--line2);background:rgba(25,230,181,.05);border-radius:8px}
.track-box .chk{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--text);flex:1 1 320px}.track-box .chk input{width:auto}
.trk-days{display:flex;align-items:center;gap:8px;color:var(--muted)}.trk-days input{width:80px}
/* sin flechitas nativas en campos numéricos */
input[type=number]{-moz-appearance:textfield;appearance:textfield}
input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;appearance:none;margin:0}
.ficha .fl>span.quick{display:flex;gap:8px;margin-top:8px;color:inherit;font-size:inherit}
.quick button{padding:4px 14px}

/* ===== Tema claro de la tienda (el admin sigue oscuro) ===== */
body.light{
  --bg:#edf2f5;--bg2:#ffffff;--bg3:#f5f8fa;--line:#d3e0e5;--line2:#a9cbcb;
  --teal:#0c9f80;--teal2:#0a8a70;--text:#10303a;--muted:#5b7983;--warn:#b57e00;--bad:#d6364a;--ok:#0c9f80;
  background-color:var(--bg);
  background-image:radial-gradient(900px 500px at 85% -10%,rgba(25,230,181,.14),transparent 60%),radial-gradient(700px 500px at -10% 40%,rgba(80,170,255,.08),transparent 60%);
}
body.light .dock{--text:#e3f6f1;--muted:#93b9b1;--bg3:rgba(255,255,255,.07);--teal:#19e6b5;--line:rgba(255,255,255,.12);
  background:linear-gradient(180deg,#0d3037,#071a1f);border-right-color:#0a2228}
body.light .dock nav a.on{background:linear-gradient(90deg,rgba(25,230,181,.28),rgba(25,230,181,.06));color:#19e6b5}
body.light .dock-foot{color:#93b9b1}
body.light .topbar{background:rgba(255,255,255,.88);border-bottom-color:var(--line)}
body.light .search{background:#fff;border-color:var(--line);box-shadow:0 1px 2px rgba(16,48,58,.06)}
body.light .chip{background:#fff;border-color:var(--line);color:var(--text);box-shadow:0 1px 2px rgba(16,48,58,.06)}
body.light .tbico{color:var(--text)}
body.light .strip{background:#fff;border-color:var(--line);box-shadow:0 2px 8px rgba(16,48,58,.06)}
body.light .strip>div{border-color:var(--line)}
body.light .strip i,body.light .hero2-feats i{background:rgba(25,230,181,.12)}
body.light .card,body.light .panel,body.light .spec,body.light .buybox{background:#fff;box-shadow:0 2px 10px rgba(16,48,58,.07)}
body.light .card:hover{filter:drop-shadow(0 6px 8px rgba(0,0,0,.28)) drop-shadow(0 18px 24px rgba(0,0,0,.42))}
body.light .card-body p{color:var(--muted)}
body.light h1,body.light h2,body.light h3{color:var(--text)}
body.light .tbl,body.light .table-wrap{background:#fff}
body.light .tbl th{background:var(--bg3);color:var(--teal)}
body.light .tbl td{border-color:var(--line)}
body.light input,body.light select,body.light textarea{color:var(--text)}
body.light label>input,body.light label>select,body.light label>textarea,body.light .mini-in{background:#fff;border-color:var(--line2);color:var(--text)}
body.light .filters a,body.light .chips a{background:#fff;border-color:var(--line);color:var(--muted)}
body.light .filters a.on,body.light .chips a.on{background:var(--teal);color:#fff;border-color:var(--teal)}
body.light .flash{background:#fff}
body.light footer,body.light .foot{background:transparent;color:var(--muted)}
body.light .btn.ghost{color:var(--teal);box-shadow:inset 0 0 0 1px var(--line2)}
body.light .stepper{background:#fff}.body.light .stepper input,body.light .stepper input{background:#fff;color:var(--text)}
body.light .stepper button{background:var(--bg3);color:var(--teal)}
body.light .spec-h{background:linear-gradient(90deg,rgba(25,230,181,.16),rgba(25,230,181,.03) 70%,transparent);color:#0a8a70;text-shadow:none;border-bottom-color:var(--line2)}
body.light .spec{box-shadow:inset 0 0 0 1px var(--line2),0 2px 10px rgba(16,48,58,.07)}
body.light .spec-b{color:var(--text)}
body.light .buybox{box-shadow:inset 0 0 0 1px var(--line2),0 2px 10px rgba(16,48,58,.07)}
body.light .buybox .qty,body.light .stock-note{color:var(--text)}
body.light .stepper input{background:#fff;color:var(--text)}
body.light .hero2{--text:#e8f8f4;--muted:#b4d2cb;--teal:#19e6b5;--line:rgba(255,255,255,.18)}
body.light .hero2 h1,body.light .hero2 p,body.light .hero2-feats span{color:#e8f8f4}
body.light .price b,body.light .price.big b{background:linear-gradient(180deg,#14404a,#0a1f26);-webkit-background-clip:text;background-clip:text;color:transparent}
body.light .mono.big{color:var(--text)}
body.light .price s{color:#7d95a0}
/* Tema claro: tinte verde menta en todas las superficies blancas */
body.light{--mint:linear-gradient(180deg,#d9f0ed 0%,#e8f3f4 55%,#eef4f7 100%)}
body.light .topbar{background:linear-gradient(180deg,rgba(217,240,237,.94),rgba(232,243,244,.94))}
body.light .search,body.light .chip,body.light .strip,body.light .card,body.light .panel,body.light .spec,body.light .buybox,
body.light .tbl,body.light .table-wrap,body.light .flash,body.light .stepper,body.light .filters a,body.light .chips a{background:var(--mint)}
body.light label>input,body.light label>select,body.light label>textarea,body.light .mini-in,
body.light .stepper input{background:#eef8f6}
body.light .filters a.on,body.light .chips a.on{background:var(--teal)}
body.light{--bg2:#e4f3f1;--bg3:#e9f4f4}
/* Tema claro: fondo de la página con tinte menta */
body.light{background-color:#e3f2f0;background-attachment:fixed;
  background-image:radial-gradient(1000px 600px at 85% -10%,rgba(25,230,181,.22),transparent 62%),radial-gradient(800px 600px at -10% 45%,rgba(25,230,181,.12),transparent 62%),linear-gradient(180deg,#d4eeea 0%,#e1f1f0 45%,#e9f3f5 100%)}
/* Tarjeta de producto estilo HUD (neón cian) */
.grid .card{--text:#e6f7f3;--muted:#9fc6be;--line:rgba(255,255,255,.14);color:#e6f7f3;padding:4px;
  background:linear-gradient(180deg,#0b2f36,#061b20);border:1px solid rgba(25,230,181,.55);box-shadow:inset 0 0 0 1px rgba(25,230,181,.18),0 0 18px rgba(25,230,181,.22)}
.grid .card .art{border-radius:10px 10px 0 0}
.grid .card .tags{top:14px;left:14px}
.grid .card .tag.auto{border-color:#19e6b5;color:#7ff5dc;background:rgba(3,22,26,.78)}
.grid .card-body{padding:16px 14px 12px;gap:6px;background:linear-gradient(180deg,rgba(12,50,58,.9),rgba(6,27,32,.95));border:1px solid rgba(25,230,181,.25);border-radius:0 0 10px 10px;margin-top:-1px}
.grid .card .cat{color:#19e6b5;letter-spacing:3px;position:relative;padding-bottom:8px}
.grid .card .cat::after{content:'';position:absolute;left:0;bottom:0;width:34px;height:2px;background:#19e6b5}
.grid .card h3{color:#fff;font-size:22px;line-height:1.15;margin-top:4px}
.grid .card-body p{color:#cfe9e3;font-size:14px;flex:0 0 auto;min-height:20px}
.grid .card .pbox{display:flex;align-items:center;gap:12px;margin-top:10px;padding:10px 12px;border:1px solid rgba(25,230,181,.28);border-radius:10px;background:rgba(2,14,17,.55)}
.grid .card .pbox .pl{flex:none;display:grid;gap:2px;padding-right:12px;border-right:1px solid rgba(255,255,255,.14)}
.grid .card .pbox .pl small{font:600 10px var(--f-mono);letter-spacing:2px;color:#9fc6be}
.grid .card .pbox .pl s{color:#9fb5b1;font-size:14px}.grid .card .pbox .pl s:empty{display:none}
.grid .card .pbox .price{margin-left:auto}
.grid .card .price b{font-size:26px;background:linear-gradient(180deg,#ffffff,#9cf5e3);-webkit-background-clip:text;background-clip:text;color:transparent}
.grid .card .price i{color:#9fc6be}
.grid .card .acts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.grid .card .acts span{display:flex;align-items:center;justify-content:center;gap:8px;padding:10px 8px;border-radius:9px;font:700 15px var(--f-head);border:1px solid rgba(25,230,181,.6);color:#d9fff6;background:rgba(2,14,17,.5)}
.grid .card .acts span.buy{background:linear-gradient(180deg,#5af5dc,#19e6b5);color:#032a22;border-color:#5af5dc}
.grid .card:hover{filter:drop-shadow(0 6px 8px rgba(0,0,0,.28)) drop-shadow(0 18px 24px rgba(0,0,0,.42))}
@media(max-width:640px){
  .grid .card h3{font-size:16px}
  .grid .card .pbox{flex-direction:column;align-items:flex-start;gap:4px;padding:8px 10px}
  .grid .card .pbox .pl{border:0;padding:0;display:flex;gap:8px;align-items:baseline}
  .grid .card .pbox .price{margin-left:0}.grid .card .price b{font-size:20px}
  .grid .card .acts{grid-template-columns:1fr}.grid .card .acts span{padding:8px;font-size:14px}
}
body.light .grid .card{background:linear-gradient(180deg,#0b2f36,#061b20);box-shadow:inset 0 0 0 1px rgba(25,230,181,.18),0 0 18px rgba(25,230,181,.22)}
/* Tarjetas: precio y botones siempre alineados abajo */
.grid{align-items:stretch}
.grid .card{height:100%}
.grid .card-body{flex:1 1 auto}
.grid .card-body p{flex:1 1 auto;min-height:20px}
.grid .card .pbox{margin-top:auto}
/* Carrito */
.dbadge{margin-left:auto;min-width:20px;height:20px;padding:0 6px;border-radius:99px;background:#19e6b5;color:#032a22;font:700 12px/20px var(--f-head);text-align:center}
.dbadge[hidden],.tbico b[hidden]{display:none}
.grid .card .acts span.buy{cursor:pointer}.grid .card .acts span.buy.off{background:rgba(255,255,255,.08);color:#9fb5b1;border-color:transparent;cursor:default}
.toast{position:fixed;right:18px;bottom:22px;z-index:99;display:flex;gap:12px;align-items:center;padding:12px 16px;background:#0b2f36;color:#e6f7f3;border:1px solid #19e6b5;border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.35);font:600 14px var(--f-head);animation:toastin .25s ease}
.toast a{color:#19e6b5;text-decoration:underline}.toast.bad{border-color:#ff6b6b}.toast.out{opacity:0;transform:translateY(8px);transition:.35s}
@keyframes toastin{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media(max-width:700px){.toast{left:14px;right:14px;bottom:84px}}
.cart-line{display:grid;grid-template-columns:60px 1fr auto auto auto;gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
.cart-line:last-child{border-bottom:0}
.cart-line .cl-info{display:grid;gap:2px;min-width:0}.cart-line .cl-info strong{overflow-wrap:break-word}
.cart-line .cl-sub{white-space:nowrap}
.sum-row.tot{border-top:1px solid var(--line);padding-top:10px;margin-top:6px}
@media(max-width:700px){.cart-line{grid-template-columns:60px 1fr auto;grid-template-areas:"a b e" "a c d"}.cart-line>:nth-child(1){grid-area:a}.cart-line>:nth-child(2){grid-area:b}.cart-line>:nth-child(3){grid-area:c}.cart-line>:nth-child(4){grid-area:d;justify-self:end}.cart-line>:nth-child(5){grid-area:e}}
/* Carrito lateral */
.cdr{position:fixed;inset:0;z-index:120;pointer-events:none}
.cdr-bg{position:absolute;inset:0;background:rgba(2,10,12,.62);opacity:0;transition:opacity .25s}
.cdr-panel{position:absolute;top:0;right:0;bottom:0;width:min(400px,100%);display:flex;flex-direction:column;background:linear-gradient(180deg,#0b2f36,#061b20);color:#e6f7f3;border-left:1px solid rgba(25,230,181,.45);box-shadow:-10px 0 40px rgba(0,0,0,.45);transform:translateX(102%);transition:transform .28s ease}
.cdr.open{pointer-events:auto}.cdr.open .cdr-bg{opacity:1}.cdr.open .cdr-panel{transform:none}
.cdr-h{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid rgba(255,255,255,.12)}
.cdr-h h3{margin:0;color:#fff;font-size:20px}.cdr-h small{color:#9fc6be;font-weight:500}
.cdr-x{display:inline-flex;align-items:center;gap:6px;background:none;border:0;color:#e6f7f3;font:600 14px var(--f-head);cursor:pointer}
.cdr-b{flex:1;overflow:auto;padding:12px 20px}
.cdr-item{display:grid;grid-template-columns:64px 1fr auto;gap:14px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.1);align-items:start}
.cdr-item .art{width:64px;border-radius:8px}
.cdr-info{display:grid;gap:4px;min-width:0}.cdr-info strong{color:#fff;font-size:15px;overflow-wrap:break-word}.cdr-info small{color:#9fc6be}
.cdr-q{display:flex;align-items:center;gap:8px;margin-top:4px}.cdr-q b{min-width:18px;text-align:center}.cdr-q em{font-style:normal;color:#19e6b5;font-weight:700;margin-left:4px}
.cdr-q button{width:26px;height:26px;border-radius:7px;border:1px solid rgba(25,230,181,.5);background:rgba(2,14,17,.5);color:#19e6b5;font:700 15px var(--f-head);cursor:pointer;line-height:1}
.cdr-rm{background:none;border:0;color:#9fc6be;cursor:pointer;padding:2px}.cdr-rm:hover{color:#ff6b6b}
.cdr-empty{display:grid;justify-items:center;gap:10px;padding:50px 0;color:#9fc6be}
.cdr-f{padding:16px 20px 20px;border-top:1px solid rgba(255,255,255,.12);display:grid;gap:10px}
.cdr-sub{display:flex;justify-content:space-between;align-items:baseline;font:700 18px var(--f-head)}.cdr-sub b{color:#19e6b5;font-size:22px}
.cdr-f .btn.ghost{color:#d9fff6;box-shadow:inset 0 0 0 1px rgba(25,230,181,.6);background:rgba(2,14,17,.5)}
.dbadge.t{margin:0;position:absolute;top:2px;right:calc(50% - 22px);min-width:16px;height:16px;font-size:10px;line-height:16px;padding:0 4px}
.tabbar a{position:relative}
body.light .cdr-h h3,body.light .cdr-info strong{color:#fff}
body.light .cdr-f .btn.ghost{color:#d9fff6}
body.light .cdr-info small{color:#9fc6be}
/* Tarjeta de producto clara (según mockup): blanca, redondeada, Comprar naranja */
body.light .grid .card{--text:#10303a;--muted:#5b7983;--line:#dbe7ea;color:#10303a;padding:0;clip-path:none;border-radius:22px;overflow:hidden;
  background:linear-gradient(180deg,#ffffff,#eef6f7);border:1px solid #d3e4e7;box-shadow:0 8px 24px rgba(16,48,58,.12)}
body.light .grid .card:hover{filter:none;box-shadow:0 8px 14px rgba(0,0,0,.20),0 22px 38px rgba(0,0,0,.38);transform:translateY(-4px)}
body.light .grid .card .art{border-radius:0}
body.light .grid .card .tag.auto{background:rgba(3,22,26,.8);border-color:#19e6b5;color:#7ff5dc}
body.light .grid .card-body{background:none;border:0;border-radius:0;margin:0;padding:16px 18px 18px}
body.light .grid .card .cat{color:#12b89b}body.light .grid .card .cat::after{background:#19d3b8}
body.light .grid .card h3{color:#0b2a33;font-size:23px;font-weight:800}
body.light .grid .card-body p{color:#5b7983}
body.light .grid .card .pbox{flex-direction:column;align-items:flex-start;gap:2px;background:#e9f1f3;border:0;border-radius:14px;padding:10px 14px}
body.light .grid .card .pbox .pl{border:0;padding:0}
body.light .grid .card .pbox .pl small{color:#6b8590}
body.light .grid .card .pbox .price{margin-left:0}
body.light .grid .card .price b{font-size:30px;background:linear-gradient(180deg,#0b3b45,#0a1f26);-webkit-background-clip:text;background-clip:text;color:transparent}
body.light .grid .card .price i{color:#6b8590}
body.light .grid .card .acts span{border:2px solid #19d3b8;background:#effbf9;color:#0b2a33;border-radius:14px;padding:12px 8px}
body.light .grid .card .acts span.buy{background:linear-gradient(180deg,#ff9a1f,#ff6a00);border-color:#ff9a1f;color:#fff;box-shadow:0 6px 16px rgba(255,120,0,.35)}
body.light .grid .card .acts span.buy.off{background:#e3eaec;color:#8aa0a8;border-color:transparent;box-shadow:none}
@media(max-width:900px){.tabbar{grid-template-columns:repeat(5,1fr)!important}}
@media(max-width:700px){body.light .grid .card h3{font-size:16px;overflow-wrap:break-word;word-break:normal}body.light .grid .card .price b{font-size:22px}body.light .grid .card-body{padding:12px 12px 14px}}
/* Tarjetas en celular: letra más legible */
@media(max-width:700px){
  body.light .grid .card .cat{font:600 12px var(--f-head);letter-spacing:1.6px;color:#0a9c84;padding-bottom:7px}
  body.light .grid .card h3{font:700 17px/1.2 var(--f-head);letter-spacing:.1px;color:#0b2a33;margin-top:2px}
  body.light .grid .card .pbox .pl small{font:600 11px var(--f-head);letter-spacing:1.6px;color:#4f6c77}
  body.light .grid .card .price b{font:700 25px/1.1 var(--f-head);letter-spacing:-.2px}
  body.light .grid .card .price i{font:600 11px var(--f-head);color:#4f6c77}
  body.light .grid .card .acts span{font:700 15px var(--f-head);padding:11px 8px}
  body.light .grid .card .tag{font-size:10.5px;padding:3px 7px}
}
/* Celular: una tarjeta por fila, como el mockup */
.pcoin{display:none}
@media(max-width:560px){
  body.light .grid{grid-template-columns:1fr;gap:18px}
  body.light .grid .card .art{aspect-ratio:16/9}
  body.light .grid .card .art.gen span{font-size:84px}
  body.light .grid .card-body{padding:14px 16px 16px;gap:8px}
  body.light .grid .card .cat{font-size:13px}
  body.light .grid .card h3{font-size:21px}
  body.light .grid .card .pbox{position:relative;padding:12px 16px;gap:0;margin-top:6px}
  body.light .grid .card .pbox .price{display:grid;gap:0}
  body.light .grid .card .price b{font-size:32px}
  body.light .grid .card .price i{font-size:12px;margin-top:2px}
  body.light .grid .card .pcoin{display:block;position:absolute;right:16px;top:50%;transform:translateY(-50%);color:#b4c6cc}
  body.light .grid .card .acts span{padding:13px 8px;font-size:16px}
}
/* Caja de precio (según mockup): vidrio claro, precio grande con degradado y COP en etiqueta */
body.light .grid .card .pbox{background:linear-gradient(180deg,#f9feff,#e9f6f8);border:1px solid #cdeaee;border-radius:18px;box-shadow:0 6px 16px rgba(12,159,128,.10);padding:12px 16px;gap:2px}
body.light .grid .card .pbox .pl small{font:700 12px var(--f-head);letter-spacing:3px;color:#5d7280}
body.light .grid .card .pbox .price{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
body.light .grid .card .price b{font:800 32px/1.05 var(--f-head);letter-spacing:-.3px;background:linear-gradient(180deg,#02121a 30%,#0a7480 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
body.light .grid .card .price i{display:inline-block;margin:0;padding:5px 12px;border-radius:12px;background:#d3f0f2;color:#0b8f95;font:700 14px var(--f-head);letter-spacing:.6px}
body.light .grid .card .pcoin{display:none!important}
@media(max-width:560px){body.light .grid .card .pbox .price{display:flex}body.light .grid .card .price b{font-size:30px}body.light .grid .card .price i{font-size:13px;margin:0;padding:4px 10px}}
/* Franja de garantías en la página de producto */
.perkbar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:26px 0 8px;border-radius:22px;border:1px solid #d3e8ec;background:linear-gradient(180deg,#fafeff,#eef7f8);box-shadow:0 8px 22px rgba(12,159,128,.10)}
.perkbar>div{display:flex;align-items:center;gap:16px;padding:22px 26px;min-width:0}
.perkbar>div+div{border-left:1px solid #d3e4e8}
.perkbar i{flex:none;display:grid;place-items:center;width:62px;height:62px;border-radius:50%;background:#d6f3ee;color:#0c9f80}
.perkbar i svg{width:30px;height:30px}
.perkbar p{margin:0;min-width:0}.perkbar b{display:block;font:700 18px/1.2 var(--f-head);color:#0b2a33}
.perkbar span{display:block;margin-top:2px;color:#5b7983;font-size:15px}
@media(max-width:800px){.perkbar{grid-template-columns:1fr}.perkbar>div{padding:16px 18px}.perkbar>div+div{border-left:0;border-top:1px solid #d3e4e8}.perkbar i{width:52px;height:52px}.perkbar b{font-size:17px}}
/* Botón "Volver al catálogo" (según mockup) */
.backpill{display:inline-flex;align-items:center;gap:12px;margin-bottom:18px;padding:5px 24px 5px 5px;border-radius:999px;border:2px solid #19d3b8;
  background:linear-gradient(180deg,#f8feff,#dff8f5);color:#04202b;font:800 17px var(--f-head);letter-spacing:.1px;box-shadow:0 6px 18px rgba(25,211,184,.35);transition:.18s}
.backpill i{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#7ffbe9,#19e6d0);color:#04202b;box-shadow:0 0 0 3px rgba(255,255,255,.7)}
.backpill:hover{text-decoration:none;transform:translateX(-2px);box-shadow:0 8px 22px rgba(25,211,184,.5)}
@media(max-width:560px){.backpill{font-size:15px;padding-right:18px}.backpill i{width:34px;height:34px}}
/* Carrito lateral claro (según mockup) */
body.light .cdr-panel{background:linear-gradient(180deg,#ffffff,#eef7f8);color:#0b2a33;border-left:1px solid #cfe6e9;box-shadow:-10px 0 40px rgba(8,42,49,.28)}
body.light .cdr-bg{background:rgba(8,32,38,.45)}
body.light .cdr-h{border-bottom:1px solid #dbe9ec}
body.light .cdr-h h3{display:flex;align-items:center;gap:10px;color:#0b2a33;font:800 21px var(--f-head)}
body.light .cdr-h h3 svg{color:#0b2a33}
body.light .cdr-h small{color:#0c9f80;font-weight:700}
body.light .cdr-x{color:#4f6c77}
body.light .cdr-item{border-bottom:1px solid #dbe9ec}
body.light .cdr-item .art{border-radius:12px}
body.light .cdr-info strong{color:#0b2a33;font:700 16px/1.25 var(--f-head)}
body.light .cdr-info small{color:#5b7983}
body.light .cdr-q button{width:32px;height:32px;border-radius:50%;border:1px solid #19d3b8;background:#d9f6f1;color:#0c9f80;font-size:17px}
body.light .cdr-q b{color:#0b2a33;min-width:20px}
body.light .cdr-q em{color:#0c9f80}
body.light .cdr-rm{color:#8aa0a8}body.light .cdr-rm:hover{color:#e0475b}
body.light .cdr-empty{color:#5b7983}
body.light .cdr-f{border-top:1px solid #dbe9ec;background:linear-gradient(180deg,#f6fcfc,#eaf6f7)}
body.light .cdr-sub{color:#0b2a33}body.light .cdr-sub span{font:800 17px var(--f-head)}body.light .cdr-sub b{color:#0c9f80;font-size:26px}
body.light .cdr-f .btn{border-radius:14px;padding:14px 16px;font-size:15px}
body.light .cdr-f .btn.ghost{background:#effbf9;color:#0b8f95;box-shadow:inset 0 0 0 2px #19d3b8}
body.light .cdr-f .btn.pay{background:linear-gradient(180deg,#ff9a1f,#ff6a00);color:#fff;box-shadow:0 6px 16px rgba(255,120,0,.35);clip-path:none}
.cdr-item .art.gen span{font-size:24px}.cdr-item .art .ico{display:none}
/* Carrito lateral: fondo menta */
body.light .cdr-panel{background:linear-gradient(200deg,#cceee8 0%,#d3eeea 50%,#dbefed 100%)}
body.light .cdr-h{border-bottom-color:#b7dcd6}
body.light .cdr-item{border-bottom-color:#b7dcd6}
body.light .cdr-f{background:linear-gradient(180deg,rgba(255,255,255,.35),rgba(255,255,255,.15));border-top-color:#b7dcd6}
/* Sin cortes en las esquinas: todo el sitio con esquinas redondeadas */
*,*::before,*::after{clip-path:none!important}
.dock nav a{border-radius:12px}
.search{border-radius:14px}
.btn,.btn.buy-now{border-radius:12px}
.panel,.spec,.buybox,.ficha .panel{border-radius:16px}
.spec-h{border-radius:16px 16px 0 0}
.stat,.ficha .fstat{border-radius:14px}
.mission li,.how-grid li,.steps li{border-radius:12px}
.flash{border-radius:10px}
#toast{border-radius:10px}
.card{border-radius:18px;overflow:hidden}
.tabs a{border-radius:10px}
.stepper{border-radius:12px;overflow:hidden}
.tbl,.table-wrap{border-radius:12px}
body.light .grid .card{border-radius:22px}
body.light .cdr-f .btn,body.light .cdr-f .btn.pay{border-radius:14px}
.pdp-art .spec{margin-top:14px}
/* Notas (admin) */
.nt-bar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin:6px 0 16px}
.nt-tags{display:flex;flex-wrap:wrap;gap:8px}
.nt-tags a{display:inline-flex;gap:8px;align-items:center;padding:7px 14px;border-radius:999px;border:1px solid var(--line2);color:var(--muted);font:600 14px var(--f-head)}
.nt-tags a b{background:rgba(25,230,181,.14);color:var(--teal);border-radius:99px;padding:0 8px;font-size:12px;line-height:20px}
.nt-tags a.on,.nt-tags a:hover{background:var(--teal);color:#02110d;border-color:var(--teal);text-decoration:none}.nt-tags a.on b{background:rgba(2,17,13,.18);color:#02110d}
.nt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;align-items:start}
.nt-card{display:flex;flex-direction:column;gap:10px;padding:16px 18px;border-radius:14px;background:linear-gradient(180deg,rgba(9,28,34,.95),rgba(5,16,20,.97));box-shadow:inset 0 0 0 1px #1f9c8c,inset 0 0 26px rgba(25,230,181,.10);min-width:0}
.nt-card.pin{box-shadow:inset 0 0 0 1px #f5c542,inset 0 0 26px rgba(245,197,66,.10)}
.nt-card header{display:flex;align-items:center;justify-content:space-between}
.nt-card h3{margin:0;font-size:18px;color:#fff;overflow-wrap:break-word}
.nt-body{margin:0;padding:10px 12px;border-radius:10px;background:#030b0e;box-shadow:inset 0 0 0 1px #1f8f80;color:#d3ece7;font:500 14px/1.5 var(--f-mono);white-space:pre-wrap;overflow-wrap:anywhere;max-height:260px;overflow:auto}
.nt-card footer{display:flex;align-items:center;justify-content:space-between;gap:8px}
.nt-tag{padding:3px 10px;border-radius:99px;font:700 11.5px var(--f-head);letter-spacing:1px;text-transform:uppercase;background:rgba(25,230,181,.14);color:var(--teal)}
.nt-tag.t-pendiente{background:rgba(245,197,66,.16);color:#f5c542}.nt-tag.t-clave{background:rgba(255,107,107,.16);color:#ff8a8a}.nt-tag.t-otro{background:rgba(255,255,255,.1);color:#cfe3df}
.nt-card .iconbtn.on{color:#f5c542}
.nt-edit summary{cursor:pointer;color:var(--teal);font:600 13px var(--f-head)}.nt-edit form{margin-top:10px}

/* selects legibles (lista nativa desplegable) */
body.admin select, .ficha select, .fi select{color-scheme:dark}
body.admin select option, body.admin select optgroup, .ficha select option, .fi select option{background:#061b20;color:#e6f7f3}
body.admin select option:checked{background:#0d7a68;color:#fff}

/* editar stock */
.stk-edit{margin-top:10px}
.stk-edit summary{display:inline-block;cursor:pointer;list-style:none}
.stk-edit summary::-webkit-details-marker{display:none}
.stk-edit form{margin-top:10px}
.stk-edit textarea{width:100%;font-family:inherit}

/* precio anterior tachado */
body.light .grid .card .pbox .pl{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
body.light .grid .card .pbox .pl s{color:#8a9ba4;font-size:15px;font-weight:600}
.price.big .oldp{color:#8a9ba4;font-size:18px;font-weight:600;margin-right:10px;align-self:center}

/* checkout: método de pago (tema claro) */
.pm-head{display:flex;gap:14px;align-items:center;margin-bottom:16px}
.pm-head i{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:linear-gradient(135deg,#19d3b0,#0c9f80);color:#fff;flex:none}
.pm-head h2{margin:0;font:700 24px var(--f-head);color:#0e3a3f}.pm-head p{margin:2px 0 0;color:#5d7280;font-size:14px}
.pm-methods{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))!important}
.pm-card{flex-direction:row!important;align-items:center;gap:14px!important;padding:16px!important;border-radius:16px!important}
.pm-ico{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:#e1f4f0;color:#0c9f80;flex:none}
.pm-txt{display:grid;gap:3px;padding-right:18px}.pm-txt small{line-height:1.35;font-size:13px}
.pm-steps{margin-top:6px;padding:16px;border-radius:16px;background:#f3fafb;border:1px solid #cdeaee}
.pm-steps h3{margin:0 0 12px;display:flex;align-items:center;gap:10px;font:700 18px var(--f-head);color:#0e3a3f}
.pm-steps h3 b{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#0c9f80;color:#fff;font-size:14px}
.pm-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.pm-grid>div{display:flex;gap:12px;align-items:flex-start}
.pm-grid i{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#e1f4f0;color:#0c9f80;flex:none}
.pm-grid strong{display:block;color:#0e3a3f;font-size:15px}.pm-grid em{font-style:normal;color:#0c9f80}
.pm-grid small{display:block;margin-top:3px;color:#5d7280;font-size:13px;line-height:1.4}
.pm-note{margin-top:12px;padding:12px 16px;border-radius:14px;background:#e8f3fb;border:1px solid #c5def0;color:#2d5870;font-size:14px}
.sum-item .sum-pr{margin-left:auto;font:700 17px var(--f-head);color:#0e3a3f}
.sum-note{display:flex;gap:10px;align-items:center;padding:12px;margin:8px 0 12px;border-radius:14px;background:#e8f3fb;border:1px solid #c5def0;color:#2d5870;font-size:13px;line-height:1.4}
.sum-note i{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#cfe6f5;color:#1d6a9c;flex:none}
@media(max-width:700px){.pm-grid{grid-template-columns:1fr}.pm-head h2{font-size:20px}}

.pay-chips{display:flex;flex-wrap:wrap;gap:10px;margin:4px 0 16px;padding:14px;border-radius:22px;background:linear-gradient(180deg,rgba(25,230,200,.10),rgba(25,230,200,.04));box-shadow:0 10px 30px rgba(20,120,120,.08)}
.pay-chip{display:inline-flex;align-items:center;gap:9px;padding:7px 16px;border-radius:99px;background:#fff;color:#14323a;font:600 15px var(--f-head);border:1px solid #e3eef0;box-shadow:0 3px 10px rgba(20,60,70,.07);white-space:nowrap}
.pay-chip img{height:26px;width:auto;max-width:72px;object-fit:contain;display:block}


.pay-marquee{overflow:hidden;margin:14px 0 0;padding:12px 0;border-radius:22px;background:linear-gradient(180deg,rgba(25,230,200,.10),rgba(25,230,200,.04));box-shadow:0 10px 30px rgba(20,120,120,.08);-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.pay-track{display:flex;width:max-content;animation:paymq 32s linear infinite}.pay-marquee:hover .pay-track{animation-play-state:paused}
.pay-set{display:flex;gap:10px;padding-right:10px}
@keyframes paymq{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.pay-track{animation:none}.pay-marquee{overflow-x:auto;-webkit-mask-image:none;mask-image:none}}

/* Cuentas vendidas: servicios a la izquierda, cuentas del servicio elegido a la derecha */
.svc-split{display:grid;grid-template-columns:minmax(220px,300px) minmax(0,1fr);gap:18px;align-items:start;margin-bottom:16px}
.svc-nav{display:grid;gap:8px;position:sticky;top:76px;max-height:calc(100vh - 96px);overflow:auto}
.svc-tab{all:unset;box-sizing:border-box;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:11px 14px;border-radius:10px;background:rgba(25,230,200,.06);box-shadow:inset 0 0 0 1px #1f6a60;font:700 16px var(--f-head);color:var(--text)}
.svc-tab:hover{background:rgba(25,230,200,.13)}
.svc-tab:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
.svc-tab.on{background:rgba(25,230,200,.18);box-shadow:inset 0 0 0 2px var(--teal);color:var(--teal)}
.svc-tab .svc-name{display:flex;align-items:center;gap:8px;min-width:0;overflow-wrap:break-word}
.svc-tab small{display:flex;align-items:center;gap:6px;font:600 13px var(--f-head);color:var(--muted);flex:none}
.svc-tab small .led{width:10px;height:10px;display:inline-block}
.svc-tab small b{color:var(--text);background:rgba(255,255,255,.08);padding:1px 9px;border-radius:10px}
.svc-pane[hidden]{display:none}
.svc-title{display:flex;align-items:center;gap:8px;margin:0 0 12px;font:700 20px var(--f-head);color:var(--teal)}
.svc-title small{font:600 13px var(--f-head);color:var(--muted);margin-left:4px}
@media (max-width:820px){
  .svc-split{grid-template-columns:1fr;gap:12px}
  .svc-nav{position:static;max-height:none;overflow:visible;grid-template-columns:repeat(auto-fill,minmax(172px,1fr))}
}

/* Mi cuenta (celular): botones apilados */
.acc-links{display:grid;gap:10px;margin-top:14px}
.acc-links .btn.ghost.danger{color:#ff6577;border-color:rgba(255,101,119,.5)}
.panel.acc-pass{margin-top:14px}