@font-face{font-family:"Montserrat";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/montserrat-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/montserrat-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/montserrat-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:700;font-display:swap;src:url("fonts/montserrat-latin-700-normal.woff2") format("woff2")}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:800;font-display:swap;src:url("fonts/montserrat-latin-800-normal.woff2") format("woff2")}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:900;font-display:swap;src:url("fonts/montserrat-latin-900-normal.woff2") format("woff2")}
@font-face{font-family:"Montserrat";font-style:italic;font-weight:800;font-display:swap;src:url("fonts/montserrat-latin-800-italic.woff2") format("woff2")}
@font-face{font-family:"Montserrat";font-style:italic;font-weight:900;font-display:swap;src:url("fonts/montserrat-latin-900-italic.woff2") format("woff2")}

/* Layout: la paleta de interlagos2026.sports.siviajo.com (negro carbón, amarillo Sí Viajo, rojo F1). App de teléfono centrada para el pasajero + panel ancho para Sí Viajo. */
:root{
  color-scheme: dark;
  --asfalto:#0A0A0B; --bg2:#111113; --carril:#151517; --pianito:#1D1D20; --linea:#242428; --linea2:#3A3A40;
  --tiza:#F4F1EA; --gris:#B3AEA5; --apagado:#8E8A82;
  --amarillo:#F5C243; --amarillo2:#FFD873; --kerb:#E10600; --verde:#9BE33B; --azul:#3A78E0;
  --font:"Montserrat",system-ui,"Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{background:var(--asfalto);color:var(--tiza)}
body{font-family:var(--font);font-size:15px;line-height:1.45;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:20px 40px;font-variant-numeric:tabular-nums}
button{font:inherit;color:inherit;cursor:pointer}
button:disabled{cursor:not-allowed}
:focus-visible{outline:2px solid var(--amarillo);outline-offset:2px}
h1,h2,h3{font-weight:900;letter-spacing:-.01em;margin:0;text-wrap:balance;line-height:1.05}
em{font-style:italic;color:var(--amarillo)}
p{margin:0}
.num{font-weight:800;font-variant-numeric:tabular-nums}
.label{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gris);font-weight:700}
.muted{color:var(--gris);font-size:13px}

.topbar{max-width:1080px;margin:0 auto 18px;display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between}
.brand{display:flex;align-items:center;gap:10px}
.checker{width:28px;height:28px;background:conic-gradient(var(--tiza) 25%,var(--asfalto) 0 50%,var(--tiza) 0 75%,var(--asfalto) 0) 0 0/14px 14px;border:2px solid var(--tiza)}
.brand b{font-size:22px;font-weight:900;font-style:italic;text-transform:uppercase}
.brand span{color:var(--gris);font-size:12px}
.switch{display:flex;background:var(--carril);border:1px solid var(--linea);padding:3px;gap:3px;border-radius:999px}
.switch button{background:none;border:0;padding:8px 14px;font-weight:700;font-size:13px;color:var(--gris);border-radius:999px}
.switch button[aria-pressed="true"]{background:var(--amarillo);color:var(--asfalto)}

/* APP */
.phone{max-width:420px;margin:0 auto;background:var(--bg2);border:1px solid var(--linea);border-radius:28px;overflow:hidden;position:relative}
.kerbline{height:6px;background:repeating-linear-gradient(90deg,var(--kerb) 0 22px,var(--tiza) 22px 44px)}
.hud{padding:16px 18px 14px;display:grid;grid-template-columns:1fr auto;gap:8px 12px;align-items:end;background:linear-gradient(180deg,var(--pianito),var(--bg2))}
.hud h1{font-size:26px;font-style:italic}
.hud .pts{text-align:right}
.hud .pts b{font-size:26px;font-weight:900;color:var(--amarillo)}
.lvl{grid-column:1/-1;display:flex;gap:8px;align-items:center;font-size:12px;color:var(--gris)}
.bar{flex:1;height:6px;background:var(--asfalto);position:relative;overflow:hidden;border-radius:3px}
.bar i{position:absolute;inset:0 auto 0 0;background:var(--amarillo);transition:width .4s}
.chips{display:flex;gap:6px;flex-wrap:wrap;grid-column:1/-1}
.chip{font-size:11px;padding:3px 9px;border:1px solid var(--linea2);font-weight:700;border-radius:999px}
.chip.y{border-color:var(--amarillo);color:var(--amarillo)}.chip.g{border-color:var(--verde);color:var(--verde)}

.days{display:grid;grid-template-columns:repeat(5,1fr);gap:4px}
.dd{background:var(--carril);border:1px solid var(--linea);padding:6px 2px;text-align:center;font-size:10.5px;color:var(--apagado);line-height:1.2;border-radius:8px}
.dd b{display:block;font-size:18px;font-weight:900}
.dd.now{border-color:var(--amarillo);color:var(--amarillo)}
.dd.past{color:var(--gris)}

.screen{padding:16px 18px 96px;min-height:600px;display:grid;gap:14px;align-content:start}
.nav{position:absolute;inset:auto 0 0 0;display:grid;grid-template-columns:repeat(6,1fr);background:var(--asfalto);border-top:1px solid var(--linea)}
.nav button{background:none;border:0;padding:10px 1px 12px;font-size:10.5px;font-weight:700;color:var(--apagado);display:grid;justify-items:center;gap:3px}
.nav svg{width:20px;height:20px}
.nav button[aria-current="page"]{color:var(--amarillo);box-shadow:inset 0 3px 0 var(--amarillo)}

.toast{position:absolute;left:12px;right:12px;top:12px;background:var(--tiza);color:var(--asfalto);padding:12px 14px;border-radius:14px;display:grid;grid-template-columns:auto 1fr;gap:2px 10px;box-shadow:0 10px 30px #000a;transform:translateY(-150%);transition:transform .35s cubic-bezier(.2,.9,.3,1.2);z-index:5}
.toast.show{transform:none}
.toast .ico{grid-row:span 2;width:34px;height:34px;background:var(--amarillo);color:var(--asfalto);display:grid;place-items:center;font-weight:900;border-radius:8px;font-size:13px}
.toast b,.toast span{font-size:13px}

.dhead{display:grid;gap:8px}
.dhead h2{font-size:30px;font-style:italic}
.prog{display:grid;grid-template-columns:repeat(5,1fr);gap:4px}
.prog i{height:6px;background:var(--linea);border-radius:3px}
.prog i.done{background:var(--amarillo)}.prog i.now{background:var(--tiza)}
.howto{display:flex;justify-content:space-between;gap:8px;font-size:12px;color:var(--gris);flex-wrap:wrap}

.card{background:var(--carril);border:1px solid var(--linea);border-radius:16px;padding:18px;display:grid;gap:14px}
.card .kicker{display:flex;justify-content:space-between;gap:8px;align-items:center}
.card h2{font-size:26px}
.ptag{font-size:12px;font-weight:800;color:var(--asfalto);background:var(--amarillo);padding:3px 9px;border-radius:999px;white-space:nowrap}
.opts{display:grid;gap:8px}
.opt{text-align:left;background:var(--bg2);border:1px solid var(--linea2);padding:12px 14px;font-weight:600;display:flex;justify-content:space-between;gap:10px;border-radius:10px}
.opt[aria-pressed="true"]{border-color:var(--amarillo);background:color-mix(in srgb,var(--amarillo) 14%,var(--bg2))}
.opt.ok{border-color:var(--verde);background:color-mix(in srgb,var(--verde) 12%,var(--bg2))}.opt.bad{border-color:var(--kerb);background:color-mix(in srgb,var(--kerb) 14%,var(--bg2))}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.cta{background:var(--amarillo);border:0;color:var(--asfalto);padding:14px;font-weight:900;font-size:16px;text-transform:uppercase;letter-spacing:.04em;border-radius:12px}
.cta:hover{background:var(--amarillo2)}
.cta:disabled{opacity:.35}
.ghost{background:none;border:1px solid var(--linea2);padding:10px 12px;font-weight:700;border-radius:10px}
.link{background:none;border:0;color:var(--gris);text-decoration:underline;font-size:13px;padding:6px;justify-self:center}
input[type=range]{width:100%;accent-color:var(--amarillo)}
textarea,select,input[type=text],input[type=email],input[type=tel],input[type=password]{width:100%;background:var(--bg2);border:1px solid var(--linea2);color:var(--tiza);padding:11px 12px;font:inherit;border-radius:10px}
.field{display:grid;gap:6px}
.big{font-size:28px;font-weight:900;color:var(--amarillo)}
.donebox{border:1px dashed var(--verde);padding:12px;color:var(--verde);font-weight:700;font-size:14px;border-radius:10px}
.warn{border:1px solid var(--kerb);background:color-mix(in srgb,var(--kerb) 12%,var(--carril));padding:12px;border-radius:10px;font-size:13px;display:grid;gap:10px}
.explain{border-left:3px solid var(--amarillo);padding:8px 12px;font-size:13px;color:var(--gris)}

.flagrow{display:grid;grid-template-columns:58px 1fr;gap:10px;align-items:center}
.flag{width:58px;height:38px;border:1px solid #555;border-radius:4px}
.tok{display:grid;grid-template-columns:1fr 64px;gap:4px 10px;align-items:center}
.tok span:nth-child(2){text-align:right;color:var(--amarillo);font-weight:800}
.tok input{grid-column:1/-1}
.tyres{display:flex;gap:10px;flex-wrap:wrap;font-size:12px;color:var(--gris)}
.tyre{display:inline-flex;align-items:center;gap:6px}
.tyre i{width:16px;height:16px;border-radius:50%;border:4px solid;background:#111}
.timer{height:6px;background:var(--bg2);border-radius:3px;overflow:hidden}.timer i{display:block;height:100%;background:var(--amarillo);transition:width .1s linear}

.lights{display:flex;gap:8px;justify-content:center;padding:14px;background:#050505;border:1px solid var(--linea);border-radius:12px}
.lights i{width:40px;height:40px;border-radius:50%;background:#2a0b0b;border:3px solid #111}
.lights i.on{background:var(--kerb);box-shadow:0 0 18px var(--kerb)}
.pad{height:130px;display:grid;place-items:center;background:var(--bg2);border:1px solid var(--linea2);font-weight:900;font-size:22px;text-transform:uppercase;user-select:none;touch-action:manipulation;text-align:center;padding:10px;border-radius:12px}
.pad.go{background:color-mix(in srgb,var(--verde) 22%,var(--asfalto));border-color:var(--verde)}

.map{background:var(--bg2);border:1px solid var(--linea);border-radius:12px;padding:8px}
.map svg{width:100%;height:auto;display:block}
.pieces{display:flex;flex-wrap:wrap;gap:6px}
.piece{background:var(--bg2);border:1px solid var(--linea2);padding:8px 10px;border-radius:999px;font-weight:700;font-size:13px}
.piece.bad{border-color:var(--kerb);animation:shake .3s}
@keyframes shake{25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
.placed{display:grid;grid-template-columns:repeat(2,1fr);gap:4px 10px;font-size:12px;color:var(--gris)}
.placed b{color:var(--amarillo);margin-right:4px}

.upl{display:grid;gap:8px}
.upl label.drop{border:1px dashed var(--gris);padding:20px;text-align:center;font-weight:700;cursor:pointer;display:block;border-radius:12px}
.upl input[type=file]{position:absolute;width:1px;height:1px;opacity:0}
.preview{width:100%;aspect-ratio:4/3;max-width:100%;object-fit:cover;border:1px solid var(--linea);display:block;border-radius:12px}

.sum{background:linear-gradient(160deg,var(--pianito),var(--carril));border:1px solid var(--amarillo);border-radius:16px;padding:18px;display:grid;gap:14px}
.sum h2{font-size:28px;font-style:italic}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.stats div{background:var(--asfalto);border:1px solid var(--linea);border-radius:10px;padding:10px;display:grid;gap:2px}
.stats b{font-size:22px;font-weight:900}
.stats span{font-size:11px;color:var(--gris)}
.next7{display:flex;gap:10px;align-items:center;background:var(--asfalto);border-radius:10px;padding:10px 12px;font-size:13px}
.next7 b{color:var(--amarillo);font-size:18px;font-weight:900}

.prize{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;align-items:center;padding:14px;border:1px solid var(--linea);background:var(--carril);border-radius:14px}
.prize .pos{grid-row:span 2;font-weight:900;font-style:italic;font-size:30px;line-height:1;color:var(--amarillo);min-width:44px;text-align:center}
.prize b{font-size:14px}.prize span{font-size:13px;color:var(--gris)}
.prize.alt .pos{color:var(--tiza)}

.passport{background:linear-gradient(160deg,#22201a,#141311);border:1px solid #4a4230;padding:16px;display:grid;grid-template-columns:110px 1fr;gap:12px 14px;border-radius:14px}
.passport .ph{width:110px;aspect-ratio:3/4;max-width:100%;background:var(--asfalto);border:1px solid #4a4230;display:grid;place-items:center;text-align:center;font-size:11px;color:var(--gris);overflow:hidden;border-radius:6px}
.passport .ph img{width:100%;height:100%;object-fit:cover}
.passport .lines{display:grid;gap:4px;font-size:12px;align-content:start;min-width:0}
.passport .lines b{font-size:13px;color:var(--tiza);overflow-wrap:anywhere}
.passport .mrz{grid-column:1/-1;font-family:ui-monospace,Menlo,monospace;font-size:11px;color:#a89c7c;letter-spacing:.08em;overflow-wrap:anywhere;border-top:1px dashed #4a4230;padding-top:8px}
.stamps{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.stamp{aspect-ratio:1;max-width:100%;border:1px dashed var(--linea2);display:grid;place-items:center;text-align:center;padding:6px;font-size:11px;color:var(--apagado);background:none;border-radius:10px}
.stamp b{display:block;font-size:13px;font-weight:900;text-transform:uppercase;line-height:1.1}
.stamp[aria-pressed="true"]{border:2px solid var(--amarillo);color:var(--tiza);transform:rotate(-3deg);background:color-mix(in srgb,var(--amarillo) 10%,transparent)}
.stamp[aria-pressed="true"]:nth-child(even){transform:rotate(2deg)}
.stamp.fixed{border:2px solid var(--verde);color:var(--tiza)}

.subtabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;background:var(--carril);border:1px solid var(--linea);padding:3px;border-radius:999px}
.subtabs button{background:none;border:0;padding:9px 6px;font-weight:700;font-size:13px;color:var(--gris);border-radius:999px}
.subtabs button[aria-pressed="true"]{background:var(--amarillo);color:var(--asfalto)}
.rule{border:1px solid var(--amarillo);background:color-mix(in srgb,var(--amarillo) 8%,var(--carril));padding:12px;font-size:13px;display:grid;gap:4px;border-radius:12px}
.rule b{font-size:14px}
.wall{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.post{background:var(--carril);border:1px solid var(--linea);display:grid;min-width:0;border-radius:12px;overflow:hidden}
.post .img{aspect-ratio:1;max-width:100%;display:grid;place-items:end start;padding:8px;font-weight:900;font-style:italic;font-size:16px;line-height:1.05;overflow:hidden}
.post .img img{width:100%;height:100%;object-fit:cover}
.post.mine{border-color:var(--amarillo)}
.post .meta{padding:8px;display:grid;gap:6px;font-size:12px}
.post .meta span{color:var(--gris);overflow-wrap:anywhere}
.like{display:flex;justify-content:space-between;align-items:center;background:var(--bg2);border:1px solid var(--linea2);padding:6px 8px;font-weight:700;border-radius:8px}
.like[aria-pressed="true"]{border-color:var(--kerb);color:var(--kerb)}

.wl{display:grid;gap:6px}
.wli{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;background:var(--carril);border:1px solid var(--linea);padding:9px 10px;border-radius:10px}
.wli b{display:block;font-size:14px}.wli small{color:var(--gris);font-size:12px}
.wli button,.expc button{background:var(--bg2);border:1px solid var(--linea2);padding:7px 10px;font-size:12px;font-weight:700;white-space:nowrap;border-radius:999px}
.wli button[aria-pressed="true"],.expc button[aria-pressed="true"]{border-color:var(--verde);color:var(--verde)}
.exp{display:grid;gap:8px}
.expc{background:linear-gradient(135deg,var(--pianito),var(--carril));border:1px solid var(--linea);padding:14px;display:grid;grid-template-columns:1fr auto;gap:4px 10px;align-items:center;border-radius:14px}
.expc h3{font-size:19px;font-style:italic}.expc p{font-size:13px;color:var(--gris);grid-column:1}
.expc button{grid-row:1/span 2;grid-column:2}
.allgp{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.gpchips{display:flex;flex-wrap:wrap;gap:6px}
.gpchips button{background:var(--bg2);border:1px solid var(--linea2);padding:7px 11px;border-radius:999px;font-size:13px;font-weight:600}
.gpchips button[aria-pressed="true"]{border-color:var(--amarillo);color:var(--asfalto);background:var(--amarillo)}
.thanks{font-size:16px;line-height:1.55;display:grid;gap:10px}
.thanks p:first-child{font-size:22px;font-weight:900;font-style:italic;line-height:1.15;color:var(--amarillo)}

.rows{display:grid}
.row{display:grid;grid-template-columns:38px 1fr auto;gap:10px;align-items:center;padding:10px 4px;border-bottom:1px solid var(--linea)}
.row .p{color:var(--gris);font-weight:800}
.row.me{background:color-mix(in srgb,var(--amarillo) 12%,transparent);box-shadow:inset 3px 0 0 var(--amarillo);padding-left:8px}
.row small{color:var(--gris);display:block;font-size:12px}
.row.gap{color:var(--apagado);text-align:center;display:block;border:0;padding:4px}
.tabs{display:flex;gap:6px;flex-wrap:wrap}
.tabs button{background:var(--carril);border:1px solid var(--linea);padding:6px 10px;font-size:12px;font-weight:700;color:var(--gris);border-radius:999px}
.tabs button[aria-pressed="true"]{color:var(--asfalto);background:var(--amarillo);border-color:var(--amarillo)}

/* PANEL */
.panel{max-width:1080px;margin:0 auto;display:grid;gap:18px}
.note{font-size:13px;color:var(--amarillo);border:1px solid color-mix(in srgb,var(--amarillo) 40%,transparent);padding:8px 12px;border-radius:10px}
.segs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
@media (max-width:760px){.segs{grid-template-columns:repeat(2,minmax(0,1fr))}}
.seg{background:var(--carril);border:1px solid var(--linea);padding:14px;display:grid;gap:4px;border-top:4px solid var(--c);align-content:start;border-radius:12px}
.seg b{font-size:30px;font-weight:900}
.seg p{font-size:13px;color:var(--gris)}
.cols{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:18px}
@media (max-width:860px){.cols{grid-template-columns:minmax(0,1fr)}}
.box{background:var(--carril);border:1px solid var(--linea);padding:16px;display:grid;gap:12px;min-width:0;align-content:start;border-radius:14px}
.box h2{font-size:20px;font-style:italic}
.scatter{width:100%;height:auto;display:block}
.tablewrap{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:13px;min-width:680px}
th{text-align:left;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--gris);padding:8px 6px;border-bottom:1px solid var(--linea);font-weight:700}
td{padding:8px 6px;border-bottom:1px solid var(--linea);vertical-align:top}
td.n{text-align:right;font-weight:700}
.tag{font-size:11px;font-weight:700;padding:2px 7px;border:1px solid currentColor;white-space:nowrap;border-radius:999px}
.formula{display:grid;gap:6px;font-size:13px}
.formula div{display:grid;grid-template-columns:1fr auto;gap:8px;border-bottom:1px dotted var(--linea2);padding-bottom:5px}
.formula span:last-child{color:var(--amarillo);font-weight:700}
.sched{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
@media (max-width:900px){.sched{grid-template-columns:minmax(0,1fr)}}
.sched .col{background:var(--asfalto);border:1px solid var(--linea);padding:10px;display:grid;gap:8px;align-content:start;min-width:0;border-radius:10px}
.sched .col h3{font-size:16px}
.sched .pu{display:grid;grid-template-columns:44px 1fr;gap:6px;font-size:12.5px}
.sched .pu b{color:var(--amarillo);font-size:12px}
.extras{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px}
.extras div{background:var(--asfalto);border:1px solid var(--linea);padding:12px;font-size:13px;color:var(--gris);border-radius:10px}
.extras b{display:block;color:var(--tiza);font-size:14px;margin-bottom:3px}
.hbars{display:grid;gap:6px}
.hb{display:grid;grid-template-columns:110px 1fr 44px;gap:8px;align-items:center;font-size:13px}
.hb .tr{height:12px;background:var(--asfalto);border-radius:3px;overflow:hidden}.hb .tr i{display:block;height:100%;background:var(--amarillo)}
.hb span:last-child{text-align:right;color:var(--gris);font-weight:700}
.devbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;max-width:420px;margin:14px auto 0;font-size:12px;color:var(--gris);justify-content:center}
.rolehead{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:end}
.rolehead h2{font-size:28px;font-style:italic}
.atabs{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px}
.atabs button{flex:0 0 auto;background:var(--carril);border:1px solid var(--linea);padding:8px 13px;font-size:13px;font-weight:700;color:var(--gris);border-radius:999px}
.atabs button[aria-selected="true"]{background:var(--amarillo);color:var(--asfalto);border-color:var(--amarillo)}
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
@media (max-width:700px){.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
.kpis div{background:var(--carril);border:1px solid var(--linea);border-radius:12px;padding:14px;display:grid;gap:2px}
.kpis b{font-size:28px;font-weight:900;color:var(--amarillo)}.kpis span{font-size:12px;color:var(--gris)}
.modgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}
.post.off{opacity:.45}
.rgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px}
.perm{min-width:560px}.perm td.c{text-align:center}.perm th:not(:first-child){text-align:center}
.stafftoast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(20px + env(safe-area-inset-bottom,0px));background:var(--tiza);color:var(--asfalto);padding:12px 16px;border-radius:12px;font-size:14px;z-index:20;max-width:min(520px,calc(100% - 32px));box-shadow:0 10px 30px #000a}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ---------- Producción ---------- */
html,body{min-height:100%}
:root{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
body{margin:0}
img{max-width:100%}
@media (max-width:460px){
  body{padding-left:0;padding-right:0;padding-block:0}
  .phone{border-radius:0;border-left:0;border-right:0;min-height:100vh}
  .nav{position:fixed;padding-bottom:env(safe-area-inset-bottom,0px)}
  .toast{position:fixed}
}
.authwrap{max-width:420px;margin:0 auto;display:grid;gap:16px;padding-block:24px}
.authwrap .brand{justify-content:center}
.check{display:flex;gap:10px;font-size:13px;align-items:flex-start}
.check input{margin-top:3px;accent-color:var(--amarillo)}
.err{color:var(--kerb);font-size:13px;font-weight:600;min-height:1em}
.hudbtns{display:flex;gap:8px;align-items:center}
.iconbtn{background:var(--carril);border:1px solid var(--linea2);width:36px;height:36px;border-radius:50%;display:grid;place-items:center;position:relative}
.iconbtn svg{width:18px;height:18px}
.iconbtn .dot{position:absolute;top:-3px;right:-3px;background:var(--kerb);color:#fff;font-size:10px;font-weight:800;border-radius:999px;padding:1px 5px}
.sheet{display:grid;gap:12px}
.notif{background:var(--carril);border:1px solid var(--linea);border-radius:12px;padding:12px;display:grid;gap:4px}
.notif.unread{border-color:var(--amarillo)}
.notif small{color:var(--apagado);font-size:11px}
.loading{color:var(--gris);text-align:center;padding:40px 0}
.linkbox{display:grid;gap:8px;background:var(--asfalto);border:1px dashed var(--amarillo);border-radius:10px;padding:12px;font-size:13px;word-break:break-all}
.staffwrap{max-width:1180px;margin:0 auto;display:grid;gap:16px}
.stafftop{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.pill{font-size:11px;font-weight:800;padding:3px 9px;border-radius:999px;border:1px solid currentColor;white-space:nowrap}
.inline{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.small{padding:6px 10px!important;font-size:12px!important}