*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#f8f5ff;font-family:Inter,system-ui,sans-serif}
body{overscroll-behavior:none}
button{font:inherit}
.app{width:100%}
.app.blind-fixed-world{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:390px!important;
  max-width:none!important;
  height:844px!important;
  min-height:0!important;
  max-height:none!important;
  margin:0!important;
  flex:none!important;
  transform:translate(-50%,-50%) scale(var(--blind-camera-scale,1));
  transform-origin:center
}
.app.blind-fixed-world .blind-stage,
.rodeo-stage-slot>.app.blind-fixed-world .blind-stage{
  width:100%!important;
  max-width:none!important;
  height:100%!important;
  min-height:0!important;
  max-height:none!important;
  margin:0!important;
  border-radius:24px!important
}
body.rodeo-game-skinned .rodeo-stage-slot{
  position:relative;
  display:grid!important;
  place-items:center!important;
  padding:0!important;
  overflow:hidden;
  background:
    linear-gradient(90deg,rgba(4,2,24,.8),rgba(11,7,44,.18) 35%,rgba(11,7,44,.18) 65%,rgba(4,2,24,.8)),
    url("imports/blind-shot/runtime/background.webp") center/cover no-repeat,
    #07162d;
  box-shadow:inset 0 0 100px rgba(0,0,0,.64)
}
.blind-stage{
  position:relative;
  width:100%;
  max-width:620px;
  height:900px;
  min-height:760px;
  margin:0 auto;
  overflow:hidden;
  border-radius:28px;
  background:#07162d;
  isolation:isolate;
  touch-action:none;
  user-select:none;
  -webkit-user-select:none;
  box-shadow:0 22px 60px rgba(19,6,55,.28)
}
#blindCanvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}
.blind-stage::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:4;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(2,8,23,.34),transparent 23%,transparent 75%,rgba(2,8,23,.38));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)
}
.duel-hud{
  position:absolute;
  z-index:12;
  top:10px;
  left:10px;
  right:10px;
  display:grid;
  grid-template-columns:1fr 56px 1fr;
  gap:7px;
  align-items:start;
  min-height:66px;
  padding:8px 12px 7px;
  background:url("imports/blind-shot/runtime/vs-bar.webp") center top/100% 64px no-repeat;
  pointer-events:none
}
.fighter-card{
  position:relative;
  min-width:0;
  padding:4px 7px 4px;
  border:0;
  border-radius:16px;
  color:#fff;
  background:transparent;
  box-shadow:none;
  text-align:center
}
.merchant-fighter-avatar{position:absolute;left:4px;top:50%;width:28px;height:28px;overflow:hidden;border:1.5px solid #57e8f0;border-radius:50%;display:none;place-items:center;transform:translateY(-50%);background:#0a3452;color:#fff;font:900 11px/1 Inter}
.enemy-card .merchant-fighter-avatar{left:auto;right:4px;border-color:#ff9b8d;background:#4a1830}
.merchant-fighter-avatar.is-active{display:grid}
.merchant-fighter-avatar img{width:100%;height:100%;object-fit:cover}
.merchant-fighter-avatar b{font:inherit}
.enemy-card{background:transparent;text-align:center}
.fighter-label{display:block;color:#91d8ff;font:900 7px/1 Inter;letter-spacing:.18em}
.enemy-card .fighter-label{color:#ffac9f}
.fighter-name{display:block;overflow:hidden;margin-top:3px;font:900 14px/1 "Roboto Condensed",Inter;text-overflow:ellipsis;white-space:nowrap}
.fighter-name-row{display:flex;align-items:center;justify-content:center;gap:5px;min-width:0}
.player-card .fighter-name-row{justify-content:center}
.rival-tier{
  flex:none;
  margin-top:3px;
  padding:3px 4px 2px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:999px;
  color:#ffe4e6;
  background:rgba(255,255,255,.1);
  font:900 5px/1 Inter;
  letter-spacing:.08em
}
.rival-tier[data-tier="hunter"]{color:#fde68a;border-color:rgba(251,191,36,.48);background:rgba(180,83,9,.24)}
.rival-tier[data-tier="elite"]{color:#fff;border-color:rgba(251,113,133,.72);background:#be123c;box-shadow:0 0 10px rgba(244,63,94,.62)}
.hearts{display:flex;justify-content:center;gap:4px;margin-top:7px}
.enemy-card .hearts{justify-content:center}
.heart{
  width:20px;
  height:17px;
  flex:none;
  background:url("imports/blind-shot/runtime/heart.webp") center/contain no-repeat;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.3));
  transition:transform .35s cubic-bezier(.2,.9,.25,1),filter .35s ease
}
.heart::before{display:none}
.heart.lost{background-image:url("imports/blind-shot/runtime/heart-empty.webp");filter:grayscale(.25) drop-shadow(0 1px 2px rgba(0,0,0,.24));transform:scale(.88)}
.round-medallion{
  width:56px;
  height:52px;
  display:grid;
  place-content:center;
  border:0;
  border-radius:50%;
  color:#fff;
  background:url("imports/blind-shot/runtime/vs.webp") center/contain no-repeat;
  filter:drop-shadow(0 8px 12px rgba(0,0,0,.34));
  box-shadow:none;
  text-align:center;
  text-shadow:0 2px 4px #000
}
.round-medallion span{margin-top:5px;font:900 5px/1 Inter;letter-spacing:.14em}
.round-medallion strong{margin-top:1px;color:#fcd34d;font:900 15px/1 "Roboto Condensed",Inter}
.phase-banner{
  position:absolute;
  z-index:11;
  top:88px;
  left:50%;
  width:max-content;
  max-width:calc(100% - 30px);
  padding:9px 18px 10px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:16px;
  color:#fff;
  background:rgba(4,14,35,.78);
  box-shadow:0 12px 30px rgba(0,0,0,.25);
  text-align:center;
  transform:translateX(-50%);
  pointer-events:none;
  backdrop-filter:blur(12px);
  transition:opacity .25s ease,transform .35s cubic-bezier(.2,.9,.2,1)
}
.phase-banner.is-pop{animation:phase-pop .42s cubic-bezier(.16,1.1,.3,1)}
.phase-banner[data-tone="danger"]{border-color:rgba(251,113,133,.58);box-shadow:0 0 32px rgba(239,68,68,.22)}
.phase-banner[data-tone="safe"]{border-color:rgba(74,222,128,.58);box-shadow:0 0 32px rgba(34,197,94,.2)}
.phase-banner span{display:block;color:#9cdcff;font:900 7px/1 Inter;letter-spacing:.18em}
.phase-banner[data-tone="danger"] span{color:#fecdd3}
.phase-banner[data-tone="safe"] span{color:#bbf7d0}
.phase-banner strong{display:block;margin-top:4px;font:1000 28px/.9 "Roboto Condensed",Inter;text-shadow:0 3px 0 rgba(0,0,0,.4)}
.phase-banner small{display:block;margin-top:6px;color:#dbeafe;font:700 8px/1.3 Inter}
@keyframes phase-pop{0%{opacity:0;transform:translateX(-50%) scale(.72) translateY(-8px)}65%{opacity:1;transform:translateX(-50%) scale(1.05)}100%{transform:translateX(-50%) scale(1)}}
.ammo-chip{
  position:absolute;
  z-index:10;
  right:10px;
  top:160px;
  display:flex;
  align-items:center;
  gap:7px;
  padding:7px 9px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:999px;
  color:#fff;
  background:rgba(3,12,31,.76);
  pointer-events:none;
  backdrop-filter:blur(10px)
}
.ammo-chip.spent{opacity:.5}
.ammo-chip strong{font:900 7px/1 Inter;letter-spacing:.12em}
.bullet-icon{position:relative;width:18px;height:7px;border-radius:4px 60% 60% 4px;background:linear-gradient(90deg,#f59e0b,#fde68a 55%,#fff7c2)}
.bullet-icon::before{content:"";position:absolute;left:-4px;top:0;width:5px;height:7px;border-radius:2px 0 0 2px;background:#b45309}
.start-layer,.result-layer{
  position:absolute;
  inset:0;
  z-index:40;
  display:grid;
  place-items:center;
  padding:22px;
  background:radial-gradient(circle at 50% 37%,rgba(14,165,233,.2),transparent 28%),rgba(2,8,23,.78);
  backdrop-filter:blur(9px);
  transition:opacity .35s ease
}
.start-layer.hidden{opacity:0;pointer-events:none}
.start-card,.result-card{
  width:100%;
  padding:26px 22px 22px;
  border:1px solid rgba(125,211,252,.5);
  border-radius:28px;
  color:#fff;
  background:linear-gradient(145deg,rgba(7,32,63,.97),rgba(23,22,65,.97));
  box-shadow:0 24px 70px rgba(0,0,0,.46),0 0 44px rgba(14,165,233,.15);
  text-align:center
}
.scope-mark{
  position:relative;
  width:74px;
  height:74px;
  margin:0 auto 13px;
  border:3px solid #67e8f9;
  border-radius:50%;
  box-shadow:0 0 24px rgba(34,211,238,.5),inset 0 0 20px rgba(34,211,238,.16)
}
.scope-mark::before,.scope-mark::after{content:"";position:absolute;background:#fbbf24;box-shadow:0 0 12px rgba(251,191,36,.7)}
.scope-mark::before{left:50%;top:-9px;width:2px;height:88px;transform:translateX(-50%)}
.scope-mark::after{top:50%;left:-9px;width:88px;height:2px;transform:translateY(-50%)}
.scope-mark i{position:absolute;left:50%;top:50%;width:7px;height:7px;border-radius:50%;background:#fb7185;box-shadow:0 0 12px #fb7185;transform:translate(-50%,-50%)}
.kicker{margin:0;color:#7dd3fc;font:900 8px/1 Inter;letter-spacing:.2em}
.start-card h1,.result-card h2{margin:8px 0 10px;font:1000 37px/.9 "Roboto Condensed",Inter;text-shadow:0 3px 0 #172554,0 0 22px rgba(56,189,248,.32)}
.start-card>p:not(.kicker),.result-card>p:not(.kicker){margin:0 auto;color:#d5e7f7;font:700 11px/1.5 Inter}
.rule-row{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:18px 0 14px}
.rule-row span{padding:9px 4px;border:1px solid rgba(255,255,255,.12);border-radius:13px;color:#b9d5e9;background:rgba(255,255,255,.05);font:800 8px/1 Inter}
.rule-row b{display:block;margin-bottom:4px;color:#fcd34d;font:1000 19px/1 "Roboto Condensed",Inter}
.start-button,.result-button{width:100%;margin-top:4px;cursor:pointer}
.start-card>small{display:block;margin-top:10px;color:#7f9caf;font:700 7px/1.3 Inter}
.scope-help{
  position:absolute;
  z-index:14;
  left:50%;
  bottom:26px;
  display:none;
  padding:8px 15px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px;
  color:#dbeafe;
  background:rgba(3,12,31,.72);
  text-align:center;
  transform:translateX(-50%);
  pointer-events:none;
  backdrop-filter:blur(9px)
}
.scope-help.show{display:block;animation:help-in .4s ease both}
.scope-help span{display:block;font:800 6px/1 Inter;letter-spacing:.16em}
.scope-help strong{display:block;margin-top:3px;color:#fcd34d;font:900 9px/1 Inter}
@keyframes help-in{from{opacity:0;transform:translate(-50%,8px)}to{opacity:1;transform:translate(-50%,0)}}
.result-layer{display:none;background:rgba(2,8,23,.75)}
.blind-stake-controls{width:100%;margin:12px 0 9px}
.blind-stake-controls .rsp-picker{padding:6px!important;border-radius:14px!important}
.blind-stake-controls .rsp-option{min-height:43px!important}
.blind-stake-controls .rsp-included{font-size:6.5px!important}
.phase-banner.hide-pressure{
  border-color:rgba(248,113,113,calc(.3 + var(--hide-pressure,0) * .65));
  background:
    linear-gradient(rgba(130,12,34,calc(var(--hide-pressure,0) * .78)),
      rgba(130,12,34,calc(var(--hide-pressure,0) * .78))),
    linear-gradient(135deg,rgba(9,16,42,.94),rgba(15,23,42,.94));
  box-shadow:
    0 14px 35px rgba(2,6,23,.35),
    0 0 calc(8px + var(--hide-pressure,0) * 28px)
      rgba(239,68,68,calc(var(--hide-pressure,0) * .65));
  transform:translateX(-50%) scale(calc(1 + var(--hide-pressure,0) * .035))
}
.phase-banner.hide-pressure strong{
  color:#fff;
  text-shadow:0 0 calc(3px + var(--hide-pressure,0) * 15px) rgba(255,50,80,.9)
}
.result-layer.show{display:grid}
.result-card{animation:result-in .45s cubic-bezier(.16,1.05,.24,1) both}
.result-card.loss{border-color:rgba(251,113,133,.64);background:linear-gradient(145deg,rgba(62,17,45,.97),rgba(22,16,49,.97))}
.result-card h2{
  color:#fff!important;
  background:none!important;
  -webkit-text-fill-color:#fff!important;
  text-shadow:0 3px 0 #172554,0 0 22px rgba(255,255,255,.22)!important
}
.result-card .kicker{color:#bae6fd!important;-webkit-text-fill-color:#bae6fd!important}
.result-card>p:not(.kicker){color:#eaf6ff!important;-webkit-text-fill-color:#eaf6ff!important}
.result-card.loss h2{color:#fff!important;-webkit-text-fill-color:#fff!important}
.result-card.loss .kicker{color:#fecdd3!important;-webkit-text-fill-color:#fecdd3!important}
.result-card .result-stats small{color:#c7e7f7!important;-webkit-text-fill-color:#c7e7f7!important}
.result-card .result-stats strong{color:#fff!important;-webkit-text-fill-color:#fff!important}
.result-emblem{
  width:68px;
  height:68px;
  display:grid;
  place-items:center;
  margin:0 auto 12px;
  border-radius:22px;
  color:#07223d;
  background:linear-gradient(145deg,#67e8f9,#fef08a);
  box-shadow:0 0 30px rgba(103,232,249,.38);
  font:1000 31px/1 "Roboto Condensed",Inter
}
.result-card.loss .result-emblem{background:linear-gradient(145deg,#fecdd3,#fb7185)}
.result-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:18px 0 13px}
.result-stats span{padding:10px 3px;border-radius:13px;background:rgba(255,255,255,.06)}
.result-stats small{display:block;color:#8fb2c8;font:800 6px/1 Inter;letter-spacing:.1em}
.result-stats strong{display:block;margin-top:5px;color:#fff;font:1000 17px/1 "Roboto Condensed",Inter}
@keyframes result-in{from{opacity:0;transform:scale(.72) translateY(20px)}to{opacity:1;transform:scale(1)}}
.rotate-note{display:none}
@media (orientation:landscape) and (max-height:500px){
  .rotate-note{position:absolute;z-index:20;right:8px;bottom:8px;display:block;padding:5px 8px;border-radius:999px;color:#dbeafe;background:rgba(3,12,31,.65);font:800 6px/1 Inter}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}
}

/* RODEO package selection lives at the bottom of the game, outside the
   centered start card. */
.start-card,.result-card{max-width:390px}
.blind-stake-dock{
  position:absolute;z-index:45;left:50%;bottom:14px;width:min(620px,calc(100% - 24px));
  transform:translateX(-50%);transition:opacity .24s ease,transform .24s cubic-bezier(.16,1,.3,1)
}
.blind-stake-dock.hidden{opacity:0;pointer-events:none;transform:translate(-50%,12px)}
.blind-stake-controls{width:100%;margin:0}
.start-card .start-button{margin-top:18px}

/* Beat the shared light-card typography override with game-level specificity. */
body.rodeo-game-skinned .rodeo-stage-slot .blind-stage .result-card,
body.rodeo-game-skinned .rodeo-stage-slot .blind-stage .result-card h2,
body.rodeo-game-skinned .rodeo-stage-slot .blind-stage .result-card .kicker,
body.rodeo-game-skinned .rodeo-stage-slot .blind-stage .result-card>p:not(.kicker),
body.rodeo-game-skinned .rodeo-stage-slot .blind-stage .result-card .result-stats small,
body.rodeo-game-skinned .rodeo-stage-slot .blind-stage .result-card .result-stats strong{
  color:#fff!important;-webkit-text-fill-color:#fff!important
}

/* The viewport consumes every available pixel at every shell width. The
   authored 390 px duel stays centered while the one canvas reveals more of
   the same world around it. */
body.rodeo-game-skinned .rodeo-stage-slot>.app.blind-fixed-world{
    position:absolute!important;inset:0!important;left:0!important;top:0!important;
    width:100%!important;height:100%!important;transform:none!important
}
body.rodeo-game-skinned .rodeo-stage-slot>.app.blind-fixed-world .blind-stage{
    width:100%!important;max-width:none!important;height:100%!important;border-radius:0!important
}
#blindCanvas{width:100%;height:100%}
.start-layer{padding:0}
.duel-hud{left:50%;right:auto;width:min(370px,calc(100% - 20px));transform:translateX(-50%)}
.phase-banner{max-width:min(370px,calc(100% - 30px))}
.blind-stake-dock{width:min(366px,calc(100% - 24px))}

/* This is intentionally the same field-start control as Soccer Ball. */
.start-layer{padding:0;background:none;backdrop-filter:none;pointer-events:none}
.start-game-id{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.start{
  height:50px;border:0;border-radius:15px;color:#170f07;background:linear-gradient(180deg,#ffcf28,#ff9f0a);
  font-weight:1000;cursor:pointer;box-shadow:inset 0 -4px rgba(0,0,0,.22),inset 0 0 0 1px rgba(255,255,255,.14);
  text-shadow:0 1px rgba(255,255,255,.45)
}
.rodeo-stage-slot .start.field-start{
  position:absolute;z-index:11;left:50%;top:54%;width:92px;height:92px;transform:translate(-50%,-50%);
  border:2px solid rgba(255,244,179,.9)!important;border-radius:50%!important;color:#fff!important;
  background:radial-gradient(circle at 35% 26%,#ffe66d,#f59e0b 46%,#7c3aed)!important;
  box-shadow:0 0 0 8px rgba(124,58,237,.14),0 0 36px rgba(255,196,0,.72),inset 0 -8px 18px rgba(76,29,149,.38)!important;
  pointer-events:auto;animation:soccer-start-pulse 1s ease-in-out infinite alternate;
  transition:opacity .18s ease,transform .18s ease;font-weight:1000;line-height:1.05
}
.field-start small{display:block;margin-top:4px;font-size:9px}
.rodeo-stage-slot .start.field-start:disabled{opacity:0!important;transform:translate(-50%,-50%) scale(.72)!important;pointer-events:none!important}
@keyframes soccer-start-pulse{
  from{filter:brightness(.94);box-shadow:0 0 0 5px rgba(124,58,237,.12),0 0 23px rgba(255,196,0,.48)}
  to{filter:brightness(1.18);box-shadow:0 0 0 12px rgba(124,58,237,.05),0 0 44px rgba(255,196,0,.85)}
}

/* Merchant Blind Shot keeps the native VS artwork, but the round counter is
   redundant in this compact identity bar. Give each identity a real avatar
   column so long names can never sit underneath the profile photo. */
html[data-rodeo-partner-embed="true"][data-rodeo-partner-game="blind-shot.html"] .duel-hud{
  width:min(480px,calc(100% - 20px));
  grid-template-columns:minmax(0,1fr) 58px minmax(0,1fr);
  gap:5px;
  min-height:74px;
  padding:8px 10px 7px;
  background-size:100% 72px
}
html[data-rodeo-partner-embed="true"][data-rodeo-partner-game="blind-shot.html"] .fighter-card{
  display:grid;
  grid-template-columns:40px minmax(0,1fr);
  grid-template-rows:auto auto 1fr;
  column-gap:7px;
  align-items:center;
  min-height:58px;
  padding:4px 5px;
  text-align:left
}
html[data-rodeo-partner-embed="true"][data-rodeo-partner-game="blind-shot.html"] .merchant-fighter-avatar,
html[data-rodeo-partner-embed="true"][data-rodeo-partner-game="blind-shot.html"] .enemy-card .merchant-fighter-avatar{
  position:static;
  grid-column:1;
  grid-row:1 / 4;
  justify-self:start;
  width:40px;
  height:40px;
  left:auto;
  right:auto;
  top:auto;
  transform:none
}
html[data-rodeo-partner-embed="true"][data-rodeo-partner-game="blind-shot.html"] .fighter-label,
html[data-rodeo-partner-embed="true"][data-rodeo-partner-game="blind-shot.html"] .fighter-name,
html[data-rodeo-partner-embed="true"][data-rodeo-partner-game="blind-shot.html"] .fighter-name-row,
html[data-rodeo-partner-embed="true"][data-rodeo-partner-game="blind-shot.html"] .hearts{
  grid-column:2;
  min-width:0;
  text-align:left
}
html[data-rodeo-partner-embed="true"][data-rodeo-partner-game="blind-shot.html"] .fighter-label{grid-row:1}
html[data-rodeo-partner-embed="true"][data-rodeo-partner-game="blind-shot.html"] .fighter-name,
html[data-rodeo-partner-embed="true"][data-rodeo-partner-game="blind-shot.html"] .fighter-name-row{
  grid-row:2;
  justify-content:flex-start
}
html[data-rodeo-partner-embed="true"][data-rodeo-partner-game="blind-shot.html"] .fighter-name{margin-top:2px}
html[data-rodeo-partner-embed="true"][data-rodeo-partner-game="blind-shot.html"] .hearts,
html[data-rodeo-partner-embed="true"][data-rodeo-partner-game="blind-shot.html"] .enemy-card .hearts{
  grid-row:3;
  justify-content:flex-start;
  gap:2px;
  margin-top:4px
}
html[data-rodeo-partner-embed="true"][data-rodeo-partner-game="blind-shot.html"] .heart{
  width:17px;
  height:15px
}
html[data-rodeo-partner-embed="true"][data-rodeo-partner-game="blind-shot.html"] .round-medallion span,
html[data-rodeo-partner-embed="true"][data-rodeo-partner-game="blind-shot.html"] .round-medallion strong{
  display:none
}
@media (max-width:359px){
  html[data-rodeo-partner-embed="true"][data-rodeo-partner-game="blind-shot.html"] .fighter-card{
    grid-template-columns:34px minmax(0,1fr);
    column-gap:5px;
    padding-inline:3px
  }
  html[data-rodeo-partner-embed="true"][data-rodeo-partner-game="blind-shot.html"] .merchant-fighter-avatar,
  html[data-rodeo-partner-embed="true"][data-rodeo-partner-game="blind-shot.html"] .enemy-card .merchant-fighter-avatar{
    width:34px;
    height:34px
  }
  html[data-rodeo-partner-embed="true"][data-rodeo-partner-game="blind-shot.html"] .fighter-name{font-size:12px}
  html[data-rodeo-partner-embed="true"][data-rodeo-partner-game="blind-shot.html"] .heart{width:15px;height:13px}
}