/* Reversible NoKitty appearance; game logic and canvas remain independent. */
.hero-art { width: calc(100% - 40px); justify-self: start; }
.hero-art .speech-sticker { right: 18px; }
.hero-art .lives-sticker { right: 12px; }
.hero-copy { min-width: 0; }
.holder-bonus { display: block; max-width: 100%; margin-top: 18px; padding: 12px 14px; border-left: 3px solid var(--green); background: #b7f64b0b; color: var(--green); }
.holder-bonus strong { display: block; font: 700 12px/1.7 var(--mono); }
.holder-bonus small { display: block; margin-top: 5px; font: 8px/1.6 var(--mono); color: var(--muted); }
.holder-bonus:hover, .holder-bonus:focus-visible { background: #b7f64b1a; }
#durability .attack-instructions { max-width: 390px; font-size: clamp(16px, 1.7vw, 20px); line-height: 1.6; }
.attack-instructions strong { display: block; color: var(--green); font: 32px/1.1 var(--display); margin-bottom: 10px; }
.attack-instructions span { display: block; }
.hero-actions { flex-wrap: wrap; }
.ticker-track { gap: 0; }
.ticker-track > span { padding-inline: 28px; }
.ticker-track .ticker-dollar { padding-inline: 12px; opacity: .65; }
.arcade-copy h2 { font-size: clamp(44px, 4.6vw, 66px); }
.arcade-copy .arcade-launch-status { color: var(--green); font: 9px/1.6 var(--mono); margin-top: 14px; }
.arcade-reward-callout { border: 0; box-shadow: none; background: transparent; padding: 0; }
.arcade-reward-callout strong { color: var(--ink); font-size: 20px; }
.phone-look { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 22px; font: 9px var(--mono); color: var(--muted); }
.phone-look button { padding: 9px 12px; color: var(--ink); background: transparent; border: 1px solid var(--line); }
.phone-look button[aria-pressed="true"] { border-color: var(--green); color: var(--green); }
.phone-vector { display: none; }
.phone-outline-narrow { display: none; }
.game-shell[data-phone-look="vector"] { background: transparent; border-color: transparent; border-radius: 0; box-shadow: none; transform: none; isolation: isolate; margin-block: 55px 100px; }
.game-shell[data-phone-look="vector"] .phone-vector { display: block; position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; z-index: -1; pointer-events: none; fill: #26393f; stroke: #627a72; stroke-width: .055; filter: drop-shadow(5px 7px 0 #080f12); }
.game-shell[data-phone-look="vector"] .phone-cat-ears { display: none; }
.game-shell[data-phone-look="vector"] .game-screen { border-radius: 0; }
.game-shell[data-phone-look="vector"] .phone-cat-face b { border-radius: 0; }
.arcade-layout { column-gap: 110px; }
.prize-card:nth-child(2) { border-color: #b8c4cf; }
.prize-card:nth-child(3) { border-color: #b78359; }
.fee-assumptions { margin-bottom: 22px; font: 11px/1.7 Arial, sans-serif; color: var(--muted); }
.fee-assumptions summary { cursor: pointer; color: var(--green); padding-block: 10px; }
.fee-assumptions p { margin-top: 12px; }
.fee-assumptions a { display: inline-block; margin-top: 10px; text-decoration: underline; }
#fee-error { color: #f4b08b; }
.conversion-mode { display: flex; gap: 8px; align-items: center; font: 11px/1.6 var(--mono); margin-bottom: 18px; }
.conversion-fields { margin-bottom: 14px; }
.conversion-fields input:read-only { color: #a9c9d1; }
.conversion-breakdown { border-top: 1px solid var(--line); margin-top: 18px; padding-top: 8px; }
.conversion-breakdown p { margin-top: 12px; }
.conversion-breakdown strong { display: block; color: var(--green); font: 12px/1.8 var(--mono); overflow-wrap: anywhere; }
.foreign-chart-test { padding: 24px; border-bottom: 1px solid #93cbd5; background: #142d36; }
.foreign-chart-test summary { cursor: pointer; color: var(--green); font: 11px var(--mono); letter-spacing: .4px; }
.foreign-chart-test[open] summary { margin-bottom: 14px; }
.foreign-chart-test p { color: #acccd3; font: 12px/1.8 Arial, sans-serif; margin-block: 12px; }
.foreign-chart-test code { display: block; overflow-wrap: anywhere; font-size: 11px; margin-bottom: 18px; }
.foreign-chart-test iframe { width: 100%; height: 460px; border: 0; margin-block: 14px; background: #0c171b; }
.foreign-chart-test > a { display: block; color: #93d3de; text-decoration: underline; font-size: 12px; }
.ultimate-word { display: none; position: absolute; top: 32%; inset-inline: 0; z-index: 5; text-align: center; color: var(--green); font: clamp(26px, 5vw, 68px)/1 var(--display); text-shadow: 3px 3px #0c171b; pointer-events: none; }
.ultimate-finished .ultimate-word { display: block; }
@media (max-width: 800px) {
  .arcade-layout { column-gap: 45px; }
  .game-shell[data-phone-look="vector"] { margin-block: 45px 80px; }
  .arcade-copy h2 { font-size: 42px; }
}
@media (max-width: 600px) {
  .hero-art { width: calc(100% - 28px); justify-self: center; }
  .hero-actions { gap: 16px; }
  .hero-actions .button { padding-inline: 12px; }
  .game-shell[data-phone-look="vector"] { width: calc(100% - 10px); margin-inline: auto; }
  .phone-outline-wide { display: none; }
  .phone-outline-narrow { display: block; }
  .game-shell[data-phone-look="vector"] .game-brand { font-size: 10px; }
  .arcade-copy h2 { font-size: clamp(43px, 11.5vw, 65px); }
  .foreign-chart-test { padding: 18px; }
}
