:root { color-scheme: dark; --lime:#c7ef83; }
#overlay { background:radial-gradient(ellipse at 50% 0%,#1d2c27 0%,#101513 55%,#0a0e0c 100%); padding:6vh 20px 32px; }
#overlay .card { width:min(620px,100%); text-align:left; padding:0; border:0; background:none; box-shadow:none; }
#overlay h1 { font-size:clamp(36px,6vw,50px); line-height:1.08; letter-spacing:-2px; font-weight:650; margin:12px 0 16px; color:#f0f2eb; }
.pluto-eyebrow { text-transform:uppercase; letter-spacing:3px; font:600 11px ui-monospace,monospace; color:var(--lime); }
.pluto-intro { color:#adb9ae; font-size:16px; max-width:500px; margin:0 0 20px; }
.pluto-meta { display:flex; gap:24px; padding:0; border:0; margin-bottom:24px; font:12px ui-monospace,monospace; color:#b0baaf; }
.pluto-meta b { color:#f0f2eb; }
#mpq-gate .setup-title { font-size:16px; color:#f0f2eb; margin-top:25px; }
#mpq-drop { padding:18px; background:#19221c66; border-color:#546347; border-radius:6px; text-align:center; }
#mpq-drop:hover { border-color:var(--lime); background:#202c22; }
#mpq-drop b { color:var(--lime); }
#mpq-list { grid-template-columns:repeat(3,1fr); }
#mpq-row-terrain-pack { grid-column:1/-1; }
#mpq-list .name { font-size:11px; }
.setup-extra { margin-top:18px; }
#bar { background:#29342a; height:3px; }
#bar>i { background:var(--lime); }
#msg { color:#b2bcb1; }
#overlay .card>p:has([data-testid=network-play-link]),#play-lab,#imitation-lab,#reconstruction-lab,#mp-panel,#replay-controls,#replay-library,#replay-info,#replay-sampler,#replay-lab>h2,#replay-setup,#mobilewarn,#pluto-panel,#replay-plutobtn,#replay-takeoverbtn,#replay-sampler-next { display:none!important; }
#pluto-site-dock { display:none; position:fixed; z-index:8; top:8px; right:10px; left:auto; width:max-content; max-width:calc(100vw - 464px); box-sizing:border-box; align-items:center; gap:12px; height:42px; padding:5px 6px 5px 12px; background:rgba(9,15,12,.79); border:0; border-radius:6px; box-shadow:none; color:#e6ece1; }
.pluto-playing #pluto-site-dock { display:flex; }
.pluto-brand { color:var(--lime); font:700 10px system-ui,sans-serif; letter-spacing:2.5px; }
#pluto-site-match { display:flex; align-items:center; flex-shrink:0; gap:6px; }
.pluto-race { width:23px; height:26px; fill:currentColor; vertical-align:middle; }
.pluto-race-protoss { color:#eacb7c; }
.pluto-race-zerg { color:#c79de5; }
.pluto-race-terran { color:#8ebfda; }
.pluto-versus { color:#a4afa7; font:10px system-ui,sans-serif; }
#pluto-site-map { min-width:0; max-width:180px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#c6cec5; font:12px system-ui,sans-serif; }
#pluto-site-next { display:flex; align-items:center; flex-shrink:0; gap:9px; position:relative; min-height:30px; background:var(--lime); color:#16200e; font:650 12px system-ui,sans-serif; border:0; border-radius:4px; padding:5px 10px; cursor:pointer; white-space:nowrap; }
#pluto-site-next svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
#pluto-site-next kbd { background:none; border:0; border-left:1px solid #8faa61; border-radius:0; box-shadow:none; color:#3b5129; font:10px ui-monospace,monospace; padding:0 0 0 8px; }
#pluto-site-next[data-ready=true]::after { content:''; position:absolute; right:3px; top:3px; width:3px; height:3px; border-radius:50%; background:#4b6d21; }
#pluto-site-next:disabled { opacity:.65; cursor:wait; }
#pluto-site-next:hover { background:#dcff9d; }
.pluto-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
#pluto-site-dock :is(button,summary):focus-visible,#pluto-playback-more summary:focus-visible { outline:2px solid var(--lime); outline-offset:3px; }
#pluto-site-stats { position:relative; flex-shrink:0; }
#pluto-site-stats summary,#pluto-playback-more summary { display:flex; justify-content:center; align-items:center; width:28px; height:28px; box-sizing:border-box; list-style:none; border-radius:4px; color:#bdc9be; cursor:pointer; }
#pluto-site-stats summary::-webkit-details-marker,#pluto-playback-more summary::-webkit-details-marker { display:none; }
#pluto-site-stats summary:hover,#pluto-playback-more summary:hover { color:#eff9e9; background:#c7ef8315; }
#pluto-site-stats summary svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; }
.pluto-stats-panel,.pluto-playback-panel { position:absolute; top:calc(100% + 12px); right:0; width:max-content; max-width:calc(100vw - 28px); padding:13px 15px; border:1px solid #465447; border-radius:6px; background:#101912f7; box-shadow:0 6px 20px #0005; color:#c6d1c3; font:12px/1.5 system-ui,sans-serif; }
.pluto-stats-panel { display:flex; flex-direction:column; gap:12px; }
.pluto-model { display:flex; flex-direction:column; gap:4px; color:#8fa38c; font-size:11px; }
#pluto-site-value { color:#d0ddc7; font:11px ui-monospace,monospace; }
body.replay-session #replay-apm:not([hidden]) { display:flex; flex-direction:column; align-items:flex-start; gap:6px; padding:0; font-size:10px; color:#8fa38c; }
#replay-apm span { font-size:12px; color:#e5ede0; }
#replay-color-key { padding:0; opacity:.9; }
#replay-input-viz,#group-rail { display:none!important; }

/* Two quiet strips, sized to their controls. The game remains the visual foreground. */
body.replay-session #replay-transport-shell,body.replay-session.replay-player-view #replay-transport-shell { top:8px; bottom:auto; left:10px; right:auto; width:396px; max-width:calc(100vw - 20px); gap:4px; padding:6px 8px; border:0; border-radius:6px; background:rgba(7,13,13,.73); box-shadow:none; backdrop-filter:none; }
body.replay-session #replay-timeline,body.replay-session.replay-player-view #replay-timeline { gap:7px; font-size:10px; }
body.replay-session #replay-time,body.replay-session.replay-player-view #replay-time { color:#dce7d6; font:600 11px/1 ui-monospace,monospace; letter-spacing:0; }
body.replay-session #replay-duration { color:#a1afa2; font-size:10px; }
body.replay-session #replay-seek,body.replay-session.replay-player-view #replay-seek { accent-color:#b7caab; height:12px; }
body.replay-session #replay-hl-markers { margin-top:-5px; height:5px; }
body.replay-session #replay-hl-markers .hl-marker { height:4px; opacity:.75; }
body.replay-session #replay-hl-markers .hl-mopup { height:3px; }
body.replay-session #topbar,body.replay-session.replay-player-view #topbar { flex-wrap:nowrap; gap:4px; }
body.replay-session #topbar button,body.replay-session.replay-player-view #topbar button { flex:0 0 28px; height:28px; border:0; border-radius:4px; background:transparent; color:#c8d3c6; font-size:12px; }
body.replay-session #topbar button:hover { background:#c7ef8315; }
body.replay-session #topbar #autocambtn,body.replay-session.replay-player-view #topbar #autocambtn { flex:0 0 64px; min-width:64px; padding:0 4px; font:600 11px system-ui,sans-serif; letter-spacing:0; }
body.replay-session #topbar #replay-ratebtn { flex-basis:29px; font:600 11px system-ui,sans-serif; color:#c8d3c6; }
body.replay-session #topbar #replay-timelapsebtn,body.replay-session.replay-player-view #topbar #replay-timelapsebtn { order:0; flex:0 0 68px; padding:0 4px; font:600 10px system-ui,sans-serif; letter-spacing:0; text-transform:capitalize; }
body.replay-session #topbar #replay-timelapsebtn.on { color:#eacb7c; background:#eacb7c18; }
body.replay-session #replay-view-live,body.replay-session.replay-player-view #replay-view-live { order:0; flex:1 1 78px; width:78px; min-width:70px; max-width:96px; height:28px; padding:0 15px 0 6px; font:11px system-ui,sans-serif; border:0; background-color:transparent; color:#c8d3c6; }
body.replay-session #paused { display:none!important; }
body.replay-session #resources { top:60px; right:10px; border:0; box-shadow:none; background:#070d0db8; }
body.replay-session #replay-tl-caption { top:88px; left:10px; padding:5px 9px; border:0; border-radius:4px; background:#070d0db8; }
#replay-tl-caption .tl-caption-text { font-size:13px; }
#replay-tl-caption .tl-caption-meta { font-size:10px; }
#pluto-playback-more { position:relative; }
#pluto-playback-more summary { font-size:10px; letter-spacing:1px; }
#pluto-playback-more .pluto-playback-panel { z-index:12; right:0; width:190px; }
.pluto-playback-panel label { display:flex; align-items:center; justify-content:space-between; gap:16px; padding-bottom:9px; }
body.replay-session #topbar #volume { display:block; width:105px; height:22px; margin:0; }
.pluto-secondary-controls { display:flex; flex-direction:column; gap:3px; }
body.replay-session #topbar .pluto-secondary-controls button { flex:0 0 auto; width:100%; padding:5px 0; text-align:left; font:12px system-ui,sans-serif; }
.pluto-secondary-controls #replay-hl-prev[hidden],.pluto-secondary-controls #replay-hl-next[hidden] { display:none!important; }
body.replay-session.replay-player-view #topbar .pluto-secondary-controls :is(#replay-hl-prev,#replay-hl-next) { display:block; }

@media(max-width:960px) {
  #pluto-site-dock { left:10px; right:10px; width:auto; max-width:none; }
  #pluto-site-map { flex:1; max-width:none; }
  body.replay-session #replay-transport-shell,body.replay-session.replay-player-view #replay-transport-shell { top:58px; }
  body.replay-session #resources { top:64px; }
  body.replay-session #replay-tl-caption { top:138px; }
}
@media(max-width:700px) {
  #overlay { padding-top:32px; }
  .pluto-brand { display:none; }
  #pluto-site-dock { gap:8px; padding-left:8px; }
  .pluto-race { width:21px; height:24px; }
  #pluto-site-next { gap:7px; padding:5px 8px; }
  #pluto-site-next kbd { display:none; }
  body.replay-session #replay-transport-shell,body.replay-session.replay-player-view #replay-transport-shell { width:calc(100vw - 20px); }
  body.replay-session #topbar,body.replay-session.replay-player-view #topbar { gap:2px; }
  body.replay-session #topbar #autocambtn,body.replay-session.replay-player-view #topbar #autocambtn { min-width:53px; flex-basis:53px; font-size:10px; }
  body.replay-session #topbar #replay-timelapsebtn,body.replay-session.replay-player-view #topbar #replay-timelapsebtn { flex-basis:62px; }
  body.replay-session #resources { top:136px; }
  body.replay-session #replay-tl-caption { top:170px; max-width:calc(100vw - 38px); }
  .pluto-meta { gap:16px; font-size:11px; }
  .pluto-stats-panel { right:-100px; }
}
@media(max-width:370px) {
  #pluto-site-dock { gap:6px; }
  #pluto-site-next { font-size:11px; gap:4px; }
  body.replay-session #topbar button,body.replay-session.replay-player-view #topbar button { flex-basis:25px; }
  #pluto-playback-more summary { width:25px; }
  body.replay-session #topbar #autocambtn,body.replay-session.replay-player-view #topbar #autocambtn { min-width:48px; flex-basis:48px; }
  body.replay-session #topbar #replay-timelapsebtn,body.replay-session.replay-player-view #topbar #replay-timelapsebtn { flex-basis:56px; font-size:9px; }
  body.replay-session #replay-view-live,body.replay-session.replay-player-view #replay-view-live { min-width:58px; padding-left:1px; }
}
#pluto-site-error { color:#f5c3ab; margin:18px 0; border:1px solid #80583d; padding:14px; border-radius:6px; font-size:13px; }
#pluto-site-error[hidden] { display:none; }
#pluto-site-retry { background:var(--lime); color:#16200e; border:0; border-radius:4px; padding:8px; margin-top:8px; cursor:pointer; }
.pluto-playing #pluto-site-error:not([hidden]) { position:fixed; top:130px; right:20px; max-width:380px; z-index:20; background:#201810; }

/* The standalone profile opens automatically; the ordinary desk lobby is never shown. */
#controls { display:none!important; }

#gameover .go-card { min-width:0; width:min(600px,calc(100vw - 32px)); box-sizing:border-box; overflow:auto; }
#go-new { background:var(--lime); color:#16200e; }
html.pluto-restoring #mpq-gate,html.pluto-restoring .setup-extra { visibility:hidden; }
html:is(.pluto-restoring,.pluto-files-ready) #overlay :is(h1,.pluto-intro,.pluto-meta,.setup-extra) { display:none; }
html:is(.pluto-restoring,.pluto-files-ready) #overlay { padding-top:35vh; }
#local-vault label:has(#vault-enable),label:has(#opt-vault-enable) { display:none!important; }
#pluto-site-advance { position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); z-index:20; display:flex; flex-direction:column; align-items:stretch; gap:20px; width:min(470px,calc(100vw - 40px)); box-sizing:border-box; padding:28px; border:1px solid #9cb87a; border-radius:10px; background:#111a10f5; box-shadow:0 10px 60px #000b; color:#e4efda; font:15px system-ui,sans-serif; text-align:center; }
#pluto-site-verdict { display:block; font-size:clamp(21px,3vw,28px); line-height:1.25; color:#f1f7eb; margin-bottom:14px; }
#pluto-site-countdown { display:block; color:#c7d9b8; font-variant-numeric:tabular-nums; }
#pluto-site-advance[hidden] { display:none; }
#pluto-site-stay { border:1px solid #61734c; background:#293521; color:#e4efda; padding:10px 16px; border-radius:5px; cursor:pointer; white-space:nowrap; }