/* Cage Grind's clean GitHub-inspired blue/steel presentation layer. */
:root {
  --bg: #0d1117;
  --panel: #161b22;
  --panel2: #21262d;
  --line: #30363d;
  --text: #f0f6fc;
  --muted: #8b949e;
  --red: #2f81f7;
  --red2: #1f6feb;
  --gold: #79c0ff;
  --green: #3fb950;
  --blue: #58a6ff;
  --purple: #a5a9f0;
  --cta-text: #fff;
  --cta-weight: 700;
  --cta-shadow: none;
  --button-primary: #1f6feb;
  --button-primary-border: #388bfd;
  --button-primary-shadow: 0 1px 0 #010409;
  --button-secondary: #21262d;
  --button-secondary-border: #484f58;
  --button-secondary-shadow: 0 1px 0 #010409;
  --fighter-accent: #58a6ff;
  --dialog-border: var(--line);
  --dialog-surface: var(--panel);
  --button-danger: #b62324;
  --button-danger-border: #f85149;
  --button-reward: #35cf7c;
  --button-reward-hover: #4bdd8d;
  --button-reward-border: #66e69f;
  --button-reward-text: #052014;
}

html, body { background:#010409; color:var(--text) }
.fight-rank-avatar{position:relative}
.fight-rank-avatar .fight-country-badge{position:absolute;right:2px;bottom:2px;z-index:2;padding:2px;border-radius:3px;background:#07111be6;pointer-events:none}
.fight-rank-avatar .fight-country-badge img{width:16px;height:11px;object-fit:contain;border-radius:0}
#healthHud{--health-tier-color:var(--attribute-cardio);--health-tier-start:#3fae5c}
#healthHud[data-health-tier="bruised"]{--health-tier-color:#e7d45b;--health-tier-start:#c2ab38}
#healthHud[data-health-tier="battered"]{--health-tier-color:#f0b44e;--health-tier-start:#cf902c}
#healthHud[data-health-tier="banged-up"]{--health-tier-color:#ee8846;--health-tier-start:#cf632f}
#healthHud[data-health-tier="not-cleared"]{--health-tier-color:#f16b70;--health-tier-start:#cf424d}
#healthHud #hudHealthLabel,#healthHud #hudHealthText{color:var(--health-tier-color)}
#healthHud #hudHealthBar{background:linear-gradient(90deg,var(--health-tier-start),var(--health-tier-color));box-shadow:none}
button, input, select, textarea { font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif }
button { transition:background-color .12s ease,border-color .12s ease,color .12s ease,transform .12s ease }
button:focus-visible, a:focus-visible, [tabindex]:focus-visible { outline:2px solid #58a6ff; outline-offset:2px }
#app { border-color:var(--line); background:var(--bg) }
#app::before { display:none }
.topbar, .bottom-nav { border-color:var(--line); background:#161b22; box-shadow:0 1px 0 #010409 }
.resource-hud { border-color:#1f2937; background:#0d1117 }
.resource-hud.is-stuck { box-shadow:0 4px 10px rgb(0 0 0 / 38%),0 1px 0 rgb(64 154 255 / 12%) }
.logo { filter:drop-shadow(0 2px 2px #010409) }
.identity .name, .career-progress-summary>b, .top-progress b { font-weight:700 }
.identity .sub, .top-progress, .career-progress-summary .top-progress b { color:#8c9aa8 }
.card, .choice, .opponent, .gear, .action, .social-post, .modal-dialog, .result-card { border-color:var(--line); background-color:var(--panel); box-shadow:none }
.hud-resource span, .hud-attribute span, .card small, .choice p, .gear p { color:var(--muted) }
.hud-meter, .hud-attribute .mini { border-color:transparent; background:#1a2230; box-shadow:none }
.main, .screen, .fight-screen, .gear-screen, .feed-screen { background-color:var(--bg) }
.card-title, .shop-head, .opponents-head, .fight-section-head { border-color:var(--line); background:var(--panel2) }
.page-subhead, .home-profile-section-heading { border-color:var(--line); background:#0d1117 }
.page-footer, .home-coach-footer, .gear-card-footer, .fight-ladder-footer, .feed-action-dock { border-color:var(--line); background:#161b22 }
.choice, .opponent, .gear, .action, .social-post { background-image:none }
.opponent.ranked, .opponent.recommended { border-color:#388bfd }
.bottom-nav .navbtn { border-color:transparent; background:transparent; color:#8b949e; box-shadow:none }
.bottom-nav .navbtn.active { border-color:#388bfd; background:#0d419d; color:#fff }
.install-offer button:not(:disabled), .fight-btn:not(:disabled), .tape-action.fight:not(:disabled), .continue-btn, .modal-run:not(:disabled), .fighter-message-send:not(:disabled), .attribute-assign-btn:not(:disabled) { border-color:var(--button-primary-border)!important; background:var(--button-primary)!important; color:#fff!important; box-shadow:var(--button-primary-shadow)!important; text-shadow:none!important }
.details-toggle, .modal-cancel, .gear-footer button, .share-win-btn { border-color:var(--button-secondary-border)!important; background:var(--button-secondary)!important; color:#f0f6fc!important; box-shadow:var(--button-secondary-shadow)!important; text-shadow:none!important }
button:disabled { border-color:#30363d!important; background:#161b22!important; color:#6e7681!important; box-shadow:none!important }
.retire-career-btn, .retire-confirm { border-color:var(--button-danger-border)!important; background:var(--button-danger)!important; color:#fff!important; box-shadow:0 1px 0 #010409!important; text-shadow:none!important }

/* Shared actions: geometry and interaction states; secondary/destructive materials above. */
:root{--action-height:44px;--action-font:11px;--action-weight:700;--action-radius:8px;--action-padding:10px 12px}
:is(.feed-action-grid button,.spar-action-dock .spar-start-btn,.spar-scout-selection .spar-fighter-picker,.fight-plan-card .fight-plan-confirm,.modal-overlay .modal-run,.modal-overlay .modal-cancel,.modal-overlay .retire-confirm,.level-up-continue){
  box-sizing:border-box;min-height:var(--action-height);padding:var(--action-padding);border:1px solid var(--button-primary-border);border-radius:var(--action-radius);
  background:var(--button-primary);color:var(--cta-text);box-shadow:var(--button-primary-shadow);text-shadow:none;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:var(--action-weight);line-height:20px;letter-spacing:.35px;text-align:center;cursor:pointer;
}
#app .screen :is(.spar-start-btn,.spar-fighter-picker),#app .screen .feed-action-grid button,#app .screen .feed-action-grid button b{
  font-size:var(--action-font)!important;font-weight:var(--action-weight);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:20px;letter-spacing:.35px;
}
.feed-action-grid button{--action-height:32px;--action-padding:5px 12px}
.fight-plan-card .fight-plan-confirm,.modal-overlay :is(.modal-run,.modal-cancel,.retire-confirm),.level-up-continue{font-size:13px!important}
:is(.feed-action-grid button,.spar-action-dock .spar-start-btn,.spar-scout-selection .spar-fighter-picker,.fight-plan-card .fight-plan-confirm,.modal-overlay .modal-run,.modal-overlay .modal-cancel,.modal-overlay .retire-confirm,.level-up-continue):focus-visible{
  outline:2px solid var(--blue);outline-offset:2px;
}
:is(.feed-action-grid button,.spar-action-dock .spar-start-btn,.spar-scout-selection .spar-fighter-picker,.fight-plan-card .fight-plan-confirm,.modal-overlay .modal-run,.modal-overlay .modal-cancel,.modal-overlay .retire-confirm,.level-up-continue):active:not(:disabled){
  transform:translateY(1px);box-shadow:var(--button-primary-shadow);
}
:is(.feed-action-grid button,.spar-action-dock .spar-start-btn,.spar-scout-selection .spar-fighter-picker,.fight-plan-card .fight-plan-confirm,.modal-overlay .modal-run,.modal-overlay .modal-cancel,.modal-overlay .retire-confirm,.level-up-continue):disabled{
  opacity:.45;filter:none;cursor:not-allowed;box-shadow:none;
}
@media(hover:hover){
  :is(.feed-action-grid button,.spar-action-dock .spar-start-btn,.spar-scout-selection .spar-fighter-picker,.fight-plan-card .fight-plan-confirm,.modal-overlay .modal-run,.modal-overlay .modal-cancel,.modal-overlay .retire-confirm,.level-up-continue):hover:not(:disabled){filter:brightness(1.08)}
}

@media (hover:hover) and (pointer:fine) {
  .choice, .opponent, .gear, .social-action { transition:border-color .12s ease,background-color .12s ease,transform .12s ease }
  .choice:hover, .opponent:hover, .gear:hover, .social-action:hover { transform:translateY(-1px); border-color:#58a6ff }
}
.choice:active, .opponent:active, .social-action:active, button:active:not(:disabled) { transform:translateY(1px) }
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { scroll-behavior:auto!important; transition-duration:.01ms!important; animation-duration:.01ms!important; animation-iteration-count:1!important }
}

/* Winner is a fight stage, reusing the promo card, tools, actions and billing. */
#winnerStage{overflow:hidden}
#winnerStage .result-outcome-stage{display:block;padding:11px 8px 14px;--player-accent:#57c8ea;--opponent-accent:#57c8ea;text-align:center}
.winner-art-frame{position:relative;z-index:2;width:100%;height:clamp(180px,38dvh,360px);margin:0 auto;overflow:hidden}
#resultWinnerArt{display:block;width:auto;max-width:100%;height:100%;margin:0 auto;object-fit:contain;object-position:center bottom;-webkit-mask-image:linear-gradient(90deg,transparent,#000 15%,#000 85%,transparent),linear-gradient(180deg,#000 75%,transparent);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent,#000 15%,#000 85%,transparent),linear-gradient(180deg,#000 75%,transparent);mask-composite:intersect}
#winnerStage #resultTitle{margin:0;color:#fff;font-family:"Bebas Neue",Impact,sans-serif;font-size:clamp(48px,14vw,80px);line-height:1;letter-spacing:3px;text-shadow:0 3px 8px #000}
#winnerStage #resultVerdict{font-size:13px;font-weight:800;letter-spacing:2px;color:#a1ddf1}
#winnerStage #resultVerdict.is-loss{color:#ff666b;font-size:20px;font-weight:900;letter-spacing:2px;text-shadow:0 2px 4px #000,0 0 12px #b619294d}
#winnerStage .matchup-poster-title{margin-top:-10px}
#winnerStage .matchup-poster-billing{margin:12px 0 4px}
#winnerStage #resultMethod{border:0;border-radius:0;background:none;padding:0;box-shadow:none;white-space:normal;line-height:1.5}
#winnerStage .tape-actions{grid-template-columns:1fr}
#winnerStage .matchup-tool[hidden],#resultModal [hidden]{display:none!important}
#winnerStage .result-damage,#winnerStage .personal-best-stamps{position:relative;z-index:3}
#resultModal .result-card{overflow-x:hidden}
#resultScorecardClose{width:100%;margin-bottom:12px}
#walkoutModal{z-index:105;background:#01070cdd}
.walkout-dialog{text-align:center;border-color:#4384a4;min-height:min(440px,80dvh);display:flex;flex-direction:column;justify-content:flex-end;background:linear-gradient(180deg,#0208100d 15%,#02081066 45%,#020810eb 85%),url("../assets/to-the-cage-walkout.png?v=2.7.222") center/cover no-repeat #09131e;text-shadow:0 2px 8px #000}
.walkout-dialog>small{color:#8edfff;letter-spacing:1px}
.walkout-dialog:before,.walkout-dialog:after{content:"";position:absolute;width:5px;height:5px;border-radius:50%;pointer-events:none;opacity:0;background:#eaf8ff;box-shadow:0 0 5px 2px #c7eaff99,0 0 12px 4px #9fd6ff33}
#walkoutModal.open .walkout-dialog:before{animation:walkoutCameraLeft var(--walkout-duration,3s) linear both}
#walkoutModal.open .walkout-dialog:after{animation:walkoutCameraRight var(--walkout-duration,3s) linear both}
@keyframes walkoutCameraLeft{0%,8%{left:9%;top:27%;opacity:0}9%{opacity:.75}11%,37%{left:9%;top:27%;opacity:0}38%{left:18%;top:34%;opacity:0}39%{opacity:.65}41%,76%{left:18%;top:34%;opacity:0}77%{left:6%;top:39%;opacity:0}78%{opacity:.7}80%,100%{left:6%;top:39%;opacity:0}}
@keyframes walkoutCameraRight{0%,23%{right:12%;top:32%;opacity:0}24%{opacity:.65}26%,58%{right:12%;top:32%;opacity:0}59%{right:7%;top:24%;opacity:0}60%{opacity:.75}62%,89%{right:7%;top:24%;opacity:0}90%{right:17%;top:38%;opacity:0}91%{opacity:.6}93%,100%{right:17%;top:38%;opacity:0}}
@media(prefers-reduced-motion:reduce){#walkoutModal .walkout-dialog:before,#walkoutModal .walkout-dialog:after{display:none;animation:none!important}}
#walkoutModal #walkoutTitle{font-family:"Segoe UI",system-ui,sans-serif;font-size:27px!important;font-weight:800;line-height:1.12;letter-spacing:.6px;min-height:64px;display:grid;align-content:center;margin:15px 0 0}
#walkoutModal #walkoutMessage{font-size:13px!important;min-height:64px;display:grid;align-items:center;line-height:1.5;color:#b5c9d7;margin:10px 0 20px}
#walkoutProgress{height:10px;overflow:hidden;border:1px solid #37566c;border-radius:999px;background:#040b11}
#walkoutProgress i{display:block;width:0;height:100%;background:linear-gradient(90deg,#258fd2,#8fe5ff)}
#walkoutModal.open #walkoutProgress i{animation:walkoutFill var(--walkout-duration,3s) linear forwards}
@keyframes walkoutFill{to{width:100%}}
@media(prefers-reduced-motion:reduce){#walkoutModal.open #walkoutProgress i{animation:none!important;width:100%}}
.home-fight-history,.home-fight-skin .entrance-music{margin:12px;border:1px solid #365269;border-radius:10px;background:linear-gradient(145deg,#0d2232,#08121c);overflow:hidden}
.home-fight-history>summary,.home-fight-skin .entrance-music>summary{padding:12px;min-height:52px;border:0;background:transparent}
.home-fight-history[open]>summary,.home-fight-skin .entrance-music[open]>summary{border-bottom:1px solid #304555;background:#112432}
.home-fight-history>summary{display:flex;align-items:center;flex-wrap:wrap;gap:6px;color:#b6ddeb}
.home-fight-history>summary>b{flex:1}
.home-fight-history>summary:focus-visible{outline:2px solid #80d6f5;outline-offset:-3px}
.home-fight-history .fight-history-entry:last-child{border-bottom:0}
.home-fight-skin .entrance-music .locker-music-controls{padding:12px;margin:0;border:0}
.home-fight-skin .entrance-music .home-music-preview{margin:0 12px 12px;padding:12px 0 0;border-top:1px solid #304555}
.profile-header-record{display:flex;flex-direction:column;align-items:flex-end;gap:2px;flex-shrink:0;text-align:right;white-space:nowrap}
.profile-header-record>b{font-variant-numeric:tabular-nums;color:#f0f6fc}
.profile-header-record>small{color:#8b949e;letter-spacing:.6px}
#lockerMusicToggle{display:inline-flex;align-items:center;justify-content:center;gap:6px}
#lockerMusicToggle .ti{font-size:16px}
.ti-music,.ti-music-off{display:inline-block;width:1em;height:1em;flex-shrink:0;background:currentColor;-webkit-mask:var(--music-icon) center/contain no-repeat;mask:var(--music-icon) center/contain no-repeat}
.ti-music{--music-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18V5l12-2v13M9 9l12-2'/%3E%3Cellipse cx='6' cy='18' rx='3' ry='3'/%3E%3Cellipse cx='18' cy='16' rx='3' ry='3'/%3E%3C/svg%3E")}
.ti-music-off{--music-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 9v9M9 5l12-2v13M13 8l8-1M3 3l18 18'/%3E%3Cellipse cx='6' cy='18' rx='3' ry='3'/%3E%3Cpath d='M15 16a3 3 0 0 0 5 2'/%3E%3C/svg%3E")}
#lockerMusicVolume:disabled{opacity:.4;cursor:not-allowed}
/* Rewards, supporting context, then progress: keep each zone distinct. */
#resultModal .result-rewards-title{color:#ffe29a;text-shadow:0 0 12px #e4ba4633}
#resultModal #rewardFans{font-size:clamp(21px,6vw,27px)!important;text-shadow:0 0 10px #4be47726}
#resultModal .rewardbox.non-positive #rewardFans{text-shadow:none}
#resultModal .result-bonuses{margin:14px 0 0}
.result-context-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid #344451;border-radius:9px;background:#0b1520;overflow:hidden;text-transform:none}
.result-context-item{min-width:0;padding:10px 6px;text-align:center}
.result-context-item+.result-context-item{border-left:1px solid #344451}
.result-context-item small,.result-context-item b{display:block;overflow-wrap:anywhere;line-height:1.35}
.result-context-item small{color:#9eafbd;letter-spacing:.3px}
.result-context-item b{margin-top:4px;color:#e4edf4}
.result-context-item.non-positive b{color:#ff737b}
#resultModal .result-bonus-row{padding:5px 3px}
#resultModal .daily-heat-result{margin-top:18px;position:relative}
#resultModal .daily-heat-result:before{content:"";position:absolute;top:-10px;left:0;right:0;border-top:1px solid #62768933}
#resultModal .daily-heat-result-pips i{height:9px;border-radius:5px}
#resultModal .victory-pack-result-track{height:10px}
#resultModal .result-actions{margin-top:18px}
#resultModal #continueBtn{font-family:"Segoe UI",system-ui,sans-serif;min-height:48px;border-radius:12px;font-size:16px!important;background:var(--button-reward)!important;border:1px solid var(--button-reward-border)!important;color:var(--button-reward-text)!important;box-shadow:0 2px 10px #1ba85e26!important;font-weight:800}
#resultModal #continueBtn:hover:not(:disabled){background:var(--button-reward-hover)!important}
#resultModal #continueBtn:disabled{opacity:.5;background:var(--panel)!important;border-color:var(--line)!important;color:var(--muted)!important;box-shadow:none!important;cursor:not-allowed}
/* Match the roomier supplied rewards reference without changing other modals. */
#resultModal .result-card.showing-rewards{padding:22px 18px 18px;border-radius:18px}
#resultRewardsStage,#resultRewardsStage button,#resultRewardsStage b,#resultRewardsStage small,#resultRewardsStage strong,#resultRewardsStage footer{font-family:"Segoe UI",system-ui,sans-serif}
#resultModal .result-rewards-title{font-family:"Segoe UI",system-ui,sans-serif;font-size:21px!important;font-weight:800;letter-spacing:1px;margin:0 0 18px}
#resultRewardsStage .rewards{border-radius:12px;margin-bottom:18px;background:#ffffff05}
#resultRewardsStage .rewardbox{padding:14px 6px}
#resultRewardsStage .rewardbox>b{font-size:20px}
#resultRewardsStage .rewardbox small{white-space:normal;margin-top:4px;font-weight:600}
#resultRewardsStage .result-context-strip{display:flex;background:#ffffff04;padding:10px 4px;border-color:#ffffff12;border-radius:10px}
#resultRewardsStage .result-context-item{flex:1;padding:2px 5px}
#resultRewardsStage .result-context-item b{font-size:13px!important;font-weight:700;margin:3px 0}
#resultRewardsStage .result-context-item small{font-size:10px!important;font-weight:500;color:#93a0b4}
.result-context-icon{display:block;font-size:14px;line-height:1.3}
#resultRewardsStage .daily-heat-result,#resultRewardsStage .victory-pack-progress{padding:14px;border-radius:12px;margin-top:20px}
#resultRewardsStage .daily-heat-result b{white-space:normal;font-size:15px!important;font-weight:800}
#resultRewardsStage .daily-heat-result footer,#resultRewardsStage .victory-pack-progress small{font-size:11px!important;line-height:1.45;font-weight:500}
#resultRewardsStage .daily-heat-result header strong{font-size:20px!important}
#resultRewardsStage .victory-pack-result-head{gap:10px;font-size:15px!important}
#resultRewardsStage .victory-pack-result-head b{font-size:20px!important}
#resultRewardsStage .result-actions{margin-top:22px}

@media(max-height:600px){.winner-art-frame{height:clamp(100px,25dvh,160px)}#winnerStage #resultTitle{font-size:42px}}
/* Daily CEO modal: summary, tip, and shared single-action footer. */
#app #dailyCageNews .daily-news-dialog{width:100%;max-width:420px;padding:0;border:1px solid var(--line);border-radius:12px;background:var(--panel);color:var(--text);max-height:calc(100dvh - 28px);overflow-y:auto}
#app #dailyCageNews[hidden]{display:none!important}
#app #dailyCageNews header{display:flex;align-items:center;gap:12px;padding:16px;border-bottom:1px solid var(--line)}
#app #dailyCageNews header>div{min-width:0;flex:1}
#app #dailyCageNews .daily-news-ceo{width:56px;height:56px;flex:none;border:1px solid #8a713b;border-radius:50%;object-fit:cover;object-position:50% 28%}
#app #dailyCageNews h2{margin:0 0 3px;font:700 15px/1.3 system-ui,sans-serif!important;text-transform:none;overflow-wrap:anywhere;color:var(--text)}
#app #dailyCageNews header small{display:block;color:var(--muted);font-size:10px!important;letter-spacing:.5px}
#app #dailyCageNews [data-news-close]{flex:none;align-self:flex-start;min-width:44px;min-height:44px;padding:0;border:0;border-radius:8px;background:transparent;box-shadow:none;color:var(--muted);font-size:24px!important;cursor:pointer}
#app #dailyCageNews [data-news-close]:hover{background:var(--panel2);color:var(--text)}
#app #dailyCageNews .daily-news-body{padding:16px}
#app #dailyCageNews p{margin:0;color:var(--text);font:400 14px/1.6 system-ui,sans-serif!important;text-align:left;overflow-wrap:anywhere}
#app #dailyCageNews .daily-news-tip{margin-top:18px;padding:12px;border-left:3px solid var(--blue);border-radius:0 6px 6px 0;background:var(--bg)}
#app #dailyCageNews .daily-news-tip b{color:var(--blue);font-size:10px!important;letter-spacing:1px}
#app #dailyCageNews .daily-news-tip p{margin-top:5px;font-size:13px!important}