/* Side-on WebGL skyline, with the same industrial primary control used in-game. */
:is(#viewport,.difficulty-transition-cover).title-screen .hud,:is(#viewport,.difficulty-transition-cover).title-screen .wavehud,:is(#viewport,.difficulty-transition-cover).title-screen .shield-hud,:is(#viewport,.difficulty-transition-cover).title-screen .bottomhud,:is(#viewport,.difficulty-transition-cover).title-screen .test-open,:is(#viewport,.difficulty-transition-cover).title-screen .skill-wallet,:is(#viewport,.difficulty-transition-cover).title-screen .motionfx{display:none!important}
:is(#viewport,.difficulty-transition-cover).title-screen #overlay{padding:0;overflow:hidden;background:linear-gradient(180deg,#090d2c8c 0%,transparent 38%,transparent 70%,#080d28ae 100%);backdrop-filter:none;justify-content:initial}
:is(#viewport,.difficulty-transition-cover).title-screen #overlay::before{display:none}
.title-brand{position:absolute;top:9%;left:4%;right:4%;pointer-events:none}
.title-brand h1{margin:0;font-size:0;line-height:0}
.title-brand img{display:block;width:100%;height:auto;object-fit:contain}
.title-entry{position:absolute;left:0;right:0;bottom:13%;display:flex;align-items:center;flex-direction:column}
:is(#viewport,.difficulty-transition-cover).title-screen #start{width:61%;min-width:0;min-height:52px;margin:0;padding:16px 22px;display:flex;justify-content:space-between;align-items:center;font-size:17px}
:is(#viewport,.difficulty-transition-cover).title-screen #overlay .title-caption{margin:13px 0 0;font-size:10px;letter-spacing:.16em;color:#8eabc7}
:is(#viewport,.difficulty-transition-cover).title-screen .menu-extras{position:absolute;bottom:max(14px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);width:70%;max-width:none;margin:0;border-color:#7180a033;z-index:1}
:is(#viewport,.difficulty-transition-cover).title-screen .menu-extras summary{text-align:center;font-size:9px;color:#8192aa}
:is(#viewport,.difficulty-transition-cover).title-screen .menu-extras[open]{max-height:24%;background:#101925f5}
@media(prefers-reduced-motion:reduce){.title-brand{filter:none}}

:is(#viewport,.difficulty-transition-cover).title-screen .skill-entry{position:absolute;bottom:6.5%;margin:0;padding:6px 12px;font-size:10px;background:#111b25bb;border-color:#43556288;color:#9bb3cb}



.title-circuit{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;fill:none;stroke-width:1.35;stroke-linejoin:round}
.title-circuit[hidden]{display:none}
.title-circuit{z-index:3;background:radial-gradient(ellipse 90% 34% at 50% 0%,#c6733966,transparent 90%),radial-gradient(ellipse at 50% 34%,color-mix(in srgb,currentColor 32%,#101927),color-mix(in srgb,currentColor 19%,#090f1b) 78%);color:#3b8490}
.circuit-ink{stroke:currentColor}
.circuit-ink circle{fill:currentColor}
.circuit-signal{stroke:color-mix(in srgb,currentColor 65%,white);stroke-width:2;stroke-dasharray:5 95;animation:title-circuit-signal 5s linear infinite}
.circuit-signal circle{display:none}
@keyframes title-circuit-signal{from{stroke-dashoffset:5}to{stroke-dashoffset:-95}}
@media(prefers-reduced-motion:reduce){.circuit-signal{display:none}}

.title-spectrum{display:none;position:absolute;inset:-13%;width:126%;height:126%;pointer-events:none;opacity:.86}
.title-screen.lobby-open.difficulty-screen:not(.lobby-subpage) .title-spectrum{display:block}

.title-mixer{display:none;position:absolute;left:50%;transform:translateX(-50%);z-index:76;pointer-events:none;filter:drop-shadow(0 3px 3px #0009)}
.title-screen.lobby-open.difficulty-screen:not(.lobby-subpage) .title-mixer[data-rendered]:not([hidden]){display:block}
#viewport.title-screen.lobby-open.difficulty-screen:not(.lobby-subpage) .difficulty-panel{translate:0 -30px}
