:root{
  --gpe-navy:#17324a;
  --gpe-blue:#1f6fa8;
  --gpe-teal:#177c7a;
  --gpe-gold:#c9942e;
  --gpe-text:#253746;
  --gpe-muted:#647482;
  --gpe-border:#dbe3e8;
  --gpe-soft:#f5f8fa;
  --gpe-blue-soft:#eef6fb;
  --gpe-green:#167d79;
  --gpe-red:#b74444;
  --gpe-shadow:0 12px 34px rgba(18,42,58,.08);
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--gpe-text);
  background:
    radial-gradient(circle at 8% 4%,rgba(31,111,168,.10),transparent 28rem),
    linear-gradient(180deg,#edf3f7 0,#f8fafb 38rem,#f4f7f9 100%);
}
a{color:var(--gpe-blue)}
button,input,select{font:inherit}
.gpe-content-v10{
  width:min(1180px,calc(100% - 32px));
  margin:0 auto;
  padding:32px 0 60px;
}
.gc-hero{
  padding:34px;
  border-radius:24px;
  background:
    radial-gradient(circle at 92% 18%,rgba(255,255,255,.16),transparent 18rem),
    linear-gradient(135deg,#17324a,#1f6fa8);
  color:#fff;
  box-shadow:var(--gpe-shadow);
}
.gc-eyebrow{
  display:inline-block;
  margin-bottom:10px;
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#d8edf8;
}
.gc-hero h1{margin:0;font-size:clamp(34px,6vw,58px);line-height:1.02;max-width:900px}
.gc-hero p{max-width:850px;margin:18px 0 0;font-size:18px;line-height:1.7;color:#e9f4fa}
.gc-answer{
  display:grid;
  grid-template-columns:42px 1fr;
  gap:14px;
  margin:22px 0;
  padding:18px 20px;
  border:1px solid var(--gpe-border);
  border-radius:16px;
  background:#fff;
}
.gc-answer>div:first-child{
  display:grid;place-items:center;width:42px;height:42px;border-radius:50%;
  background:var(--gpe-blue-soft);color:var(--gpe-blue);font-weight:900
}
.gc-answer p{margin:5px 0 0;color:var(--gpe-muted);line-height:1.6}
.gpe-quickjump{
  display:flex;flex-wrap:wrap;gap:10px;margin:0 0 28px;
}
.gpe-quickjump a{
  padding:8px 12px;border:1px solid var(--gpe-border);border-radius:999px;
  background:#fff;text-decoration:none;font-size:13px;font-weight:800;color:var(--gpe-navy)
}
.gc-section{margin:34px 0}
.gc-section-head{display:flex;justify-content:space-between;gap:24px;align-items:end;margin-bottom:18px}
.gc-section-head h2{margin:4px 0 0;color:var(--gpe-navy);font-size:clamp(26px,4vw,38px)}
.gc-section-head p{max-width:520px;margin:0;color:var(--gpe-muted);line-height:1.6}
.gpe-section-kicker{color:var(--gpe-teal);font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.gpe-slots-grid{
  display:grid;grid-template-columns:minmax(0,.95fr) minmax(380px,1.05fr);gap:24px;align-items:start;
}
.gpe-slots-panel{
  background:#fff;border:1px solid var(--gpe-border);border-radius:20px;padding:24px;box-shadow:var(--gpe-shadow);
}
.gpe-slots-panel--controls{position:sticky;top:16px}
.gpe-slots-panel-head span{color:var(--gpe-teal);font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.06em}
.gpe-slots-panel-head h3{margin:6px 0;color:var(--gpe-navy);font-size:24px}
.gpe-slots-panel-head p{margin:0 0 18px;color:var(--gpe-muted);line-height:1.6;font-size:14px}
.gpe-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.gpe-tab{
  border:1px solid var(--gpe-border);background:#fff;color:var(--gpe-navy);padding:9px 12px;border-radius:10px;
  cursor:pointer;font-weight:800
}
.gpe-tab[aria-selected="true"]{background:var(--gpe-navy);color:#fff;border-color:var(--gpe-navy)}
.gpe-tab-panel[hidden]{display:none!important}
.gpe-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.gpe-field{min-width:0}
.gpe-field--wide{grid-column:1/-1}
.gpe-field label{display:block;font-size:13px;font-weight:850;color:var(--gpe-navy)}
.gpe-field small{display:block;margin-top:5px;color:var(--gpe-muted);font-size:12px;line-height:1.45}
.gpe-field input,.gpe-field select{
  width:100%;min-height:46px;margin-top:7px;padding:10px 12px;border:1px solid #cad7e1;border-radius:11px;
  background:#fbfcfd;color:var(--gpe-text);outline:none
}
.gpe-field input:focus,.gpe-field select:focus{border-color:var(--gpe-blue);box-shadow:0 0 0 3px rgba(31,111,168,.10);background:#fff}
.gpe-subhead{grid-column:1/-1;padding-top:16px;margin-top:4px;border-top:1px solid var(--gpe-border);font-weight:900;color:var(--gpe-navy)}
.gpe-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}
.gpe-actions button{min-height:48px;border:0;border-radius:11px;padding:11px 14px;font-weight:900;cursor:pointer}
.gpe-run{background:var(--gpe-blue);color:#fff}
.gpe-compare{background:var(--gpe-teal);color:#fff}
.gpe-reset{grid-column:1/-1;background:#fff;color:var(--gpe-navy);border:1px solid var(--gpe-border)!important}
.gpe-error{margin:12px 0 0;padding:10px 12px;border-radius:10px;background:#fff0f0;color:#9c2f2f;font-weight:750;font-size:13px}
.gpe-empty{padding:24px;border:1px dashed #bfcfda;border-radius:14px;background:#f8fbfd;text-align:center;color:var(--gpe-muted)}
.gpe-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:16px}
.gpe-fact{padding:16px;border:1px solid var(--gpe-border);border-radius:15px;background:linear-gradient(145deg,#fff,#f5f9fb)}
.gpe-fact span{display:block;color:var(--gpe-muted);font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.05em}
.gpe-fact strong{display:block;margin-top:6px;color:var(--gpe-navy);font-size:clamp(22px,3vw,30px);line-height:1.08;overflow-wrap:anywhere}
.gpe-fact p{margin:7px 0 0;color:var(--gpe-muted);font-size:12px;line-height:1.45}
.gpe-fact--rtp{border-top:4px solid var(--gpe-blue)}
.gpe-fact--risk{border-top:4px solid var(--gpe-red)}
.gpe-fact--bankroll{border-top:4px solid var(--gpe-green)}
.gpe-table-wrap{overflow:auto;border:1px solid var(--gpe-border);border-radius:14px;background:#fff}
.gpe-table-wrap table{width:100%;border-collapse:collapse;min-width:650px}
.gpe-table-wrap th,.gpe-table-wrap td{padding:12px 14px;border-bottom:1px solid var(--gpe-border);text-align:left;vertical-align:top}
.gpe-table-wrap th{background:#f4f7f9;color:var(--gpe-navy)}
.gpe-table-wrap tr:last-child th,.gpe-table-wrap tr:last-child td{border-bottom:0}
.gpe-chart-card{margin-top:16px;padding:18px;border:1px solid var(--gpe-border);border-radius:15px;background:#fff}
.gpe-chart-card h4{margin:0 0 10px;color:var(--gpe-navy)}
.gpe-chart-wrap{width:100%;height:280px}
.gpe-chart-wrap canvas{width:100%;height:100%;display:block}
.gpe-callout{margin-top:16px;padding:18px 20px;border-left:5px solid var(--gpe-gold);border-radius:0 14px 14px 0;background:#fff9ec}
.gpe-callout p{margin:6px 0 0;line-height:1.6}
.gpe-compare-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:18px}
.gpe-card{padding:18px;border:1px solid var(--gpe-border);border-radius:15px;background:#fff}
.gpe-card h3{margin:0 0 8px;color:var(--gpe-navy);font-size:18px}
.gpe-card p{margin:0;color:var(--gpe-muted);line-height:1.6;font-size:14px}
.gpe-advanced-note{font-size:12px;color:var(--gpe-muted);line-height:1.5;margin:12px 0 0}
.gpe-badge{display:inline-block;padding:4px 8px;border-radius:999px;background:var(--gpe-blue-soft);color:var(--gpe-blue);font-size:11px;font-weight:900}
.gpe-model-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px}
.gpe-model-summary div{padding:12px;border-radius:12px;background:#f7fafc;border:1px solid var(--gpe-border)}
.gpe-model-summary span{display:block;font-size:11px;color:var(--gpe-muted);text-transform:uppercase;font-weight:900}
.gpe-model-summary strong{display:block;margin-top:4px;color:var(--gpe-navy)}
footer{margin-top:36px;color:var(--gpe-muted);font-size:12px;line-height:1.6}

/* =========================================================
   SLOT MACHINE EXPERIENCE LAYER v1.1
   Purpose: make the tool itself feel like a real tragamonedas UI
========================================================= */
.gpe-slot-cabinet{
  margin:22px 0 28px;
  padding:14px;
  border:1px solid rgba(31,111,168,.38);
  border-radius:28px;
  background:
    linear-gradient(180deg,rgba(9,31,47,.98),rgba(10,44,62,.98)),
    #0b2638;
  box-shadow:
    0 24px 55px rgba(8,34,50,.24),
    inset 0 0 0 1px rgba(255,255,255,.05);
  color:#fff;
  overflow:hidden;
}
.gpe-slot-marquee{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:18px;
  align-items:center;
  padding:18px 20px;
  border:1px solid rgba(114,210,232,.22);
  border-radius:19px 19px 12px 12px;
  background:
    radial-gradient(circle at 15% 20%,rgba(42,187,212,.18),transparent 20rem),
    linear-gradient(135deg,#0d3850,#09283b);
}
.gpe-slot-brand small{
  display:block;
  color:#78d6e8;
  font-size:10px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.gpe-slot-brand strong{
  display:block;
  margin-top:4px;
  color:#fff;
  font-size:clamp(23px,4vw,36px);
  letter-spacing:.01em;
  line-height:1.04;
}
.gpe-slot-brand span{
  display:block;
  margin-top:5px;
  color:#bfdde7;
  font-size:13px;
}
.gpe-slot-meters{
  display:grid;
  grid-template-columns:repeat(3,minmax(92px,1fr));
  gap:8px;
}
.gpe-slot-meter{
  min-width:0;
  padding:10px 12px;
  border:1px solid rgba(114,210,232,.22);
  border-radius:12px;
  background:rgba(5,24,37,.58);
}
.gpe-slot-meter span{
  display:block;
  color:#87c7d8;
  font-size:9px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.gpe-slot-meter strong{
  display:block;
  margin-top:3px;
  color:#fff;
  font-size:16px;
  overflow-wrap:anywhere;
}
.gpe-slot-stage{
  display:grid;
  grid-template-columns:minmax(0,1fr) 205px;
  gap:12px;
  margin-top:12px;
}
.gpe-slot-reelbox{
  position:relative;
  padding:12px;
  border:3px solid #d8aa48;
  border-radius:17px;
  background:
    linear-gradient(180deg,#0a2535,#061923);
  box-shadow:
    inset 0 0 0 2px rgba(255,235,167,.20),
    0 0 28px rgba(44,180,214,.12);
}
.gpe-slot-reels{
  position:relative;
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:7px;
  min-height:360px;
  overflow:hidden;
  border-radius:11px;
  background:
    repeating-linear-gradient(90deg,rgba(255,255,255,.025) 0 1px,transparent 1px 20%);
}
.gpe-slot-reels::before,
.gpe-slot-reels::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  z-index:3;
  height:2px;
  background:linear-gradient(90deg,transparent,#f6d371 10%,#f6d371 90%,transparent);
  box-shadow:0 0 12px rgba(246,211,113,.65);
  pointer-events:none;
}
.gpe-slot-reels::before{top:33.333%}
.gpe-slot-reels::after{top:66.666%}
.gpe-slot-reel{
  position:relative;
  min-width:0;
  overflow:hidden;
  border-radius:11px;
}
.gpe-slot-track{
  position:absolute;
  inset:0 auto auto 0;
  width:100%;
  display:flex;
  flex-direction:column;
  gap:7px;
  will-change:transform;
  transform:translate3d(0,0,0);
}
.gpe-slot-track.is-rolling{
  filter:blur(.45px) saturate(.92);
}
.gpe-slot-symbol{
  position:relative;
  display:grid;
  place-items:center;
  min-width:0;
  min-height:110px;
  padding:8px;
  border:1px solid rgba(117,198,216,.20);
  border-radius:11px;
  background:
    radial-gradient(circle at 50% 32%,rgba(255,255,255,.09),transparent 42%),
    linear-gradient(180deg,#123a4e,#0b2838);
  box-shadow:inset 0 -16px 24px rgba(0,0,0,.15);
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.gpe-slot-symbol[data-win="1"]{
  border-color:#f7d06d;
  box-shadow:
    inset 0 -16px 24px rgba(0,0,0,.10),
    0 0 0 2px rgba(247,208,109,.18),
    0 0 26px rgba(247,208,109,.42);
  transform:translateY(-1px);
}
.gpe-slot-icon{
  display:grid;
  place-items:center;
  width:66px;
  height:66px;
  border-radius:20px;
  border:2px solid rgba(255,255,255,.16);
  color:#fff;
  font-size:34px;
  font-weight:1000;
  line-height:1;
  text-shadow:0 2px 8px rgba(0,0,0,.32);
}
.gpe-slot-symbol small{
  position:absolute;
  bottom:8px;
  left:8px;
  right:8px;
  color:#c9e4ec;
  font-size:8px;
  font-weight:900;
  text-align:center;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.gpe-slot-icon--gem{background:linear-gradient(145deg,#28c9df,#196dd0)}
.gpe-slot-icon--sun{background:linear-gradient(145deg,#ffcf54,#d88a1b)}
.gpe-slot-icon--mask{background:linear-gradient(145deg,#b56ee7,#5f3ab8)}
.gpe-slot-icon--coin{background:linear-gradient(145deg,#ffd86b,#b47b12)}
.gpe-slot-icon--leaf{background:linear-gradient(145deg,#55c780,#17885e)}
.gpe-slot-icon--wild{background:linear-gradient(145deg,#f2ba45,#934d0e)}
.gpe-slot-icon--scatter{background:linear-gradient(145deg,#f56d77,#a72253)}
.gpe-slot-icon--bonus{background:linear-gradient(145deg,#58d6ef,#774de0)}
.gpe-slot-icon--seven{background:linear-gradient(145deg,#fa4c55,#a70f2f)}
.gpe-slot-reels.is-spinning .gpe-slot-symbol{
  filter:saturate(.92);
}
.gpe-slot-reel::before,
.gpe-slot-reel::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  z-index:5;
  height:28px;
  pointer-events:none;
}
.gpe-slot-reel::before{
  top:0;
  background:linear-gradient(180deg,rgba(5,20,30,.72),transparent);
}
.gpe-slot-reel::after{
  bottom:0;
  background:linear-gradient(0deg,rgba(5,20,30,.72),transparent);
}
.gpe-slot-paytable{
  padding:14px;
  border:1px solid rgba(114,210,232,.20);
  border-radius:14px;
  background:linear-gradient(180deg,#0c3147,#092537);
}
.gpe-slot-paytable h3{
  margin:0 0 10px;
  color:#f3ca68;
  font-size:14px;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.gpe-slot-payrow{
  display:grid;
  grid-template-columns:32px 1fr auto;
  gap:8px;
  align-items:center;
  padding:7px 0;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.gpe-slot-payrow:last-child{border-bottom:0}
.gpe-slot-payrow .gpe-slot-icon{
  width:30px;
  height:30px;
  border-radius:9px;
  font-size:15px;
}
.gpe-slot-payrow span{
  color:#cfe4eb;
  font-size:10px;
  line-height:1.25;
}
.gpe-slot-payrow strong{
  color:#fff;
  font-size:12px;
}
.gpe-slot-controlbar{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  gap:12px;
  align-items:center;
  margin-top:12px;
  padding:12px;
  border:1px solid rgba(114,210,232,.18);
  border-radius:14px;
  background:#071d2b;
}
.gpe-slot-controlcluster{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}
.gpe-slot-status{
  min-width:0;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:11px;
  background:rgba(255,255,255,.03);
}
.gpe-slot-status span{
  display:block;
  color:#7fbfd1;
  font-size:9px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.gpe-slot-status strong{
  display:block;
  margin-top:3px;
  color:#fff;
  font-size:15px;
  overflow-wrap:anywhere;
}
.gpe-slot-spin{
  width:116px;
  height:116px;
  border:4px solid #f6d06d;
  border-radius:50%;
  background:
    radial-gradient(circle at 35% 30%,#ffe9a3,#d29422 55%,#7f500b 100%);
  color:#fff;
  font-weight:1000;
  font-size:18px;
  letter-spacing:.04em;
  text-shadow:0 2px 5px rgba(0,0,0,.38);
  box-shadow:
    0 0 0 5px rgba(247,208,109,.13),
    0 10px 24px rgba(0,0,0,.24),
    inset 0 2px 2px rgba(255,255,255,.4);
  cursor:pointer;
}
.gpe-slot-spin:active{transform:scale(.97)}
.gpe-slot-spin:disabled{opacity:.78;cursor:wait;transform:none}
.gpe-slot-betcontrols{
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:6px;
  align-items:center;
}
.gpe-slot-betcontrols button{
  width:35px;
  height:35px;
  border:1px solid rgba(127,197,214,.25);
  border-radius:9px;
  background:#10384e;
  color:#fff;
  font-weight:1000;
  cursor:pointer;
}
.gpe-slot-message{
  grid-column:1/-1;
  margin-top:8px;
  color:#c6dfe7;
  font-size:11px;
  text-align:center;
  min-height:16px;
}
.gpe-slot-message strong{color:#f7d06d}
.gpe-slot-footerhint{
  margin-top:10px;
  color:#7eb8c9;
  font-size:10px;
  text-align:center;
}
@media(max-width:900px){
  .gpe-slot-marquee{grid-template-columns:1fr}
  .gpe-slot-stage{grid-template-columns:1fr}
  .gpe-slot-paytable{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 14px}
  .gpe-slot-paytable h3{grid-column:1/-1}
}
@media(max-width:700px){
  .gpe-slot-meters{grid-template-columns:1fr 1fr}
  .gpe-slot-reels{min-height:300px}
  .gpe-slot-symbol{min-height:90px}
  .gpe-slot-icon{width:52px;height:52px;font-size:27px}
  .gpe-slot-controlbar{grid-template-columns:1fr}
  .gpe-slot-spin{justify-self:center}
  .gpe-slot-controlcluster{grid-template-columns:1fr 1fr}
  .gpe-slot-paytable{grid-template-columns:1fr}
}

@media(max-width:900px){
  .gpe-slots-grid{grid-template-columns:1fr}
  .gpe-slots-panel--controls{position:static}
  .gpe-facts,.gpe-compare-cards{grid-template-columns:1fr}
}
@media(max-width:650px){
  .gpe-content-v10{width:min(100% - 20px,1180px);padding-top:18px}
  .gc-hero{padding:24px 20px}
  .gc-section-head{display:block}
  .gc-section-head p{margin-top:8px}
  .gpe-fields,.gpe-model-summary{grid-template-columns:1fr}
  .gpe-field--wide,.gpe-subhead{grid-column:auto}
  .gpe-actions{grid-template-columns:1fr}
  .gpe-reset{grid-column:auto}
}


/* =========================================================
   COMPACT HUB ENTRY
   Reuses the approved v1.2 visual language.
========================================================= */
.gpe-slots-hub-module{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:22px;
  align-items:center;
  margin:28px 0;
  padding:22px 24px;
  border:1px solid var(--gpe-border,#dbe3e8);
  border-radius:18px;
  background:
    radial-gradient(circle at 92% 20%,rgba(23,124,122,.12),transparent 16rem),
    #fff;
  box-shadow:var(--gpe-shadow,0 12px 34px rgba(18,42,58,.08));
}
.gpe-slots-hub-copy>span{
  display:inline-block;
  margin-bottom:6px;
  color:var(--gpe-teal,#177c7a);
  font-size:11px;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.gpe-slots-hub-copy h2{
  margin:0 0 7px;
  color:var(--gpe-navy,#17324a);
  font-size:clamp(21px,3vw,29px);
  line-height:1.2;
}
.gpe-slots-hub-copy p{
  margin:0;
  color:var(--gpe-muted,#647482);
  line-height:1.65;
}
.gpe-slots-hub-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:11px 17px;
  border-radius:11px;
  background:var(--gpe-blue,#1f6fa8);
  color:#fff!important;
  font-weight:900;
  text-decoration:none!important;
  white-space:nowrap;
}
@media(max-width:700px){
  .gpe-slots-hub-module{grid-template-columns:1fr}
  .gpe-slots-hub-button{width:100%;box-sizing:border-box}
}