/* Illustrated launcher only. Classic and match presentation keep their own skins. */
html[data-art-style=radioactive] #menu{
  --gold:#ceff24;--accent:#ceff24;--pink:#ff3993;--cyan:#75eced;--ink:#182016;
  --text:#f7efd7;--soft:#dee6ce;--muted:#dce5ca;--line:#182016;
  /* Paper is a dark gunmetal face now (Mike: no bright cream panels or buttons); text on it is --text. */
  --paper:linear-gradient(110deg,#28331f,#1b2419);
  --lettering:'Bully Display','Bully Bangers',Impact,sans-serif;
  background:linear-gradient(0deg,#0e1c12bf,transparent 65%),url('assets/radioactive-junkyard-stage.webp') center top/cover fixed,#26372a;background:linear-gradient(0deg,#0e1c12bf,transparent 65%),image-set(url('assets/radioactive-junkyard-stage.avif') type('image/avif'),url('assets/radioactive-junkyard-stage.webp') type('image/webp')) center top/cover fixed,#26372a;
  color:var(--text);scrollbar-color:var(--accent) #19221b;
}
html[data-art-style=radioactive] #menu .lobby{width:min(1680px,100%);padding:0 28px 24px}
html[data-art-style=radioactive] #menu .radioactive-banner{display:none}
html[data-art-style=radioactive] #menu .masthead{height:100px;border:0;gap:16px}
html[data-art-style=radioactive] #menu .brand-logo.radioactive-logo{width:190px;height:94px;object-fit:contain;mask-image:none;filter:drop-shadow(3px 3px #10170e)}
html[data-art-style=radioactive] #menu .classic-logo,html:not([data-art-style=radioactive]) #menu .radioactive-logo{display:none}
html[data-art-style=radioactive] #menu .masthead .eyebrow{color:var(--accent);text-shadow:2px 2px #10170e}
html[data-art-style=radioactive] #menu .masthead p{color:var(--text);text-shadow:1px 2px #10170e}
html[data-art-style=radioactive] #menu :is(h2,h3,legend,summary,.primary,.section-kicker){font-family:var(--lettering);font-weight:400;letter-spacing:.6px}
/* UI-kit plate buttons (.bb-btn, e.g. the build studio's DEFAULT / CLEAR / DONE) keep their own dark plate art: the
   paper fill and the border shorthand here used to wipe it into a cream button (Mike, Nov 1). :where adds no weight. */
html[data-art-style=radioactive] #menu button:not(:where(.bb-btn)){clip-path:none;border-radius:3px 7px 4px 6px;color:var(--text);background:var(--paper);border:3px solid #182016;box-shadow:2px 3px #0c130e}
html[data-art-style=radioactive] #menu :is(button,summary,input,select):focus-visible{outline:3px solid var(--cyan);outline-offset:3px}
html[data-art-style=radioactive] #menu :is(.setup-note,.control-hint,.browser-note,.muted){color:var(--soft)}

/* The junkyard remains visible between two stacks of collectible cards. */
html[data-art-style=radioactive] #menu .selection{grid-template-columns:310px minmax(270px,1fr) 350px;gap:18px 24px;padding-top:14px}
html[data-art-style=radioactive] #menu :is(.character-panel,.build-panel){background:none;border:0;box-shadow:none;padding:0}
html[data-art-style=radioactive] #menu :is(.selection-top,.build-heading){background:var(--accent);color:var(--ink);border:4px solid #172016;box-shadow:3px 4px #080e0a;padding:11px 14px;transform:rotate(-1deg);border-radius:2px 11px 3px 8px;clip-path:polygon(4px 3px,19% 0,40% 3px,61% 0,85% 2px,calc(100% - 5px) 0,100% 8px,calc(100% - 3px) 48%,100% calc(100% - 4px),77% 100%,52% calc(100% - 3px),29% 100%,3px calc(100% - 2px),0 72%,3px 42%,0 11px)}
html[data-art-style=radioactive] #menu .selection-top{margin-bottom:13px}
html[data-art-style=radioactive] #menu .selection-top h2{font-size:30px;line-height:1;color:var(--ink);letter-spacing:.5px}
html[data-art-style=radioactive] #menu .selection-top .muted{color:#344320;font-weight:700}
html[data-art-style=radioactive] #menu .build-heading{background:#ff8a29;transform:rotate(1deg);margin-bottom:14px}
html[data-art-style=radioactive] #menu .build-heading h2{font-size:34px;color:var(--ink);letter-spacing:.5px;margin:3px 0}
html[data-art-style=radioactive] #menu .build-heading :is(p,.section-kicker){color:#2c2516}
html[data-art-style=radioactive] #menu .section-kicker{color:var(--accent)}
html[data-art-style=radioactive] #menu .art-style-picker{padding:4px 8px;gap:9px;background:#111c18d9;border:2px solid #596d3c;width:max-content;max-width:100%;border-radius:3px}
html[data-art-style=radioactive] #menu .art-style-picker>span{color:var(--text)}
html[data-art-style=radioactive] #menu .art-style-picker small{color:#d2dfbc}
html[data-art-style=radioactive] #menu .art-style-picker button{padding:5px 10px;min-height:30px;color:var(--text);border:2px solid #111c18;background:var(--paper)}
html[data-art-style=radioactive] #menu .art-style-picker button[aria-pressed=true]{background:var(--accent);color:var(--ink);border-color:#111c18;box-shadow:2px 2px var(--pink)}

/* Scale the preview area only; actor geometry and animation are unchanged. */
html[data-art-style=radioactive] #menu .champion-stage{height:auto;min-height:680px;align-self:start;z-index:0}
html[data-art-style=radioactive] #menu #champion-preview{width:145%;max-width:none;height:625px;object-fit:contain;top:-32px;left:-22.5%;filter:drop-shadow(3px 4px #0d140dc9)}
html[data-art-style=radioactive] #menu .champion-caption{position:relative;left:auto;right:auto;bottom:auto;margin-top:-85px;padding:0 6px}
html[data-art-style=radioactive] #menu #champion-facing{top:440px;left:auto;right:6%;transform:none;background:var(--paper);border:3px solid #162116;color:var(--text);width:44px;height:36px}
html[data-art-style=radioactive] #menu #champion-name{font-family:var(--lettering);color:var(--accent);font-size:clamp(42px,4vw,66px);letter-spacing:1px;text-shadow:3px 3px #11190e,-2px -2px #11190e;margin:5px 0}
html[data-art-style=radioactive] #menu #champion-tag{font-size:11px;font-weight:800;color:#fff3d0;text-shadow:1px 2px #10170e;letter-spacing:2px}
html[data-art-style=radioactive] #menu .class-detail>p{color:#f3edd9;text-shadow:1px 2px #10170e;font-size:11px}
html[data-art-style=radioactive] #menu .creation-passive{background:#17221be8;border:2px solid #b0ce58;border-radius:3px 9px 4px 7px;padding:10px 12px;margin:10px auto 0;box-shadow:3px 3px #0c140d}
html[data-art-style=radioactive] #menu .creation-passive :is(b,.passive-label){color:var(--accent)}
html[data-art-style=radioactive] #menu .creation-passive :is(small,.passive-label>span){color:#ebefd8}
html[data-art-style=radioactive] #menu .stage-halo{background:radial-gradient(ellipse at 50% 55%,#b6ff2433,transparent 62%)}
html[data-art-style=radioactive] #menu[data-faction=horde] .stage-halo{background:radial-gradient(ellipse at 50% 55%,#ff369a26,transparent 62%)}

/* Cream class cards, painted faction tabs and pink selection ink. */
html[data-art-style=radioactive] #menu .factions{background:none;border:0;padding:0;gap:8px;margin-bottom:14px}
html[data-art-style=radioactive] #menu .factions button{background:#293329;color:#f7ead2;border:3px solid #111b14;box-shadow:2px 3px #060d09;padding:10px 6px;font-family:var(--lettering);font-size:17px}
html[data-art-style=radioactive] #menu .factions button small{font-family:var(--font-body);font-size:9px;color:#f1dec3}
html[data-art-style=radioactive] #menu .factions button[data-team=alliance][aria-pressed=true]{background:#ffb42c;color:#151b11;border-color:#111b14;box-shadow:3px 3px var(--pink)}
html[data-art-style=radioactive] #menu .factions button[data-team=horde][aria-pressed=true]{background:var(--pink);color:#151b11;border-color:#111b14;box-shadow:3px 3px var(--accent)}
html[data-art-style=radioactive] #menu .factions button[aria-pressed=true] small{color:#242619}
html[data-art-style=radioactive] #menu .class-heading{margin-bottom:7px}
html[data-art-style=radioactive] #menu .class-heading h2{color:var(--text);font-size:16px;text-shadow:1px 2px #10170e}
html[data-art-style=radioactive] #menu .class-grid{gap:9px}
html[data-art-style=radioactive] #menu .class-card{background:var(--paper);border:7px solid transparent;border-image:url('assets/radioactive-ui-card.webp') 12% fill / 9px / 2px stretch;min-height:110px;padding:4px 1px;overflow:visible;isolation:isolate;box-shadow:2px 3px #080f0a}
html[data-art-style=radioactive] #menu .class-card .spell-icon{width:62px;height:62px;margin:0 auto 6px;border:2px solid #202817;border-radius:2px;opacity:1;box-shadow:1px 2px #1c2319}
html[data-art-style=radioactive] #menu .class-card strong{font:400 16px/1.1 var(--lettering);color:var(--ink);overflow-wrap:anywhere}
html[data-art-style=radioactive] #menu .class-card[aria-pressed=true]{background:color-mix(in srgb,var(--accent) 16%,#1f2620);border-color:transparent;box-shadow:0 0 0 3px var(--pink),4px 5px var(--pink);transform:rotate(-2deg)}
html[data-art-style=radioactive] #menu .class-card[aria-pressed=true] strong{color:#1a2019}
html[data-art-style=radioactive] #menu .class-card[aria-pressed=true]:before{content:'';position:absolute;inset:-11px -8px;z-index:-1;background:var(--pink);clip-path:polygon(0 6%,10% 8%,8% 0,26% 4%,42% 0,65% 5%,92% 0,95% 10%,100% 8%,96% 38%,100% 65%,95% 88%,100% 98%,72% 95%,46% 100%,25% 95%,0 100%,4% 75%,0 40%,5% 18%)}
html[data-art-style=radioactive] #menu .difficulty-options{gap:7px}
html[data-art-style=radioactive] #menu .difficulty-options button{background:var(--paper);color:var(--text);border:3px solid #172016;padding:10px 6px;font-weight:800;font-size:11px}
html[data-art-style=radioactive] #menu .difficulty-options button[aria-pressed=true]{background:var(--accent);color:#16200d;border-color:#172016;box-shadow:3px 3px var(--pink)}
html[data-art-style=radioactive] #menu .difficulty-options button[data-difficulty=hard][aria-pressed=true]{background:var(--pink);color:#1e171b}
html[data-art-style=radioactive] #menu .launcher-link{background:#1a251de8;color:var(--text);border:2px solid #738b45;padding:11px 10px;margin-top:14px}
html[data-art-style=radioactive] #menu .launcher-link span{color:var(--accent)}

/* Ability text is printed on cream paper, never over the illustrated backdrop. */
html[data-art-style=radioactive] #menu .slot-label{margin:12px 0 7px}
html[data-art-style=radioactive] #menu .slot-label h3{color:var(--ink);background:var(--accent);padding:4px 9px;border:2px solid #182016;font-size:18px;transform:rotate(-2deg)}
html[data-art-style=radioactive] #menu .slot-label>span{color:#f2ecd8;font-weight:800;text-shadow:1px 2px #10170e}
html[data-art-style=radioactive] #menu .loadout-slots{gap:9px}
html[data-art-style=radioactive] #menu :is(.loadout-slots button,.ultimate-slot){background:transparent;border:10px solid transparent;border-image:url('assets/radioactive-ui-card.webp') 12% fill / 12px / 2px stretch;min-height:91px;padding:5px 6px;gap:10px;box-shadow:3px 4px #08110b;border-radius:3px 9px 5px 8px}
html[data-art-style=radioactive] #menu .ultimate-slot{box-shadow:0 0 0 3px var(--pink),4px 5px #08110b;min-height:101px}
html[data-art-style=radioactive] #menu :is(.loadout-slots,.ultimate-slot) .spell-icon{width:54px;height:54px;border:2px solid #1c2319;border-radius:2px;box-shadow:1px 2px #21281d}
html[data-art-style=radioactive] #menu :is(.loadout-slots,.ultimate-slot) b{font:400 23px/1.05 var(--lettering);color:var(--ink)}
html[data-art-style=radioactive] #menu :is(.loadout-slots,.ultimate-slot) small{font-size:10px;line-height:1.45;color:#424437}
html[data-art-style=radioactive] #menu .loadout-slots small i{color:#675e40}
html[data-art-style=radioactive] #menu .slot-number{color:#192012;font:400 20px var(--lettering);width:18px}
html[data-art-style=radioactive] #menu .slot-change{color:#6b2e48;font-weight:900}

/* The launch shelf is lower in the page; phone play actions remain fixed. */
html[data-art-style=radioactive] #menu .launch-panel{background:#14231dec;border:3px solid #768c42;border-top:6px solid var(--pink);padding:17px 18px 10px;box-shadow:4px 5px #08110c}
html[data-art-style=radioactive] #menu #mode-picker h2{color:var(--accent);font-size:19px}
html[data-art-style=radioactive] #menu #mode-picker button{font:400 19px var(--lettering)}
html[data-art-style=radioactive] #menu .launch-bottom{margin-top:15px}
html[data-art-style=radioactive] #menu :is(#create-room,#join-room,.room-actions .secondary,.room-invite button,.room-player button){background:#1f2620;color:var(--text);border:3px solid #172016}
html[data-art-style=radioactive] #menu :is(#room-help,.multiplayer-box>label){color:#d9e5c9}
html[data-art-style=radioactive] #menu .primary{background:#c6ff14;color:#111b0c;border:4px solid #172016;box-shadow:4px 5px var(--pink),7px 8px #172016;font:400 28px/1.1 var(--lettering);min-height:58px;letter-spacing:.8px;transform:rotate(-1deg)}
html[data-art-style=radioactive] #menu #match-settings>summary{color:var(--cyan);font-size:17px}
html[data-art-style=radioactive] #menu #enter-training{background:#1b3229;color:var(--cyan);border:2px solid #89c0a2;padding:8px 10px;font-size:11px;letter-spacing:.5px;margin-top:8px;min-height:36px}
html[data-art-style=radioactive] #menu #enter-training:hover:not(:disabled){border-color:var(--pink)}
html[data-art-style=radioactive] #menu .control-hint{color:#d8e4c9}

/* Preserve dialog dimensions and scroll behavior while replacing their skin. */
html[data-art-style=radioactive] #menu :is(.launcher-dialog,.briefing,#account-content){color:#f4efd8;background:#1a2920;border:4px solid #101b13;border-radius:4px 12px 5px 9px;box-shadow:0 0 0 2px #9ab856,6px 7px #071109dd}
html[data-art-style=radioactive] #menu .launcher-dialog::backdrop{background:#07120bd1;backdrop-filter:blur(3px)}
html[data-art-style=radioactive] #menu .launcher-dialog>header{background:repeating-linear-gradient(173deg,#4b260411 0 1px,transparent 1px 5px),#ff8a29;border-bottom:5px solid #182016;clip-path:polygon(0 0,100% 0,100% calc(100% - 4px),88% 100%,70% calc(100% - 3px),51% 100%,34% calc(100% - 4px),17% 100%,0 calc(100% - 2px))}
html[data-art-style=radioactive] #menu .launcher-dialog :is(h2,header .section-kicker){color:#172016}
html[data-art-style=radioactive] #menu .launcher-dialog [data-close-dialog]{background:var(--pink);border:3px solid #182016;color:#182016}
html[data-art-style=radioactive] #menu .launcher-dialog .ability-option{background:transparent;border:10px solid transparent;border-image:url('assets/radioactive-ui-card.webp') 12% fill / 12px / 1px stretch;border-radius:3px 8px 4px 6px;padding:12px;color:#182016}
html[data-art-style=radioactive] #menu .launcher-dialog .ability-option b{color:#182016;font:400 21px var(--lettering)}
html[data-art-style=radioactive] #menu .launcher-dialog .ability-option :is(small,em,.ability-starting,.ability-role,.ability-tradeoff b){color:#3e4938}
html[data-art-style=radioactive] #menu .launcher-dialog .ability-option[aria-pressed=true]{border-color:transparent;box-shadow:0 0 0 3px var(--pink),2px 3px #080f09}
html[data-art-style=radioactive] #menu .launcher-dialog .equipped-tag{color:#98234e;font-weight:900}
html[data-art-style=radioactive] #menu .launcher-dialog .spell-icon{width:42px;height:42px;border:2px solid #182016;border-radius:2px}

/* Private-room names, readied players, settings and accounts stay high-contrast. */
html[data-art-style=radioactive] #menu #private-lobby{background:#17261ef5;border:4px solid #101b13;border-top:5px solid var(--pink);border-radius:4px 12px 6px 8px;box-shadow:0 0 0 2px #9ab856,4px 5px #08130c}
html[data-art-style=radioactive] #menu #private-lobby :is(h2,.eyebrow){color:var(--accent)}
html[data-art-style=radioactive] #menu #private-lobby :is(p,.room-bots){color:#dce6cf}
html[data-art-style=radioactive] #menu .room-team{border:3px solid #152017;border-top:5px solid #c6f52d;background:#243326;border-radius:3px 8px 4px 6px}
html[data-art-style=radioactive] #menu .room-team.horde{border-top-color:var(--pink)}
html[data-art-style=radioactive] #menu .room-team h3{color:var(--accent);font-size:22px}
html[data-art-style=radioactive] #menu .room-team.horde h3{color:#ff85b8}
html[data-art-style=radioactive] #menu .room-team h3 small{color:#d7e0cd}
html[data-art-style=radioactive] #menu .room-player{border-top-color:#74825a}
html[data-art-style=radioactive] #menu .room-player b{color:#fff2cc}
html[data-art-style=radioactive] #menu .room-player small{color:#d1dec4}
html[data-art-style=radioactive] #menu .room-player.is-you{background:#c6ff1412;box-shadow:inset 3px 0 var(--cyan)}
html[data-art-style=radioactive] #menu .room-player .room-dot.connected{background:var(--accent)}
html[data-art-style=radioactive] #menu .room-player .room-readiness{color:#ff9ac6}
html[data-art-style=radioactive] #menu .room-player .room-readiness.ready{color:var(--accent)}
html[data-art-style=radioactive] #menu #ready-room[aria-pressed=true]{background:var(--accent);border-color:#172016;color:#172016}
html[data-art-style=radioactive] #menu :is(#player-name,.room-invite input,.account-panel input,.party-row select){background:#f1e4c5;border:3px solid #152017;color:#182216;box-shadow:inset 2px 2px #968c6933;border-radius:3px}
html[data-art-style=radioactive] #menu input::placeholder{color:#58614e;opacity:1}
html[data-art-style=radioactive] #menu input[type=range]{accent-color:var(--accent)}
html[data-art-style=radioactive] #menu select option{background:#f1e4c5;color:#182216}
html[data-art-style=radioactive] #menu .briefing :is(.setup-note,.briefing-copy p){color:#d7e1c6}
html[data-art-style=radioactive] #menu .briefing :is(summary,.briefing-copy b,h2){color:var(--accent)}
html[data-art-style=radioactive] #menu .briefing details{border-top-color:#7d8e5a}
html[data-art-style=radioactive] #menu .map-options button{background:#1f2620;border:3px solid #182016;color:var(--text)}
html[data-art-style=radioactive] #menu .map-options button[aria-pressed=true]{border-color:var(--pink);background:var(--accent)}
html[data-art-style=radioactive] #menu .map-preview button{background:#17251ee8;color:var(--accent)}
html[data-art-style=radioactive] #menu .party-row>span{font-family:var(--lettering);color:var(--accent)}
html[data-art-style=radioactive] #menu .party-row label small{color:#d9e5cc}
html[data-art-style=radioactive] #menu :is(.sound-settings,.setting-story){background:#17241ee8;border:2px solid #7e9650;border-radius:4px;padding:12px;color:#e1e8d5;box-shadow:3px 4px #0d180f}
html[data-art-style=radioactive] #menu :is(.sound-settings,.setting-story) summary{color:var(--accent)}
html[data-art-style=radioactive] #menu .sound-settings small{color:#dbe5ce}
html[data-art-style=radioactive] #menu .setting-story b{color:var(--accent)}
html[data-art-style=radioactive] #menu .account-top strong{color:#edf2d8;text-shadow:1px 2px #10170e}
html[data-art-style=radioactive] #menu .account-top .secondary{background:#1f2620;border:3px solid var(--accent);color:var(--text)}
html[data-art-style=radioactive] #menu .account-panel :is(p,label){color:#dfe9d1}
html[data-art-style=radioactive] #menu .account-panel summary{color:var(--accent)}
html[data-art-style=radioactive] #menu .account-panel .account-continue{color:#172016;background:var(--accent);padding:12px 16px;min-height:44px;text-decoration:none;font-weight:800}
html[data-art-style=radioactive] #menu #account-status{color:var(--accent)}
html[data-art-style=radioactive] #menu #account-delete button{background:#ff9dbd;color:#27151e}
html[data-art-style=radioactive] #menu .lobby-footer{color:#e2e8d1;border-color:#8b9a6266;text-shadow:1px 2px #10170e}

/* States override legacy gold rules without changing button geometry. */
/* Hover keeps the button's own fill and lights its edge (Mike, Nov 1: never a bright cream or white hover in any menu;
   tests/no-bright-states.test.js). Selected states keep their own lime look, so hover and selected stay distinct. */
html[data-art-style=radioactive] #menu :is(button:not(:where(.bb-btn)),.class-card,.difficulty-options button,.loadout-slots button,.ultimate-slot,.launcher-dialog .ability-option,#cosmetic-picker button,#create-room,#join-room,.room-actions button,.room-invite button,.account-top .secondary):hover:not(:disabled){border-color:#ffe46b;box-shadow:3px 4px #0c160e,0 0 10px #ffe46b55}
html[data-art-style=radioactive] #menu .primary:hover:not(:disabled){background:#e0ff5c;border-color:#172016;color:#172016;box-shadow:4px 5px var(--pink),7px 8px #172016}
html[data-art-style=radioactive] #menu :is(button,.launcher-dialog .ability-option,#cosmetic-picker button,.room-player button):disabled{background:#d0c9b1;color:#615f52;border-color:#394534;box-shadow:none;opacity:.65;cursor:not-allowed;transform:none}
html[data-art-style=radioactive] #menu :is(button,input,select)[aria-invalid=true]{border-color:var(--pink)}

@media(min-width:1600px){
  html[data-art-style=radioactive] #menu .selection{grid-template-columns:350px minmax(360px,1fr) 390px;gap:22px 35px}
  html[data-art-style=radioactive] #menu .class-card{min-height:125px}
  html[data-art-style=radioactive] #menu .class-card .spell-icon{width:72px;height:72px}
  html[data-art-style=radioactive] #menu #champion-preview{height:720px}
  html[data-art-style=radioactive] #menu #champion-facing{top:530px}
}
@media(max-width:1200px) and (min-width:851px){
  html[data-art-style=radioactive] #menu .lobby{padding-inline:18px}
  html[data-art-style=radioactive] #menu .selection{grid-template-columns:260px minmax(210px,1fr) 305px;gap:16px}
  html[data-art-style=radioactive] #menu .class-card{min-height:97px}
  html[data-art-style=radioactive] #menu .class-card .spell-icon{width:52px;height:52px}
  html[data-art-style=radioactive] #menu .class-card strong{font-size:14px}
  html[data-art-style=radioactive] #menu :is(.loadout-slots,.ultimate-slot) b{font-size:20px}
  html[data-art-style=radioactive] #menu :is(.loadout-slots,.ultimate-slot) .spell-icon{width:44px;height:44px}
  html[data-art-style=radioactive] #menu #champion-preview{height:560px}
  html[data-art-style=radioactive] #menu #champion-facing{top:395px}
  html[data-art-style=radioactive] #menu .champion-stage{min-height:620px}
}
@media(max-width:850px){
  html[data-art-style=radioactive] #menu .selection{grid-template-columns:280px minmax(0,1fr);gap:20px}
  html[data-art-style=radioactive] #menu .build-panel{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:0 20px}
  html[data-art-style=radioactive] #menu .build-heading{grid-column:1/-1}
  html[data-art-style=radioactive] #menu .champion-stage{min-height:600px}
  html[data-art-style=radioactive] #menu #champion-preview{height:570px;width:100%;left:0}
  html[data-art-style=radioactive] #menu #champion-facing{top:400px}
  html[data-art-style=radioactive] #menu .art-style-picker small{display:none}
}
@media(max-width:550px){
  html[data-art-style=radioactive] #menu{background-position:center top;background-attachment:scroll;background-size:auto 950px;background-repeat:no-repeat;background-color:#243628}
  html[data-art-style=radioactive] #menu .lobby{padding:0 14px 125px}
  html[data-art-style=radioactive] #menu .masthead{height:78px}
  html[data-art-style=radioactive] #menu .brand-logo.radioactive-logo{width:133px;height:72px}
  html[data-art-style=radioactive] #menu .account-panel{right:14px;max-width:205px}
  html[data-art-style=radioactive] #menu .account-top .secondary{font-size:8px;padding:8px 9px}
  html[data-art-style=radioactive] #menu .art-style-picker{padding:3px 5px;gap:5px}
  html[data-art-style=radioactive] #menu .art-style-picker>span{font-size:8px;letter-spacing:.6px}
  html[data-art-style=radioactive] #menu .art-style-picker button{font-size:9px;padding:6px 9px}
  html[data-art-style=radioactive] #menu .selection{grid-template-columns:minmax(0,1fr);gap:22px;padding-top:8px}
  html[data-art-style=radioactive] #menu .champion-stage{min-height:0;grid-row:1}
  html[data-art-style=radioactive] #menu #champion-preview{width:100%;left:0;height:420px;top:-32px}
  html[data-art-style=radioactive] #menu #champion-facing{top:275px;right:7%}
  html[data-art-style=radioactive] #menu .champion-caption{margin-top:-74px}
  html[data-art-style=radioactive] #menu #champion-name{font-size:49px}
  html[data-art-style=radioactive] #menu .creation-passive{max-width:330px}
  html[data-art-style=radioactive] #menu .class-card{display:block;min-height:112px;padding:4px 1px}
  html[data-art-style=radioactive] #menu .class-card .spell-icon{width:65px;height:65px;margin:0 auto 7px}
  html[data-art-style=radioactive] #menu .class-card strong{font-size:16px}
  html[data-art-style=radioactive] #menu .build-panel{display:block}
  html[data-art-style=radioactive] #menu .launch-panel{padding:14px 10px 10px}
  html[data-art-style=radioactive] #menu .play-actions{background:#16271bf5;border-top:4px solid var(--pink);padding:10px 14px max(13px,env(safe-area-inset-bottom));box-shadow:0 -5px #121d11}
  html[data-art-style=radioactive] #menu .play-actions .primary{font-size:21px;min-height:48px;padding:10px 7px}
  html[data-art-style=radioactive] #menu .launcher-dialog{border-radius:3px 9px 4px 7px}
  html[data-art-style=radioactive] #menu .room-teams{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){html[data-art-style=radioactive] #menu button{transition:none}}