:root{
  --accent:#8f1e1a; --accent2:#5d0d0a; --accent3:#c74338; --line:#d17670;
  --gold:#d49d2a; --silver:#9ba1ad; --panel:#140808; --panel2:#2a0c0c; --bg:#040404;
  --text:#f4f5f8; --muted:#bec2cc; --chip:#0c0d12; --chip2:#141822; --cell1:#7a1a18; --cell2:#631110;
  --history:#6e1513; --stake1:#434750; --stake2:#141820; --scene:none; --n:6;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:#000;color:var(--text);font-family:'Arial Narrow','Roboto Condensed',Inter,Arial,sans-serif}
body[data-game="p8"]{--accent:#0c611b;--accent2:#083e10;--accent3:#36b34a;--line:#49ba5a;--panel:#041106;--panel2:#0d2e13;--cell1:#1d6c25;--cell2:#15531c;--history:#1b6223}
body[data-game="h7"]{--accent:#0c2f9b;--accent2:#071a59;--accent3:#4a74f0;--line:#6487ef;--panel:#061033;--panel2:#0c1a4d;--cell1:#123082;--cell2:#0d2564;--history:#14296d}
button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation}
button:focus-visible{outline:3px solid #ffd766;outline-offset:2px}
#app{height:100dvh;min-height:740px;display:flex;flex-direction:column;padding:10px;gap:10px;background:radial-gradient(circle at 50% 0%, rgba(255,255,255,.05), transparent 25%), #020202}
.hero{position:relative;min-height:166px;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#0a0a0c}
.hero::before{content:'';position:absolute;inset:0;background-image:linear-gradient(90deg,rgba(0,0,0,.88),rgba(0,0,0,.45),rgba(0,0,0,.12),rgba(0,0,0,.5),rgba(0,0,0,.88)), var(--scene);background-size:cover;background-position:center 44%;filter:saturate(.92)}
.hero::after{content:'';position:absolute;inset:0;box-shadow: inset 0 -40px 40px #0009}
.hero-inner{position:relative;z-index:1;height:100%;display:grid;grid-template-columns:290px minmax(0,1fr) 315px;gap:14px;align-items:center;padding:10px 28px 10px 18px}
.brand{display:flex;flex-direction:column;align-items:center;justify-content:center;width:max-content;max-width:100%}
.brand-logo{display:block;max-width:150px;width:100%;height:auto;filter:drop-shadow(0 2px 8px #000)}
.brand small,.brand strong{display:none}
.brand .agency{display:inline-block;margin-top:10px;padding:8px 12px;border:1px solid var(--line);border-radius:7px;background:linear-gradient(var(--panel2), var(--accent2));font-size:16px;font-weight:900}
.top-tabs{display:flex;justify-content:center;gap:10px;align-items:flex-start}
.game-tab{width:150px;height:100px;padding:6px;border-radius:12px;border:1px solid #6d7380;background:linear-gradient(#20232d,#090b11);box-shadow:0 3px 10px #0007;display:flex;align-items:center;justify-content:center}
.game-tab img{max-width:76%;max-height:76%;object-fit:contain;filter:brightness(0) invert(1)}
.game-tab .lbl{display:none}
.game-tab.on{background:linear-gradient(#cb453b,#8b1b16 58%,#65110d);border-color:#c2746f;color:#fff}
.game-tab.green{background:linear-gradient(#2d9a29,#186914 58%,#0f4f0c)}
.game-tab.blue{background:linear-gradient(#2753cf,#183895 58%,#11296a)}
.game-tab.sky{background:linear-gradient(#33a7ec,#176ba5 58%,#0f4570)}
.game-tab.dark{background:linear-gradient(#3b3b3d,#202022 58%,#121214)}
.game-stack{display:grid;grid-template-rows:50px 42px 42px;gap:5px;margin-right:4px;align-self:center}
@media (max-width: 1500px){.layout{grid-template-columns:170px 1fr 300px}.hero-inner{grid-template-columns:250px 1fr 270px}.game-tab{width:82px;height:52px}.stake{font-size:38px}.combo{font-size:20px}.cell{font-size:clamp(16px,1.3vw,28px)}}
.game-row{display:grid;grid-template-columns:1fr 100px;gap:4px}
.info-box,.timer,.jp{display:flex;align-items:center;justify-content:space-between;padding:0 13px;border-radius:6px;border:1px solid #6d7380;background:linear-gradient(#202638,#060810)}
.info-box{font-size:24px;font-weight:900}.info-box b{font-size:32px}
.timer{justify-content:center;font-size:28px;font-style:italic}
.jp{font-size:16px;background:linear-gradient(#c48c20,#8f5d12);border-color:#f0b84c}
.jp.local{background:linear-gradient(#8d95a3,#505662);border-color:#afb6c1}
.layout{flex:1;min-height:0;display:grid;grid-template-columns:186px 1fr 330px;gap:10px}
.panel{border:1px solid var(--line);border-radius:14px;background:linear-gradient(160deg,var(--panel2), var(--panel));box-shadow:inset 0 1px 0 #fff2,0 10px 26px #0007;min-height:0}
.shortcuts{display:flex;flex-direction:column;padding:12px 10px;gap:12px;background:linear-gradient(180deg,#0f1118,#07090e)}
.shortcuts .title{padding:6px 6px 10px;border-bottom:1px solid #ffffff26;text-align:center}
.shortcuts .title small{display:block;color:#f7d0ca;font-size:12px;font-weight:900;letter-spacing:1.4px}
.shortcuts .title b{font-size:19px}
.shortcut{position:relative;text-align:left;padding:12px 12px 12px 16px;min-height:82px;border-radius:8px;border:1px solid #7d808c;background:linear-gradient(#ce473d,#8e1b16 54%,#65110d);display:flex;flex-direction:column;justify-content:center;gap:6px;box-shadow:inset 0 1px 0 #ffffff44,0 4px 8px #0006}
.shortcut strong{font-size:18px;line-height:1;font-style:italic}.shortcut small{font-size:11px;color:#f4eaea;line-height:1.2}.shortcut .sig{position:absolute;right:11px;top:50%;transform:translateY(-50%);font-size:24px;opacity:.95}
.shortcut.active{background:linear-gradient(#4a7dff,#1948d0 55%,#1236a2);border:2px solid #c9d8ff;box-shadow:0 0 0 1px #fff3 inset, 0 0 16px #0006}
.mode-tip{margin-top:auto;padding:10px;border-radius:9px;background:#0004;border:1px solid #fff2;font-size:12px;line-height:1.45;color:#d8dbe4}
.board{display:flex;flex-direction:column;overflow:hidden;background:linear-gradient(180deg,#050607,#010101)}
.board-head{display:flex;align-items:center;justify-content:space-between;padding:8px 14px 10px;border-bottom:1px solid var(--line);background:linear-gradient(#0a0b0f,#040507)}
.board-head h1{margin:0;font-size:24px;letter-spacing:.2px;font-style:italic}.board-head p{margin:3px 0 0;color:#c8cbd4;font-size:12px}
.auto-pill{padding:10px 14px;border-radius:10px;border:1px solid #5f6674;background:linear-gradient(#1f2432,#0a0d15);font-size:13px;font-weight:900}
.visor-zone{flex:1;min-height:0;padding:12px;display:flex;flex-direction:column}
.card{border:1px solid var(--line);border-radius:16px;background:linear-gradient(180deg,var(--accent),var(--accent2));overflow:hidden;box-shadow:inset 0 1px 0 #fff2}
.card-head{padding:14px 16px;border-bottom:1px solid #ffffff45;font-size:20px;font-weight:1000;text-align:center}
.history-list{display:flex;flex-direction:column;height:100%}
.history-body{flex:1;overflow:auto;padding:0}
.h-row{display:grid;grid-template-columns:62px 1fr 74px;align-items:center;min-height:64px;border-bottom:1px solid #ffffff2e;background:linear-gradient(90deg,rgba(0,0,0,.2),rgba(255,255,255,.04))}
.h-row:nth-child(even){background:linear-gradient(90deg,rgba(0,0,0,.28),rgba(255,255,255,.02))}
.h-no{display:flex;align-items:center;justify-content:center;height:100%;font-size:26px;font-weight:1000;background:#0005;border-right:1px solid #ffffff30}
.h-combos{padding:0 12px;display:flex;flex-direction:column;gap:6px}
.pair{display:flex;align-items:center;gap:8px;font-size:20px;font-weight:1000}
.badge{min-width:34px;height:30px;padding:0 8px;border-radius:4px;display:inline-flex;align-items:center;justify-content:center;background:#fff;color:#111;font-weight:1000}
.badge.striped{background:repeating-linear-gradient(180deg,#fff,#fff 7px,#121212 7px,#121212 14px);color:#f20;border:1px solid #fff8}
.h-odd{padding-right:12px;text-align:right;font-size:24px;font-weight:1000}
.matrix-card{display:flex;flex:1;min-height:0;width:100%;flex-direction:column;background:linear-gradient(180deg,#5d0d0a,#2e0503 15%,#160202 100%);border-radius:18px;overflow:hidden;box-shadow:inset 0 1px 0 #ffffff26,0 10px 25px #0008}
.matrix-top{display:grid;grid-template-columns:78px repeat(var(--n),1fr);gap:0;padding:0 12px 0 0;background:linear-gradient(180deg,#8c1612 0%,#62100d 58%,#4b0b09 100%);border-bottom:1px solid #dc6a3d;min-height:52px;align-items:end}
.mh-blank{height:52px;border-right:1px solid #dc6a3d}
.mh{position:relative;height:52px;display:flex;align-items:flex-start;justify-content:center;padding-top:7px;font-size:25px;font-weight:500;background:transparent;border:0}
.mh::after{content:'';position:absolute;left:16%;right:16%;bottom:0;height:5px;background:var(--lane,#fff)}
.matrix-body{flex:1;min-height:0;padding:0;background:#000}
.matrix-grid{height:100%;display:grid;grid-template-columns:78px repeat(var(--n),minmax(0,1fr));grid-template-rows:repeat(var(--n),minmax(0,1fr));gap:0;border-left:0;border-right:0;border-top:0;background:#000}
.rowh{display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:500;background:linear-gradient(180deg,#2f0503,#170100);border:0;border-right:1px solid #dc6a3d;border-bottom:1px solid #dc6a3d;position:relative}
.rowh::before{content:"";position:absolute;left:0;top:12px;bottom:12px;width:5px;background:var(--lane,#fff)}
.rowh[data-num="6"]::after,.mh[data-num="6"]::before{content:"";position:absolute;background:repeating-linear-gradient(90deg,#fff 0 8px,transparent 8px 12px);height:5px;left:18%;right:18%;bottom:0}
.mh[data-num="6"]::before{bottom:0;top:auto} body[data-game="p8"] .mh[data-num="8"]::before, body[data-game="p8"] .rowh[data-num="8"]::after{content:"";position:absolute;background:repeating-linear-gradient(90deg,#ff3ee6 0 8px,transparent 8px 12px);height:5px;left:18%;right:18%;bottom:0}
.cell{position:relative;border:0;background:linear-gradient(180deg,#8b1814,#6b0d0a 60%,#5a0705 100%);font-size:clamp(18px,1.7vw,31px);font-weight:700;font-variant-numeric:tabular-nums;color:#fff;min-width:0;min-height:0;border-right:1px solid #a94523;border-bottom:1px solid #a94523}
.cell.alt{background:linear-gradient(180deg,#8b1814,#6b0d0a 60%,#5a0705 100%)}
.cell.diag{background:linear-gradient(180deg,#650b07,#500603 100%)}
body[data-game="p8"] .matrix-card{background:linear-gradient(180deg,#12631c,#09350f 18%,#031005 100%)} body[data-game="h7"] .matrix-card{background:linear-gradient(180deg,#1637a1,#0b1e63 18%,#040d2d 100%)} body[data-game="p8"] .matrix-top{background:linear-gradient(180deg,#23812e 0%,#14511d 58%,#0f3915 100%)} body[data-game="h7"] .matrix-top{background:linear-gradient(180deg,#2249c4 0%,#16318a 58%,#102160 100%)} body[data-game="p8"] .rowh{background:linear-gradient(180deg,#0b260d,#061706)} body[data-game="h7"] .rowh{background:linear-gradient(180deg,#09183d,#050d23)} body[data-game="p8"] .cell{background:linear-gradient(180deg,#237c2c,#15511c 60%,#103c15 100%)} body[data-game="h7"] .cell{background:linear-gradient(180deg,#224fc7,#12369e 60%,#0d2a7b 100%)} body[data-game="p8"] .cell.diag{background:linear-gradient(180deg,#14521b,#0d3a12)} body[data-game="h7"] .cell.diag{background:linear-gradient(180deg,#123397,#0a246e)}
.cell.hot{color:#ff1717}.cell.bonus{color:#1cff1a}.cell.marked{box-shadow:inset 0 0 0 4px #ffd35e;z-index:1}
.cell.marked::after{content:attr(data-badge);position:absolute;right:5px;top:5px;background:#ffd766;color:#231a03;padding:3px 6px;border-radius:4px;font-size:11px;font-weight:1000}
.matrix-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:6px 12px 8px;border-top:1px solid #692918;background:#020202}
.lastjp{font-size:14px;font-weight:1000}.lastjp b{color:#ffd566}
.mini-history{display:flex;align-items:center;gap:5px;flex-wrap:wrap}.mini-history span{min-width:34px;padding:4px 5px;border-radius:4px;border:1px solid #ffffff4b;background:rgba(255,255,255,.08);text-align:center;font-weight:1000;font-size:12px}
.stakes{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;padding:0 12px 12px 12px;flex:none}
.stake{min-height:100px;border-radius:10px;border:1px solid #6f7482;background:linear-gradient(#c73f35,#891711 55%,#6a100c 100%);box-shadow:inset 0 1px 0 #ffffff40,0 6px 10px #0005;font-size:46px;font-style:italic;color:#fff}
.stake.on{background:linear-gradient(#ffe46c,#d7a11c 60%,#bd8814);color:#201605;border:2px solid #ffdf7d}

.ticket{display:flex;flex-direction:column;overflow:hidden;background:linear-gradient(180deg,#14161d,#090b10)}
.ticket-head{display:flex;justify-content:space-between;align-items:center;padding:14px;border-bottom:1px solid #ffffff24;background:linear-gradient(#1b2030,#0c0f17)}
.ticket-head h2{margin:0;font-size:26px;font-style:italic}.ticket-head small{display:block;color:#edf1f6;font-size:12px;margin-top:4px}.pill{padding:7px 10px;border-radius:10px;border:1px solid #ffffff55;background:linear-gradient(#242a3d,#0a0d15);font-size:13px;font-weight:1000}
.ticket-list{flex:1;min-height:0;overflow:auto;padding:8px;display:flex;flex-direction:column;gap:6px}
.ticket-empty{margin:auto;text-align:center;color:#a9b0c1;line-height:1.6}.ticket-empty b{display:block;font-size:54px;color:#d0a643;margin-bottom:10px}
.line-item{display:grid;grid-template-columns:1fr auto 40px;align-items:center;gap:8px;padding:10px 10px;border:1px solid #ffffff1d;border-radius:10px;background:#ffffff07}
.combo{font-size:23px;font-weight:1000}.meta{font-size:12px;color:#c8ced8;margin-top:4px}.amt{font-size:22px;font-weight:1000}.remove{width:40px;height:40px;border-radius:8px;border:1px solid #ffffff35;background:#5c1212;font-size:24px}
.ticket-bottom{padding:12px 14px;border-top:1px solid #ffffff28;background:#07090d}
.summary{display:flex;justify-content:space-between;align-items:center;padding:7px 0;font-size:15px}.summary b{font-size:18px}
.summary.big{padding:10px 12px;margin-top:10px;gap:8px;border:1px solid #9b7a1d;border-radius:8px;background:linear-gradient(#ecd44d,#c9a01b);font-size:18px;font-weight:1000;color:#17130a}.summary.big span{flex:none}.summary.big b{font-size:clamp(20px,1.45vw,26px);line-height:1.12;letter-spacing:-.35px;white-space:nowrap;font-variant-numeric:tabular-nums;color:#17130a}
.actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.actions button{min-height:62px;border-radius:10px;border:0;font-size:18px;font-weight:1000}
.actions .clear{background:linear-gradient(#d43b32,#95130f);box-shadow:inset 0 1px 0 #fff4} .actions .print{background:linear-gradient(#f3d94f,#b58d13);color:#221905;box-shadow:inset 0 1px 0 #fff7}
.toast{position:fixed;left:50%;bottom:20px;transform:translateX(-50%) translateY(20px);opacity:0;pointer-events:none;transition:.22s;background:#111827e8;color:#fff;padding:12px 16px;border-radius:999px;border:1px solid #ffffff30;font-weight:900;z-index:20}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.modal-backdrop{position:fixed;inset:0;background:#000a;display:none;place-items:center;z-index:40}.modal-backdrop.show{display:grid}.modal{width:min(520px,92vw);background:#12151f;border:1px solid #ffffff25;border-radius:16px;padding:18px;box-shadow:0 20px 50px #0008}.modal h2{margin:0 0 10px;font-size:28px}.modal p{color:#c8cdd8;line-height:1.5}.amount-display{font-size:40px;font-weight:1000;text-align:center;padding:12px;border-radius:12px;background:#0b0d13;border:1px solid #ffffff18;margin:12px 0}.keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.keypad button{min-height:62px;border:1px solid #ffffff22;border-radius:10px;background:#1b202c;font-size:28px;font-weight:1000}.modal-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:14px}.modal-actions button{min-height:46px;padding:0 16px;border:0;border-radius:10px;font-weight:1000}.modal-actions .secondary{background:#394154}.modal-actions .primary{background:linear-gradient(#ffe57d,#bf8c19);color:#2c2207}
@media (max-width: 1500px){.layout{grid-template-columns:170px 1fr 300px}.hero-inner{grid-template-columns:225px minmax(0,1fr) 300px}.game-tab{width:clamp(66px,5.4vw,82px);height:52px}.stake{font-size:38px}.combo{font-size:20px}.cell{font-size:clamp(16px,1.3vw,28px)}}

/* Accesos administrativos: exclusivamente al pie de ATAJOS */
.shortcut-admin{display:grid;grid-template-columns:1fr 1fr;gap:8px;flex:none}
.shortcut-admin-btn{min-width:0;min-height:58px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  border:1px solid #6a7486;border-radius:9px;color:#f6f6f8;background:linear-gradient(#333a47,#131822);
  box-shadow:inset 0 1px 0 #ffffff36,0 3px 7px #0008;font-size:11px;font-weight:900;letter-spacing:.2px}
.shortcut-admin-btn svg{flex:none}
.shortcut-admin-exit{border-color:#6a7486;background:linear-gradient(#333a47,#131822)}
.shortcut-admin-btn:active{transform:scale(.97)}
@media(max-height:900px){
  .shortcuts{gap:8px;padding:10px 9px}
  .shortcuts .title{padding:3px 4px 7px}
  .shortcut{min-height:66px;padding:7px 9px 7px 12px;gap:4px}
  .shortcut strong{font-size:16px}.shortcut small{font-size:10px}
  .mode-tip{padding:7px;font-size:10px;line-height:1.3}
  .shortcut-admin-btn{min-height:48px;gap:2px;font-size:10px}
  .shortcut-admin-btn svg{height:23px;width:23px}
}

.settings-scrim{position:fixed;inset:0;z-index:500;display:flex;justify-content:center;align-items:center;padding:18px;
 background:rgba(0,0,0,.82);backdrop-filter:blur(5px)}
.settings-scrim[hidden],.settings-view[hidden],.session-lock[hidden]{display:none!important}
.settings-dialog{width:min(480px,100%);border:1px solid #b86661;border-radius:17px;overflow:hidden;color:#f6f6fa;
 background:linear-gradient(160deg,#24212c 0%,#11121b 47%,#0a0a10 100%);box-shadow:0 20px 75px #000b}
.settings-modal-header{display:flex;align-items:center;justify-content:space-between;padding:17px 20px;
 border-bottom:1px solid #ffffff27;background:linear-gradient(#8c1b16,#410d0c)}
.settings-modal-header h2{margin:0;font-size:23px;letter-spacing:.2px}
.settings-x{width:41px;height:41px;border:1px solid #ffffff50;border-radius:8px;font-size:26px;line-height:1;background:#0005}
.settings-view{padding:20px;display:flex;flex-direction:column;gap:13px}
.settings-option{display:flex;align-items:center;gap:13px;text-align:left;padding:17px;border:1px solid #ffffff30;
 border-radius:11px;background:linear-gradient(#2b2e3c,#171923);font-size:18px;font-weight:900;min-height:76px}
.settings-option:hover{border-color:#f8d775;background:linear-gradient(#393b4b,#1c1f2a)}
.settings-option svg{width:34px;height:34px;flex:none;color:#ffcf64}
.settings-option.logout svg{color:#fa7970}
.settings-option small{display:block;margin-top:5px;color:#b9bfca;font-size:12px;font-weight:400}
.printer-field{display:flex;flex-direction:column;gap:7px;font-size:14px;font-weight:800;color:#e9e9ed}
.printer-field input,.printer-field select{width:100%;min-height:47px;padding:10px 12px;border-radius:8px;
 border:1px solid #777f90;background:#090d16;color:white;font:inherit;font-size:17px}
.printer-actions{display:flex;gap:10px;margin-top:6px}.printer-actions button{flex:1;min-height:51px;border:1px solid #ffffff24;
 border-radius:9px;background:linear-gradient(#424551,#20232b);font-size:15px;font-weight:900}
.printer-actions .save{color:#1c1608;background:linear-gradient(#ffe673,#c59319);border-color:#e9c85c}
.settings-note{font-size:12px;line-height:1.5;color:#b7bfcd;margin:2px 0 0}
.settings-warning{font-size:15px;line-height:1.5;margin:0;color:#ecedf3}
.printer-actions .leave{background:linear-gradient(#d0443a,#8d1411);color:white}
.session-lock{position:fixed;inset:0;z-index:800;background:linear-gradient(145deg,#220806,#000);display:grid;place-items:center;padding:20px}
.session-lock-content{max-width:450px;text-align:center;padding:28px;border:1px solid #a24640;border-radius:16px;background:#0d1018}
.session-lock-content h2{margin:0 0 10px;font-size:28px}.session-lock-content p{color:#c4c7ce;line-height:1.5}
.session-lock-content button{padding:13px 23px;border:0;border-radius:9px;background:linear-gradient(#fce06f,#c39218);color:#191407;font-weight:900}



/* Ajustes de identidad visual para PERROS 8: no afectan Perros 6 ni a BORRAR / IMPRIMIR. */
body[data-game="p8"] .shortcut,
body[data-game="p8"] .stake {
  background:linear-gradient(180deg,#32a440 0%,#167326 55%,#094517 100%);
  border-color:#51b760;
  color:#fff;
}
body[data-game="p8"] .shortcut.active {
  background:linear-gradient(180deg,#4cce66 0%,#188c32 54%,#07551c 100%);
  border:2px solid #e7f7e7;
  box-shadow:inset 0 0 0 1px #ffffff38,0 0 13px #2baa4c77;
}
/* La ficha elegida SIEMPRE es amarilla, independientemente del juego. */
body[data-game="p8"] .stake.on,
body[data-game="h7"] .stake.on {
  background:linear-gradient(#ffe46c,#d7a11c 60%,#bd8814);
  color:#201605;
  border:2px solid #ffdf7d;
}
/* Fichas inactivas con la identidad del juego (caballos queda preparada en azul). */
body[data-game="h7"] .stake:not(.on) {
  background:linear-gradient(180deg,#295dd5 0%,#173c9c 55%,#0b2464 100%);
  border-color:#6287e8;
  color:#fff;
}
/* IMPRESORA y SALIR se mantienen siempre negros, sin depender del juego. */
.shortcut-admin-btn,
.shortcut-admin-exit,
body[data-game="p8"] .shortcut-admin-btn,
body[data-game="h7"] .shortcut-admin-btn {
  background:linear-gradient(180deg,#333a47 0%,#202633 55%,#11151d 100%);
  border-color:#6a7486;
  color:#f6f6f8;
}
/* El menú de impresora sigue la identidad del juego activo. */
body[data-game="p8"] .settings-modal-header {
  background:linear-gradient(#197b2b,#083d17);
  border-bottom-color:#358d45;
}
body[data-game="p8"] .settings-dialog {border-color:#45a555}
body[data-game="p8"] .printer-actions .leave {
  background:linear-gradient(#269d3c,#0d5720);
}
/* Líneas interiores de la matriz: verde, en lugar del rojo/naranja fijo de Perros 6. */
body[data-game="p8"] .matrix-top {border-bottom-color:#39a64c}
body[data-game="p8"] .mh-blank {border-right-color:#39a64c}
body[data-game="p8"] .rowh {
  border-right-color:#328c40;
  border-bottom-color:#328c40;
}
body[data-game="p8"] .cell {
  border-right-color:#328c40;
  border-bottom-color:#328c40;
}
/* Cada icono superior conserva su color de identidad, activo o inactivo. */
.game-tab[data-game-tab="p6"],
.game-tab[data-game-tab="p6"].on {
  background:linear-gradient(#cb453b,#8b1b16 58%,#65110d);
  border-color:#c2746f;
}
.game-tab[data-game-tab="p8"],
.game-tab[data-game-tab="p8"].on {
  background:linear-gradient(#35af3a,#197724 58%,#0c4b14);
  border-color:#69c775;
}
.game-tab[data-game-tab="h7"],
.game-tab[data-game-tab="h7"].on {
  background:linear-gradient(#2753cf,#183895 58%,#11296a);
  border-color:#5575cc;
}
/* Resaltado del seleccionado sin cambiar su fondo. */
.game-tab[data-game-tab].on {box-shadow:inset 0 0 0 1px #ffffff56,0 0 12px #ffffff25;}


/* CABALLOS 7: los cuatro botones de ATAJOS siguen la identidad azul del visor.
   Conservamos el resaltado del atajo activo y no alteramos IMPRESORA / SALIR. */
body[data-game="h7"] .shortcuts .shortcut:not(.active) {
  background:linear-gradient(180deg,#3263d3 0%,#1b429e 55%,#0b245f 100%);
  border-color:#6686dc;
  color:#fff;
}

/* CABALLOS 7: líneas divisorias azules en toda la matriz, como su borde exterior. */
body[data-game="h7"] .matrix-top {
  border-bottom-color:#426de0;
}
body[data-game="h7"] .mh-blank {
  border-right-color:#426de0;
}
body[data-game="h7"] .rowh {
  border-right-color:#355bce;
  border-bottom-color:#355bce;
}
body[data-game="h7"] .cell {
  border-right-color:#355bce;
  border-bottom-color:#355bce;
}


/* GALLOS - área de cuotas extendida, sin la columna de atajos de carreras */
body[data-game="gall"]{
  --accent:#252e69;--accent2:#121836;--accent3:#3d5bba;--line:#7487cf;
  --panel:#070913;--panel2:#141a36;--cell1:#27315f;--cell2:#131a38;
}
body[data-game="gall"] .shortcuts{display:none}
body[data-game="gall"] .layout{grid-template-columns:minmax(0,1fr) 330px}
body[data-game="gall"] .hero::before{background-image:linear-gradient(90deg,#000d,#0a1430c0,#000d),radial-gradient(ellipse at center,#30375b,#070912 70%);filter:none}
body[data-game="gall"] .brand-logo{display:none}
.brand-gallos{display:none;align-items:center;gap:8px;color:#a8bfff;font-size:23px;line-height:.86;letter-spacing:.3px;text-shadow:0 2px 8px #000}
.brand-gallos img{width:66px;height:72px;object-fit:contain;filter:brightness(0) saturate(100%) invert(59%) sepia(27%) saturate(1769%) hue-rotate(185deg) brightness(106%)}
.brand .brand-gallos strong{display:block;font-size:22px;font-weight:1000;letter-spacing:-.5px;color:#9bb8ff}
body[data-game="gall"] .brand-gallos{display:flex}
.game-tab.gallos-tab{background:linear-gradient(#373b55,#1c2138 56%,#0d1127);border-color:#6a7191}
.game-tab.gallos-tab.on{background:linear-gradient(#4b548d,#27336b 55%,#151d46);border-color:#a8b9f5;box-shadow:inset 0 0 0 1px #ffffff40,0 0 15px #576fc966}
body[data-game="gall"] .board-head{gap:12px;min-height:62px}
body[data-game="gall"] .board-head>div:first-child{flex:none}
body[data-game="gall"] #autoModePill{display:none}
.gallo-tabs{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.gallo-tabs[hidden], .gallo-zone[hidden], .gallo-admin[hidden]{display:none!important}
.gallo-mode{padding:10px 13px;border-radius:7px;border:1px solid #646f9c;background:linear-gradient(#242a4a,#0e132b);font-size:13px;font-weight:900;white-space:nowrap}
.gallo-mode.on{border-color:#ebd889;background:linear-gradient(#465ca6,#1d347e);box-shadow:inset 0 -3px 0 #e5c252;color:#fff}
body[data-game="gall"] .visor-zone{padding:10px 12px 8px}
body[data-game="gall"] .matrix-card{display:none}
.gallo-zone{flex:1;min-height:0;width:100%;display:flex;flex-direction:column;gap:8px;color:#f4f6ff}
.gallo-legend{display:flex;align-items:center;gap:15px;flex:none;min-height:24px;color:#d5daef;font-size:13px}
.gallo-legend b{font-size:12px;font-weight:900;letter-spacing:.4px;opacity:.88;margin-right:2px}
.g-key{display:inline-flex;align-items:center;gap:5px;font-weight:700}
.g-key i,.g-pick{display:inline-block;width:22px;height:8px;background:#397cff}
.g-key i.white,.g-pick.white{background:#fff}
.g-key i.draw,.g-pick.draw{background:#696c79}
.g-pick{display:block;width:60%;height:7px;margin:auto}
.g-marked{outline:2px solid #f5d36b!important;outline-offset:-2px;position:relative;z-index:2}
.g-marked::after{content:attr(data-selected);position:absolute;right:5px;top:3px;padding:2px 4px;border-radius:4px;background:#e8c352;color:#131321;font-size:10px;font-weight:1000;pointer-events:none}
.g-order-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;flex:1;min-height:0}
.g-order-table{display:grid;grid-template-rows:34px repeat(13,minmax(0,1fr));overflow:hidden;border:1px solid #7985b6;background:#080b19;border-radius:9px 9px 4px 4px;min-height:0;min-width:0}
.g-order-head,.g-order-row{display:grid;grid-template-columns:56px repeat(3,minmax(22px,1fr)) 78px;align-items:stretch}
.g-order-head{background:linear-gradient(#101730,#05091b);border-bottom:1px solid #a4b4e0;font-size:12px;font-weight:900;color:#e8eafe;letter-spacing:.25px}
.g-order-head span{display:flex;align-items:center;justify-content:center}
.g-order-row{position:relative;text-align:center;border:0;border-bottom:1px solid #7f8baa;background:linear-gradient(180deg,#2f386d,#171e42);color:#fff;padding:0;min-width:0;min-height:0}
.g-order-row:nth-child(even){background:linear-gradient(180deg,#313e81,#1b2352)}
.g-order-row:last-child{border-bottom:0}
.g-order-row>span{display:flex;align-items:center;justify-content:center;min-width:0}
.g-number{border-right:1px solid #91a0c4;background:#070b21;font-size:clamp(15px,1.2vw,23px);font-weight:1000;letter-spacing:1px}
.g-odds{font-size:clamp(15px,1.35vw,24px);font-weight:1000;font-variant-numeric:tabular-nums}
.g-odds.hot{color:#ff383a}.g-odds.bonus{color:#20fa36}
.g-order-row:hover{filter:brightness(1.13)}
.g-fight-list{display:flex;flex:1;flex-direction:column;gap:12px;min-height:0}
.g-fight-title,.g-fight-row{display:grid;grid-template-columns:130px repeat(3,minmax(0,1fr));gap:10px}
.g-fight-title{flex:none;color:#cbd6fc;font-size:16px;font-weight:900;text-align:center;align-items:center;padding:10px 0}
.g-fight-row{flex:1;min-height:0}
.g-fight-name{display:flex;align-items:center;justify-content:center;padding:8px;background:linear-gradient(#222d61,#101936);border:1px solid #5c72ba;border-radius:9px;font-size:22px;font-weight:900}
.g-fight-cell{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;border-radius:10px;border:1px solid #7285b6;background:linear-gradient(#263267,#101738);font-size:clamp(20px,1.7vw,32px);font-weight:1000}
.g-fight-cell.blue{background:linear-gradient(#2c64c8,#163b87)}
.g-fight-cell.white{background:linear-gradient(#c9cedd,#777e97);color:#141a2b}
.g-fight-cell.draw{background:linear-gradient(#444958,#202634)}
.g-fight-cell small{font-size:13px;font-weight:800;opacity:.9}
.g-tournament{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;flex:1;min-height:0}
.g-tournament-choice{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;position:relative;border-radius:16px;border:1px solid #637cb7;background:radial-gradient(ellipse at 50% 35%,#385dba,#081437 79%)}
.g-tournament-choice.white{background:radial-gradient(ellipse at 50% 35%,#767c99,#171c31 80%)}
.g-tournament-choice .g-tournament-icon{font-size:clamp(56px,6vw,110px);font-weight:1000;line-height:1;color:#fff}
.g-tournament-choice strong{font-size:clamp(21px,2vw,36px)}
.g-tournament-choice .g-tournament-odd{padding:8px 24px;border:1px solid #ffffff66;border-radius:10px;background:#0006;font-size:clamp(30px,3vw,52px);font-weight:1000}
.g-tournament-choice small{font-size:15px;opacity:.85}
body[data-game="gall"] .stake:not(.on){background:linear-gradient(#364483,#17244e 58%,#0c1535);border-color:#7686c3}
body[data-game="gall"] .stake.on{background:linear-gradient(#ffe46c,#d7a11c 60%,#bd8814);border:2px solid #ffdf7d;color:#201605}
body[data-game="gall"] #currentShortcut{font-size:15px}
.gallo-admin{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}
.gallo-admin button{min-height:39px;border-radius:7px;border:1px solid #636e8a;background:linear-gradient(#272e3d,#111725);font-size:12px;font-weight:900}
@media(max-width:1400px){body[data-game="gall"] .layout{grid-template-columns:minmax(0,1fr) 285px}.g-order-cols{gap:7px}.g-order-head,.g-order-row{grid-template-columns:46px repeat(3,minmax(18px,1fr)) 64px}.gallo-mode{font-size:11px;padding:8px 7px}.g-fight-title,.g-fight-row{grid-template-columns:100px repeat(3,minmax(0,1fr));gap:6px}}
@media(max-height:870px){.gallo-legend{font-size:11px;min-height:20px}.g-order-table{grid-template-rows:27px repeat(13,minmax(0,1fr))}.g-order-head{font-size:10px}.g-order-cols{gap:10px}body[data-game="gall"] .visor-zone{padding:7px 10px 6px}}

/* === AUTOSERVICIO RULETA: alcance aislado, sin alterar iconos ni otros juegos === */
body[data-game="rulett"]{--accent:#48404b;--accent2:#16131a;--accent3:#a99163;--line:#8c796c;--panel:#0a0a0e;--panel2:#18141a}
body[data-game="rulett"] .shortcuts{display:none}
body[data-game="rulett"] .layout{grid-template-columns:minmax(0,1fr) 330px}
body[data-game="rulett"] .matrix-card,body[data-game="rulett"] #galloZone{display:none!important}
body[data-game="rulett"] .visor-zone{padding:9px 12px 8px;overflow:hidden}
body[data-game="rulett"] .board-head{gap:14px;min-height:69px}
body[data-game="rulett"] .board-head>div:first-child{flex:0 0 auto}
body[data-game="rulett"] #autoModePill{display:none}
body[data-game="rulett"] .hero::before{background-image:linear-gradient(90deg,#000e,#21131bcc,#000d),radial-gradient(ellipse at center,#301f28,#07080b 75%);filter:none}
.brand-roulette{display:none;text-align:center;flex-direction:column;color:#ded3c0;text-shadow:0 3px 8px #000}
.brand-roulette span{font-size:15px;font-weight:900;letter-spacing:5px}
.brand-roulette b{font-size:30px;line-height:1.1;color:#e6ce95;letter-spacing:1px}
body[data-game="rulett"] .brand-logo,body[data-game="rulett"] .brand-gallos{display:none}
body[data-game="rulett"] .brand-roulette{display:flex}
body[data-game="rulett"] .stake:not(.on){background:linear-gradient(#3a3239,#20191e 55%,#110f13);border-color:#857781}
body[data-game="rulett"] .stake.on{background:linear-gradient(#ffe46c,#d7a11c 60%,#bd8814);color:#201605;border:2px solid #ffdf7d}
.game-tab.roulette-tab,.game-tab.roulette-tab.on{background:linear-gradient(#48464a,#242529 58%,#131316);border-color:#8b878d}
.roulette-tools{margin-left:auto;display:flex;justify-content:flex-end;align-items:center;gap:13px;min-width:0;flex-wrap:wrap}
.roulette-tools[hidden],.roulette-zone[hidden]{display:none!important}
.roulette-tabs{display:flex;gap:5px;border:1px solid #827780;padding:4px;border-radius:10px;background:#060608}
.rl-view{font-size:13px;font-weight:900;letter-spacing:.2px;padding:10px 12px;border-radius:7px;border:1px solid transparent;background:#171820;color:#d7d9e0;white-space:nowrap}
.rl-view.on{color:#1e1607;background:linear-gradient(#ffe578,#bf8e20);border-color:#e6c24e}
.roulette-multi{display:flex;gap:9px;align-items:center;cursor:pointer;border:1px solid #8a7b69;background:linear-gradient(#2a2020,#111012);padding:7px 10px;border-radius:9px;min-width:184px}
.roulette-multi input{position:absolute;opacity:0;width:1px;height:1px}
.roulette-multi-check{width:31px;height:31px;flex:none;border-radius:7px;display:grid;place-items:center;background:#08080b;color:transparent;border:2px solid #88838e;font-size:22px;font-weight:900}
.roulette-multi input:checked+.roulette-multi-check{color:white;border-color:#f3d36f;background:linear-gradient(#d63a32,#851b18)}
.roulette-multi input:focus-visible+.roulette-multi-check{outline:2px solid #ffdc69;outline-offset:3px}
.roulette-multi-copy{display:flex;flex-direction:column;gap:4px;font-size:11px;line-height:1.1}
.roulette-multi-copy strong{font-size:12px;letter-spacing:.5px}.roulette-multi-copy small{color:#f2d17e;font-weight:900}
.roulette-zone{flex:1;display:flex;flex-direction:column;gap:9px;min-width:0;min-height:0;width:100%;position:relative}
.rl-tip{font-size:12px;color:#d6d6de;background:#14131a;border:1px solid #5c5863;border-radius:7px;padding:7px 10px;flex:none}
.rl-classic{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:center;gap:6px}
.rl-betboard{flex:1;min-height:0;max-height:640px;display:grid;grid-template-rows:minmax(0,3fr) minmax(38px,.60fr) minmax(38px,.60fr);gap:4px;background:#060506;border-radius:8px;user-select:none}
.rl-number-area{display:grid;grid-template-columns:7.8% minmax(0,1fr) 6.9%;gap:3px;min-height:0;position:relative}
.rl-zero{color:#fff;font-size:clamp(20px,2.4vw,36px);background:linear-gradient(#086c1b,#003e0e);border:2px solid #356f38;border-radius:7px;position:relative;cursor:pointer}.rl-zero-number{position:absolute;inset:0;width:100%;height:100%;border:0;background:transparent;color:inherit;font-size:inherit}
.rl-zero-hot{position:absolute;right:-9px;z-index:3;width:19px;height:21px;border-radius:50%;border:1px solid transparent;background:rgba(255,209,111,.035);transform:translateY(-50%);cursor:pointer}
.rl-numbers-wrapper{position:relative;min-width:0;min-height:0}
.rl-numbers-grid{height:100%;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:3px}
.rl-num{position:relative;border:1px solid #454045;display:grid;place-items:center;border-radius:6px;color:#f7f5f3;font-size:clamp(16px,2.1vw,31px);font-weight:700;min-width:0;min-height:0;cursor:pointer}
.rl-num.red{background:linear-gradient(#8a1a17,#530805)}.rl-num.black{background:linear-gradient(#313133,#131314)}
.rl-row-outs{display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:3px;min-height:0}
.rl-out{border:1px solid #555258;border-radius:6px;background:linear-gradient(#39393d,#19191d);font-size:clamp(12px,1.4vw,19px);min-height:0}
.rl-overlay{position:absolute;inset:0;pointer-events:none;z-index:3}
.rl-hotspot{position:absolute;transform:translate(-50%,-50%);z-index:1;pointer-events:auto;border:1px solid transparent;background:rgba(255,209,111,.025);border-radius:6px;cursor:pointer;padding:0;min-width:13px;min-height:13px}
.rl-hotspot:hover,.rl-hotspot:focus-visible{background:#ffdc7bd9;border-color:#fff6ad;box-shadow:0 0 10px #efd088}
.rl-hotspot.corner{width:18px;height:18px;border-radius:50%;z-index:4}
.rl-hotspot.split{width:14px;height:17px;z-index:3}
.rl-hotspot.split.horizontal{width:24px;height:14px}
.rl-hotspot.street{width:25px;height:14px;top:calc(100% - 5px)!important}
.rl-hotspot.six_line{width:17px;height:17px;top:calc(100% - 5px)!important}
.rl-hotspot.previewed{background:#f6d462cc;border:1px solid #fff}
.rl-zero-hot.previewed{background:#f6d462cc}.rl-zero-special{position:absolute;right:-16px;z-index:5;width:17px;height:17px;border-radius:50%;border:1px solid transparent;background:rgba(255,209,111,.035);transform:translateY(-50%);cursor:pointer;padding:0}.rl-zero-special.basket{right:-25px;z-index:6;width:18px;height:18px}.rl-zero-special:hover,.rl-zero-special:focus-visible{background:#f6d462cc;border-color:#fff7ba}
.rl-num.previewed,.rl-zero.previewed{filter:brightness(1.42);box-shadow:inset 0 0 0 3px #ffdd6a;z-index:1}
.rl-num.marked,.rl-zero.marked{box-shadow:inset 0 0 0 3px #f7d66d}
.rl-num.marked::after,.rl-zero.marked::after{content:attr(data-amount);position:absolute;right:2px;top:2px;border-radius:3px;padding:1px 3px;background:#ffe079;color:#201604;font-size:10px;font-weight:900}
.rl-dozens{display:grid;grid-template-columns:7.8% repeat(3,minmax(0,1fr)) 6.9%;gap:3px;min-height:0}
.rl-dozens::before,.rl-dozens::after,.rl-outside::before,.rl-outside::after{content:none}.rl-spacer{pointer-events:none}
.rl-outside{display:grid;grid-template-columns:7.8% repeat(6,minmax(0,1fr)) 6.9%;gap:3px;min-height:0}
.rl-outside>button,.rl-dozens>button{min-height:0;font-size:clamp(13px,1.65vw,23px);color:#ece8e7;border:1px solid #454247;border-radius:6px;background:linear-gradient(#38383b,#16161a)}
.rl-outside .rl-red-zone{background:linear-gradient(#8d1f1a,#540a07)}.rl-outside .rl-black-zone{background:linear-gradient(#343438,#101014)}
.rl-outside .rl-red-zone::after,.rl-outside .rl-black-zone::after{content:'';display:block;width:21px;height:21px;margin:auto;transform:rotate(45deg);background:#9b2220;border:1px solid #efb2ab}
.rl-outside .rl-black-zone::after{background:#070709;border-color:#a7a3a9}
.rl-betboard [data-rkey].selected{outline:3px solid #ffdc6f;outline-offset:-3px;z-index:6}
.rl-racetrack{flex:1;min-height:0;display:flex;flex-direction:column;gap:9px;justify-content:center}
.rl-oval{position:relative;flex:1;min-height:240px;max-height:470px;width:100%;border:1px solid #a1a0a5;border-radius:50%/45%;background:radial-gradient(ellipse at center,#13391f 5%,#07240e 50%,#031108 100%);overflow:hidden;box-shadow:inset 0 0 0 10px #073418,inset 0 0 0 12px #d3d7c3,inset 0 0 0 44px #135529,inset 0 0 0 46px #c0c6ad}
.rl-oval::before{content:'';position:absolute;inset:54px 62px;border:2px solid #aac6a4;border-radius:50%;pointer-events:none}
.rl-pocket{position:absolute;transform:translate(-50%,-50%);border:1px solid #e2e6dd94;border-radius:4px;width:clamp(24px,2.45vw,38px);height:clamp(24px,2.40vw,35px);background:#202124;color:#fff;font-size:clamp(13px,1.30vw,18px);font-weight:900;z-index:2;padding:0}
.rl-pocket.red{background:#9c181a}.rl-pocket.black{background:#18191c}.rl-pocket.green{background:#05772d}
.rl-pocket.selected{border:3px solid #ffe078;box-shadow:0 0 9px #ffde74}
.rl-pocket:hover{filter:brightness(1.5)}
.rl-sector-list{position:absolute;top:50%;left:50%;width:54%;transform:translate(-50%,-50%);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;z-index:3}
.rl-sector{min-height:57px;padding:5px 4px;border:1px solid #ddd7d7a1;border-radius:7px;font-size:clamp(9px,1vw,14px);font-weight:900;background:linear-gradient(#5d511d,#252211);color:#ffdc4f;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}
.rl-sector:nth-child(2){background:linear-gradient(#123d19,#0c2511);color:#48df70}.rl-sector:nth-child(3){background:linear-gradient(#14434e,#0c2632);color:#31d8e7}.rl-sector:nth-child(4){background:linear-gradient(#5a1050,#2b102e);color:#f18ddf}
.rl-sector small{font-size:10px;color:white}
.rl-sector.selected{outline:2px solid #ffe06d;outline-offset:1px}
.rl-neighbors{display:flex;justify-content:center;align-items:center;gap:14px;padding:8px;border:1px solid #375d41;border-radius:8px;background:#081d0f;font-size:13px;flex:none}
.rl-neighbors strong{font-size:14px}.rl-neighbors button{font-weight:900;border:1px solid #718b79;background:#153f25;padding:7px 12px;border-radius:7px}.rl-neighbors b{color:#ffe07b}
.rl-wheel-help{color:#cbd9cd;font-size:12px;text-align:center}
body[data-game="rulett"] #galloAdmin{display:grid!important}
@media(max-width:1500px){body[data-game="rulett"] .layout{grid-template-columns:minmax(0,1fr) 300px}.roulette-tools{gap:5px}.rl-view{padding:8px 8px;font-size:11px}.roulette-multi{min-width:164px;padding:6px}.roulette-multi-copy strong{font-size:10px}.roulette-multi-copy small{font-size:10px}.rl-sector-list{width:58%}}
@media(max-height:860px){body[data-game="rulett"] .visor-zone{padding:6px 9px}.rl-tip{padding:5px 8px;font-size:10px}.rl-oval{max-height:400px}.rl-betboard{gap:3px}.rl-number-area,.rl-numbers-grid,.rl-row-outs,.rl-dozens,.rl-outside{gap:2px}.rl-num{font-size:clamp(13px,1.6vw,23px)}}

/* === Ajuste solicitado: paño PISTA PREMIUM. Estilos limitados a Racetrack === */
body[data-game="rulett"] .roulette-tools{margin-left:auto;gap:7px}
body[data-game="rulett"] .roulette-ticket-multi{display:block}
.roulette-ticket-multi{display:none;margin-top:11px;padding:10px;border:1px solid #8a7750;border-radius:9px;
  background:linear-gradient(150deg,#191c20,#0b0d11);box-shadow:inset 0 1px 0 #ffffff12}
.roulette-ticket-multi-title{display:flex;justify-content:space-between;gap:5px;align-items:center;
  margin-bottom:9px;color:#f0d390;font-weight:900;font-size:13px;letter-spacing:.4px}
.roulette-ticket-multi-title small{font-size:9px;letter-spacing:.15px;color:#b9b9b8;text-align:right}
.roulette-ticket-multi .roulette-multi-ticket{width:100%;min-width:0;padding:9px 8px;gap:8px;
  border-color:#6d6655;border-radius:7px;background:linear-gradient(#252622,#111311);align-items:center}
.roulette-ticket-multi .roulette-multi-check{width:29px;height:29px;border-radius:6px;font-size:21px}
.roulette-ticket-multi .roulette-multi-copy{flex:1;min-width:0;gap:5px}
.roulette-ticket-multi .roulette-multi-copy strong{font-size:10.5px;color:#fff4d5;letter-spacing:0}
.roulette-ticket-multi .roulette-multi-copy small{color:#ffe29a;font-size:12px}
.roulette-ticket-multi .rtl-state{flex:none;min-width:52px;font-size:9px;font-weight:900;text-align:right;color:#a2a4a7}
.roulette-ticket-multi .rtl-state::after{content:'NO ACTIVO'}
.roulette-ticket-multi .roulette-multi input:checked~.rtl-state{color:#f9d874}
.roulette-ticket-multi .roulette-multi input:checked~.rtl-state::after{content:'ACTIVO'}
.roulette-ticket-multi p{font-size:10.5px;color:#c4c5c1;line-height:1.35;margin:8px 2px 0}
/* No estilos de tablero clásico debajo de este punto: pista exclusivamente */
.rl-racetrack{flex:1;display:flex;min-height:0;gap:9px;justify-content:center;align-items:stretch}
.rl-racetrack .rl-oval{flex:1;position:relative;width:100%;min-height:224px;max-height:465px;
  border:2px solid #b8b69c;border-radius:47% / 47%;overflow:hidden;
  background:radial-gradient(ellipse at 50% 46%,#0a3820 8%,#052b16 57%,#073b20 74%,#064126 100%);
  box-shadow:0 0 0 2px #122317,inset 0 0 0 6px #092b19,inset 0 0 0 9px #c8c3a4,
    inset 0 0 0 13px #155434,inset 0 0 0 17px #07341e,0 9px 26px #0009}
.rl-racetrack .rl-oval::before{content:'';position:absolute;inset:10px 13px;border:1px solid #e0d3a7;
  border-radius:47% / 47%;pointer-events:none;z-index:1;opacity:.9}
.rl-racetrack .rl-oval::after{content:'';position:absolute;inset:10.5% 8.9%;border:1.5px solid #dddac1;
  border-radius:44% / 44%;pointer-events:none;z-index:1;opacity:.95}
.rl-track-inner{position:absolute;inset:32.5% 10.2%;border-radius:50% / 47%;
  background:radial-gradient(ellipse at center,#064022,#092f1a 70%,#063019);
  border:1.5px solid #e0ddc6;box-shadow:0 0 0 3px #04321c;pointer-events:none;z-index:1}
.rl-racetrack .rl-pocket{position:absolute;z-index:3;transform:translate(-50%,-50%);padding:0;
  width:4.74%;height:16.4%;min-width:0;min-height:0;border:1px solid #dedbc8;
  border-radius:1px;color:#f8f7ee;text-align:center;font-size:clamp(12px,1.43vw,25px);
  font-family:Arial,'Arial Narrow',sans-serif;font-weight:800;line-height:1;
  text-shadow:0 1px 1px #0009;box-shadow:inset 0 1px 0 #ffffff25;transition:filter .12s,border-color .12s}
.rl-racetrack .rl-pocket.bend{width:6.2%;height:14.5%;border-radius:4px}
.rl-racetrack .rl-pocket.red{background:linear-gradient(115deg,#c61b22 0%,#9d1119 88%)}
.rl-racetrack .rl-pocket.black{background:linear-gradient(115deg,#1e2021 0%,#080b0d 93%)}
.rl-racetrack .rl-pocket.green{background:linear-gradient(125deg,#126e39,#084828)}
.rl-racetrack .rl-pocket:hover,.rl-racetrack .rl-pocket:focus-visible{filter:brightness(1.24);border:2px solid #ffe29b;z-index:6}
.rl-racetrack .rl-pocket.selected{border:2px solid #f7da78;box-shadow:inset 0 0 0 1px #ffda79,0 0 0 2px #c8a94d;z-index:5}
.rl-racetrack .rl-sector-list{position:absolute;z-index:4;top:50%;left:50%;transform:translate(-50%,-50%);
  width:77.5%;height:26.5%;display:grid;grid-template-columns:1.14fr 1fr 1.14fr 1fr;
  gap:0;overflow:hidden;border:1px solid #c7c7a9;border-radius:60px;
  background:linear-gradient(155deg,#07371e,#032914 80%);box-shadow:0 3px 9px #0006}
.rl-racetrack .rl-sector{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-height:0;height:100%;gap:7px;padding:6px 3px;border:0;border-right:1px solid #d2d1b5;
  border-radius:0;background:transparent!important;color:#f0d998!important;
  font-family:Arial,sans-serif;font-size:clamp(10px,1.18vw,20px);font-weight:900;letter-spacing:.35px;transition:background .14s}
.rl-racetrack .rl-sector:nth-child(even){background:#032a16!important}
.rl-racetrack .rl-sector:last-child{border-right:0}
.rl-racetrack .rl-sector small{font-size:clamp(8px,.74vw,12px);font-weight:800;letter-spacing:.2px;color:#f3f1df!important;white-space:nowrap}
.rl-racetrack .rl-sector:hover,.rl-racetrack .rl-sector:focus-visible{background:#176137!important;z-index:1}
.rl-racetrack .rl-sector.selected{outline:2px solid #f1d276;outline-offset:-3px;background:#135532!important}
.rl-racetrack .rl-neighbors{display:flex;justify-content:center;align-items:center;gap:11px;flex:none;
  min-height:40px;padding:5px 12px;border:1px solid #6c735a;background:linear-gradient(#17241b,#0a180f);
  border-radius:8px;color:#e6e4d8;font-size:12px}
.rl-racetrack .rl-neighbors-label{font-size:12px;letter-spacing:.8px;font-weight:900;color:#e7ca81}
.rl-racetrack .rl-neighbors strong{font-size:12px}
.rl-racetrack .rl-neighbors button{height:30px;width:35px;padding:0;border:1px solid #b7a980;
  border-radius:5px;background:linear-gradient(#23452d,#092715);font-size:20px;color:#fff}
.rl-racetrack .rl-neighbors b{color:#f2d589;font-size:12px;text-align:center}
.rl-racetrack .rl-wheel-help{font-size:11px;color:#bbc9ba;line-height:1.2;text-align:center;flex:none}
@media(max-width:1500px){
  .rl-racetrack .rl-sector{font-size:clamp(9px,1.05vw,16px)}
  .rl-racetrack .rl-sector small{font-size:clamp(8px,.7vw,10px)}
  .rl-racetrack .rl-pocket{font-size:clamp(12px,1.3vw,19px)}
  .roulette-ticket-multi .roulette-multi-copy strong{font-size:10px}
}
@media(max-height:820px){
  .rl-racetrack .rl-oval{min-height:205px}
  .rl-racetrack .rl-neighbors{min-height:34px;padding:3px 8px}
  .roulette-ticket-multi{padding:8px;margin-top:8px}
  .roulette-ticket-multi p{font-size:10px;margin-top:5px}
}


/* === LOTERÍA: mismo MI TICKET de todos los juegos; sin historial central === */
body[data-game="lottery"]{--accent:#09618e;--accent2:#042741;--accent3:#33a8e1;--line:#2381b0;--panel:#041522;--panel2:#082f49}
body[data-game="lottery"] .layout{grid-template-columns:370px minmax(0,1fr) 330px}
body[data-game="lottery"] .hero::before{background-image:linear-gradient(90deg,#000e,#032943d6,#000d),radial-gradient(ellipse at center,#075078,#050d15 75%);filter:none}
body[data-game="lottery"] .brand-logo,body[data-game="lottery"] .brand-gallos,body[data-game="lottery"] .brand-roulette{display:none}
/* Lotería: no utiliza carrera, temporizador ni indicadores de jackpot. */
body[data-game="lottery"] .game-stack{display:none!important}
body[data-game="lottery"] .hero-inner{grid-template-columns:290px minmax(0,1fr);padding-right:18px}
body[data-game="lottery"] .top-tabs{justify-content:center}
@media(max-width:1500px){body[data-game="lottery"] .hero-inner{grid-template-columns:225px minmax(0,1fr)}}

.brand-lottery{display:none;align-items:center;flex-direction:column;gap:5px;color:#d7f0ff;text-shadow:0 2px 8px #000}
.brand-lottery small{display:block!important;font-size:15px;font-weight:900;letter-spacing:3px;color:#a7d8f4}
.brand-lottery b{font-size:clamp(27px,2.4vw,39px);font-weight:1000;letter-spacing:2px}
body[data-game="lottery"] .brand-lottery{display:flex}
.game-tab[data-game-tab="lottery"],.game-tab[data-game-tab="lottery"].on{background:linear-gradient(#30a6e1,#14618f 60%,#063d62);border-color:#6ac1e9}
body[data-game="lottery"] .shortcuts{gap:9px;padding:10px;background:linear-gradient(#071825,#030910)}
body[data-game="lottery"] .shortcuts>.title,body[data-game="lottery"] .shortcuts>.shortcut,body[data-game="lottery"] .shortcuts>.mode-tip{display:none!important}
.lottery-selector{display:none;flex-direction:column;min-height:0;flex:1;gap:11px}
body[data-game="lottery"] .lottery-selector{display:flex}
.lottery-selector h2{margin:0;padding:10px 5px 12px;text-align:center;font-size:20px;font-weight:900;border-bottom:1px solid #54b3e470;color:#eaf7ff}
.lottery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;align-content:start;overflow:auto;min-height:0;flex:1;padding-right:2px}
.lottery-code{height:69px;min-width:0;padding:7px 8px;border:1px solid #3d9ccb;border-radius:6px;background:linear-gradient(#187db4,#074c76 65%,#033652);color:#e3f2fc;font-size:14px;font-weight:800;box-shadow:inset 0 2px 3px #ffffff32;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;line-height:1.15;text-align:center;white-space:normal;overflow-wrap:anywhere}
.lottery-code strong{font-size:17px;font-weight:1000;line-height:1}.lottery-code .lottery-full-name{display:block;font-size:11px;font-weight:700;line-height:1.1;max-width:100%;white-space:normal;text-wrap:balance}
.lottery-code.selected{background:linear-gradient(#ffe66d,#b88609);color:#261906;border-color:#ffe48d;box-shadow:inset 0 0 0 2px #fff5a0}
.lottery-code:disabled{cursor:not-allowed;color:#80919d;background:linear-gradient(#172b37,#071721);border-color:#253744;opacity:.65}
.lottery-note{margin-top:auto;border:1px solid #3b7491;background:#061521;padding:10px;border-radius:8px;font-size:11px;line-height:1.45;color:#d9e9f3}
.lottery-indicator{display:flex;align-items:center;gap:6px;margin-bottom:5px}.lottery-indicator i{width:9px;height:9px;border-radius:50%;background:#3edd83}.lottery-indicator i.closed{background:#6b7781}
body[data-game="lottery"] .shortcuts>.shortcut-admin{margin-top:0}
body[data-game="lottery"] .matrix-card,body[data-game="lottery"] .stakes,body[data-game="lottery"] #autoModePill{display:none!important}
body[data-game="lottery"] .visor-zone{padding:12px;overflow:hidden}
.lottery-zone[hidden]{display:none!important}
.lottery-zone{flex:1;min-height:0;width:100%;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at center,#083c59 0%,#03111e 75%);border:1px solid #165e89;border-radius:12px;padding:clamp(12px,2vw,28px)}
.lottery-terminal{width:min(100%,670px);height:min(100%,690px);min-height:0;display:flex;flex-direction:column;gap:10px}
.lottery-selected-strip{min-height:48px;padding:9px 13px;display:flex;align-items:center;justify-content:space-between;gap:10px;background:linear-gradient(#103d59,#06263b);border:1px solid #367d9f;border-radius:8px;color:#c6e9fd;font-size:13px}
.lottery-selected-strip b{color:#ffe277;letter-spacing:.4px;font-size:16px;text-align:right}

.lottery-fields{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:10px}
.lottery-field{display:flex;flex-direction:column;gap:4px;align-items:center;justify-content:center;min-height:109px;border:1px solid #287ca8;border-radius:9px;background:linear-gradient(#073c5d,#031726);color:#d1e6f5}
.lottery-field.active{border:2px solid #f3d552;background:linear-gradient(#125a80,#063352);box-shadow:0 0 0 1px #f3d55220}
.lottery-field span{font-size:15px;font-style:italic;font-weight:900}.lottery-field strong{font-size:clamp(23px,2.35vw,39px);font-weight:700;font-variant-numeric:tabular-nums;min-height:48px;white-space:nowrap;letter-spacing:.3px}
.lottery-keypad{flex:1;min-height:250px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(4,minmax(0,1fr));gap:6px}
.lottery-keypad button{border:1px solid #4ca2ce;border-radius:7px;background:linear-gradient(145deg,#2184b6 0%,#07517d 55%,#043b61 100%);font-size:clamp(29px,3vw,48px);font-weight:400;color:#deeffb;box-shadow:inset 0 2px 3px #ffffff32,0 3px 6px #0007}
.lottery-keypad button:active{filter:brightness(1.3);transform:scale(.985)}
.lottery-keypad .lottery-erase{background:linear-gradient(#8a2521,#4c1212);border-color:#ab625c}
.lottery-keypad .lottery-enter{background:linear-gradient(#f4d956,#b6880b);border-color:#ffe48a;color:#221902;font-weight:900}
.lottery-help{text-align:center;font-size:12px;line-height:1.35;color:#c9dceb;min-height:17px}
body[data-game="lottery"] .ticket-head{background:linear-gradient(#104f70,#071d31)}
body[data-game="lottery"] .line-item{border-color:#28648b;background:linear-gradient(#102e43,#091824)}
body[data-game="lottery"] .ticket .meta{color:#afd6ee}
body[data-game="lottery"] .ticket .combo{color:#ecf8ff}
@media(max-width:1500px){body[data-game="lottery"] .layout{grid-template-columns:315px minmax(0,1fr) 300px}.lottery-code{height:63px;font-size:13px}.lottery-terminal{width:min(100%,550px)}}
@media(max-height:850px){.lottery-terminal{gap:6px}.lottery-field{min-height:80px}.lottery-keypad{min-height:210px}.lottery-code{height:57px}.lottery-selector h2{padding:6px;font-size:17px}.lottery-note{padding:6px}}
/* Logos originales de cada juego: los iconos de navegación no se modifican. */
body[data-game="gall"] .brand-logo,
body[data-game="rulett"] .brand-logo{display:block}
body[data-game="gall"] .brand-gallos,
body[data-game="rulett"] .brand-roulette{display:none}
body[data-game="gall"] .brand-logo,
body[data-game="rulett"] .brand-logo,
body[data-game="p8"] .brand-logo,
body[data-game="h7"] .brand-logo{max-width:210px;max-height:104px;object-fit:contain}
/* Bingo: venta de cartones dentro de un iframe, debajo de la cabecera. */
body[data-game="bingo"]{--accent:#0f3352;--accent2:#061a2c;--accent3:#e7b947;--line:#b1832d;--panel:#030f19;--panel2:#0b2132}
#bingoOriginal{display:none;width:100%;border:0;border-radius:14px;background:#030f19;flex:1 1 auto;min-height:0}
body[data-game="bingo"] #bingoOriginal{display:block}
body[data-game="bingo"] .layout{display:none}
/* Sin carrera, temporizador ni jackpots (como lotería): las pestañas quedan centradas. */
body[data-game="bingo"] .game-stack{display:none!important}
body[data-game="bingo"] .hero-inner{grid-template-columns:290px minmax(0,1fr);padding-right:18px}
body[data-game="bingo"] .top-tabs{justify-content:center}
@media(max-width:1500px){body[data-game="bingo"] .hero-inner{grid-template-columns:225px minmax(0,1fr)}}
/* Sin la foto ni el logo del juego anterior. */
body[data-game="bingo"] .hero::before{background-image:linear-gradient(90deg,#000e,#0a2236d6,#000d),radial-gradient(ellipse at center,#10314a,#030f19 75%);filter:none}
body[data-game="bingo"] .brand-logo,body[data-game="bingo"] .brand-gallos,body[data-game="bingo"] .brand-roulette,body[data-game="bingo"] .brand-lottery{display:none}
.brand-bingo{display:none;align-items:center;flex-direction:column;gap:5px;color:#ffe7a6;text-shadow:0 2px 8px #000}
.brand-bingo small{display:block!important;font-size:13px;font-weight:900;letter-spacing:3px;color:#a0bbd8}
.brand-bingo b{font-size:clamp(30px,2.6vw,44px);font-weight:1000;letter-spacing:3px;color:#f2c65a}
body[data-game="bingo"] .brand-bingo{display:flex}
/* Pestaña con el color del bingo (activa: borde dorado). */
.game-tab[data-game-tab="bingo"]{background:linear-gradient(#17405f,#0b2840 58%,#051624);border-color:#5b7a93}
.game-tab[data-game-tab="bingo"].on{background:linear-gradient(#1c4d72,#0f3352 55%,#061a2c);border-color:#e7b947;box-shadow:inset 0 0 0 1px #ffffff30,0 0 15px #e7b94755}

/* ==========================================================================
   TABLA DE CUOTAS · CARRERAS (Perros 6, Perros 8, Caballos 7)
   Diseño del tablero de NEW_EVENT_MC (style_p.css / style_p8.css / style_c.css):
   panel con marco 3D, fichas de número, esquina "2º → / 1º ↓", celdas con
   bisel y solo división horizontal. La que MÁS paga en rojo y la que MENOS en verde.
   ========================================================================== */
@font-face{font-family:'VH-Bold';src:url('../fonts/DINNextLTPro-Bold.woff2') format('woff2');font-display:swap}
@font-face{font-family:'VH-Regular';src:url('../fonts/DINNextLTPro-Regular.woff2') format('woff2');font-display:swap}

body[data-game="p6"]{
  --vh-linea:rgba(245,80,91,.30);--vh-suave:#ff9fa5;--vh-icono:#ff7f88;--vh-esquina:#ffe6e8;
  --vh-fondo-panel:linear-gradient(180deg,rgba(255,150,157,.16) 0%,rgba(255,150,157,.04) 9%,rgba(255,150,157,0) 22%),linear-gradient(180deg,#51090e 0%,#3a0509 48%,#280306 100%);
  --vh-marco:inset 0 0 0 2px rgba(55,5,8,.95),inset 0 0 0 3px rgba(255,90,101,.38),inset 0 -14px 26px rgba(0,0,0,.45),inset 0 10px 22px rgba(255,70,82,.14);
  --vh-relieve-dato:0 2px 0 rgba(31,2,4,.85),0 4px 6px rgba(0,0,0,.55);
  --vh-cel-brillo:255,140,148;--vh-cel-filo:rgba(255,160,166,.30);--vh-cel:#48080c;
}
body[data-game="p8"]{
  --vh-linea:rgba(80,245,163,.30);--vh-suave:#9fffcf;--vh-icono:#7fffbf;--vh-esquina:#e6fff2;
  --vh-fondo-panel:linear-gradient(180deg,rgba(150,255,203,.16) 0%,rgba(150,255,203,.04) 9%,rgba(150,255,203,0) 22%),linear-gradient(180deg,#09512d 0%,#053a20 48%,#032815 100%);
  --vh-marco:inset 0 0 0 2px rgba(5,55,30,.95),inset 0 0 0 3px rgba(90,255,173,.38),inset 0 -14px 26px rgba(0,0,0,.45),inset 0 10px 22px rgba(70,255,163,.14);
  --vh-relieve-dato:0 2px 0 rgba(2,31,17,.85),0 4px 6px rgba(0,0,0,.55);
  --vh-cel-brillo:140,255,198;--vh-cel-filo:rgba(160,255,208,.30);--vh-cel:#084828;
}
body[data-game="h7"]{
  --vh-linea:rgba(80,135,245,.30);--vh-suave:#9fc0ff;--vh-icono:#7fb0ff;--vh-esquina:#e6eeff;
  --vh-fondo-panel:linear-gradient(180deg,rgba(150,195,255,.16) 0%,rgba(150,195,255,.04) 9%,rgba(150,195,255,0) 22%),linear-gradient(180deg,#0c2468 0%,#07174a 48%,#040d33 100%);
  --vh-marco:inset 0 0 0 2px rgba(6,20,70,.95),inset 0 0 0 3px rgba(90,150,255,.38),inset 0 -14px 26px rgba(0,0,0,.45),inset 0 10px 22px rgba(70,130,255,.14);
  --vh-relieve-dato:0 2px 0 rgba(3,10,40,.85),0 4px 6px rgba(0,0,0,.55);
  --vh-cel-brillo:140,185,255;--vh-cel-filo:rgba(160,200,255,.30);--vh-cel:#0a1c5c;
}

/* Panel con marco 3D */
body .matrix-card{
  --vh-cab:clamp(84px,6.6vw,112px);
  border:0;border-radius:16px;background:var(--vh-fondo-panel)!important;box-shadow:var(--vh-marco);
  padding:clamp(8px,.9vw,16px) clamp(12px,1.3vw,24px) clamp(12px,1.3vw,24px) 0;
}
body .matrix-top{
  grid-template-columns:var(--vh-cab) repeat(var(--n),minmax(0,1fr));
  padding:0;background:none!important;border:0!important;min-height:clamp(44px,3.6vw,60px);align-items:center;
}
body .matrix-body{background:none}
body .matrix-grid{grid-template-columns:var(--vh-cab) repeat(var(--n),minmax(0,1fr));background:none}

/* Esquina: columna = 2º lugar, fila = 1º lugar */
body .mh-blank{
  position:relative;height:100%;border:0!important;
  font-family:'VH-Bold',sans-serif;font-size:clamp(17px,1.5vw,28px);line-height:1;color:var(--vh-esquina);
  text-shadow:0 2px 3px rgba(0,0,0,.6);
}
.mh-blank span{position:absolute;display:flex;align-items:center;gap:6px}
.mh-blank span:first-child{right:clamp(2px,.3vw,6px);top:50%;transform:translateY(-50%)}
.mh-blank span:last-child{left:clamp(4px,.5vw,10px);top:clamp(8px,.85vw,16px);flex-direction:column;gap:4px;z-index:1}
.mh-blank i{font-style:normal;font-size:.8em;color:var(--vh-icono)}

/* Fichas de número (encabezados de columna y fila) */
body .mh,body .rowh{
  display:flex;align-items:center;justify-content:center;padding:0;height:auto;
  background:none!important;border:0!important;
}
.mh::before,.mh::after,.rowh::before,.rowh::after{content:none!important}
.mh img,.rowh img{display:block;height:clamp(32px,2.7vw,52px);width:auto;max-width:90%;object-fit:contain;filter:drop-shadow(0 4px 5px rgba(0,0,0,.6));pointer-events:none}
.rowh img{height:clamp(28px,2.3vw,44px)}
.mh:hover img,.rowh:hover img{transform:translateY(-1px);filter:drop-shadow(0 0 8px rgba(255,255,255,.35)) drop-shadow(0 4px 5px rgba(0,0,0,.6))}

/* Celdas de cuota */
body .cell,body .cell.alt,body .cell.diag{
  font-family:'VH-Bold',sans-serif;font-weight:400;line-height:1;color:#fff;
  font-size:clamp(18px,1.9vw,38px);font-variant-numeric:tabular-nums;
  text-shadow:var(--vh-relieve-dato);
  border:0;border-bottom:1px solid rgba(0,0,0,.55)!important;border-right:0!important;
  background:
    linear-gradient(180deg,rgba(var(--vh-cel-brillo),.16) 0%,rgba(var(--vh-cel-brillo),.05) 22%,rgba(var(--vh-cel-brillo),0) 50%,rgba(0,0,0,.18) 100%),
    var(--vh-cel)!important;
  box-shadow:inset 0 1px 0 var(--vh-cel-filo),inset 0 -2px 0 rgba(0,0,0,.45);
}
/* Zona de cuotas hundida con su marco y esquinas redondeadas */
.matrix-grid .rowh+.cell{border-left:1px solid var(--vh-linea)!important}
.matrix-grid .cell[data-a="1"]{border-top:1px solid var(--vh-linea)!important}
.matrix-grid .cell[data-a="1"][data-b="1"]{border-top-left-radius:10px}
.matrix-grid .cell.vh-ult-col[data-a="1"]{border-top-right-radius:10px}
.matrix-grid .cell.vh-ult-fil[data-b="1"]{border-bottom-left-radius:10px}
.matrix-grid .cell.vh-ult-fil.vh-ult-col{border-bottom-right-radius:10px}

/* La que MÁS paga en rojo (aclarado para que se lea igual que las blancas) y la que MENOS en verde */
body .cell.vh-mayor{color:#ff7070}
body .cell.vh-menor{color:#09ff00}
.cell:hover{filter:brightness(1.18)}
.cell.marked{box-shadow:inset 0 0 0 4px #ffd35e,inset 0 1px 0 var(--vh-cel-filo)}

/* ==========================================================================
   TEXTURA DEL TABLERO en las pestañas de juego y en los botones de ATAJOS
   Misma receta que el panel de cuotas: brillo arriba, degradado oscuro y
   bisel interior (doble filo), sin borde exterior.
   ========================================================================== */
.top-tabs .game-tab[data-game-tab]{
  border:0;
  background:
    linear-gradient(180deg,rgba(var(--t-luz),.20) 0%,rgba(var(--t-luz),.05) 12%,rgba(var(--t-luz),0) 30%),
    linear-gradient(180deg,var(--t-a) 0%,var(--t-b) 48%,var(--t-c) 100%);
  box-shadow:
    inset 0 0 0 2px var(--t-sombra),
    inset 0 0 0 3px rgba(var(--t-filo),.42),
    inset 0 -12px 22px rgba(0,0,0,.45),
    inset 0 9px 18px rgba(var(--t-filo),.16),
    0 3px 10px #0007;
}
.top-tabs .game-tab[data-game-tab].on{
  background:
    linear-gradient(180deg,rgba(var(--t-luz),.30) 0%,rgba(var(--t-luz),.08) 14%,rgba(var(--t-luz),0) 34%),
    linear-gradient(180deg,var(--t-a) 0%,var(--t-b) 48%,var(--t-c) 100%);
  box-shadow:
    inset 0 0 0 2px var(--t-sombra),
    inset 0 0 0 4px rgba(var(--t-filo),.95),
    inset 0 -12px 22px rgba(0,0,0,.40),
    inset 0 9px 18px rgba(var(--t-filo),.24),
    0 0 16px rgba(var(--t-filo),.45);
}
.top-tabs .game-tab[data-game-tab="p6"]{--t-luz:255,150,157;--t-a:#6a0c12;--t-b:#4a070c;--t-c:#2c0306;--t-filo:255,90,101;--t-sombra:rgba(55,5,8,.95)}
.top-tabs .game-tab[data-game-tab="p8"]{--t-luz:150,255,203;--t-a:#0b6538;--t-b:#064828;--t-c:#032815;--t-filo:90,255,173;--t-sombra:rgba(5,55,30,.95)}
.top-tabs .game-tab[data-game-tab="h7"]{--t-luz:150,195,255;--t-a:#0f2d82;--t-b:#081d5c;--t-c:#040d33;--t-filo:90,150,255;--t-sombra:rgba(6,20,70,.95)}
.top-tabs .game-tab[data-game-tab="gall"]{--t-luz:175,185,255;--t-a:#2c346c;--t-b:#1b214a;--t-c:#0d1127;--t-filo:125,140,225;--t-sombra:rgba(10,14,40,.95)}
.top-tabs .game-tab[data-game-tab="lottery"]{--t-luz:150,215,255;--t-a:#0f5f8e;--t-b:#094266;--t-c:#042a40;--t-filo:90,190,245;--t-sombra:rgba(3,30,48,.95)}
.top-tabs .game-tab[data-game-tab="rulett"]{--t-luz:225,225,232;--t-a:#3c3c41;--t-b:#26262a;--t-c:#121214;--t-filo:165,165,175;--t-sombra:rgba(8,8,10,.95)}
.top-tabs .game-tab[data-game-tab="bingo"]{--t-luz:150,195,235;--t-a:#17405f;--t-b:#0b2840;--t-c:#051624;--t-filo:231,185,71;--t-sombra:rgba(3,14,24,.95)}

/* ATAJOS (solo carreras): usan el panel del juego activo (--vh-fondo-panel / --vh-marco) */
body[data-game] .shortcuts .shortcut:not(.x){
  border:0;border-radius:12px;color:#fff;
  background:var(--vh-fondo-panel);
  box-shadow:var(--vh-marco),0 4px 8px #0006;
}
body[data-game] .shortcuts .shortcut:not(.x) small{color:var(--vh-suave)}
body[data-game] .shortcuts .shortcut:not(.x) .sig{color:var(--vh-icono);text-shadow:0 2px 3px rgba(0,0,0,.55)}
/* Atajo activo: misma textura, más luz y el aro dorado de la selección */
body[data-game] .shortcuts .shortcut.active:not(.x){
  background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,0) 40%),var(--vh-fondo-panel);
  box-shadow:inset 0 0 0 3px #ffd35e,var(--vh-marco),0 0 14px rgba(255,211,94,.45);
}

/* FICHAS DE MONTO (25 · 50 · 100 · 200) en carreras: misma textura del tablero.
   La ficha elegida sigue siendo amarilla, ahora con el mismo bisel 3D. */
body:is([data-game="p6"],[data-game="p8"],[data-game="h7"]) .stakes .stake{
  border:0;border-radius:12px;
  font-family:'VH-Bold',sans-serif;font-style:normal;font-variant-numeric:tabular-nums;
}
body:is([data-game="p6"],[data-game="p8"],[data-game="h7"]) .stakes .stake:not(.on){
  color:#fff;text-shadow:var(--vh-relieve-dato);
  background:var(--vh-fondo-panel);
  box-shadow:var(--vh-marco),0 6px 10px #0005;
}
body:is([data-game="p6"],[data-game="p8"],[data-game="h7"]) .stakes .stake.on{
  color:#2a1c03;text-shadow:0 1px 0 rgba(255,240,190,.6);
  background:
    linear-gradient(180deg,rgba(255,250,215,.45) 0%,rgba(255,250,215,.10) 12%,rgba(255,250,215,0) 30%),
    linear-gradient(180deg,#f2c94c 0%,#d29a1d 48%,#a8740c 100%);
  box-shadow:
    inset 0 0 0 2px rgba(92,58,4,.95),
    inset 0 0 0 4px rgba(255,226,140,.85),
    inset 0 -12px 22px rgba(90,50,0,.35),
    0 0 14px rgba(255,211,94,.40),0 6px 10px #0005;
}
body:is([data-game="p6"],[data-game="p8"],[data-game="h7"]) .stakes .stake:active{transform:scale(.98)}

/* ============================================================
   ESTACIÓN CONECTADA (estacion.mjs): pago, activación y bloqueo
   ============================================================ */
.toast{z-index:950}
body.venta-cerrada :is(.matrix-card,#galloZone,#rouletteZone){filter:grayscale(.6) brightness(.7)}
body.venta-cerrada #raceTime{color:#ff7070}
.pago-scrim,.estacion-scrim{position:fixed;inset:0;z-index:600;display:flex;justify-content:center;align-items:center;padding:16px;background:rgba(0,0,0,.84);backdrop-filter:blur(5px)}
.estacion-scrim{z-index:900;background:linear-gradient(145deg,#220806,#000)}
.pago-scrim[hidden],.estacion-scrim[hidden],.pago-dialog [hidden]{display:none!important}
.pago-dialog{width:min(620px,100%);max-height:100%;overflow:auto;border:1px solid #b86661;border-radius:17px;color:#f6f6fa;
 background:linear-gradient(160deg,#24212c 0%,#11121b 47%,#0a0a10 100%);box-shadow:0 20px 75px #000b}
.pago-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:17px 20px;border-bottom:1px solid #ffffff27;background:linear-gradient(#8c1b16,#410d0c)}
.pago-head h2{margin:0;font-size:25px}.pago-head small{color:#f1d7d5;font-size:14px;font-weight:800}
.pago-estado{margin:16px 20px 0;padding:14px 16px;border-radius:11px;font-size:20px;font-weight:1000;text-align:center;background:#ffffff10;border:1px solid #ffffff25}
.pago-estado[data-tono="ok"]{background:linear-gradient(#1f7a33,#0f4a1d);border-color:#55c46d}
.pago-estado[data-tono="warn"]{background:linear-gradient(#8a6410,#4d3606);border-color:#e3b744}
.pago-estado[data-tono="error"]{background:linear-gradient(#9a1f19,#55100d);border-color:#f0736b}
.pago-montos{margin:16px 20px 0;display:grid;gap:6px}
.pago-montos div{display:flex;justify-content:space-between;align-items:center;padding:9px 12px;border-radius:9px;background:#ffffff08;border:1px solid #ffffff17}
.pago-montos dt{font-size:14px;font-weight:900;color:#c8ced8}.pago-montos dd{margin:0;font-size:22px;font-weight:1000;font-variant-numeric:tabular-nums}
.pago-montos .pago-total,.pago-montos .pago-falta{border-color:#9b7a1d;background:linear-gradient(#ecd44d,#c9a01b)}
.pago-montos .pago-total dt,.pago-montos .pago-total dd,.pago-montos .pago-falta dt,.pago-montos .pago-falta dd{color:#17130a}
.pago-ticket{margin:16px 20px 0;display:grid;gap:8px}.pago-ticket label{font-size:14px;font-weight:800;color:#e9e9ed}
.pago-ticket div{display:flex;gap:8px}
.pago-ticket input{flex:1;min-width:0;min-height:52px;padding:10px 12px;border-radius:9px;border:1px solid #777f90;background:#090d16;color:#fff;font:inherit;font-size:19px}
.pago-ticket button,.pago-cotizacion button{min-height:52px;padding:0 18px;border:1px solid #ffffff30;border-radius:9px;background:linear-gradient(#424551,#20232b);font-size:15px;font-weight:900}
.pago-cotizacion{margin:10px 20px 0;padding:12px;display:flex;flex-wrap:wrap;align-items:center;gap:10px;border:1px solid #e9c85c;border-radius:11px;background:#2a230c}
.pago-cotizacion div{flex:1 1 260px;display:grid;gap:4px}.pago-cotizacion span{font-size:15px}.pago-cotizacion small{color:#f3d98a}
.pago-cotizacion [data-cotizacion="usar"]{color:#1c1608;background:linear-gradient(#ffe673,#c59319);border-color:#e9c85c}
.pago-fuentes{list-style:none;margin:10px 20px 0;padding:0;display:grid;gap:6px}
.pago-fuentes li{display:grid;grid-template-columns:1fr auto 44px;align-items:center;gap:10px;padding:8px 10px;border:1px solid #ffffff1d;border-radius:10px;background:#ffffff07;font-weight:900}
.pago-fuentes button{width:44px;height:44px;border-radius:8px;border:1px solid #ffffff35;background:#5c1212;font-size:24px}
.pago-aviso{margin:10px 20px 0;min-height:1em;color:#f3d98a;font-weight:800;text-align:center}
.pago-acciones,.pago-asistencia{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:14px 20px 20px}
.pago-asistencia{grid-template-columns:1fr}
.pago-acciones button,.pago-asistencia button{min-height:64px;border-radius:10px;border:0;font-size:19px;font-weight:1000}
.pago-acciones .clear{background:linear-gradient(#d43b32,#95130f);box-shadow:inset 0 1px 0 #fff4}
.pago-acciones .print,.pago-asistencia .print{background:linear-gradient(#f3d94f,#b58d13);color:#221905;box-shadow:inset 0 1px 0 #fff7}
.pago-acciones button:disabled{filter:grayscale(1) brightness(.6)}
.estacion-box{max-width:520px;text-align:center;padding:30px;border:1px solid #a24640;border-radius:16px;background:#0d1018}
.estacion-box h2{margin:0 0 14px;font-size:30px}.estacion-box p{color:#c4c7ce;line-height:1.5;font-size:17px;margin:14px 0 0}
.estacion-codigo{display:inline-block;padding:14px 26px;border-radius:12px;background:linear-gradient(#ffe673,#c59319);color:#1c1608;font-size:clamp(34px,6vw,54px);font-weight:1000;letter-spacing:6px;font-variant-numeric:tabular-nums}
.estacion-qr{display:block;width:min(240px,60vw);margin:18px auto 0;padding:10px;border-radius:12px;background:#fff}
.estacion-scrim [hidden]{display:none!important}
@media (max-width:520px){.pago-acciones{grid-template-columns:1fr}.pago-head{flex-direction:column}}
.estacion-conectada .solo-demo{display:none}

/* Pareja Super Palé (catálogo V2): se distingue de los horarios simples. */
.lottery-code.super-pale{border-style:dashed}