/* QuantaCade Energy Snake Build 1 */
.qc-es-wrap,
.qc-es-wrap * { box-sizing: border-box; }
.qc-es-wrap {
  --qc-bg:#070923;
  --qc-card:rgba(32,35,76,.88);
  --qc-card2:rgba(44,48,98,.76);
  --qc-border:rgba(130,185,255,.22);
  --qc-text:#f8fbff;
  --qc-muted:rgba(233,241,255,.72);
  --qc-blue:#78dcff;
  --qc-gold:#ffd36f;
  --qc-green:#20f5ad;
  --qc-purple:#9a8cff;
  --qc-red:#ff6b8d;
  color:var(--qc-text);
  background:
    radial-gradient(circle at 20% 10%, rgba(120,220,255,.22), transparent 32%),
    radial-gradient(circle at 84% 22%, rgba(154,140,255,.18), transparent 34%),
    linear-gradient(135deg,#070923,#14173c 45%,#070923);
  border:1px solid var(--qc-border);
  border-radius:18px;
  padding:clamp(14px,2vw,24px);
  box-shadow:0 20px 70px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.08);
  overflow:hidden;
  position:relative;
}
.qc-es-wrap:before{content:"";position:absolute;inset:-55% -35%;z-index:0;pointer-events:none;background:linear-gradient(105deg,transparent 31%,rgba(120,220,255,0) 39%,rgba(120,220,255,.12) 46%,rgba(255,255,255,.17) 49%,rgba(154,140,255,.10) 53%,rgba(120,220,255,0) 61%,transparent 70%);opacity:.44;mix-blend-mode:screen;transform:translateX(-72%) rotate(2deg);animation:qcEsSearchlightSweep 12s ease-in-out infinite}.qc-es-wrap:after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(circle at 18% 72%,rgba(120,220,255,.08),transparent 28%),radial-gradient(circle at 78% 38%,rgba(154,140,255,.07),transparent 30%);opacity:.62;animation:qcEsAmbientGlowDrift 16s ease-in-out infinite alternate}.qc-es-wrap>*{position:relative;z-index:1}
.qc-es-header{display:flex;gap:16px;justify-content:space-between;align-items:flex-start;margin-bottom:12px}.qc-es-kicker{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--qc-blue);font-weight:900}.qc-es-title{margin:3px 0 4px;font-size:clamp(30px,4vw,48px);line-height:1;font-weight:1000;letter-spacing:-.04em;text-shadow:0 0 24px rgba(120,220,255,.18)}.qc-es-subtitle{margin:0;color:var(--qc-muted);max-width:950px;font-size:14px;line-height:1.45}.qc-es-pill{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--qc-border);background:rgba(255,255,255,.08);padding:8px 12px;border-radius:999px;font-weight:900;white-space:nowrap;color:#fff}
.qc-es-mode-banner{display:flex;gap:10px;align-items:center;justify-content:space-between;margin:0 0 14px;padding:11px 13px;border:1px solid rgba(120,220,255,.28);background:linear-gradient(135deg,rgba(38,45,88,.84),rgba(45,39,86,.78));border-radius:16px;color:var(--qc-text);box-shadow:inset 0 0 28px rgba(120,220,255,.06);position:relative;overflow:hidden}.qc-es-mode-banner strong{letter-spacing:.08em;text-transform:uppercase;font-size:12px;color:var(--qc-blue)}.qc-es-mode-banner span{color:var(--qc-muted);font-size:13px;text-align:right}.qc-es-mode-banner.is-subscribed{border-color:rgba(32,245,173,.34);box-shadow:0 0 24px rgba(32,245,173,.10), inset 0 0 28px rgba(32,245,173,.05)}.qc-es-mode-banner.is-guest{border-color:rgba(255,211,111,.34)}
.qc-es-grid{display:grid;grid-template-columns:minmax(420px,1fr) minmax(280px,360px);gap:16px;align-items:start}.qc-es-board-card,.qc-es-panel,.qc-lb-card,.qc-lb-kpi{background:linear-gradient(135deg,rgba(38,45,88,.84),rgba(45,39,86,.78));border:1px solid var(--qc-border);border-radius:18px;padding:12px;backdrop-filter:blur(10px);position:relative;overflow:hidden;box-shadow:inset 0 0 34px rgba(120,220,255,.04),0 16px 40px rgba(0,0,0,.20)}.qc-es-board-card:after,.qc-es-panel:after,.qc-lb-card:after,.qc-lb-kpi:after{content:"";position:absolute;inset:-70% -45%;z-index:0;pointer-events:none;background:linear-gradient(102deg,transparent 36%,rgba(120,220,255,0) 43%,rgba(120,220,255,.09) 48%,rgba(255,255,255,.13) 50%,rgba(154,140,255,.07) 53%,rgba(120,220,255,0) 59%,transparent 68%);opacity:.32;mix-blend-mode:screen;transform:translateX(-84%) rotate(1deg);animation:qcEsPanelSearchlight 9.5s ease-in-out infinite}.qc-es-panel:after{animation-delay:1.7s}.qc-lb-card:after{animation-delay:2.9s;opacity:.24}.qc-es-board-card>*,.qc-es-panel>*,.qc-lb-card>*,.qc-lb-kpi>*{position:relative;z-index:1}
.qc-es-board-card{padding:14px}.qc-es-board-shell{width:100%;max-width:980px;margin:0 auto;border-radius:18px;padding:10px;background:radial-gradient(circle at 50% 50%,rgba(120,220,255,.08),transparent 65%),rgba(0,0,0,.30);border:1px solid rgba(255,255,255,.16);box-shadow:0 0 34px rgba(120,220,255,.12),inset 0 0 40px rgba(0,0,0,.38);position:relative;isolation:isolate}.qc-es-board-shell:before{content:"";position:absolute;inset:-20px;border-radius:28px;background:radial-gradient(circle,rgba(120,220,255,.16),transparent 48%),radial-gradient(circle at 68% 30%,rgba(255,211,111,.10),transparent 42%),radial-gradient(circle at 30% 70%,rgba(154,140,255,.14),transparent 48%);filter:blur(13px);opacity:.45;z-index:-1;animation:qcEsBoardBreath 4.8s ease-in-out infinite}.qc-es-canvas-wrap{position:relative;width:100%}#qcEnergySnakeCanvas{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#071126;border-radius:12px;image-rendering:pixelated;box-shadow:inset 0 0 30px rgba(0,0,0,.42)}.qc-es-status{margin-top:8px;min-height:22px;color:var(--qc-muted);font-size:13px}.qc-es-idle-prompt{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;text-align:center;min-width:min(280px,54%);padding:13px 18px;border-radius:999px;border:1px solid rgba(255,211,111,.55);background:linear-gradient(135deg,rgba(8,11,42,.88),rgba(20,23,60,.70));box-shadow:0 0 0 2px rgba(255,211,111,.16),0 0 30px rgba(255,211,111,.24),0 0 54px rgba(120,220,255,.16),inset 0 0 22px rgba(255,211,111,.08);pointer-events:auto;cursor:pointer;user-select:none;animation:qcEsPromptBreath 3.8s ease-in-out infinite}.qc-es-idle-prompt:hover,.qc-es-idle-prompt:focus{border-color:rgba(255,211,111,.82);box-shadow:0 0 0 2px rgba(255,211,111,.28),0 0 34px rgba(255,211,111,.34),0 0 62px rgba(120,220,255,.20),inset 0 0 24px rgba(255,211,111,.11);outline:none}.qc-es-idle-prompt.is-hidden{display:none}.qc-es-idle-prompt span{display:block;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:rgba(248,251,255,.82);font-weight:950;line-height:1.15}.qc-es-idle-prompt strong{display:block;font-size:clamp(16px,2.3vw,24px);letter-spacing:.08em;text-transform:uppercase;color:#fff;text-shadow:0 0 16px rgba(255,211,111,.42);line-height:1.05;margin:2px 0}.qc-es-rotate-overlay{position:absolute;inset:0;display:none;align-items:center;justify-content:center;text-align:center;padding:22px;background:rgba(5,7,17,.84);border-radius:12px;z-index:5}.qc-es-rotate-overlay.is-visible{display:flex}.qc-es-rotate-card{max-width:390px;border:1px solid rgba(255,211,111,.46);border-radius:20px;background:linear-gradient(135deg,rgba(8,11,42,.94),rgba(32,35,76,.88));padding:20px;box-shadow:0 0 0 2px rgba(255,211,111,.18),0 0 34px rgba(255,211,111,.24),inset 0 0 26px rgba(120,220,255,.08)}.qc-es-rotate-card h3{margin:0 0 8px;font-size:26px;color:#fff}.qc-es-rotate-card p{margin:0;color:var(--qc-muted)}
.qc-es-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:14px}.qc-es-stat{background:rgba(0,0,0,.22);border:1px solid rgba(255,255,255,.14);border-radius:14px;padding:9px 8px;min-width:0;position:relative;overflow:hidden;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}.qc-es-stat span{display:block;color:var(--qc-muted);font-size:11px;text-transform:uppercase;letter-spacing:.08em;font-weight:900}.qc-es-stat strong{display:block;margin-top:3px;font-size:clamp(19px,2.2vw,24px);line-height:1;color:#fff}.qc-es-stat:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.22),transparent);transform:translateX(-130%);opacity:0;pointer-events:none}.qc-es-stat-pulse{transform:translateY(-1px);border-color:rgba(120,220,255,.65);box-shadow:0 0 22px rgba(120,220,255,.22),inset 0 0 20px rgba(120,220,255,.08)}.qc-es-stat-pulse:after{animation:qcEsStatSweep .72s ease-out}.qc-es-charge-bar{grid-column:1/-1;border:1px solid rgba(120,220,255,.18);border-radius:999px;background:rgba(0,0,0,.26);height:16px;overflow:hidden;box-shadow:inset 0 0 12px rgba(0,0,0,.35)}.qc-es-charge-fill{height:100%;width:0;background:linear-gradient(90deg,var(--qc-blue),var(--qc-green),var(--qc-gold),var(--qc-purple));border-radius:999px;box-shadow:0 0 18px rgba(255,211,111,.26);transition:width .18s ease}.qc-es-panel-label{display:block;color:var(--qc-muted);font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.08em;margin:0 0 5px}.qc-es-controls,.qc-es-actions{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.qc-es-actions{padding-top:4px;border-top:1px solid rgba(255,255,255,.08)}.qc-es-btn,.qc-es-select{border:1px solid var(--qc-border);border-radius:12px;background:rgba(255,255,255,.11);color:var(--qc-text);padding:10px 12px;font-weight:900;min-height:42px}.qc-es-btn{cursor:pointer;transition:transform .16s ease,background .16s ease,border-color .16s ease,box-shadow .16s ease,color .16s ease}.qc-es-btn:hover,.qc-es-btn:focus{color:#fff;border-color:rgba(255,211,111,.82);background:rgba(255,211,111,.10);box-shadow:0 0 0 2px rgba(255,211,111,.34),0 0 24px rgba(255,211,111,.40),0 0 48px rgba(255,211,111,.22),inset 0 0 22px rgba(255,211,111,.11);transform:translateY(-1px);outline:none}.qc-es-btn:disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}.qc-es-btn-primary{background:linear-gradient(135deg,rgba(120,220,255,.28),rgba(32,245,173,.14));border-color:rgba(120,220,255,.52);box-shadow:0 0 18px rgba(120,220,255,.12)}.qc-es-btn-danger{border-color:rgba(255,107,141,.55)}.qc-es-help{color:var(--qc-muted);font-size:13px;line-height:1.45}.qc-es-particle-key{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin:10px 0}.qc-es-key-item{display:flex;align-items:center;gap:7px;color:rgba(248,251,255,.86);font-size:12px;font-weight:800;border:1px solid rgba(120,220,255,.13);border-radius:12px;background:rgba(5,8,28,.28);padding:7px}.qc-es-dot{width:12px;height:12px;border-radius:50%;display:inline-block;box-shadow:0 0 14px currentColor}.qc-es-dot-blue{color:var(--qc-blue);background:var(--qc-blue)}.qc-es-dot-gold{color:var(--qc-gold);background:var(--qc-gold)}.qc-es-dot-green{color:var(--qc-green);background:var(--qc-green)}.qc-es-dot-purple{color:var(--qc-purple);background:var(--qc-purple)}.qc-es-mobile-pad{display:none;grid-template-columns:repeat(3,60px);grid-template-rows:repeat(3,50px);gap:8px;justify-content:center;margin-top:12px}.qc-es-mobile-pad button{min-height:48px;border-radius:14px;border:1px solid var(--qc-border);background:rgba(255,255,255,.12);color:var(--qc-text);font-weight:1000;font-size:18px}.qc-es-mobile-pad .qc-es-pad-up{grid-column:2}.qc-es-mobile-pad .qc-es-pad-left{grid-column:1;grid-row:2}.qc-es-mobile-pad .qc-es-pad-right{grid-column:3;grid-row:2}.qc-es-mobile-pad .qc-es-pad-down{grid-column:2;grid-row:3}.qc-es-pop{position:absolute;z-index:4;left:50%;top:45%;transform:translate(-50%,-50%);font-weight:1000;letter-spacing:.06em;text-shadow:0 0 18px rgba(120,220,255,.85),0 0 34px rgba(154,140,255,.55);pointer-events:none;animation:qcEsPointFloat 1.12s ease-out forwards;white-space:nowrap}.qc-es-pop-blue{color:var(--qc-blue);font-size:28px}.qc-es-pop-gold{color:var(--qc-gold);font-size:38px}.qc-es-pop-green{color:var(--qc-green);font-size:32px}.qc-es-pop-purple{color:var(--qc-purple);font-size:42px}.qc-es-overdrive .qc-es-board-shell{animation:qcEsOverdriveShell .92s ease-in-out infinite}.qc-es-overdrive #qcEnergySnakeCanvas{box-shadow:0 0 44px rgba(255,211,111,.32),0 0 90px rgba(154,140,255,.22),inset 0 0 36px rgba(255,211,111,.12)}
.qc-game-leaderboard{margin-top:18px;width:100%}.qc-lb-breaks{line-height:1;height:1.6em}.qc-game-leaderboard-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-end;flex-wrap:wrap;margin-bottom:12px}.qc-game-leaderboard-head h2{margin:0;font-size:clamp(24px,3vw,34px);line-height:1}.qc-game-leaderboard-head p{margin:6px 0 0;color:var(--qc-muted);max-width:840px}.qc-lb-dashboard-inner{width:100%}.qc-lb-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;transition:opacity .18s ease,transform .18s ease}.qc-lb-card{padding:14px}.qc-lb-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:10px}.qc-lb-card h3{margin:0;font-size:24px}.qc-lb-rank-chip{color:var(--qc-blue);font-size:11px;font-weight:900;letter-spacing:.05em;text-transform:uppercase;border:1px solid rgba(120,220,255,.22);background:rgba(120,220,255,.08);border-radius:999px;padding:6px 8px;white-space:nowrap}.qc-lb-muted{color:var(--qc-muted)}.qc-lb-scroll{max-height:432px;overflow-y:auto;border-radius:12px;border:1px solid rgba(255,255,255,.08)}.qc-lb-scroll::-webkit-scrollbar{width:9px}.qc-lb-scroll::-webkit-scrollbar-thumb{background:rgba(120,220,255,.35);border-radius:999px}.qc-lb-table{width:100%;border-collapse:collapse;font-size:14px}.qc-lb-table th,.qc-lb-table td{padding:9px 8px;border-bottom:1px solid rgba(255,255,255,.1);text-align:left}.qc-lb-table th{position:sticky;top:0;z-index:1;color:var(--qc-blue);font-size:12px;text-transform:uppercase;letter-spacing:.08em;background:rgba(8,10,35,.95);backdrop-filter:blur(8px)}.qc-lb-table strong{color:var(--qc-green)}.qc-lb-user-row{background:rgba(32,245,173,.11);box-shadow:inset 0 0 22px rgba(32,245,173,.18);animation:qcEsUserRowGlow 2.8s ease-in-out infinite}.qc-lb-user-row td:first-child{border-left:3px solid var(--qc-green)}.qc-lb-footnote{color:var(--qc-muted);font-size:11px;margin-top:8px}.qc-lb-live-chip{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(32,245,173,.32);background:rgba(32,245,173,.10);color:var(--qc-green);border-radius:999px;padding:8px 12px;font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.qc-lb-live-chip:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--qc-green);box-shadow:0 0 14px rgba(32,245,173,.8);animation:qcEsLiveDot 1.7s ease-in-out infinite}.qc-lb-status{margin-top:8px;color:var(--qc-muted);font-size:12px;text-align:right}#qcEnergySnakeLeaderboardPanel{transition:opacity .18s ease,transform .18s ease}#qcEnergySnakeLeaderboardPanel.qc-lb-refreshing{opacity:.62;transform:translateY(1px)}#qcEnergySnakeLeaderboardPanel.qc-lb-updated{animation:qcEsLbUpdated .72s ease-out}
@keyframes qcEsSearchlightSweep{0%{transform:translateX(-72%) rotate(2deg);opacity:.18}18%{opacity:.44}44%{opacity:.36}58%{transform:translateX(72%) rotate(2deg);opacity:.28}100%{transform:translateX(72%) rotate(2deg);opacity:0}}@keyframes qcEsPanelSearchlight{0%,34%{transform:translateX(-84%) rotate(1deg);opacity:0}46%{opacity:.34}66%{transform:translateX(84%) rotate(1deg);opacity:.2}100%{transform:translateX(84%) rotate(1deg);opacity:0}}@keyframes qcEsAmbientGlowDrift{0%{opacity:.42;filter:hue-rotate(0deg);transform:scale(1)}100%{opacity:.68;filter:hue-rotate(14deg);transform:scale(1.02)}}@keyframes qcEsBoardBreath{0%,100%{opacity:.35;transform:scale(.98)}50%{opacity:.68;transform:scale(1.035)}}@keyframes qcEsPromptBreath{0%,100%{opacity:.78;transform:translate(-50%,-50%) scale(.98);filter:drop-shadow(0 0 10px rgba(255,211,111,.26))}50%{opacity:1;transform:translate(-50%,-50%) scale(1.035);filter:drop-shadow(0 0 18px rgba(255,211,111,.44)) drop-shadow(0 0 26px rgba(120,220,255,.24))}}@keyframes qcEsStatSweep{0%{opacity:0;transform:translateX(-130%)}20%{opacity:1}100%{opacity:0;transform:translateX(130%)}}@keyframes qcEsPointFloat{0%{opacity:0;transform:translate(-50%,-32%) scale(.74);filter:blur(4px)}18%{opacity:1;transform:translate(-50%,-50%) scale(1.08);filter:blur(0)}100%{opacity:0;transform:translate(-50%,-115%) scale(1);filter:blur(2px)}}@keyframes qcEsOverdriveShell{0%,100%{box-shadow:0 0 34px rgba(120,220,255,.12),inset 0 0 40px rgba(0,0,0,.38)}50%{box-shadow:0 0 52px rgba(255,211,111,.36),0 0 96px rgba(154,140,255,.20),inset 0 0 44px rgba(255,211,111,.12)}}@keyframes qcEsUserRowGlow{0%,100%{box-shadow:inset 0 0 14px rgba(32,245,173,.12)}50%{box-shadow:inset 0 0 26px rgba(32,245,173,.28)}}@keyframes qcEsLiveDot{0%,100%{opacity:.55;transform:scale(.9)}50%{opacity:1;transform:scale(1.16)}}@keyframes qcEsLbUpdated{0%{box-shadow:0 0 0 rgba(32,245,173,0)}45%{box-shadow:0 0 34px rgba(32,245,173,.24)}100%{box-shadow:0 0 0 rgba(32,245,173,0)}}
@media(max-width:1100px){.qc-es-grid{grid-template-columns:1fr}.qc-es-panel{max-width:none}.qc-es-board-shell{max-width:100%}.qc-lb-grid{grid-template-columns:1fr}}@media(max-width:760px){.qc-es-header{display:block}.qc-es-pill{margin-top:10px}.qc-es-board-card{padding:10px}.qc-es-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.qc-es-mobile-pad{display:grid}.qc-es-particle-key{grid-template-columns:1fr 1fr}.qc-es-mode-banner{display:block}.qc-es-mode-banner span{display:block;text-align:left;margin-top:4px}.qc-es-idle-prompt{min-width:min(250px,64%);padding:11px 14px}}@media(max-width:520px){.qc-es-stats{grid-template-columns:1fr 1fr}.qc-es-actions .qc-es-btn{flex:1 1 45%}.qc-es-particle-key{grid-template-columns:1fr}.qc-lb-table{font-size:12px}.qc-lb-table th,.qc-lb-table td{padding:8px 6px}}
@media(prefers-reduced-motion:reduce){.qc-es-wrap:before,.qc-es-wrap:after,.qc-es-board-shell:before,.qc-es-idle-prompt,.qc-es-board-card:after,.qc-es-panel:after,.qc-lb-card:after,.qc-lb-kpi:after,.qc-lb-live-chip:before,.qc-lb-user-row{animation:none!important}}

/* Energy Snake Audio Build 004: volume sliders + preview button */
.qc-es-audio-controls{
  display:grid;
  gap:10px;
  margin:10px 0 12px;
  padding:11px;
  border:1px solid rgba(120,220,255,.16);
  border-radius:14px;
  background:rgba(5,8,28,.28);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.qc-es-audio-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.qc-es-audio-label{
  color:rgba(233,241,255,.72);
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-weight:950;
}
.qc-es-audio-test{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:32px;
  padding:7px 11px;
  border:1px solid rgba(120,220,255,.24);
  border-radius:999px;
  background:rgba(255,255,255,.055);
  color:#f8fbff;
  -webkit-text-fill-color:#f8fbff;
  font-size:10px;
  font-weight:950;
  letter-spacing:.07em;
  text-transform:uppercase;
  cursor:pointer;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 0 12px rgba(120,220,255,.06);
  transition:transform .16s ease,background .16s ease,border-color .16s ease,box-shadow .16s ease,color .16s ease;
}
.qc-es-audio-test:hover,
.qc-es-audio-test:focus,
.qc-es-audio-test:focus-visible{
  color:#fff;
  -webkit-text-fill-color:#fff;
  border-color:rgba(255,211,111,.82);
  background:rgba(255,211,111,.10);
  box-shadow:0 0 0 2px rgba(255,211,111,.28),0 0 22px rgba(255,211,111,.34),0 0 42px rgba(255,211,111,.18),inset 0 0 18px rgba(255,211,111,.10);
  transform:translateY(-1px);
  outline:none;
}
.qc-es-audio-slider-row{
  display:grid;
  grid-template-columns:82px minmax(0,1fr);
  align-items:center;
  gap:10px;
  padding:8px 9px;
  border:1px solid rgba(120,220,255,.13);
  border-radius:12px;
  background:rgba(0,0,0,.18);
}
.qc-es-audio-slider-row span{
  color:rgba(248,251,255,.86);
  font-size:11px;
  font-weight:950;
  letter-spacing:.07em;
  text-transform:uppercase;
}
.qc-es-audio-slider-row strong{
  display:block;
  margin-top:2px;
  color:#ffd36f;
  font-size:11px;
  text-shadow:0 0 10px rgba(255,211,111,.28);
}
.qc-es-audio-slider-row input[type="range"]{
  width:100%;
  accent-color:#ffd36f;
  cursor:pointer;
}
.qc-es-audio-slider-row input[type="range"]:focus{
  outline:none;
  filter:drop-shadow(0 0 10px rgba(255,211,111,.28));
}
@media(max-width:520px){
  .qc-es-audio-head{display:grid;grid-template-columns:1fr;justify-items:center;}
  .qc-es-audio-slider-row{grid-template-columns:1fr;gap:6px;text-align:center;}
}

/* Build 001 visual tune: visible gold reactor backlight when Charge reaches 100% / Overdrive is active. */
.qc-es-board-card.qc-es-charge-full,
.qc-es-wrap.qc-es-overdrive .qc-es-board-card {
  border-color: rgba(255,211,111,.70) !important;
  box-shadow:
    0 0 0 2px rgba(255,211,111,.18),
    0 0 38px rgba(255,211,111,.30),
    0 0 76px rgba(255,211,111,.18),
    0 18px 46px rgba(0,0,0,.24),
    inset 0 0 34px rgba(255,211,111,.10) !important;
}
.qc-es-board-shell.qc-es-charge-full,
.qc-es-wrap.qc-es-overdrive .qc-es-board-shell {
  border-color: rgba(255,211,111,.82) !important;
  background:
    radial-gradient(circle at 50% 50%, rgba(255,211,111,.13), transparent 62%),
    radial-gradient(circle at 50% 50%, rgba(120,220,255,.08), transparent 65%),
    rgba(0,0,0,.30) !important;
  box-shadow:
    0 0 0 2px rgba(255,211,111,.24),
    0 0 46px rgba(255,211,111,.42),
    0 0 96px rgba(255,211,111,.22),
    0 0 60px rgba(120,220,255,.16),
    inset 0 0 44px rgba(255,211,111,.13),
    inset 0 0 40px rgba(0,0,0,.30) !important;
  animation: qcEsChargeFullGoldBreath 1.95s ease-in-out infinite !important;
}
.qc-es-board-shell.qc-es-charge-full:before,
.qc-es-wrap.qc-es-overdrive .qc-es-board-shell:before {
  background:
    radial-gradient(circle, rgba(255,211,111,.34), transparent 45%),
    radial-gradient(circle at 36% 34%, rgba(255,211,111,.24), transparent 44%),
    radial-gradient(circle at 70% 66%, rgba(120,220,255,.20), transparent 46%),
    radial-gradient(circle at 50% 50%, rgba(154,140,255,.15), transparent 54%) !important;
  opacity: .84 !important;
  filter: blur(15px) !important;
}
.qc-es-board-shell.qc-es-charge-full #qcEnergySnakeCanvas,
.qc-es-wrap.qc-es-overdrive #qcEnergySnakeCanvas {
  box-shadow:
    0 0 34px rgba(255,211,111,.30),
    0 0 72px rgba(255,211,111,.18),
    inset 0 0 38px rgba(255,211,111,.12),
    inset 0 0 30px rgba(0,0,0,.42) !important;
}
@keyframes qcEsChargeFullGoldBreath {
  0%, 100% {
    box-shadow:
      0 0 0 2px rgba(255,211,111,.18),
      0 0 34px rgba(255,211,111,.34),
      0 0 72px rgba(255,211,111,.16),
      0 0 42px rgba(120,220,255,.12),
      inset 0 0 36px rgba(255,211,111,.10),
      inset 0 0 40px rgba(0,0,0,.30);
  }
  50% {
    box-shadow:
      0 0 0 2px rgba(255,211,111,.30),
      0 0 58px rgba(255,211,111,.50),
      0 0 112px rgba(255,211,111,.28),
      0 0 68px rgba(120,220,255,.18),
      inset 0 0 54px rgba(255,211,111,.17),
      inset 0 0 40px rgba(0,0,0,.26);
  }
}

/* Build 008: mobile control refinement.
   - Portrait mode is playable.
   - Swiping on the board controls the snake instead of scrolling the page.
   - Landscape phones show a smaller board on the left and D-pad on the right. */
.qc-es-rotate-overlay,
.qc-es-rotate-overlay.is-visible {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.qc-es-canvas-wrap,
#qcEnergySnakeCanvas,
.qc-es-board-shell,
.qc-es-mobile-pad,
.qc-es-mobile-pad button {
  touch-action: none;
  -ms-touch-action: none;
}

.qc-es-mobile-pad {
  grid-template-columns: repeat(3, 56px) !important;
  grid-template-rows: repeat(3, 50px) !important;
  gap: 8px !important;
  justify-content: center;
  align-items: center;
}
.qc-es-mobile-pad button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  min-width: 52px;
  border-radius: 16px;
  border: 1px solid var(--qc-border);
  background: rgba(255,255,255,.12);
  color: var(--qc-text);
  font-weight: 1000;
  font-size: 18px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 0 14px rgba(120,220,255,.08);
}
.qc-es-mobile-pad button:hover,
.qc-es-mobile-pad button:focus {
  color:#fff;
  border-color:rgba(255,211,111,.82);
  background:rgba(255,211,111,.10);
  box-shadow:0 0 0 2px rgba(255,211,111,.24),0 0 22px rgba(255,211,111,.26),inset 0 0 18px rgba(255,211,111,.08);
  outline:none;
}
.qc-es-mobile-pad .qc-es-pad-up { grid-column: 2 !important; grid-row: 1 !important; }
.qc-es-mobile-pad .qc-es-pad-left { grid-column: 1 !important; grid-row: 2 !important; }
.qc-es-mobile-pad .qc-es-pad-right { grid-column: 3 !important; grid-row: 2 !important; }
.qc-es-mobile-pad .qc-es-pad-down { grid-column: 2 !important; grid-row: 3 !important; }

@media (max-width: 760px) {
  .qc-es-mobile-pad {
    display: grid !important;
    width: 100%;
    max-width: 360px;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (max-width: 960px) and (orientation: landscape) {
  .qc-es-header,
  .qc-es-mode-banner {
    margin-bottom: 8px;
  }
  .qc-es-title {
    font-size: clamp(22px, 4vw, 34px);
  }
  .qc-es-subtitle,
  .qc-es-mode-banner span {
    font-size: 12px;
  }
  .qc-es-board-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(150px, 178px);
    gap: 10px;
    align-items: center;
    padding: 9px;
  }
  .qc-es-board-shell {
    grid-column: 1;
    max-width: none;
    padding: 7px;
  }
  .qc-es-canvas-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  #qcEnergySnakeCanvas {
    width: auto;
    max-width: 100%;
    height: min(56vh, 330px);
  }
  .qc-es-mobile-pad {
    display: grid !important;
    grid-column: 2;
    grid-row: 1;
    grid-template-columns: repeat(3, 42px) !important;
    grid-template-rows: repeat(3, 42px) !important;
    gap: 5px !important;
    margin: 0 !important;
    max-width: none;
  }
  .qc-es-mobile-pad button {
    min-width: 42px;
    min-height: 40px;
    padding: 4px;
    border-radius: 13px;
    font-size: 15px;
  }
  .qc-es-status {
    grid-column: 1 / -1;
    margin-top: 2px;
    font-size: 12px;
    min-height: 18px;
  }
}
