:root{
      --sky-top:#57b8ff;
      --sky-mid:#9be8ff;
      --sky-bottom:#d8ffcb;
      --shell-ink:#203049;
      --shell-ink-soft:#4b627f;
      --panel:#fffdf4e8;
      --panel-strong:#fff9ec;
      --panel-border:#ffffffd1;
      --shadow-soft:0 10px 24px rgba(32,48,73,.18);
      --shadow-strong:0 24px 56px rgba(32,48,73,.28);
      --brand-pink:#ff5ba8;
      --brand-orange:#ff9e4d;
      --brand-gold:#ffd36a;
      --brand-green:#58d36b;
      --brand-blue:#56a8ff;
      --good:#2ecc98;
      --bad:#ff5f78;
      --fever-warm:#ffe38d;
      --fever-hot:#ff8abb;
      --fever-cool:#67b8ff;
      --ui-scale:1;
      --hud-scale:1;
      --hud-card-min-h:calc(66px * var(--hud-scale));
      --hud-card-pad-y:calc(7px * var(--hud-scale));
      --hud-card-pad-x:calc(12px * var(--hud-scale));
      --hud-value-min-h:calc(28px * var(--hud-scale));
      --hud-score-gap:calc(0px * var(--hud-scale));
      --life-heart-size:calc(54px * var(--hud-scale));
      --life-heart-gap:calc(3px * var(--hud-scale));
      --life-heart-target-box-gap:-5px;
      --life-heart-optical-inset-ratio:0.1248751249;
      --title-scale:1;
      --fx-density:1;
      --fruit-scale:1;
      --basket-scale:1;
      --pause-scale:1;
      --motion-scale:1;
      --tap-target:44px;
      --hud-inset-top:14px;
      --hud-inset-side:14px;
      --text-leading:var(--font-line-height-body);
      --shell-radius:32px;
    }

    *{ box-sizing:border-box; }
    html,body{ height:100%; margin:0; }

    body{
      font-family:var(--font-family-body);
      font-weight:var(--font-weight-body);
      line-height:var(--font-line-height-body);
      display:grid;
      place-items:center;
      overflow:hidden;
      color:var(--shell-ink);
      background:
        radial-gradient(1300px 650px at -6% 18%, #ffffffc9 0 36%, transparent 37%),
        radial-gradient(1100px 560px at 108% 24%, #fff7d9bf 0 38%, transparent 39%),
        linear-gradient(180deg, var(--sky-top) 0%, var(--sky-mid) 54%, var(--sky-bottom) 100%);
    }

    body::before,
    body::after{
      content:"";
      position:fixed;
      inset:auto;
      pointer-events:none;
      z-index:0;
      opacity:.45;
      filter:blur(0.2px);
      animation:skyDrift 16s linear infinite;
    }

    body::before{
      width:min(44vw, 640px);
      height:min(24vw, 340px);
      left:-6vw;
      top:22vh;
      background:
        radial-gradient(circle at 18% 44%, #ffffffd8 0 20%, transparent 21%),
        radial-gradient(circle at 54% 50%, #ffffffda 0 26%, transparent 27%),
        radial-gradient(circle at 82% 44%, #ffffffd2 0 20%, transparent 21%);
    }

    body::after{
      width:min(36vw, 520px);
      height:min(20vw, 300px);
      right:-2vw;
      top:30vh;
      background:
        radial-gradient(circle at 20% 52%, #fff7dcdd 0 22%, transparent 23%),
        radial-gradient(circle at 56% 44%, #ffffffd1 0 28%, transparent 29%),
        radial-gradient(circle at 86% 58%, #fffce8d8 0 18%, transparent 19%);
      animation-duration:21s;
      animation-direction:reverse;
    }

    .wrap{
      width:min(1060px, 96vw);
      aspect-ratio:16 / 9;
      position:relative;
      z-index:1;
      overflow:hidden;
      border-radius:var(--shell-radius);
      border:2px solid #ffffffb3;
      box-shadow:var(--shadow-strong);
      background:
        linear-gradient(180deg, #ffffff54, #ffffff14),
        linear-gradient(155deg, #fff9ec77 0%, #ffffff10 56%, #d2efff21 100%);
      backdrop-filter:blur(8px);
    }

    .wrap::before{
      content:"";
      position:absolute;
      inset:0;
      background:
        radial-gradient(66% 48% at 10% 0%, #ffffff55 0, transparent 70%),
        radial-gradient(64% 46% at 90% 0%, #ffefbd33 0, transparent 72%);
      mix-blend-mode:screen;
      pointer-events:none;
    }

    .wrap::after{
      content:"";
      position:absolute;
      inset:0;
      pointer-events:none;
      opacity:0;
      background:
        radial-gradient(120% 78% at 50% 50%, rgba(255,88,150,0) 40%, rgba(238,30,92,.24) 82%, rgba(188,12,62,.44) 100%),
        linear-gradient(180deg, rgba(72,14,36,.06), rgba(52,10,28,.24));
      transition:opacity .16s linear;
      z-index:2;
    }

    canvas{
      width:100%;
      height:100%;
      display:block;
      touch-action:none;
    }

    .hud{
      position:absolute;
      inset:
        calc(var(--hud-inset-top) + env(safe-area-inset-top))
        var(--hud-inset-side)
        auto
        var(--hud-inset-side);
      display:grid;
      grid-template-columns:minmax(0, 1fr) auto;
      gap:calc(10px * var(--hud-scale));
      align-items:start;
      pointer-events:none;
      text-shadow:
        0 1px 0 rgba(255,255,255,.7),
        0 2px 6px rgba(25,40,60,.16);
    }

    .hud-main{
      display:grid;
      grid-template-columns:minmax(0, 1.4fr) minmax(0, 1fr);
      gap:calc(10px * var(--hud-scale));
      min-width:0;
    }

    .hud-main > .badge{
      grid-column:1 / -1;
      justify-self:start;
    }

    .stat-card{
      min-height:var(--hud-card-min-h);
      border-radius:20px;
      border:2px solid var(--panel-border);
      background:var(--panel);
      box-shadow:var(--shadow-soft);
      backdrop-filter:blur(2px);
      padding:var(--hud-card-pad-y) var(--hud-card-pad-x);
      display:grid;
      gap:2px;
      align-content:center;
      min-width:0;
    }

    .stat-label{
      font-size:calc(16px * var(--hud-scale));
      line-height:1.2;
      font-weight:var(--font-weight-heading-sub);
      letter-spacing:.9px;
      text-transform:uppercase;
      color:var(--shell-ink-soft);
      opacity:.9;
      text-shadow:
        0 1px 0 rgba(255,255,255,.76),
        0 2px 6px rgba(25,40,60,.18);
    }

    .stat-value{
      display:inline-flex;
      align-items:center;
      min-height:var(--hud-value-min-h);
      gap:8px;
      min-width:0;
      font-weight:var(--font-weight-body);
      line-height:1;
      font-size:calc(31px * var(--hud-scale));
      color:var(--shell-ink);
      letter-spacing:.2px;
      text-shadow:
        0 2px 0 rgba(255,255,255,.72),
        0 6px 12px rgba(25,40,60,.20);
    }

    .score-card .stat-value{
      --score-scale:1;
      --score-glow:0;
      --score-color:#ff5b9c;
      --score-shadow-base:
        0 2px 0 rgba(255,255,255,.84),
        0 0 calc(12px + var(--score-glow) * 1px) rgba(255,129,177,.28);
      --score-shadow-hot:
        0 0 calc(var(--score-glow) * 1px) rgba(185,255,244,.9),
        0 0 calc(var(--score-glow) * 1.45px) rgba(104,233,255,.54),
        0 0 calc(var(--score-glow) * 2px) rgba(146,161,255,.44);
      --score-shadow:var(--score-shadow-base);
      color:var(--score-color);
      margin-top:-1px;
      justify-content:flex-start;
      align-self:flex-end;
      gap:0;
      transform:scale(var(--score-scale));
      text-shadow:var(--score-shadow);
      filter:var(--score-filter,none);
    }

    .score-card{
      grid-template-rows:auto auto;
      align-content:start;
      gap:var(--hud-score-gap);
      padding-top:var(--hud-card-pad-y);
      min-height:var(--hud-card-min-h);
    }

    .hud-main > .stat-card{
      align-content:stretch;
      grid-template-rows:auto minmax(0,1fr);
    }

    .hud-main > .stat-card .stat-value{
      display:flex;
      align-self:stretch;
      align-items:center;
    }

    .hud-main > .score-card .stat-value{
      align-self:stretch;
      align-items:center;
    }

    .score-card .stat-label{
      position:relative;
      z-index:3;
      line-height:1.2;
      margin-left:0;
    }

    .score-shell{
      position:relative;
      display:inline-flex;
      align-items:center;
      gap:8px;
      min-width:0;
      padding:2px 12px 2px;
      margin-top:0;
      border-radius:999px;
      isolation:isolate;
    }

    .score-shell::before{
      content:"";
      position:absolute;
      inset:-3px -10px -6px -10px;
      border-radius:999px;
      z-index:-1;
      opacity:0;
      transform:scale(.92);
      background:
        radial-gradient(90% 80% at 50% 48%, rgba(255,255,255,.86) 0%, rgba(255,255,255,.30) 52%, rgba(255,255,255,0) 100%),
        conic-gradient(from 215deg, rgba(255,132,170,.54), rgba(255,214,135,.52), rgba(106,226,198,.50), rgba(101,197,255,.54), rgba(189,158,255,.52), rgba(255,132,170,.54));
      filter:blur(2px);
      transition:opacity .18s ease, transform .18s ease;
    }

    .score-card.is-fever .score-shell::before{
      opacity:1;
      transform:scale(1);
      animation:scoreAuraPulse 1.1s ease-in-out infinite;
    }

    .score-multiplier{
      display:none;
      align-items:center;
      justify-content:center;
      min-width:2.4ch;
      padding:2px 9px 3px;
      border-radius:999px;
      border:2px solid rgba(104,101,116,.72);
      background:linear-gradient(180deg, #fffef8, #ece9e2);
      color:#5b5664;
      font-size:calc(16px * var(--hud-scale));
      line-height:1;
      font-weight:var(--font-weight-body);
      letter-spacing:.2px;
      box-shadow:
        0 2px 0 rgba(255,255,255,.95) inset,
        0 2px 8px rgba(28,35,53,.18);
      transform-origin:50% 72%;
      transform:translateY(0) scale(1);
      transition:transform .1s linear, filter .1s linear;
    }

    .score-multiplier.show{
      display:inline-flex;
    }

    .score-card.is-fever #score{
      color:#6de4ff;
      -webkit-text-stroke:2px rgba(57,167,233,.78);
      paint-order:stroke fill;
      text-shadow:
        0 0 8px rgba(175,255,255,.74),
        0 0 20px rgba(112,255,210,.46),
        0 0 34px rgba(124,169,255,.44);
    }

    .score-card.is-fever .score-multiplier{
      border-color:#8b8993;
      box-shadow:
        0 2px 0 rgba(255,255,255,.95) inset,
        0 0 14px rgba(255,255,255,.46),
        0 4px 10px rgba(28,35,53,.24);
    }

    .score-card.is-fever{
      border-color:#fff8d2;
      background:
        linear-gradient(118deg, #fff8db 0%, #ffe5ef 48%, #dff2ff 100%);
      box-shadow:
        0 0 0 1px #ffffffb8 inset,
        0 14px 28px rgba(32,48,73,.2),
        0 0 28px rgba(255,182,122,.34);
      animation:scoreFeverGlow 1.05s ease-in-out infinite;
    }

    .score-card.is-fever .stat-label{
      color:#8852bf;
      letter-spacing:1.2px;
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .score-card.is-fever{
      position:relative;
      overflow:hidden;
      isolation:isolate;
      border-color:#7bf2ff;
      background:
        radial-gradient(120% 110% at 8% 0%, rgba(255,113,184,.22) 0%, rgba(255,113,184,0) 56%),
        radial-gradient(120% 110% at 100% 0%, rgba(118,233,255,.22) 0%, rgba(118,233,255,0) 58%),
        linear-gradient(160deg, #12172a 0%, #161c34 48%, #101522 100%);
      box-shadow:
        0 0 0 1px rgba(255,255,255,.08) inset,
        0 0 0 2px rgba(123,242,255,.18),
        0 12px 22px rgba(13,18,33,.34),
        0 0 22px rgba(110,224,255,.18),
        0 0 32px rgba(255,97,177,.16);
      animation:liveStageCardPulse 1.35s ease-in-out infinite;
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .score-card.is-fever::before{
      content:"FEVER ON AIR";
      position:absolute;
      top:5px;
      right:8px;
      z-index:1;
      display:inline-flex;
      align-items:center;
      height:18px;
      max-width:52%;
      padding:0 8px;
      border-radius:999px;
      border:1px solid rgba(255,226,150,.42);
      background:
        linear-gradient(180deg, rgba(255,238,188,.22), rgba(255,142,196,.16)),
        rgba(17,22,38,.92);
      color:#ffe8a8;
      font-size:calc(9px * var(--hud-scale));
      font-weight:var(--font-weight-body-strong);
      letter-spacing:1.1px;
      line-height:1;
      text-transform:uppercase;
      text-shadow:0 0 8px rgba(255,215,118,.45);
      box-shadow:
        0 0 0 1px rgba(255,255,255,.06) inset,
        0 0 10px rgba(255,181,92,.22);
      white-space:nowrap;
      overflow:hidden;
      text-overflow:clip;
      animation:liveStageBannerBlink 1.1s steps(2, end) infinite;
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .score-card.is-fever::after{
      content:"";
      position:absolute;
      left:10px;
      right:10px;
      bottom:5px;
      height:12px;
      z-index:0;
      border-radius:999px;
      opacity:.7;
      background:
        radial-gradient(circle at 8px 6px, rgba(255,210,105,.95) 0 2px, rgba(255,210,105,0) 4px),
        radial-gradient(circle at 18px 6px, rgba(255,117,190,.85) 0 2px, rgba(255,117,190,0) 4px),
        radial-gradient(circle at 28px 6px, rgba(117,240,255,.88) 0 2px, rgba(117,240,255,0) 4px);
      background-size:30px 12px;
      background-repeat:repeat-x;
      filter:blur(.2px) saturate(1.08);
      animation:liveStageFootlights 2.1s linear infinite;
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .score-card.is-fever .stat-label{
      position:relative;
      z-index:2;
      color:#cae8ff;
      letter-spacing:1.05px;
      text-shadow:
        0 0 10px rgba(113,234,255,.36),
        0 1px 0 rgba(18,25,46,.88);
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .score-card.is-fever .stat-value{
      position:relative;
      z-index:2;
      color:#eef8ff;
      text-shadow:none;
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .score-card.is-fever .score-shell{
      position:relative;
      z-index:2;
      overflow:hidden;
      border-radius:999px;
      border:2px solid rgba(119,236,255,.34);
      background:
        linear-gradient(180deg, rgba(37,46,79,.95), rgba(17,23,40,.96));
      box-shadow:
        0 0 0 1px rgba(255,255,255,.07) inset,
        0 0 12px rgba(113,234,255,.13),
        0 0 16px rgba(255,98,173,.1);
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .score-card.is-fever .score-shell::before{
      inset:-6px -14px -8px -14px;
      opacity:.95;
      transform:scale(1);
      background:
        radial-gradient(70% 120% at 0% 50%, rgba(110,238,255,.26) 0%, rgba(110,238,255,0) 74%),
        radial-gradient(72% 120% at 100% 50%, rgba(255,104,182,.24) 0%, rgba(255,104,182,0) 74%),
        linear-gradient(115deg, rgba(255,255,255,.08) 15%, rgba(255,255,255,.48) 32%, rgba(255,255,255,.08) 48%, rgba(255,255,255,0) 60%),
        linear-gradient(90deg, rgba(64,233,255,.2), rgba(255,123,194,.14), rgba(255,206,126,.18), rgba(64,233,255,.2));
      background-size:100% 100%, 100% 100%, 220% 100%, 100% 100%;
      background-position:0 0, 0 0, 120% 0, 0 0;
      filter:blur(1.6px) saturate(1.06);
      animation:liveStageSpotlightSweep 2.4s linear infinite;
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .score-card.is-fever #score{
      position:relative;
      z-index:3;
      color:#f5fbff;
      -webkit-text-stroke:2px rgba(58,120,214,.72);
      text-shadow:
        0 0 8px rgba(255,255,255,.72),
        0 0 16px rgba(116,236,255,.72),
        0 0 28px rgba(88,195,255,.48),
        0 0 38px rgba(255,106,179,.22);
      filter:drop-shadow(0 0 8px rgba(114,236,255,.28));
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .score-card.is-fever .score-multiplier{
      position:relative;
      z-index:3;
      border-color:rgba(255,218,126,.68);
      background:
        linear-gradient(180deg, rgba(255,226,150,.98), rgba(255,175,93,.95));
      color:#33243f;
      text-shadow:none;
      box-shadow:
        0 1px 0 rgba(255,246,212,.9) inset,
        0 0 10px rgba(255,198,108,.45),
        0 4px 10px rgba(15,18,29,.26);
      animation:liveStageMultiplierBlink 1.35s ease-in-out infinite;
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .score-card.is-fever[data-fever-phase="enter"]{
      animation-duration:.72s;
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .score-card.is-fever[data-fever-phase="enter"]::before{
      animation-duration:.34s;
      box-shadow:
        0 0 0 1px rgba(255,255,255,.08) inset,
        0 0 14px rgba(255,204,111,.38);
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .score-card.is-fever[data-fever-phase="enter"] .score-shell::before{
      animation-duration:.78s;
      filter:blur(1.4px) saturate(1.16);
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .score-card.is-fever[data-fever-phase="active"]{
      animation-duration:1.45s;
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .score-card.is-fever[data-fever-phase="active"]::before{
      animation-duration:1.08s;
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .score-card.is-fever[data-fever-phase="active"] .score-shell::before{
      animation-duration:2.6s;
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .score-card.is-fever[data-fever-phase="exit"]{
      opacity:.94;
      filter:saturate(.9);
      animation-duration:1.7s;
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .score-card.is-fever[data-fever-phase="exit"]::before{
      opacity:.8;
      animation-duration:1.5s;
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .score-card.is-fever[data-fever-phase="exit"]::after{
      opacity:.45;
      animation-duration:2.8s;
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .score-card.is-fever[data-fever-phase="exit"] .score-shell::before{
      opacity:.6;
      filter:blur(1.3px) saturate(.88);
      animation-duration:3s;
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .badge.fever-neon{
      position:relative;
      overflow:hidden;
      isolation:isolate;
      color:#e7f6ff;
      border-color:rgba(121,239,255,.62);
      background:
        radial-gradient(110% 140% at 0% 0%, rgba(255,113,187,.22) 0%, rgba(255,113,187,0) 58%),
        radial-gradient(100% 120% at 100% 0%, rgba(120,235,255,.2) 0%, rgba(120,235,255,0) 62%),
        linear-gradient(150deg, rgba(18,23,39,.96), rgba(22,29,53,.97));
      box-shadow:
        0 0 0 1px rgba(255,255,255,.06) inset,
        0 0 0 1px rgba(121,239,255,.14),
        0 8px 20px rgba(13,18,33,.28),
        0 0 18px rgba(114,235,255,.2),
        0 0 26px rgba(255,102,177,.12);
      text-shadow:none;
      animation:liveStageBadgeHum 1.4s ease-in-out infinite;
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .badge.fever-neon::before{
      content:"";
      position:absolute;
      inset:0;
      z-index:0;
      background:
        linear-gradient(115deg, rgba(255,255,255,0) 25%, rgba(255,255,255,.2) 39%, rgba(255,255,255,0) 56%);
      background-size:210% 100%;
      background-position:125% 0;
      animation:liveStageSpotlightSweep 2.8s linear infinite;
      opacity:.75;
      pointer-events:none;
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .badge.fever-neon::after{
      content:"";
      position:absolute;
      left:8px;
      right:8px;
      bottom:4px;
      height:8px;
      z-index:0;
      border-radius:999px;
      opacity:.55;
      background:
        radial-gradient(circle at 6px 4px, rgba(255,210,105,.95) 0 1.5px, rgba(255,210,105,0) 3px),
        radial-gradient(circle at 14px 4px, rgba(255,117,190,.9) 0 1.5px, rgba(255,117,190,0) 3px),
        radial-gradient(circle at 22px 4px, rgba(117,240,255,.9) 0 1.5px, rgba(117,240,255,0) 3px);
      background-size:24px 8px;
      background-repeat:repeat-x;
      animation:liveStageFootlights 2.6s linear infinite;
      pointer-events:none;
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .badge.fever-neon > *{
      position:relative;
      z-index:1;
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .badge.fever-neon .spark{
      color:#ffd87f;
      text-shadow:
        0 0 8px rgba(255,210,105,.65),
        0 0 14px rgba(255,122,190,.34);
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .badge.fever-neon .badge-label{
      color:#bfeaff;
      opacity:.98;
      letter-spacing:1px;
      text-shadow:0 0 10px rgba(116,236,255,.34);
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .badge.fever-neon .badge-time{
      color:#f5fbff;
      text-shadow:
        0 0 8px rgba(255,255,255,.42),
        0 0 14px rgba(255,117,190,.28),
        0 0 18px rgba(116,236,255,.28);
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .badge.fever-neon .badge-tail{
      color:#d3deef;
      opacity:.88;
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .badge.fever-neon .badge-score-boost{
      color:#ffeab0;
      border-color:rgba(124,241,255,.42);
      background:
        linear-gradient(180deg, rgba(22,28,48,.9), rgba(17,22,40,.94));
      box-shadow:
        0 0 0 1px rgba(255,255,255,.05) inset,
        0 0 10px rgba(114,235,255,.18),
        0 0 14px rgba(255,117,190,.12);
      text-shadow:
        0 0 8px rgba(255,210,105,.35),
        0 0 12px rgba(255,117,190,.24);
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .badge.fever-neon[data-phase="enter"]{
      animation-duration:.72s;
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .badge.fever-neon[data-phase="enter"]::before{
      animation-duration:.95s;
      opacity:.9;
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .badge.fever-neon[data-phase="active"]{
      animation-duration:1.35s;
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .badge.fever-neon[data-phase="active"]::before{
      animation-duration:2.4s;
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .badge.fever-neon[data-phase="exit"]{
      opacity:.9;
      filter:saturate(.9);
      animation-duration:1.7s;
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .badge.fever-neon[data-phase="exit"]::before{
      opacity:.45;
      animation-duration:3.1s;
    }

    .hud[data-fever-ui-theme="live-stage-v1"] .badge.fever-neon[data-phase="exit"]::after{
      opacity:.3;
      animation-duration:3.2s;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever{
      position:relative;
      overflow:hidden;
      isolation:isolate;
      border-color:#ffd7ef;
      background:
        radial-gradient(120% 95% at 10% 0%, rgba(255,203,234,.88) 0%, rgba(255,203,234,.25) 48%, rgba(255,203,234,0) 72%),
        radial-gradient(120% 95% at 100% 0%, rgba(197,246,255,.86) 0%, rgba(197,246,255,.24) 50%, rgba(197,246,255,0) 72%),
        linear-gradient(165deg, #fff8ff 0%, #f3f7ff 52%, #eefcff 100%);
      box-shadow:
        0 0 0 1px rgba(255,255,255,.86) inset,
        0 10px 22px rgba(157,176,220,.22),
        0 0 18px rgba(255,176,225,.22),
        0 0 14px rgba(133,231,255,.14);
      animation:dreamyCardFloat 1.9s ease-in-out infinite;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever::after{
      content:"";
      position:absolute;
      left:10px;
      right:10px;
      bottom:5px;
      height:10px;
      z-index:0;
      border-radius:999px;
      opacity:.82;
      background:
        radial-gradient(circle at 8px 5px, rgba(255,170,216,.8) 0 2px, rgba(255,170,216,0) 3px),
        radial-gradient(circle at 18px 5px, rgba(157,235,255,.82) 0 2px, rgba(157,235,255,0) 3px),
        radial-gradient(circle at 28px 5px, rgba(255,229,152,.8) 0 2px, rgba(255,229,152,0) 3px);
      background-size:30px 10px;
      background-repeat:repeat-x;
      filter:saturate(1.02);
      animation:dreamyTwinkleDots 2.7s linear infinite;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever .stat-label{
      position:relative;
      z-index:2;
      color:#8f78c3;
      letter-spacing:1.05px;
      text-shadow:
        0 1px 0 rgba(255,255,255,.88),
        0 0 10px rgba(205,223,255,.52);
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever .score-shell{
      position:relative;
      z-index:2;
      overflow:hidden;
      border-radius:999px;
      border:2px solid rgba(255,255,255,.88);
      background:
        linear-gradient(180deg, rgba(255,255,255,.88), rgba(248,251,255,.95));
      box-shadow:
        0 1px 0 rgba(255,255,255,.95) inset,
        0 0 0 1px rgba(255,217,240,.55),
        0 3px 12px rgba(188,207,243,.18);
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever .score-shell::before{
      inset:-5px -12px -8px -12px;
      opacity:.94;
      transform:scale(1);
      background:
        radial-gradient(75% 115% at 18% 38%, rgba(255,201,236,.72) 0%, rgba(255,201,236,.22) 42%, rgba(255,201,236,0) 72%),
        radial-gradient(80% 115% at 84% 42%, rgba(194,246,255,.72) 0%, rgba(194,246,255,.20) 44%, rgba(194,246,255,0) 72%),
        radial-gradient(42% 64% at 36% 65%, rgba(255,255,255,.9) 0%, rgba(255,255,255,.18) 52%, rgba(255,255,255,0) 72%),
        radial-gradient(40% 62% at 68% 68%, rgba(255,255,255,.84) 0%, rgba(255,255,255,.16) 50%, rgba(255,255,255,0) 72%),
        linear-gradient(90deg, rgba(255,217,238,.36), rgba(221,245,255,.32), rgba(255,242,194,.28), rgba(255,217,238,.36));
      filter:blur(1.5px);
      animation:dreamyCloudPulse 2.2s ease-in-out infinite;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever .score-shell::after{
      content:"✦ ･ﾟ✧ ｡";
      position:absolute;
      left:10px;
      right:10px;
      top:50%;
      z-index:0;
      transform:translateY(-52%);
      color:rgba(164,149,223,.52);
      font-size:calc(10px * var(--hud-scale));
      letter-spacing:12px;
      white-space:nowrap;
      opacity:.9;
      text-shadow:
        0 0 8px rgba(255,255,255,.7),
        0 0 10px rgba(164,230,255,.45);
      animation:dreamySparkleDrift 3.1s linear infinite;
      pointer-events:none;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever #score{
      position:relative;
      z-index:3;
      color:#ffffff;
      -webkit-text-stroke:2px rgba(139,191,238,.75);
      text-shadow:
        0 1px 0 rgba(255,255,255,.95),
        0 0 8px rgba(255,208,239,.72),
        0 0 14px rgba(167,235,255,.64),
        0 0 22px rgba(255,244,191,.42);
      filter:drop-shadow(0 0 6px rgba(188,230,255,.35));
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever .score-multiplier{
      position:relative;
      z-index:3;
      border-color:rgba(255,255,255,.94);
      background:
        linear-gradient(180deg, #fff4fb, #ffe6f4);
      color:#a26db1;
      box-shadow:
        0 1px 0 rgba(255,255,255,.95) inset,
        0 0 0 1px rgba(255,202,232,.7),
        0 0 8px rgba(255,209,239,.46),
        0 3px 8px rgba(189,206,240,.22);
      animation:dreamyMultiplierGlow 1.6s ease-in-out infinite;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever[data-fever-phase="enter"]{
      animation-duration:.92s;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever[data-fever-phase="enter"] .score-shell::before{
      animation-duration:.95s;
      opacity:1;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever[data-fever-phase="enter"] .score-shell::after{
      animation-duration:1.4s;
      opacity:1;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever[data-fever-phase="active"]{
      animation-duration:1.95s;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever[data-fever-phase="active"] .score-shell::before{
      animation-duration:2.4s;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever[data-fever-phase="active"] .score-shell::after{
      animation-duration:3.2s;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever[data-fever-phase="exit"]{
      opacity:.95;
      filter:saturate(.93);
      animation-duration:2.2s;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever[data-fever-phase="exit"] .score-shell::before{
      opacity:.68;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever[data-fever-phase="exit"] .score-shell::after{
      opacity:.52;
      animation-duration:4.2s;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .badge.fever-neon{
      position:relative;
      overflow:hidden;
      isolation:isolate;
      color:#7f71aa;
      border-color:#ffe3f3;
      background:
        radial-gradient(120% 140% at 0% 0%, rgba(255,205,237,.85) 0%, rgba(255,205,237,.24) 55%, rgba(255,205,237,0) 72%),
        radial-gradient(120% 140% at 100% 0%, rgba(201,245,255,.82) 0%, rgba(201,245,255,.22) 55%, rgba(201,245,255,0) 72%),
        linear-gradient(165deg, #fff8ff 0%, #f4f7ff 48%, #effcff 100%);
      box-shadow:
        0 0 0 1px rgba(255,255,255,.88) inset,
        0 8px 18px rgba(180,199,237,.2),
        0 0 14px rgba(255,196,228,.18);
      text-shadow:none;
      animation:dreamyBadgeBob 1.8s ease-in-out infinite;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .badge.fever-neon::before{
      content:"☁  ✦   ☁  ✧";
      position:absolute;
      inset:2px 10px auto 10px;
      z-index:0;
      color:rgba(146,156,214,.34);
      font-size:calc(9px * var(--hud-scale));
      letter-spacing:4px;
      white-space:nowrap;
      opacity:.82;
      text-shadow:0 0 6px rgba(255,255,255,.72);
      animation:dreamyBadgeSparkleDrift 4.2s linear infinite;
      pointer-events:none;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .badge.fever-neon::after{
      content:"";
      position:absolute;
      left:8px;
      right:8px;
      bottom:4px;
      height:8px;
      z-index:0;
      border-radius:999px;
      opacity:.62;
      background:
        radial-gradient(circle at 7px 4px, rgba(255,178,221,.82) 0 1.5px, rgba(255,178,221,0) 3px),
        radial-gradient(circle at 15px 4px, rgba(166,235,255,.82) 0 1.5px, rgba(166,235,255,0) 3px),
        radial-gradient(circle at 23px 4px, rgba(255,233,163,.78) 0 1.5px, rgba(255,233,163,0) 3px);
      background-size:24px 8px;
      background-repeat:repeat-x;
      animation:dreamyTwinkleDots 3s linear infinite;
      pointer-events:none;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .badge.fever-neon > *{
      position:relative;
      z-index:1;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .badge.fever-neon .spark{
      color:#ff9fca;
      text-shadow:
        0 0 8px rgba(255,191,224,.75),
        0 0 8px rgba(160,234,255,.45);
      animation:dreamySparkPulse 1.5s ease-in-out infinite;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .badge.fever-neon .badge-label{
      color:#8d7ac2;
      opacity:.98;
      letter-spacing:1px;
      text-shadow:0 1px 0 rgba(255,255,255,.86);
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .badge.fever-neon .badge-time{
      color:#ff78b8;
      text-shadow:
        0 0 7px rgba(255,206,236,.72),
        0 0 8px rgba(177,237,255,.45);
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .badge.fever-neon .badge-tail{
      color:#9aa0c5;
      opacity:.92;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .badge.fever-neon .badge-score-boost{
      color:#ff6fb8;
      border-color:rgba(255,211,236,.88);
      background:
        linear-gradient(180deg, rgba(255,255,255,.92), rgba(249,243,255,.94));
      box-shadow:
        0 1px 0 rgba(255,255,255,.94) inset,
        0 4px 10px rgba(190,169,236,.14),
        0 0 10px rgba(255,203,234,.24);
      text-shadow:
        0 1px 0 rgba(255,255,255,.94),
        0 0 8px rgba(255,203,234,.72),
        0 0 10px rgba(177,237,255,.34);
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .badge.fever-neon[data-phase="enter"]{
      animation-duration:1.05s;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .badge.fever-neon[data-phase="enter"]::before{
      animation-duration:2s;
      opacity:.95;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .badge.fever-neon[data-phase="active"]{
      animation-duration:1.85s;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .badge.fever-neon[data-phase="active"]::before{
      animation-duration:4.4s;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .badge.fever-neon[data-phase="exit"]{
      opacity:.92;
      filter:saturate(.9);
      animation-duration:2.2s;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .badge.fever-neon[data-phase="exit"]::before,
    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .badge.fever-neon[data-phase="exit"]::after{
      opacity:.48;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] #pauseBtn[data-fever-pause="on"]{
      border-color:rgba(255,245,252,.92);
      color:#6f63ae;
      text-shadow:
        0 1px 0 rgba(255,255,255,.92),
        0 0 10px rgba(190,214,255,.34);
      background:
        radial-gradient(120% 150% at 12% -12%, rgba(255,201,230,.92) 0%, rgba(255,201,230,.20) 52%, rgba(255,201,230,0) 74%),
        radial-gradient(110% 140% at 100% 0%, rgba(187,238,255,.9) 0%, rgba(187,238,255,.18) 54%, rgba(187,238,255,0) 76%),
        linear-gradient(180deg, #fffaff 0%, #f8f5ff 46%, #edf9ff 100%);
      box-shadow:
        0 0 0 1px rgba(255,255,255,.78) inset,
        0 8px 20px rgba(138,160,214,.22),
        0 0 12px rgba(255,193,226,.14);
      filter:saturate(1.04);
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] #pauseBtn[data-fever-pause="on"]:hover:not(:disabled){
      box-shadow:
        0 0 0 1px rgba(255,255,255,.82) inset,
        0 12px 24px rgba(138,160,214,.26),
        0 0 14px rgba(255,193,226,.18);
      filter:saturate(1.08) brightness(1.01);
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] #pauseBtn[data-fever-pause="on"]:focus-visible{
      outline-color:#8d7be3;
      box-shadow:
        0 0 0 1px rgba(255,255,255,.82) inset,
        0 8px 20px rgba(138,160,214,.22),
        0 0 0 4px rgba(195,182,255,.22);
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] #pauseBtn[data-fever-pause="on"][data-fever-phase="enter"]{
      transform:translateY(-1px);
      filter:saturate(1.1) brightness(1.03);
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] #pauseBtn[data-fever-pause="on"][data-fever-phase="active"]{
      filter:saturate(1.1);
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] #pauseBtn[data-fever-pause="on"][data-fever-phase="exit"]{
      filter:saturate(1.03) brightness(.995);
      box-shadow:
        0 0 0 1px rgba(255,255,255,.72) inset,
        0 7px 18px rgba(138,160,214,.18),
        0 0 8px rgba(255,193,226,.11);
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever + .stat-card[aria-label="ライフ"]{
      position:relative;
      overflow:hidden;
      isolation:isolate;
      border-color:#dff1ff;
      background:
        radial-gradient(110% 100% at 4% 0%, rgba(255,208,238,.72) 0%, rgba(255,208,238,.18) 48%, rgba(255,208,238,0) 72%),
        radial-gradient(110% 100% at 100% 0%, rgba(208,245,255,.72) 0%, rgba(208,245,255,.16) 50%, rgba(208,245,255,0) 72%),
        linear-gradient(165deg, #fff9ff 0%, #f5f8ff 50%, #f2fcff 100%);
      box-shadow:
        0 0 0 1px rgba(255,255,255,.9) inset,
        0 8px 18px rgba(184,201,236,.2),
        0 0 12px rgba(255,204,234,.14);
      animation:dreamyLifeCardFloat 2.15s ease-in-out infinite;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever + .stat-card[aria-label="ライフ"]::after{
      content:"";
      position:absolute;
      left:10px;
      right:10px;
      bottom:5px;
      height:8px;
      z-index:0;
      border-radius:999px;
      opacity:.64;
      background:
        radial-gradient(circle at 7px 4px, rgba(255,180,223,.8) 0 1.4px, rgba(255,180,223,0) 3px),
        radial-gradient(circle at 15px 4px, rgba(170,236,255,.8) 0 1.4px, rgba(170,236,255,0) 3px),
        radial-gradient(circle at 23px 4px, rgba(255,233,166,.76) 0 1.4px, rgba(255,233,166,0) 3px);
      background-size:24px 8px;
      background-repeat:repeat-x;
      animation:dreamyTwinkleDots 3.2s linear infinite;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever + .stat-card[aria-label="ライフ"] .stat-label{
      position:relative;
      z-index:2;
      color:#8f79c5;
      text-shadow:
        0 1px 0 rgba(255,255,255,.9),
        0 0 8px rgba(201,223,255,.45);
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever + .stat-card[aria-label="ライフ"] .stat-value{
      position:relative;
      z-index:2;
      text-shadow:none;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever + .stat-card[aria-label="ライフ"] .hearts{
      position:relative;
      z-index:2;
      padding:0;
      border-radius:0;
      background:none;
      box-shadow:none;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever + .stat-card[aria-label="ライフ"] .hearts::before{
      content:none;
      animation:none;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever + .stat-card[aria-label="ライフ"] .life-heart{
      position:relative;
      z-index:1;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever + .stat-card[aria-label="ライフ"] .life-heart.on .life-heart-icon{
      filter:none;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever[data-fever-phase="enter"] + .stat-card[aria-label="ライフ"]{
      animation-duration:1.05s;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever[data-fever-phase="enter"] + .stat-card[aria-label="ライフ"] .hearts::before{
      animation-duration:2.6s;
      opacity:.9;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever[data-fever-phase="active"] + .stat-card[aria-label="ライフ"]{
      animation-duration:2.2s;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever[data-fever-phase="active"] + .stat-card[aria-label="ライフ"] .hearts::before{
      animation-duration:4.8s;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever[data-fever-phase="exit"] + .stat-card[aria-label="ライフ"]{
      opacity:.95;
      filter:saturate(.93);
      animation-duration:2.4s;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever[data-fever-phase="exit"] + .stat-card[aria-label="ライフ"]::after{
      opacity:.44;
    }

    .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever[data-fever-phase="exit"] + .stat-card[aria-label="ライフ"] .hearts::before{
      opacity:.45;
      animation-duration:6s;
    }

    #score{
      display:inline-block;
      min-width:2ch;
      position:relative;
      left:-1px;
      top:0;
      transform-origin:50% 68%;
      transition:transform .09s linear, text-shadow .09s linear, color .18s ease, filter .1s linear;
      white-space:nowrap;
    }

    .hearts{
      display:flex;
      align-items:center;
      flex-wrap:nowrap;
      gap:var(--life-heart-gap);
      min-width:fit-content;
      min-height:var(--life-heart-size);
    }

    .stat-card[aria-label="ライフ"] .stat-value{
      justify-content:flex-start;
    }

    .stat-card[aria-label="ライフ"] .hearts{
      margin-inline-start:calc(-6px * var(--hud-scale));
    }

    .hearts > .life-heart + .life-heart{
      /* `gap` cannot be negative, so apply extra negative margin to get an effective box gap of -5px. */
      margin-inline-start:calc(var(--life-heart-target-box-gap) - var(--life-heart-gap));
    }

    .life-heart{
      width:var(--life-heart-size);
      height:var(--life-heart-size);
      position:relative;
      overflow:hidden;
      border:none;
      background:transparent;
      color:#b61544;
      display:grid;
      place-items:center;
      font-size:calc(13px * var(--hud-scale));
      line-height:1;
      font-weight:900;
      box-shadow:none;
    }

    .life-heart-icon{
      width:100%;
      height:100%;
      object-fit:contain;
      display:block;
    }

    .life-heart-fallback{
      width:100%;
      height:100%;
      display:none;
      place-items:center;
      line-height:1;
    }

    .life-heart.icon-error .life-heart-icon{
      display:none;
    }

    .life-heart.icon-error .life-heart-fallback{
      display:grid;
    }

    .life-heart.off{
      border:none;
      background:transparent;
      color:#71839e;
      box-shadow:none;
    }

    .hearts.hit .life-heart.on{
      animation:lifeHitPulse .35s ease-out 2;
    }

    .hud-side{
      display:grid;
      gap:calc(8px * var(--hud-scale));
      justify-items:end;
      pointer-events:none;
    }

    .btns{
      display:flex;
      gap:calc(8px * var(--hud-scale));
      flex-wrap:wrap;
      justify-content:flex-end;
      pointer-events:auto;
    }

    button{
      cursor:pointer;
      border:none;
      border-radius:999px;
      min-height:var(--tap-target);
      min-width:var(--tap-target);
      padding:calc(10px * var(--ui-scale)) calc(16px * var(--ui-scale));
      font-family:var(--font-family-body);
      font-size:calc(14px * var(--ui-scale));
      line-height:var(--font-line-height-body);
      font-weight:var(--font-weight-button);
      color:var(--shell-ink);
      background:linear-gradient(180deg, #fffef9, #ffeeda);
      box-shadow:0 8px 18px rgba(32,48,73,.2);
      border:2px solid #ffffffd8;
      transition:transform .09s ease, box-shadow .15s ease, filter .15s ease;
      touch-action:manipulation;
    }

    button:hover{
      transform:translateY(-1px);
      box-shadow:0 12px 22px rgba(32,48,73,.24);
      filter:saturate(1.03);
    }

    button:active{ transform:translateY(1px) scale(.992); }

    button:disabled{
      opacity:.65;
      cursor:default;
      transform:none;
      box-shadow:0 4px 10px rgba(32,48,73,.14);
      filter:none;
    }

    button:focus-visible{
      outline:3px solid #245b99;
      outline-offset:2px;
    }

    .badge{
      display:none;
      align-items:center;
      flex-wrap:wrap;
      gap:8px;
      row-gap:calc(3px * var(--hud-scale));
      padding:calc(10px * var(--hud-scale)) calc(12px * var(--hud-scale));
      border-radius:14px;
      background:var(--panel-strong);
      border:2px solid var(--panel-border);
      box-shadow:var(--shadow-soft);
      font-size:calc(14px * var(--hud-scale));
      line-height:var(--font-line-height-body);
      font-weight:var(--font-weight-body-strong);
      color:var(--shell-ink);
      pointer-events:none;
      max-width:min(76vw, 360px);
      width:fit-content;
      text-shadow:
        0 1px 0 rgba(255,255,255,.72),
        0 2px 6px rgba(25,40,60,.18);
    }

    .badge.show{ display:flex; }

    .badge .spark{
      font-size:calc(15px * var(--hud-scale));
      color:#ff8b4a;
      text-shadow:0 0 7px #ffed97;
    }

    .badge .badge-label{
      text-transform:uppercase;
      letter-spacing:.8px;
      opacity:.85;
    }

    .badge .badge-time{
      font-size:calc(18px * var(--hud-scale));
      color:#f25f9f;
      min-width:4ch;
      text-align:right;
    }

    .badge .badge-tail{
      opacity:.7;
      font-size:calc(12px * var(--hud-scale));
    }

    .badge .badge-score-boost{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      flex:0 1 auto;
      white-space:nowrap;
      font-size:calc(13px * var(--hud-scale));
      line-height:1;
      font-weight:var(--font-weight-heading-sub);
      letter-spacing:.4px;
      color:#ff6ca8;
      padding:calc(4px * var(--hud-scale)) calc(9px * var(--hud-scale));
      border-radius:999px;
      border:1px solid rgba(255,170,209,.68);
      background:
        linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,241,248,.94));
      box-shadow:
        0 1px 0 rgba(255,255,255,.95) inset,
        0 3px 8px rgba(255,146,197,.20);
      margin-inline-start:calc(2px * var(--hud-scale));
      text-shadow:
        0 1px 0 rgba(255,255,255,.9),
        0 0 8px rgba(255,189,220,.48);
    }

    .badge.fever-neon{
      color:#2c3158;
      background:
        linear-gradient(115deg, #fff8de 0%, #ffeec4 40%, #ffe0ef 75%, #d9efff 100%);
      border-color:#fff7df;
      box-shadow:
        0 0 0 1px #ffffffb5 inset,
        0 8px 20px rgba(32,48,73,.18),
        0 0 20px rgba(255,197,132,.38);
      animation:feverBadgePulse 1.2s ease-in-out infinite;
    }

    .badge.fever-neon .badge-time{
      color:#ff4f95;
      text-shadow:0 0 8px rgba(255,142,182,.55);
    }

    .badge.fever-neon[data-phase="enter"]{ animation-duration:.9s; }
    .badge.fever-neon[data-phase="active"]{ animation-duration:1.25s; }
    .badge.fever-neon[data-phase="exit"]{ animation-duration:1.45s; opacity:.92; }

    .pause-panel{
      position:absolute;
      inset:0;
      display:grid;
      place-items:center;
      opacity:0;
      pointer-events:none;
      transition:opacity .18s ease;
      background:
        radial-gradient(120% 68% at 30% 6%, #ffffff35 0%, transparent 58%),
        linear-gradient(180deg, rgba(10,20,36,0.24), rgba(10,20,36,0.62));
      z-index:3;
    }

    .pause-panel.show{
      opacity:1;
      pointer-events:auto;
    }

    .pause-card{
      width:min(600px, 92%);
      border-radius:28px;
      border:2px solid #ffffffd8;
      background:
        linear-gradient(165deg, #fffef8 0%, #ffeacd 54%, #ffe2f4 100%);
      box-shadow:var(--shadow-strong);
      padding:calc(20px * var(--ui-scale));
      text-align:center;
      color:#25405f;
    }

    .pause-panel[data-fever-pause="on"] .pause-card{
      position:relative;
      overflow:hidden;
      isolation:isolate;
      border-color:#ffe4f3;
      background:
        radial-gradient(130% 100% at 8% 0%, rgba(255,211,238,.86) 0%, rgba(255,211,238,.24) 52%, rgba(255,211,238,0) 76%),
        radial-gradient(130% 100% at 100% 0%, rgba(206,245,255,.86) 0%, rgba(206,245,255,.22) 52%, rgba(206,245,255,0) 76%),
        linear-gradient(165deg, #fff9ff 0%, #f6f8ff 50%, #effcff 100%);
      box-shadow:
        0 0 0 1px rgba(255,255,255,.86) inset,
        0 18px 36px rgba(124,150,206,.24),
        0 0 18px rgba(255,188,226,.18),
        0 0 14px rgba(154,233,255,.14);
      animation:pauseFeverDreamyFloat 2.2s ease-in-out infinite;
    }

    .pause-panel[data-fever-pause="on"] .pause-card::before{
      content:"";
      position:absolute;
      inset:10px 12px auto 12px;
      height:18px;
      z-index:0;
      border-radius:999px;
      opacity:.8;
      background:
        radial-gradient(circle at 8px 9px, rgba(255,186,225,.9) 0 2px, rgba(255,186,225,0) 4px),
        radial-gradient(circle at 18px 9px, rgba(168,236,255,.88) 0 2px, rgba(168,236,255,0) 4px),
        radial-gradient(circle at 28px 9px, rgba(255,229,156,.86) 0 2px, rgba(255,229,156,0) 4px);
      background-size:30px 18px;
      background-repeat:repeat-x;
      animation:dreamyTwinkleDots 3.2s linear infinite;
      pointer-events:none;
    }

    .pause-panel[data-fever-pause="on"] .pause-card::after{
      content:"☁ ✦  ☁ ✧";
      position:absolute;
      left:20px;
      right:20px;
      top:40px;
      z-index:0;
      color:rgba(149,160,220,.28);
      font-size:calc(13px * var(--ui-scale));
      letter-spacing:8px;
      white-space:nowrap;
      text-shadow:0 0 6px rgba(255,255,255,.68);
      opacity:.8;
      animation:dreamyBadgeSparkleDrift 5.1s linear infinite;
      pointer-events:none;
    }

    .pause-panel[data-fever-pause="on"] .pause-card > *{
      position:relative;
      z-index:1;
    }

    .pause-panel[data-fever-pause="on"] .pause-title{
      color:#8d79c5;
      text-shadow:
        0 1px 0 rgba(255,255,255,.92),
        0 0 12px rgba(200,223,255,.38);
    }

    .pause-panel[data-fever-pause="on"] .pause-desc{
      color:#6f75ab;
    }

    .pause-panel[data-fever-pause="on"] .pause-actions button{
      border:2px solid rgba(255,255,255,.9);
      background:
        linear-gradient(180deg, #fff9ff, #ffeef7 55%, #edf8ff);
      box-shadow:
        0 8px 16px rgba(147,171,221,.18),
        0 0 10px rgba(255,198,229,.12);
    }

    .pause-title{
      margin:0;
      font-size:calc(32px * var(--title-scale));
      line-height:1.12;
      color:#294770;
      text-shadow:0 2px 0 #ffffffd5;
      letter-spacing:.5px;
    }

    .pause-desc{
      margin:12px 0 14px;
      font-size:calc(14px * var(--ui-scale));
      font-weight:var(--font-weight-body);
      line-height:var(--font-line-height-body);
      color:#365a84;
    }

    :root{
      --overlay-audio-gap: calc(8px * var(--ui-scale));
      --overlay-audio-button-width: calc(170px * var(--ui-scale));
      --overlay-shared-row-width: calc((var(--overlay-audio-button-width) * 3) + (var(--overlay-audio-gap) * 2));
    }

    .pause-actions{
      display:grid;
      grid-template-columns:repeat(2, minmax(0,1fr));
      gap:10px;
      width:min(100%, var(--overlay-shared-row-width));
      margin-inline:auto;
    }

    .pause-audio-actions{
      margin-top:10px;
      display:flex;
      justify-content:center;
      align-items:stretch;
      flex-wrap:nowrap;
      gap:var(--overlay-audio-gap);
      width:min(100%, var(--overlay-shared-row-width));
      margin-inline:auto;
    }

    .pause-audio-actions button{
      white-space:nowrap;
    }

    #resumeBtn{
      background:linear-gradient(100deg, #ff7cb8 0%, #ffc76a 52%, #ffe98f 100%);
      color:#1f3152;
    }

    #pauseRestartBtn{
      background:linear-gradient(180deg, #f6fbff, #e4f2ff);
      color:#24486a;
    }

    .overlay{
      position:absolute;
      inset:0;
      display:grid;
      place-items:center;
      background:
        radial-gradient(130% 78% at 20% 0%, #ffffff50 0%, transparent 54%),
        linear-gradient(180deg, #15305022, #15305068 80%, #10273f82);
      backdrop-filter:blur(6px);
      opacity:0;
      pointer-events:none;
      transition:opacity .24s ease;
    }

    .overlay:not(.show){
      backdrop-filter:none;
    }

    .overlay.show{ opacity:1; pointer-events:auto; }

    .card{
      position:relative;
      width:min(600px, 92%);
      border-radius:30px;
      border:2px solid #ffffffde;
      padding:
        calc(24px * var(--ui-scale))
        calc(24px * var(--ui-scale))
        calc(24px * var(--ui-scale));
      background:
        radial-gradient(120% 60% at 0% 0%, #ffffffd8 0%, transparent 46%),
        linear-gradient(180deg, #fffdf4f8, #ffefd2ef 72%, #ffe5f0eb 100%);
      box-shadow:var(--shadow-strong);
      color:var(--shell-ink);
      text-align:center;
      line-height:var(--text-leading);
      overflow:auto;
      max-height:calc(100% - 28px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
      -webkit-overflow-scrolling:touch;
    }

    .title{
      margin:0 0 calc(10px * var(--ui-scale));
      font-size:calc(35px * var(--title-scale));
      line-height:1.1;
      color:#ff4e94;
      letter-spacing:.6px;
      text-shadow:0 3px 0 #ffffffd6;
    }

    .title[data-title-role="brand"],
    .title:not([data-title-role]){
      font-family:var(--font-family-heading-brand);
      font-weight:var(--font-weight-heading-brand);
      font-size:calc(42px * var(--title-scale));
    }

    .title[data-title-role="brand"]{
      display:flex;
      justify-content:center;
      align-items:center;
    }

    .start-logo{
      display:block;
      width:calc(891px * var(--title-scale));
      max-width:min(82%, 1170px);
      height:auto;
      margin-inline:auto;
      filter:drop-shadow(0 3px 0 #ffffffd2);
    }

    .title[data-title-role="sub"],
    .pause-title{
      font-family:var(--font-family-heading-sub);
      font-weight:var(--font-weight-heading-sub);
    }

    .title[data-title-role="sub"]{
      font-size:calc(36.8px * var(--title-scale));
    }

    .subtitle{
      margin:0 0 calc(14px * var(--ui-scale));
      font-size:calc(16px * var(--ui-scale));
      line-height:var(--font-line-height-body);
      font-weight:var(--font-weight-body);
      color:#2f4b69;
    }

    .nowrap-inline{
      white-space:nowrap;
    }

    .how{
      margin:0 0 calc(18px * var(--ui-scale));
      padding:calc(14px * var(--ui-scale)) calc(16px * var(--ui-scale));
      border-radius:20px;
      border:2px dashed #ffca7f;
      background:
        linear-gradient(90deg, #ffe5f2d9 0%, #fff1d5e0 45%, #e5ffdbe0 100%);
      font-size:calc(15px * var(--ui-scale));
      font-weight:var(--font-weight-body);
      line-height:var(--font-line-height-body);
      color:#29435f;
    }

    .start-actions{
      display:grid;
      gap:calc(10px * var(--ui-scale));
      width:min(100%, var(--overlay-shared-row-width));
      max-width:100%;
      margin:calc(8px * var(--ui-scale)) auto 0;
      justify-items:stretch;
    }

    .audio-controls-row{
      display:flex;
      gap:var(--overlay-audio-gap);
      justify-content:center;
      align-items:stretch;
      flex-wrap:nowrap;
      width:100%;
    }

    .audio-controls-row > button,
    .audio-channel-controls > button{
      min-height:calc(42px * var(--ui-scale));
    }

    #startBtn,
    #resumeBtn{
      background:
        linear-gradient(180deg, rgba(255,255,255,.42), rgba(255,255,255,0) 46%),
        linear-gradient(100deg, #ff9cc7 0%, #ffd59a 52%, #fff0a6 100%);
      color:#7a214d;
      letter-spacing:.04em;
      border:2px solid #ffffffea;
      box-shadow:
        0 10px 20px rgba(32,48,73,.18),
        inset 0 1px 0 rgba(255,255,255,.75);
      text-shadow:
        0 1px 0 rgba(255,255,255,.7),
        0 2px 6px rgba(255, 163, 203, .25);
    }

    #startBtn{
      width:100%;
      min-height:calc(50.4px * var(--ui-scale));
      padding:calc(12px * var(--ui-scale)) calc(20px * var(--ui-scale));
      font-size:calc(18px * var(--ui-scale));
      font-weight:800;
    }

    #startBtn:hover,
    #resumeBtn:hover{
      color:#6d1c45;
      background:
        linear-gradient(180deg, rgba(255,255,255,.5), rgba(255,255,255,.06) 48%),
        linear-gradient(100deg, #ffa8cf 0%, #ffddb0 52%, #fff4b8 100%);
      box-shadow:
        0 12px 24px rgba(32,48,73,.22),
        inset 0 1px 0 rgba(255,255,255,.85);
      text-shadow:
        0 1px 0 rgba(255,255,255,.78),
        0 2px 8px rgba(255, 163, 203, .28);
    }

    #soundBtn,
    #pauseSoundBtn{
      background:linear-gradient(180deg, #f2f9ff, #dff1ff);
      color:#204463;
      padding:calc(10px * var(--ui-scale)) calc(14px * var(--ui-scale));
      font-size:calc(13px * var(--ui-scale));
      letter-spacing:.2px;
      width:var(--overlay-audio-button-width);
      white-space:nowrap;
    }

    .audio-channel-controls{
      display:none;
      gap:var(--overlay-audio-gap);
      justify-content:center;
      align-items:stretch;
      flex-wrap:nowrap;
    }

    :root[data-audio-channel-controls="1"] .audio-channel-controls{
      display:flex;
    }

    :root:not([data-audio-channel-controls="1"]) #pauseBgmChannelBtn,
    :root:not([data-audio-channel-controls="1"]) #pauseSfxChannelBtn{
      display:none;
    }

    #bgmChannelBtn,
    #sfxChannelBtn,
    #pauseBgmChannelBtn,
    #pauseSfxChannelBtn{
      padding:calc(10px * var(--ui-scale)) calc(14px * var(--ui-scale));
      font-size:calc(13px * var(--ui-scale));
      letter-spacing:.2px;
      color:#234567;
      background:linear-gradient(180deg, #f8f6ff, #e8eeff);
      border:2px solid #ffffffd4;
      box-shadow:0 8px 18px rgba(37,71,113,.16);
      width:var(--overlay-audio-button-width);
      white-space:nowrap;
    }

    #bgmChannelBtn:disabled,
    #sfxChannelBtn:disabled,
    #pauseBgmChannelBtn:disabled,
    #pauseSfxChannelBtn:disabled{
      color:#6f7f93;
      background:linear-gradient(180deg, #eceff4, #dde3ea);
      border-color:#ffffffa6;
      box-shadow:none;
      opacity:.78;
      cursor:not-allowed;
      filter:saturate(.2);
    }

    .note{
      font-size:calc(12px * var(--ui-scale));
      font-weight:var(--font-weight-body);
      color:#496683;
      opacity:.84;
      margin-top:calc(10px * var(--ui-scale));
      line-height:var(--font-line-height-body);
    }

    .credit{
      position:absolute;
      bottom:calc(8px * var(--ui-scale));
      right:calc(16px * var(--ui-scale));
      font-size:calc(10px * var(--ui-scale));
      font-weight:var(--font-weight-body);
      color:#496683;
      opacity:.5;
    }

    :root[data-device="mobile"] .hud{
      grid-template-columns:1fr;
      gap:8px;
    }

    :root[data-device="mobile"] .hud-main{
      grid-template-columns:repeat(2, minmax(0,1fr));
    }

    :root[data-device="mobile"] .hud-side{
      justify-items:stretch;
    }

    :root[data-device="mobile"] .btns{
      justify-content:space-between;
      width:100%;
    }

    :root[data-device="mobile"] .badge{
      justify-self:flex-start;
      max-width:100%;
    }

    :root[data-device="mobile"] .hud-main > .badge{
      width:min(100%, 420px);
    }

    :root[data-device="mobile"] .wrap,
    :root[data-device="mobile"] .stat-card,
    :root[data-device="mobile"] .overlay{
      backdrop-filter:none;
    }

    :root[data-device="desktop"] .audio-controls-row > #soundBtn{
      flex:1.75 1 0;
      width:auto;
      min-width:0;
    }

    :root[data-device="desktop"] .audio-controls-row > .audio-channel-controls{
      flex:2 1 0;
      min-width:0;
    }

    :root[data-device="desktop"] .audio-channel-controls{
      min-width:0;
    }

    :root[data-device="desktop"] .audio-channel-controls > #bgmChannelBtn,
    :root[data-device="desktop"] .audio-channel-controls > #sfxChannelBtn{
      flex:1 1 0;
      width:auto;
      min-width:0;
    }

    :root[data-device="desktop"] #pauseSoundBtn{
      flex:1.75 1 0;
      width:auto;
      min-width:0;
    }

    :root[data-device="desktop"] #pauseBgmChannelBtn,
    :root[data-device="desktop"] #pauseSfxChannelBtn{
      flex:1 1 0;
      width:auto;
      min-width:0;
    }

    :root[data-device="mobile"]{
      --overlay-shared-row-width:100%;
    }

    :root[data-device="mobile"] .start-actions,
    :root[data-device="mobile"] .pause-actions,
    :root[data-device="mobile"] .pause-audio-actions{
      width:100%;
      max-width:100%;
    }

    :root[data-device="mobile"] .audio-controls-row{
      width:100%;
      flex-wrap:nowrap;
    }

    :root[data-device="mobile"] .audio-controls-row > #soundBtn{
      flex:1.75 1 0;
      width:auto;
      min-width:0;
    }

    :root[data-device="mobile"] .audio-controls-row > .audio-channel-controls{
      flex:2 1 0;
      min-width:0;
    }

    :root[data-device="mobile"] .audio-channel-controls{
      gap:var(--overlay-audio-gap);
      flex-wrap:nowrap;
      min-width:0;
    }

    :root[data-device="mobile"] .audio-channel-controls > #bgmChannelBtn,
    :root[data-device="mobile"] .audio-channel-controls > #sfxChannelBtn{
      flex:1 1 0;
      width:auto;
      min-width:0;
    }

    :root[data-device="mobile"] .pause-audio-actions{
      display:flex;
      flex-wrap:nowrap;
      justify-content:center;
      align-items:stretch;
    }

    :root[data-device="mobile"] #pauseSoundBtn{
      flex:1.75 1 0;
      width:auto;
      min-width:0;
    }

    :root[data-device="mobile"] #pauseBgmChannelBtn,
    :root[data-device="mobile"] #pauseSfxChannelBtn{
      flex:1 1 0;
      width:auto;
      min-width:0;
    }

    :root[data-device="mobile"] #soundBtn,
    :root[data-device="mobile"] #pauseSoundBtn,
    :root[data-device="mobile"] #bgmChannelBtn,
    :root[data-device="mobile"] #sfxChannelBtn,
    :root[data-device="mobile"] #pauseBgmChannelBtn,
    :root[data-device="mobile"] #pauseSfxChannelBtn{
      padding-inline:calc(10px * var(--ui-scale));
    }

    :root[data-quality-tier="balanced"] body::before,
    :root[data-quality-tier="balanced"] body::after,
    :root[data-quality-tier="performance"] body::before,
    :root[data-quality-tier="performance"] body::after{
      animation:none;
      opacity:.26;
      filter:none;
    }

    :root[data-quality-tier="performance"] .wrap::before{
      mix-blend-mode:normal;
      opacity:.35;
    }

    @media (max-width: 980px) {
      :root{
        --hud-card-min-h:calc(62px * var(--hud-scale));
        --hud-value-min-h:calc(26px * var(--hud-scale));
        --hud-scale:0.91;
      }

      .wrap{
        width:min(100vw, 980px);
      }

      .hud-main{
        gap:8px;
      }
    }

    @media (max-width: 700px) {
      :root{
        --hud-card-min-h:58px;
        --hud-card-pad-y:6px;
        --hud-value-min-h:24px;
        --hud-score-gap:0px;
        --life-heart-size:clamp(40px, 12vw, 50px);
        --life-heart-gap:clamp(2px, 0.8vw, 3px);
        --hud-scale:0.83;
      }

      body{ place-items:stretch; }

      .wrap{
        width:100%;
        max-width:100%;
        height:100dvh;
        aspect-ratio:auto;
        border-radius:0;
        border:none;
      }

      .hud-main{
        grid-template-columns:minmax(0, 1.4fr) minmax(0, 1fr);
        gap:6px;
      }

      .stat-card{
        border-radius:16px;
      }

      .score-card .stat-value{
        margin-top:-1px;
      }

      .score-shell::before{
        inset:-2px -8px -5px -8px;
      }

      .btns button{
        flex:1 1 auto;
      }

      .card{
        width:min(640px, 95vw);
      }

      .start-logo{
        max-width:min(88%, 1035px);
      }
    }

    @keyframes skyDrift{
      0%{ transform:translateX(0px); }
      50%{ transform:translateX(12px); }
      100%{ transform:translateX(0px); }
    }

    @keyframes feverBadgePulse{
      0%,100%{ transform:scale(1); filter:saturate(1); }
      50%{ transform:scale(1.03); filter:saturate(1.12); }
    }

    @keyframes scoreFeverGlow{
      0%,100%{ transform:translateY(0); filter:saturate(1); }
      50%{ transform:translateY(-1px); filter:saturate(1.16); }
    }

    @keyframes scoreAuraPulse{
      0%,100%{ transform:scale(1); filter:saturate(1); }
      50%{ transform:scale(1.02); filter:saturate(1.14); }
    }

    @keyframes liveStageCardPulse{
      0%,100%{
        transform:translateY(0);
        filter:saturate(1);
      }
      50%{
        transform:translateY(-1px);
        filter:saturate(1.08);
      }
    }

    @keyframes liveStageBannerBlink{
      0%, 55%, 100%{
        opacity:1;
        filter:brightness(1);
      }
      28%{
        opacity:.78;
        filter:brightness(1.12);
      }
      42%{
        opacity:.94;
        filter:brightness(1.2);
      }
    }

    @keyframes liveStageSpotlightSweep{
      0%{
        background-position:0 0, 0 0, 120% 0, 0 0;
      }
      100%{
        background-position:0 0, 0 0, -120% 0, 0 0;
      }
    }

    @keyframes liveStageFootlights{
      0%{
        background-position:0 0, 0 0, 0 0;
        filter:blur(.2px) saturate(1.04);
      }
      50%{
        filter:blur(.2px) saturate(1.14);
      }
      100%{
        background-position:30px 0, 15px 0, -15px 0;
        filter:blur(.2px) saturate(1.04);
      }
    }

    @keyframes liveStageMultiplierBlink{
      0%,100%{
        box-shadow:
          0 1px 0 rgba(255,246,212,.9) inset,
          0 0 8px rgba(255,198,108,.36),
          0 4px 10px rgba(15,18,29,.24);
      }
      50%{
        box-shadow:
          0 1px 0 rgba(255,248,220,.95) inset,
          0 0 12px rgba(255,214,132,.56),
          0 4px 10px rgba(15,18,29,.28);
      }
    }

    @keyframes liveStageBadgeHum{
      0%,100%{
        transform:scale(1);
        filter:saturate(1);
      }
      50%{
        transform:scale(1.02);
        filter:saturate(1.09);
      }
    }

    @keyframes dreamyCardFloat{
      0%,100%{
        transform:translateY(0);
        filter:saturate(1);
      }
      50%{
        transform:translateY(-1px);
        filter:saturate(1.03);
      }
    }

    @keyframes dreamyCloudPulse{
      0%,100%{
        opacity:.9;
        filter:blur(1.5px);
      }
      50%{
        opacity:1;
        filter:blur(1.2px);
      }
    }

    @keyframes dreamySparkleDrift{
      0%{
        transform:translateY(-52%) translateX(10px);
      }
      100%{
        transform:translateY(-52%) translateX(-14px);
      }
    }

    @keyframes dreamyBadgeSparkleDrift{
      0%{
        transform:translateX(10px);
      }
      100%{
        transform:translateX(-14px);
      }
    }

    @keyframes dreamyTwinkleDots{
      0%{
        background-position:0 0, 0 0, 0 0;
        opacity:.74;
      }
      50%{
        opacity:.94;
      }
      100%{
        background-position:18px 0, -10px 0, 10px 0;
        opacity:.74;
      }
    }

    @keyframes dreamyMultiplierGlow{
      0%,100%{
        box-shadow:
          0 1px 0 rgba(255,255,255,.95) inset,
          0 0 0 1px rgba(255,202,232,.68),
          0 0 8px rgba(255,209,239,.42),
          0 3px 8px rgba(189,206,240,.22);
      }
      50%{
        box-shadow:
          0 1px 0 rgba(255,255,255,.97) inset,
          0 0 0 1px rgba(201,239,255,.72),
          0 0 11px rgba(186,241,255,.52),
          0 4px 9px rgba(189,206,240,.26);
      }
    }

    @keyframes dreamyBadgeBob{
      0%,100%{
        transform:scale(1);
        filter:saturate(1);
      }
      50%{
        transform:scale(1.015);
        filter:saturate(1.03);
      }
    }

    @keyframes dreamySparkPulse{
      0%,100%{
        transform:scale(1) rotate(0deg);
        opacity:1;
      }
      50%{
        transform:scale(1.12) rotate(8deg);
        opacity:.9;
      }
    }

    @keyframes pauseFeverDreamyFloat{
      0%,100%{
        transform:translateY(0);
        filter:saturate(1);
      }
      50%{
        transform:translateY(-1px);
        filter:saturate(1.03);
      }
    }

    @keyframes dreamyLifeCardFloat{
      0%,100%{
        transform:translateY(0);
        filter:saturate(1);
      }
      50%{
        transform:translateY(-1px);
        filter:saturate(1.02);
      }
    }

    @keyframes dreamyLifeCloudDrift{
      0%{
        transform:translateY(-50%) translateX(8px);
      }
      100%{
        transform:translateY(-50%) translateX(-10px);
      }
    }

    @keyframes lifeHitPulse{
      0%{ transform:scale(1); }
      30%{ transform:scale(1.3); }
      70%{ transform:scale(.92); }
      100%{ transform:scale(1); }
    }

    @keyframes hudDamageShake{
      0%,100%{ transform:translate3d(0,0,0); }
      20%{ transform:translate3d(-6px,0,0); }
      40%{ transform:translate3d(5px,-1px,0); }
      60%{ transform:translate3d(-4px,1px,0); }
      80%{ transform:translate3d(3px,0,0); }
    }

    .wrap.damage-1{
      animation:hudDamageShake .26s ease-out;
    }

    .wrap.damage-2{
      animation:hudDamageShake .34s ease-out;
    }

    .wrap.damage-3{
      animation:hudDamageShake .42s ease-out;
    }

    .wrap.life-caution{
      box-shadow:
        0 0 0 1px rgba(255,169,106,.35) inset,
        var(--shadow-strong);
    }

    .wrap.life-critical{
      box-shadow:
        0 0 0 2px rgba(255,104,152,.46) inset,
        0 0 24px rgba(255,98,156,.26),
        var(--shadow-strong);
    }

    .wrap.life-critical::after{
      opacity:0;
      animation:lifeCriticalScreenPulse 2.52s ease-in-out infinite;
    }

    .wrap.life-critical .stat-card[aria-label="ライフ"]{
      transform-origin:50% 50%;
      animation:lifeCriticalCardPulse 1.08s ease-in-out infinite;
    }

    .hearts.life-critical .life-heart.on{
      animation:lifeCriticalAlarm 1.08s ease-in-out infinite;
    }

    @keyframes lifeCriticalAlarm{
      0%,100%{
        transform:scale(1);
        filter:saturate(1);
      }
      50%{
        transform:scale(1.1);
        filter:saturate(1.25);
      }
    }

    @keyframes lifeCriticalCardPulse{
      0%,100%{
        transform:scale(1);
        box-shadow:var(--shadow-soft);
      }
      50%{
        transform:scale(1.018);
        box-shadow:
          0 0 0 2px rgba(255,122,172,.22) inset,
          0 0 14px rgba(255,94,152,.24),
          var(--shadow-soft);
      }
    }

    @keyframes lifeCriticalScreenPulse{
      0%, 100%{
        opacity:0;
        filter:saturate(1);
      }
      22%{
        opacity:.132;
        filter:saturate(1.01);
      }
      52%{
        opacity:.748;
        filter:saturate(1.04);
      }
      72%{
        opacity:.154;
        filter:saturate(1.03);
      }
    }

    @keyframes hudDamageShakeReduced{
      0%,100%{ transform:translate3d(0,0,0); }
      20%{ transform:translate3d(-2px,0,0); }
      40%{ transform:translate3d(2px,0,0); }
      60%{ transform:translate3d(-1px,0,0); }
      80%{ transform:translate3d(1px,0,0); }
    }

    @keyframes lifeCriticalAlarmReduced{
      0%,100%{
        transform:scale(1);
        filter:saturate(1);
      }
      50%{
        transform:scale(1.05);
        filter:saturate(1.12);
      }
    }

    @keyframes lifeCriticalCardPulseReduced{
      0%,100%{
        transform:scale(1);
        box-shadow:var(--shadow-soft);
      }
      50%{
        transform:scale(1.01);
        box-shadow:
          0 0 0 1px rgba(255,122,172,.16) inset,
          0 0 8px rgba(255,94,152,.16),
          var(--shadow-soft);
      }
    }

    @media (prefers-reduced-motion: reduce) {
      body::before,
      body::after,
      .badge.fever-neon,
      .hud[data-fever-ui-theme="live-stage-v1"] .score-card.is-fever,
      .hud[data-fever-ui-theme="live-stage-v1"] .score-card.is-fever::before,
      .hud[data-fever-ui-theme="live-stage-v1"] .score-card.is-fever::after,
      .hud[data-fever-ui-theme="live-stage-v1"] .score-card.is-fever .score-shell::before,
      .hud[data-fever-ui-theme="live-stage-v1"] .score-card.is-fever .score-multiplier,
      .hud[data-fever-ui-theme="live-stage-v1"] .badge.fever-neon::before,
      .hud[data-fever-ui-theme="live-stage-v1"] .badge.fever-neon::after,
      .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever,
      .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever::after,
      .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever .score-shell::before,
      .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever .score-shell::after,
      .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever .score-multiplier,
      .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever + .stat-card[aria-label="ライフ"],
      .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever + .stat-card[aria-label="ライフ"]::after,
      .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .score-card.is-fever + .stat-card[aria-label="ライフ"] .hearts::before,
      .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .badge.fever-neon::before,
      .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .badge.fever-neon::after,
      .hud[data-fever-ui-theme="dreamy-kawaii-v1"] .badge.fever-neon .spark,
      .pause-panel[data-fever-pause="on"] .pause-card,
      .pause-panel[data-fever-pause="on"] .pause-card::before,
      .pause-panel[data-fever-pause="on"] .pause-card::after{
        animation:none !important;
      }

      .overlay,
      button,
      #score{
        transition:none;
      }

      .score-card.is-fever,
      .score-card.is-fever .score-shell::before{
        animation:none !important;
      }

      .wrap.damage-1,
      .wrap.damage-2,
      .wrap.damage-3{
        animation-name:hudDamageShakeReduced;
        animation-duration:.2s;
      }

      .hearts.life-critical .life-heart.on{
        animation-name:lifeCriticalAlarmReduced;
        animation-duration:1.62s;
      }

      .wrap.life-critical .stat-card[aria-label="ライフ"]{
        animation-name:lifeCriticalCardPulseReduced;
        animation-duration:1.62s;
      }

      .wrap.life-critical::after{
        animation-name:lifeCriticalScreenPulse;
        animation-duration:3.42s;
        opacity:0;
      }
    }