/* Play composition: the cards keep their inline drawings (B338: the generated
   illustrations of assets/play-menu were never loaded under the #m.bh lobby, gone) */
/* Roboto Condensed: assets/fonts/fonts.css (the page links it) */

#m.nm{--menu-bottom:20px;background:radial-gradient(ellipse at 46% 42%,#ffffff38,transparent 70%),repeating-linear-gradient(115deg,#ffffff08 0 1px,transparent 1px 4px),#f3f1ed}
#m.nm #mtop{flex-shrink:0}
#m.nm #mnav{left:23px;bottom:var(--menu-bottom);width:300px}
#m.nm #mmain{left:360px;right:20px;top:80px;bottom:var(--menu-bottom);padding:0;overflow:hidden}
#m.nm #mstage{visibility:hidden}
#m.nm #mstep1{position:relative;inset:auto;flex:1;max-width:none;width:100%;margin:0;padding:30px 34px 24px 36px;border:0;border-radius:0;background:transparent;overflow-y:auto;scrollbar-width:none;gap:0;justify-content:flex-start;min-width:0}
#m.nm #mstep1::-webkit-scrollbar{display:none}
#m.nm .pht{flex-direction:column;align-items:flex-start;gap:12px;border-bottom:1px solid #cbc8c1;padding-bottom:17px;margin-bottom:32px;flex-shrink:0}
#m.nm .pht b{font-family:'Roboto Condensed','Arial Narrow',sans-serif;font-size:32px;font-weight:700;letter-spacing:.025em;line-height:1.2}
#m.nm .pht span{font-size:12px;letter-spacing:.12em;color:#6f6c66}
#m.nm .pcards{grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(16px,1.77vw,34px);padding-right:0;flex-shrink:0}
#m.nm .pcard{min-width:0;min-height:515px;padding:14px 11px 36px;gap:0;border-radius:4px;border-color:#cfccc5;background:linear-gradient(135deg,#fbfaf899,#ffffff45);box-shadow:none;color:#191917}
#m.nm .pcard:hover{border-color:#77736c;background:#fbfaf8;transform:translateY(-2px);box-shadow:0 6px 18px #1f1e1b0a}
#m.nm .pcart{position:relative;flex:none;width:100%;height:auto;aspect-ratio:1.055;background:#efede9;border:0;border-radius:0}
#m.nm .pchd{display:grid;grid-template-columns:38px minmax(0,1fr);gap:27px;margin:39px 0 0 29px;white-space:normal;align-items:center;min-height:35px;font-family:'Roboto Condensed','Arial Narrow',sans-serif;font-size:23px;line-height:1.05;letter-spacing:.005em}
#m.nm .pchd b{font-weight:700}
#m.nm #pcCreate .pchd{margin-left:24px;gap:19px;font-size:21px}
#m.nm #pcJoin .pchd{margin-left:24px;gap:26px;font-size:22px}
#m.nm #pcTrain .pchd{margin-left:25px;gap:28px}
#m.nm .pchd svg{width:34px;height:34px}
#m.nm .pcds{margin:9px 18px 0 94px;max-width:170px;font-size:12px;line-height:1.85;letter-spacing:.015em;color:#45433f;min-height:45px}
#m.nm #pcCreate .pcds,#m.nm #pcCreate .pcgo{margin-left:82px}
#m.nm #pcJoin .pcds,#m.nm #pcJoin .pcgo{margin-left:88px}
#m.nm #pcTrain .pcds,#m.nm #pcTrain .pcgo{margin-left:90px}
#m.nm #pcJoin .pcds{max-width:155px}
#m.nm #pcTrain .pcds{max-width:155px}
#m.nm .pcgo{position:static;display:block;width:24px;height:24px;margin:23px 0 0 94px;font-size:0;line-height:1;font-weight:400}
#m.nm .pcgo::before{content:'';display:block;width:24px;height:24px;background:currentColor;clip-path:polygon(0 48%,76% 48%,54% 25%,58% 22%,87% 51%,58% 80%,54% 77%,76% 54%,0 54%)}
/* Keep advanced controls in the normal scroll and keyboard order, beneath
   the four primary options and their intentional lower breathing room. */
#m.nm .play-class-choice{margin-top:30px;flex:none}
#m.nm .play-class-choice .sechead{margin-bottom:10px}
#m.nm #classsel{gap:10px}
#m.nm .clscard{padding:8px 11px;gap:3px}
#m.nm .clscard .clsblur{min-height:30px}
#m.nm .play-setup{margin-top:28px;flex:none;scroll-margin-block:24px}
#m.nm .play-setup summary{width:fit-content;cursor:pointer;color:#77736c;font-size:10px;font-weight:700;letter-spacing:.12em;padding:8px 0}
#m.nm .play-setup summary span{margin-left:12px;font-size:9px;font-weight:400}
#m.nm .play-setup[open] summary{margin-bottom:10px}
#m.nm .pfoot{margin-top:0}
#m.nm #mfoot{display:none}
#m.nm .menu-promos{display:grid;grid-template-columns: .84fr 1fr;gap:12px;height:100%}
#m.nm .menu-promo{border:1px solid #d6d3cd;border-radius:6px 6px 0 0;background:#fff;padding:10px 14px;min-width:0}
#m.nm .promo-label{display:block;color:#8a867f;font-size:10px;letter-spacing:.15em;font-weight:600;margin-bottom:8px}
#m.nm .promo-body{display:flex;align-items:center;gap:13px}
#m.nm .promo-art{display:grid;place-items:center;flex:none;width:51px;height:49px;background:#efede8;border:1px solid #e0ddd6;border-radius:4px;color:#b7b3aa;font-size:20px;font-weight:700}
#m.nm .promo-body b{font-size:13px;letter-spacing:.025em}
#m.nm .promo-body p{font-size:10px;letter-spacing:.03em;color:#8a867f;margin-top:4px}
#m.nm .promo-body button{margin-left:auto;flex:none;padding:7px 15px}
#m.nm #mstatus{bottom:14px;height:31px;border-radius:0 0 5px 5px;font-size:9px}
#m.nm #mtop{padding-left:26px;padding-right:20px}
#m.nm #mnav{gap:1.5px}
#m.nm #mnav,#m.nm #mtop,#m.nm #mfoot{background-color:#fbfaf8e8}
#m.nm #mstatus{letter-spacing:.12em}
#m.nm #msoon,#m.nm #mstep2{bottom:var(--menu-bottom)}
#m.nm button:focus-visible,#m.nm summary:focus-visible{outline:2px solid #33312c;outline-offset:4px}
@media(min-width:1600px){
 #m.nm .pcards{margin-right:35px}
 #m.nm .pht{transform:translateY(1px)}
}
@media(max-width:1500px){
 #m.nm #mnav{width:250px}
 #m.nm #mmain{left:295px;right:25px}
 #m.nm #mstep1{padding:45px 20px 24px}
 #m.nm .pcard{min-height:420px;padding-bottom:25px}
 #m.nm .pcard .pchd{margin:25px 0 0;grid-template-columns:28px 1fr;gap:10px;font-size:clamp(17px,1.4vw,21px)}
 #m.nm .pchd svg{width:28px;height:28px}
 #m.nm .pcard .pcds,#m.nm .pcard .pcgo{margin-left:38px;margin-right:0}
 #m.nm #msoon,#m.nm #mstep2{left:295px}
 #m.nm .pfoot{flex-wrap:wrap}
 #m.nm #mchal{width:100%}
 #m.nm .play-setup{margin-top:36px}
}
@media(max-width:1100px){
 #m.nm #mnav{width:210px}
 #m.nm .navbtn .nt{font-size:13px}
 #m.nm .navbtn .nt small{font-size:8px;letter-spacing:.05em}
 #m.nm #mmain,#m.nm #msoon,#m.nm #mstep2{left:253px}
 #m.nm .pcards{grid-template-columns:repeat(2,minmax(0,1fr))}
 #m.nm .pcard{min-height:0}
 #m.nm .pcard .pcgo{margin-top:auto;padding-top:18px;height:42px}
 #m.nm .pcard .pcds{margin-bottom:12px}
 #m.nm .pbandrow{flex-wrap:wrap}
 #m.nm .vbody{flex-direction:column;overflow:auto;flex:1}
 #m.nm #vsetPanel,#m.nm #vjoinForm{flex:none;width:100%}
 #m.nm .vteams{flex:none;min-height:200px}
 #m.nm .vfoot{flex-wrap:wrap}
 #m.nm .vtt{flex-wrap:wrap}
}
@media(max-width:700px){
 #m.nm{overflow-y:auto;display:flex}
 #m.nm #mtop{height:auto;min-height:64px;padding:10px 14px;gap:14px;flex-wrap:wrap}
 #m.nm #mbrandT b{font-size:20px}
 #m.nm #mplayer{padding:6px;gap:8px}
 #m.nm .pcshield{display:none}
 #m.nm #mnav{position:relative;inset:auto;width:auto;margin:12px 14px;flex-direction:row;flex-shrink:0;overflow-x:auto;padding:5px;gap:4px}
 #m.nm .navbtn{padding:10px;flex-shrink:0;gap:6px}
 #m.nm .navbtn .nt small,#m.nm .navbtn .pbbar{display:none}
 #m.nm #mmain{position:relative;inset:auto;flex:1 0 auto;min-height:520px;margin:0 14px;overflow:visible}
 #m.nm #mstep1{padding:18px 0 24px}
 #m.nm .pht{margin-bottom:22px}
 #m.nm .pcards{gap:12px}
 #m.nm .play-setup{margin-top:24px}
 #m.nm .pcard{padding:8px 8px 22px}
 #m.nm .pcard .pchd{font-size:20px;gap:7px;grid-template-columns:22px 1fr;margin-top:20px}
 #m.nm .pchd svg{width:22px;height:22px}
 #m.nm .pcard .pcds{margin-left:5px;font-size:11px}
 #m.nm .pcard .pcgo{margin-left:5px;margin-top:14px}
 #m.nm #mfoot{position:relative;inset:auto;height:auto;margin:0 14px 14px;padding:10px 10px 0;flex:none}
 #m.nm .menu-promos{grid-template-columns:1fr}
 #m.nm #mstatus{position:relative;inset:auto;margin-top:10px;padding:8px;height:auto;gap:8px;flex-wrap:wrap}
 #m.nm #stChat{display:none}
 #m.nm #msoon,#m.nm #mstep2{left:14px;right:14px;top:160px;bottom:14px;max-width:none}
 #m.nm #vcreate,#m.nm #vjoin{min-height:520px}
 #m.nm .vcols{flex-wrap:wrap}
 #m.nm #classsel{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:420px){
 #m.nm .pcards{grid-template-columns:1fr}
 #m.nm .pcard .pchd{font-size:23px}
 #m.nm .pcard .pcds{max-width:none;min-height:0}
 #m.nm #mplayer{flex-wrap:wrap;max-width:100%}
 #m.nm .promo-body{gap:8px;flex-wrap:wrap}
}
@media(min-width:701px) and (max-height:800px){
 #m.nm #mstep1{padding-top:30px}
 #m.nm .pht{margin-bottom:22px}
}
@media(prefers-reduced-motion:reduce){#m.nm .pcard,#m.nm .pcgo{transition:none}}