/* Multiplayer rooms: premium landscape-first responsive design */
.multi-view{max-width:1480px;margin:0 auto;padding:28px 4vw 70px;}
.multi-kicker{color:#c4b0ff;letter-spacing:.20em;font-size:10px;font-weight:900}.multi-heading{display:flex;justify-content:space-between;gap:20px;align-items:end;margin:10px 0 27px}.multi-heading h1{font-size:clamp(27px,3.4vw,47px);letter-spacing:-.06em;margin:6px 0 6px}.multi-heading p{font-size:13px;color:#b9b8df;margin:5px 0}
.multi-status{border:1px solid #ccc1ff66;border-radius:99px;padding:10px 15px;color:#cfc6ff;font-size:12px;background:#29254a85;max-width:370px;line-height:1.4}.multi-status.good{color:#a2f6d1;border-color:#89eac977}.multi-status.bad{color:#ffd0d3;border-color:#ffb3be77}
.multi-setup{display:grid;grid-template-columns:1.15fr .9fr;gap:24px}.multi-mode-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.multi-mode-card{background:linear-gradient(155deg,#36315f,#1f294b);border:1px solid #ffffff36;border-radius:25px;padding:23px;text-align:left;color:#fff;min-height:250px;position:relative;overflow:hidden;cursor:pointer}.multi-mode-card.active{border:2px solid #c5aeff;box-shadow:0 0 0 3px #b9a7ff16,0 24px 44px #03092555}.multi-mode-icon{display:grid;place-items:center;width:62px;height:62px;font-size:37px;border-radius:20px;background:#ffffff1c;margin:0 0 20px}.multi-mode-card strong{display:block;font-size:22px;letter-spacing:-.04em}.multi-mode-card small{display:block;font-size:12px;color:#d0c6ed;line-height:1.7;margin-top:10px}.multi-mode-card:after{content:'✦';position:absolute;right:15px;bottom:11px;font-size:65px;color:#c2b0ff15}.multi-mode-card.race{background:linear-gradient(155deg,#573a63,#273454)}
.multi-panel{background:#242542df;border:1px solid #ffffff27;padding:27px;border-radius:25px;box-shadow:0 24px 60px #0608244a}.multi-panel h2{font-size:20px;margin:0 0 15px}.multi-panel p{color:#c7c1dc;font-size:12px;line-height:1.7}.multi-form{display:grid;grid-template-columns:1fr 1fr;gap:11px}.multi-form label{display:block;color:#d6cdef;font-size:11px;font-weight:750}.multi-form input,.multi-form select{display:block;width:100%;margin:7px 0 0;min-height:43px;border:1px solid #ffffff2c;background:#1518329c;border-radius:12px;color:#fff;padding:0 11px;font:inherit;font-size:13px;outline-color:#b7a4fe}.multi-form select option{background:#242242}.multi-form label.wide{grid-column:1 / -1}.multi-divider{height:1px;background:#fff2;margin:20px 0}.multi-actions{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap}.multi-actions .btn{padding:12px 18px;min-height:45px}.multi-join{display:flex;gap:10px}.multi-join input{min-width:0;flex:1;letter-spacing:.22em;text-transform:uppercase;text-align:center;font-weight:900;font-size:20px;border-radius:13px;border:1px solid #ffffff4c;color:white;background:#131730;padding:7px 12px}.multi-join button{flex-shrink:0}.multi-footnote{font-size:11px;color:#9793b8;line-height:1.7;margin-top:16px}.multi-note{margin-top:20px;border:1px solid #ffffff23;background:#24203e;padding:17px 20px;border-radius:19px;color:#bab2d7;font-size:12px;line-height:1.75}
.multi-room-layout{display:grid;grid-template-columns:320px minmax(0,1fr);gap:18px}.multi-room-sidebar{background:#22243eb8;border:1px solid #ffffff2b;padding:21px;border-radius:23px;align-self:start}.multi-room-sidebar .eyebrow{font-size:10px}.multi-room-code{font-size:39px;letter-spacing:.16em;font-weight:950;color:#ece4ff;margin:10px 0}.multi-players{display:grid;grid-template-columns:1fr;gap:10px;margin-top:18px}.multi-player-card{border:1px solid #ffffff31;border-radius:17px;display:flex;align-items:center;background:#ffffff0e;padding:8px;gap:11px}.multi-player-card img{height:54px;width:60px;object-fit:contain}.multi-player-card b{font-size:13px}.multi-player-card small{font-size:11px;color:#b9b2d8;display:block;margin-top:4px}.ready-dot,.wait-dot{margin-left:auto;height:11px;width:11px;border-radius:50%;background:#9af5c1;box-shadow:0 0 12px #91f7c7}.wait-dot{background:#b1a0d6;box-shadow:none}.multi-player-empty{border:1px dashed #ffffff45;border-radius:18px;padding:22px;text-align:center;color:#aaa3ce;font-size:12px}
.multi-room-feedback{font-size:12px;line-height:1.6;color:#c9c1e0;margin:15px 0}.multi-room-btns{display:flex;flex-wrap:wrap;gap:8px}.multi-room-btns .btn{min-height:43px;padding:10px 13px;font-size:12px}.multi-room-sidebar .btn-outline{background:#ffffff10;color:white}.multi-room-details{color:#d7ceee;font-size:13px;margin:12px 0}
.multi-play-shell{min-width:0;background:#1e2142;border:1px solid #ffffff2b;border-radius:24px;overflow:hidden;box-shadow:0 18px 55px #0005}.multi-hud{min-height:55px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 16px;background:#181e3cbf}.multi-hud strong{font-size:14px}.multi-hud span{color:#eee9fb;font-size:12px}.multi-screen{position:relative;aspect-ratio:1280 / 620;min-height:260px;overflow:hidden;touch-action:none}.multi-screen canvas{width:100%;height:100%;display:block;touch-action:none}.multi-control-overlay{position:absolute;bottom:3.5%;left:3%;right:3%;display:flex;align-items:end;justify-content:space-between;pointer-events:none;z-index:3}.multi-control-overlay>*{pointer-events:auto}.multi-right-actions{display:flex;gap:10px;align-items:end}.multi-control-overlay button{touch-action:none;user-select:none;-webkit-user-select:none;transition:transform .08s}.multi-control-overlay button.pressed{transform:scale(.92);filter:brightness(1.23)}
.multi-joystick,.solo-joystick{width:122px;height:122px;display:grid;place-items:center;border-radius:50%;border:2px solid #fff4;background:#121b4470;backdrop-filter:blur(11px);touch-action:none;box-shadow:inset 0 0 40px #ffffff10,0 6px 34px #0003;position:relative}.multi-joystick:before,.solo-joystick:before{content:'←               →';white-space:pre;font-size:10px;color:#e4d9ff8a;position:absolute;top:52%;transform:translateY(-50%);pointer-events:none}.joy-knob{border:2px solid #ffffff88;background:radial-gradient(circle at 30% 25%,#e8dbff,#ae93ec 63%,#7967c6);box-shadow:inset 0 2px 12px #fff7,0 8px 23px #0d0b36ad;width:59px;height:59px;border-radius:50%;transition:transform .035s;touch-action:none;pointer-events:none}.multi-action{height:67px;width:67px;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:24px;border:1px solid #ffffff8a;background:linear-gradient(155deg,#7de2c6dd,#409eacda);color:white;box-shadow:0 10px 28px #12163f8a;font-weight:900}.multi-action span{font-size:26px}.multi-action small{font-size:9px;margin-top:2px}.multi-action.jump{height:85px;width:85px;background:linear-gradient(145deg,#c5aeff,#8167dd)}.multi-action.ability{background:linear-gradient(145deg,#fbd19f,#da8fc0)}.multi-announcement{padding:11px 16px;background:#1e2642;color:#ded4fd;font-size:12px;min-height:39px}
.multi-mode-joininfo{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.multi-mode-joininfo span{font-size:10px;color:#e6d6ff;border:1px solid #ffffff2b;padding:8px;border-radius:99px}.multi-setup.hidden,.multi-room-layout.hidden,.multi-play-shell.hidden,.multi-room-sidebar[hidden],.multi-room-btns button[hidden]{display:none!important}.multi-room-layout:not(.hidden)>.multi-play-shell.hidden{display:none}.multi-room-layout:has(.multi-play-shell.hidden){grid-template-columns:minmax(0,650px);justify-content:center}
.solo-joystick{pointer-events:auto;display:none}
.orientation-prompt{display:none;position:fixed;z-index:9000;inset:0;background:#12152c;color:#fff;text-align:center;align-content:center;padding:30px;pointer-events:auto}.orientation-prompt strong{font-size:24px}.orientation-prompt span{display:block;font-size:65px;margin-bottom:22px}.orientation-prompt p{color:#d3c8ef;font-size:14px;line-height:1.8}
@media(max-width:900px){.multi-setup{grid-template-columns:1fr}.multi-room-layout{grid-template-columns:1fr}.multi-room-sidebar{order:2}.multi-play-shell{order:1}.multi-mode-card{min-height:205px}.multi-heading{flex-wrap:wrap}.multi-screen{min-height:300px}}
@media(max-width:600px){.multi-view{padding:15px 12px 50px}.multi-mode-list{gap:8px}.multi-mode-card{min-height:166px;padding:14px;border-radius:18px}.multi-mode-icon{width:44px;height:44px;font-size:25px;margin-bottom:12px}.multi-mode-card strong{font-size:17px}.multi-mode-card small{font-size:10px}.multi-panel{padding:18px}.multi-hud{padding:9px}.multi-hud strong{font-size:11px}.multi-screen{min-height:290px}.multi-joystick{width:90px;height:90px}.joy-knob{width:44px;height:44px}.multi-action{height:58px;width:58px;border-radius:19px}.multi-action.jump{height:70px;width:70px}.multi-right-actions{gap:5px}}
/* The entire game arena, including touch controls, fills the mobile landscape viewport. */
@media (max-height:650px) and (orientation:landscape) and (max-width:1200px){body:has(#screen-game.active) .site-header,body:has(#screen-multiplayer.active .multi-play-shell:not(.hidden)) .site-header,body:has(#screen-game.active) .site-footer,body:has(#screen-multiplayer.active .multi-play-shell:not(.hidden)) .site-footer{display:none!important}body:has(#screen-game.active) main,body:has(#screen-multiplayer.active .multi-play-shell:not(.hidden)) main{margin:0!important;padding:0!important}#screen-game.active{height:100dvh!important;max-width:none!important;width:100%!important;padding:0!important;display:flex!important;flex-direction:column!important}#screen-game .game-heading{flex:0 0 42px!important;padding:5px 12px!important;min-height:42px!important}#screen-game .canvas-shell{flex:1;min-height:0!important;height:auto!important;width:100%!important;border-radius:0!important}#screen-game .game-footer{display:none!important}#screen-game .touch-controls{bottom:max(14px,env(safe-area-inset-bottom));left:max(15px,env(safe-area-inset-left));right:max(15px,env(safe-area-inset-right))}#screen-game .solo-joystick{display:grid!important}#screen-game .touch-dpad{display:none!important}#screen-game .action-btn{height:60px;width:65px}#screen-game .jump-btn{height:82px;width:82px}#screen-multiplayer.active:has(.multi-play-shell:not(.hidden)){padding:0!important;width:100%;max-width:none;height:100dvh!important;display:flex!important;flex-direction:column!important}#screen-multiplayer.active .multi-heading{display:none}#screen-multiplayer.active .multi-room-layout{flex:1;min-height:0;display:flex;flex-direction:column;gap:0}#screen-multiplayer.active .multi-room-sidebar{order:2;width:100%;padding:5px 11px;border-radius:0;display:flex;align-items:center;gap:14px}#screen-multiplayer.active .multi-room-sidebar .eyebrow,#screen-multiplayer.active .multi-room-sidebar .multi-players,#screen-multiplayer.active .multi-room-sidebar .multi-room-feedback,#screen-multiplayer.active .multi-room-sidebar .multi-room-details,#screen-multiplayer.active .multi-room-sidebar #multiCopy{display:none!important}#screen-multiplayer.active .multi-room-code{font-size:15px;margin:0}#screen-multiplayer.active .multi-play-shell{flex:1;min-height:0;display:flex;flex-direction:column;order:1;border:0;border-radius:0}#screen-multiplayer.active .multi-hud{flex:0 0 36px;min-height:36px;padding:5px 13px}#screen-multiplayer.active .multi-screen{flex:1;min-height:0;aspect-ratio:auto!important}#screen-multiplayer.active .multi-announcement{flex:0 0 30px;min-height:30px;font-size:11px;padding:6px 15px}#screen-multiplayer.active .multi-control-overlay{bottom:max(11px,env(safe-area-inset-bottom))}#screen-multiplayer.active .multi-joystick{width:102px;height:102px}#screen-multiplayer.active .multi-action{width:62px;height:64px}#screen-multiplayer.active .multi-action.jump{width:82px;height:82px}}
@media (hover:none) and (pointer:coarse){#screen-game .solo-joystick{display:grid}#screen-game .touch-dpad{display:none}}
@media (orientation:portrait) and (max-width:650px) and (pointer:coarse){body:has(#screen-game.active) .orientation-prompt,body:has(#screen-multiplayer.active .multi-play-shell:not(.hidden)) .orientation-prompt{display:block}}
@media (max-height:650px) and (orientation:landscape) and (max-width:1200px){
 #screen-multiplayer.active:has(.multi-play-shell:not(.hidden)){min-height:0!important;max-height:100dvh!important;overflow:hidden!important;}
 #screen-game.active{min-height:0!important;max-height:100dvh!important;overflow:hidden!important;}
 #screen-multiplayer.active:has(.multi-play-shell:not(.hidden)) #multiHint{display:none!important;}
 #screen-multiplayer.active .multi-room-sidebar{flex:0 0 47px!important;overflow:hidden!important;}
 #screen-multiplayer.active .multi-room-sidebar .multi-room-btns{flex-wrap:nowrap;align-items:center;}
 #screen-multiplayer.active .multi-room-sidebar .multi-room-btns .btn{min-height:32px;height:33px;padding:4px 12px;white-space:nowrap;}
 #screen-multiplayer.active .multi-screen{height:auto!important;min-height:0!important;}
}

/* Multiplayer portrait: full-screen soft-world gameplay with no clipped canvas or controls. */
@media(max-width:650px) and (orientation:portrait) {
 body:has(#screen-multiplayer.active .multi-play-shell:not(.hidden)) .orientation-prompt,
 body:has(#screen-multiplayer.active .multi-play-shell:not(.hidden)) .site-header,
 body:has(#screen-multiplayer.active .multi-play-shell:not(.hidden)) .site-footer {display:none!important;}
 #screen-multiplayer.active:has(.multi-play-shell:not(.hidden)){
  position:fixed!important;inset:0!important;z-index:1500!important;
  margin:0!important;padding:3px 4px!important;
  width:100vw!important;height:100dvh!important;max-height:100dvh!important;
  min-height:0!important;max-width:none!important;overflow:hidden!important;
  display:flex!important;flex-direction:column!important;background:#15182f!important;
 }
 #screen-multiplayer.active .multi-heading,
 #screen-multiplayer.active #multiHint {display:none!important;}
 #screen-multiplayer.active .multi-room-layout:not(.hidden){
  display:flex!important;flex:1 1 auto!important;min-height:0!important;
  height:100%!important;width:100%!important;flex-direction:column!important;
  gap:0!important;overflow:hidden!important;
 }
 #screen-multiplayer.active .multi-play-shell:not(.hidden){
  order:1!important;flex:1 1 auto!important;min-height:0!important;
  display:flex!important;flex-direction:column!important;width:100%!important;
  border-radius:13px 13px 0 0!important;
 }
 #screen-multiplayer.active .multi-hud{
  min-height:39px!important;height:39px!important;flex:0 0 39px!important;
  padding:6px 10px!important;gap:4px!important;
 }
 #screen-multiplayer.active .multi-hud strong{font-size:11px;max-width:57%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
 #screen-multiplayer.active .multi-hud span{font-size:10px;white-space:nowrap;}
 #screen-multiplayer.active .multi-screen{
  flex:1 1 auto!important;height:0!important;min-height:0!important;
  width:100%!important;aspect-ratio:auto!important;
 }
 #screen-multiplayer.active .multi-screen canvas{width:100%!important;height:100%!important;display:block!important;}
 #screen-multiplayer.active .multi-control-overlay{
  bottom:max(8px,env(safe-area-inset-bottom))!important;left:8px!important;right:8px!important;gap:7px!important;
 }
 #screen-multiplayer.active .multi-joystick{width:86px!important;height:86px!important;flex:0 0 86px!important;}
 #screen-multiplayer.active .multi-joystick .joy-knob{width:46px!important;height:46px!important;}
 #screen-multiplayer.active .multi-right-actions{gap:5px!important;}
 #screen-multiplayer.active .multi-action{width:54px!important;height:58px!important;border-radius:15px!important;}
 #screen-multiplayer.active .multi-action.jump{width:69px!important;height:70px!important;}
 #screen-multiplayer.active .multi-action span{font-size:22px!important;}
 #screen-multiplayer.active .multi-action small{font-size:10px!important;}
 #screen-multiplayer.active .multi-announcement{
  min-height:35px!important;height:35px!important;flex:0 0 35px!important;
  overflow:hidden!important;padding:7px 10px!important;font-size:10px!important;
  white-space:nowrap;text-overflow:ellipsis;
 }
 #screen-multiplayer.active .multi-room-sidebar{
  order:2!important;flex:0 0 47px!important;min-height:47px!important;
  display:flex!important;align-items:center!important;justify-content:space-between!important;
  width:100%!important;padding:3px 9px!important;gap:6px!important;
  border-radius:0 0 13px 13px!important;overflow:hidden!important;
 }
 #screen-multiplayer.active .multi-room-sidebar .eyebrow,
 #screen-multiplayer.active .multi-room-sidebar .multi-players,
 #screen-multiplayer.active .multi-room-sidebar .multi-room-feedback,
 #screen-multiplayer.active .multi-room-sidebar .multi-room-details,
 #screen-multiplayer.active .multi-room-sidebar #multiCopy {display:none!important;}
 #screen-multiplayer.active .multi-room-code{font-size:16px!important;margin:0!important;}
 #screen-multiplayer.active .multi-room-sidebar .multi-room-btns{display:flex!important;align-items:center!important;gap:5px!important;flex-wrap:nowrap!important;}
 #screen-multiplayer.active .multi-room-sidebar .multi-room-btns .btn{
  font-size:10px!important;white-space:nowrap!important;
  min-height:31px!important;height:31px!important;padding:4px 8px!important;
 }
}