
#noba-roam-v2{--nb-ink:#343051;--nb-muted:#5b5576;--nb-accent:#863696;--nb-soft:#f6c4f0;--nb-sky:#f451ad;--nb-paper:#ffe6ec;--nb-road:#b1c6fc;box-sizing:border-box;max-width:880px;margin:0 auto;padding:22px;background:linear-gradient(155deg,var(--nb-paper) 0%,var(--nb-paper) 48%,var(--nb-road) 100%);color:var(--nb-ink);font:14px/1.55 -apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif;border-radius:24px}
#noba-roam-v2 *{box-sizing:border-box}
#noba-roam-v2 [hidden]{display:none!important}
#noba-roam-v2 button,#noba-roam-v2 input,#noba-roam-v2 a{font:inherit}
#noba-roam-v2 button{min-height:44px;border:1px solid #d5c8ed;border-radius:12px;padding:8px 12px;background:#fffafc;color:var(--nb-ink);cursor:pointer}
#noba-roam-v2 button:disabled{cursor:default;opacity:.55}
#noba-roam-v2 button[aria-pressed=true]{background:var(--nb-soft);border-color:var(--nb-accent)}
#noba-roam-v2 h2{font-size:34px;line-height:1.2;letter-spacing:2px;margin:8px 0}
#noba-roam-v2 h3{font-size:16px;margin:5px 0}
#noba-roam-v2 p{margin:6px 0 12px}
#noba-roam-v2 .nb-head,#noba-roam-v2 .nb-row{display:flex;align-items:center;justify-content:space-between;gap:10px}
#noba-roam-v2 .nb-brand{font-size:27px;letter-spacing:-1px}
#noba-roam-v2 .nb-edition{display:block;letter-spacing:2px;font-size:10px}
#noba-roam-v2 .nb-intro{padding:21px 0 17px}
#noba-roam-v2 .nb-intro>span{font-size:12px;letter-spacing:3px;color:var(--nb-muted)}
#noba-roam-v2 .nb-intro p{color:var(--nb-muted)}
#noba-roam-v2 .nb-cities{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:18px}
#noba-roam-v2 .nb-cities button{padding:9px 4px}
#noba-roam-v2 small{display:block;font-size:10px;letter-spacing:1px}
#noba-roam-v2 .nb-layout{display:grid;grid-template-columns:minmax(280px,1.12fr) minmax(250px,1fr);gap:24px;align-items:start}
#noba-roam-v2 .nb-play{min-width:0}
#noba-roam-v2 .nb-scene{position:relative;border-radius:22px;overflow:hidden;background:var(--nb-soft)}
#noba-roam-v2 canvas{display:block;width:100%;height:auto;aspect-ratio:3/4}
#noba-roam-v2 .nb-scene-top,#noba-roam-v2 .nb-scene-bottom{position:absolute;left:16px;right:16px;display:flex;justify-content:space-between;gap:8px;pointer-events:none;font-size:11px;color:#493d4d}
#noba-roam-v2 .nb-scene-top{top:14px}
#noba-roam-v2 .nb-scene-bottom{bottom:10px}
#noba-roam-v2 .nb-scene-top span{background:#fff8f4ed;padding:4px 8px;border-radius:8px}
#noba-roam-v2 .nb-post{padding:16px 0 2px}
#noba-roam-v2 .nb-post .nb-row span{font-size:12px;color:var(--nb-muted)}
#noba-roam-v2 .nb-slots{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px;margin:10px 0}
#noba-roam-v2 .nb-slot{min-width:0;aspect-ratio:1;border:1px dashed var(--nb-accent);background:#fffafc;display:grid;place-items:center;border-radius:12px;font-size:22px;color:#a395a3}
#noba-roam-v2 .nb-slot img{max-width:100%;width:92%;height:92%;object-fit:contain}
#noba-roam-v2 .nb-slot.nb-miss{font-size:18px;color:#927b80}
#noba-roam-v2 .nb-feedback{font-size:12px;min-height:38px;color:var(--nb-muted)}
#noba-roam-v2 .nb-heroes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-bottom:12px}
#noba-roam-v2 .nb-heroes button{padding:6px;font-size:11px}
#noba-roam-v2 .nb-heroes img{width:45px;height:45px;object-fit:contain;vertical-align:middle;margin-right:4px}
#noba-roam-v2 .nb-controls{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:10px}
#noba-roam-v2 label{font-size:12px}
#noba-roam-v2 output{float:right;color:var(--nb-accent)}
#noba-roam-v2 input[type=range]{width:100%;height:32px;accent-color:var(--nb-accent);display:block}
#noba-roam-v2 .nb-primary{background:var(--nb-accent);color:#fff;border:0;width:100%;font-size:15px;min-height:52px;touch-action:none;user-select:none;-webkit-user-select:none}
#noba-roam-v2 .nb-quota{margin-top:8px;font-size:11px}
#noba-roam-v2 .nb-quota button{font-size:11px;border:0;background:transparent;padding:6px}
#noba-roam-v2 .nb-result-actions button{width:100%}
#noba-roam-v2 .nb-kicker{font-size:10px;letter-spacing:1.8px;color:var(--nb-muted)}
#noba-roam-v2 .nb-count{font-size:18px}
#noba-roam-v2 .nb-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:16px 0}
#noba-roam-v2 .nb-gallery button{border:0;border-radius:15px;padding:8px 3px;background:var(--nb-paper);font-size:11px;position:relative}
#noba-roam-v2 .nb-gallery img{width:100%;aspect-ratio:1;object-fit:contain;opacity:.92;filter:none}
#noba-roam-v2 .nb-gallery button.owned{background:var(--nb-soft)}
#noba-roam-v2 .nb-gallery button.owned img{opacity:1;filter:none}
#noba-roam-v2 .nb-gallery em{position:absolute;right:7px;top:3px;font-style:normal;color:var(--nb-accent)}
#noba-roam-v2 .nb-card-head{margin-top:25px}
#noba-roam-v2 .nb-card-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:12px 0}
#noba-roam-v2 .nb-card-gallery button{aspect-ratio:3/4;background:linear-gradient(140deg,var(--nb-soft),var(--nb-road));border:1px solid #dfd0d9;padding:0;overflow:hidden;color:var(--nb-ink);font-size:11px}
#noba-roam-v2 .nb-card-gallery img{width:100%;height:100%;object-fit:contain;display:block}
#noba-roam-v2 .nb-quiet,#noba-roam-v2 .nb-rules{font-size:12px;color:var(--nb-muted)}
#noba-roam-v2 .nb-rules{border-top:1px solid #e3dccc;padding-top:15px;margin-top:17px}
#noba-roam-v2 summary{cursor:pointer;min-height:44px;padding:9px 0}
#noba-roam-v2 .nb-detail{display:flex;align-items:center;gap:10px;font-size:12px;background:#fffafc;padding:12px;border-radius:16px;flex-wrap:wrap}
#noba-roam-v2 .nb-detail img{width:100px;height:100px;object-fit:contain}
#noba-roam-v2 .nb-detail p{max-width:140px}
#noba-roam-v2 .nb-reveal{position:absolute;inset:12px;background:#fff8fc;z-index:4;border-radius:17px;padding:15px;text-align:center;box-shadow:0 8px 35px #4e325433;display:flex;flex-direction:column;align-items:center;justify-content:center}
#noba-roam-v2 .nb-reveal img{min-height:0;width:auto;max-width:100%;max-height:65%;object-fit:contain;margin:8px 0;border-radius:8px}
#noba-roam-v2 .nb-reveal p{font-size:11px;margin:3px 0}
#noba-roam-v2 .nb-reveal button{margin-top:7px;flex-shrink:0}
#noba-roam-v2 .nb-invite,#noba-roam-v2 .nb-export{margin-top:22px;border-top:1px solid #e1d6c6;padding-top:18px;font-size:13px}
#noba-roam-v2 .nb-sim{background:var(--nb-paper);border-radius:16px;padding:16px;margin-top:14px}
#noba-roam-v2 .nb-sim label{display:block;margin:12px 0}
#noba-roam-v2 .nb-sim input{display:block;margin-top:5px;padding:9px;border:1px solid #d1c4b2;border-radius:8px;width:100%;max-width:300px;font-size:16px;background:#fffafc;color:#453b41}
#noba-roam-v2 .nb-sim p{font-size:12px;margin-top:10px}
#noba-roam-v2 .nb-postcard-image{max-width:430px;width:100%;display:block;margin:14px auto}
#noba-roam-v2 .nb-export a{display:block;text-align:center;color:var(--nb-accent);padding:12px}
#noba-roam-v2 .nb-picks{display:flex;flex-wrap:wrap;gap:7px}
#noba-roam-v2 .nb-picks button{font-size:11px}
#noba-roam-v2 footer{text-align:center;font-size:10px;letter-spacing:1.4px;color:#5b5576;margin-top:24px}
@media(max-width:640px){#noba-roam-v2{padding:16px;border-radius:18px}
#noba-roam-v2 .nb-layout{grid-template-columns:1fr;gap:26px}
#noba-roam-v2 .nb-play{max-width:430px;width:100%;margin:auto}
#noba-roam-v2 .nb-gallery{gap:10px}
#noba-roam-v2 .nb-card-gallery{grid-template-columns:repeat(6,minmax(0,1fr));gap:5px}
#noba-roam-v2 .nb-card-gallery button{font-size:10px;padding:2px}
#noba-roam-v2 .nb-intro{padding-top:17px}
#noba-roam-v2 h2{font-size:30px}
#noba-roam-v2 .nb-heroes img{width:39px;height:39px}
#noba-roam-v2 .nb-reveal h3{font-size:14px}}
#noba-roam-v2 .nb-cities button[aria-pressed=true]{background:var(--nb-accent);color:#fff;box-shadow:0 4px 0 #30265b2b}
#noba-roam-v2 .nb-collection{background:#fff9f8e8;border-radius:20px;padding:16px;min-width:0}
#noba-roam-v2 .nb-scene{box-shadow:0 5px 0 #49336920}
#noba-roam-v2 .nb-scene-bottom span{background:#fff8f4ed;padding:3px 6px;border-radius:6px;font-size:10px}
#noba-roam-v2 .nb-gallery button.owned{box-shadow:inset 0 0 0 2px var(--nb-accent)}
#noba-roam-v2 .nb-primary{box-shadow:0 4px 0 #30265b33}
#noba-roam-v2 .nb-dial-area{text-align:center;padding:3px 0 7px}
#noba-roam-v2 .nb-controls{display:flex;justify-content:center;gap:28px;margin-bottom:9px;font-size:12px}
#noba-roam-v2 .nb-controls b{font-weight:500;color:var(--nb-accent);margin-left:6px}
#noba-roam-v2 button.nb-dial{--nb-charge:0deg;--nb-knob-x:0px;--nb-knob-y:-54px;--nb-knob-turn:0deg;position:relative;display:block;width:192px;height:192px;min-height:192px;margin:0 auto;border:0;border-radius:50%;padding:0;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;background:var(--nb-soft);box-shadow:0 7px 0 #42346128,0 14px 20px #443b6017;overflow:hidden;cursor:grab}
#noba-roam-v2 button.nb-dial.is-charging{cursor:grabbing}
#noba-roam-v2 .nb-dial-ring{position:absolute;inset:0;border-radius:50%;background:conic-gradient(var(--nb-accent) 0deg var(--nb-charge),#ffffff80 var(--nb-charge) 360deg)}
#noba-roam-v2 .nb-dial-face{position:absolute;inset:9px;border-radius:50%;background:radial-gradient(circle at 38% 25%,#ffffff,var(--nb-soft) 85%);box-shadow:inset 0 -5px 10px #52406015}
#noba-roam-v2 .nb-dial-knob{position:absolute;left:50%;top:50%;width:58px;height:58px;margin:-29px;border-radius:50%;background:var(--nb-accent);box-shadow:0 4px 0 #30234c33,0 7px 12px #37254525;transform:translate(var(--nb-knob-x),var(--nb-knob-y)) rotate(var(--nb-knob-turn));display:grid;place-items:center;pointer-events:none}
#noba-roam-v2 .nb-dial-knob img{width:45px;height:45px;object-fit:contain;pointer-events:none;-webkit-user-drag:none}
#noba-roam-v2 .nb-dial-copy{position:absolute;left:14px;right:14px;top:106px;pointer-events:none;color:var(--nb-ink)}
#noba-roam-v2 .nb-dial-copy b{font-size:18px;font-weight:500}
#noba-roam-v2 .nb-dial-copy small{font-size:11px;letter-spacing:1px;margin-top:3px}
#noba-roam-v2 .nb-dial-area>p{font-size:12px;color:var(--nb-muted);margin:15px 0 3px}

body{margin:0;padding:12px;background:#e7e7fc}#noba-roam-v2 .nb-intro{padding:8px 0 12px}#noba-roam-v2 h2{font-size:25px;margin:0}#noba-roam-v2 .nb-head{margin-bottom:12px}#noba-roam-v2 .nb-intro h2{letter-spacing:1px}#noba-roam-v2 .nb-network{display:flex;gap:12px;align-items:center;padding:12px;background:#fff1cc;color:#493813;border-radius:12px;margin:10px 0}#noba-roam-v2 .nb-network span{flex:1;font-size:14px}#noba-roam-v2 .nb-invite-link{display:block;width:100%;font-size:16px;padding:12px;border:1px solid #aa91b6;background:#fff;border-radius:10px;color:#44324f}#noba-roam-v2 .nb-share-actions{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}#noba-roam-v2 .nb-feedback{font-size:14px}#noba-roam-v2 .nb-rules{font-size:14px}#noba-roam-v2 .nb-gallery button{font-size:12px}#noba-roam-v2 .nb-quota,#noba-roam-v2 .nb-quota button{font-size:12px}#noba-roam-v2 .nb-controls{font-size:14px}#noba-roam-v2 .nb-dial-area>p{font-size:13px}@media(max-width:640px){body{padding:0}#noba-roam-v2{border-radius:0;padding:12px}#noba-roam-v2 .nb-head{margin-bottom:6px}#noba-roam-v2 .nb-edition{font-size:10px}#noba-roam-v2 .nb-cities{margin-bottom:12px}#noba-roam-v2 .nb-intro{padding-bottom:8px}#noba-roam-v2 .nb-dial-area{padding-top:8px}#noba-roam-v2 .nb-layout{gap:18px}}
