/* OUTMAXX / Welcome. Live type, approved mark, and separate production artwork. */
#welcome-screen[hidden],.storage-notice[hidden]{display:none!important}
#welcome-screen{position:fixed;inset:0;z-index:7000;display:grid;place-items:center;background:#020b0e;color:#f2f3eb;padding:16px;isolation:isolate;overscroll-behavior:none;}
#welcome-screen *{box-sizing:border-box}
.welcome-panel{width:min(1120px,100%);height:min(850px,100%);display:grid;grid-template-rows:auto minmax(0,1fr) auto;border:1.5px solid #19e5ed;border-radius:18px;overflow:hidden;background:radial-gradient(ellipse at 24% 30%,#04303970,transparent 64%),#020d10;box-shadow:0 0 40px #06dceb0b,inset 0 0 45px #01dded05;}
.welcome-header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px 30px 10px;}
.welcome-brand{display:block;width:156px!important;height:auto!important;object-fit:contain!important;filter:none!important;max-height:42px;}
.welcome-skip{background:none;border:0;color:#d8e3e3;font:15px var(--body-font);padding:10px 0 10px 16px;min-height:44px;cursor:pointer;}
.welcome-scroll{min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#225460 transparent;}
.welcome-content{min-height:100%;display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:34px;padding:24px 40px 30px;}
.welcome-art{position:relative;width:100%;aspect-ratio:1;margin:0;isolation:isolate;}
.welcome-illustration{display:block;width:100%;height:100%;object-fit:contain;position:relative;z-index:1;}
.welcome-honeycomb{position:absolute;inset:6%;z-index:0;opacity:.22;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='84' height='146' viewBox='0 0 84 146'%3E%3Cpath d='M0 24.3 42 0 84 24.3V73L42 97.3 0 73ZM-42 97.3 0 73 42 97.3V146L0 170.3 -42 146ZM42 97.3 84 73 126 97.3V146L84 170.3 42 146Z' fill='none' stroke='%23099caa' stroke-width='1'/%3E%3C/svg%3E");background-size:54px 94px;mask-image:radial-gradient(ellipse,#000 10%,transparent 70%);}
.welcome-motion{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;fill:none;stroke:#c6ffff;stroke-width:5;filter:drop-shadow(0 0 8px #00dfef);opacity:.8;}
.welcome-motion circle{fill:#ffd879;stroke:none;filter:blur(21px);opacity:0;animation:welcome-beat 4.5s ease-in-out infinite;}
.welcome-motion .motion-two{animation-delay:.65s}.welcome-motion .motion-three{animation-delay:1.3s}
.welcome-motion .motion-core{fill:#12ddee;filter:blur(40px);animation-duration:5s;opacity:.05;}
.motion-rail,.motion-orbit,.motion-flow{stroke-dasharray:55 900;stroke-dashoffset:70;animation:welcome-flow 4.5s ease-in-out infinite;opacity:0;}
.motion-flow{stroke-width:10;stroke-dasharray:16 300;animation-name:welcome-charge;}
.welcome-kicker{display:flex;align-items:center;gap:8px;color:#7fabb2;letter-spacing:.14em;font:12px var(--display-font);margin-bottom:17px;}
.welcome-kicker i{width:14px;height:2px;background:#0fe4ed;box-shadow:0 0 9px #0fe4ed80}.welcome-kicker span{margin-left:auto;color:#b1ced3;letter-spacing:.1em;}
.welcome-copy h1{margin:0 0 22px;font:400 clamp(40px,4.2vw,58px)/1.01 var(--display-font);letter-spacing:.018em;color:#f7f5e9;text-wrap:balance;outline:none;}
.welcome-copy p{margin:0;font:400 16px/1.65 var(--body-font);color:#dce4e4;text-wrap:pretty;}
.welcome-copy{max-width:440px;animation:welcome-enter .3s ease-out both;}
.welcome-footer{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:40px;padding:8px 40px 28px;}
.welcome-navigation{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0;}
.welcome-back{display:grid;place-items:center;width:44px;height:44px;padding:0;background:none;border:1px solid #27474d;border-radius:5px;color:#bedde0;font:32px/1 Arial;cursor:pointer;}
.welcome-back:disabled{opacity:.2;cursor:default;}
.welcome-dots{display:flex;align-items:center;justify-content:center;}
.welcome-dots button{width:32px;height:44px;display:grid;place-items:center;background:none;border:0;padding:0;cursor:pointer;}
.welcome-dots span{display:block;width:8px;height:8px;border:1px solid #a3bac2;border-radius:50%;transition:background .2s,box-shadow .2s;}
.welcome-dots button[aria-current] span{border-color:#05e3ed;background:#05e3ed;box-shadow:0 0 12px #00deed65;}
.welcome-counter{font:16px var(--display-font);color:#dcf4f4;letter-spacing:.08em;white-space:nowrap;}
.welcome-counter i{font-style:normal;color:#668990;margin-left:5px;}
.welcome-next{position:relative;display:flex;align-items:center;justify-content:center;gap:16px;min-height:62px;width:100%;border:1.5px solid #0de4ec;border-radius:10px;background:linear-gradient(155deg,#15404a90,#030d11 55%,#11434b70);box-shadow:inset 0 3px 0 #b6ffff0f,0 0 15px #04cee10b;color:#f1f5eb;font:400 27px var(--display-font);letter-spacing:.08em;cursor:pointer;}
.welcome-next svg{position:absolute;right:24px;width:18px;fill:none;color:#0fe5ef;}
.welcome-next:hover{background:linear-gradient(155deg,#1d525d,#071d24 55%,#134953)}
#welcome-screen button:focus-visible{outline:2px solid #ffe38a;outline-offset:4px;}
.welcome-replay-card{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:25px;}
.welcome-replay-card h2{font:32px var(--display-font);margin:6px 0}.welcome-replay-card p{color:#b9cbcf;margin:0;font-size:14px;}
.welcome-replay-card .action-button{flex-shrink:0;}
.sound-event{margin:0 22px 22px;}
.first-program{padding:44px 24px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:18px;}
.first-program-art{width:100px;height:100px;object-fit:contain;}.first-program h1{font:48px/1 var(--display-font);margin:0;color:#f2f4e9;}.first-program p{font-size:16px;line-height:1.6;color:#bed0d5;max-width:430px;margin:0 0 8px;}.first-program-replay{border:0;background:none;color:#8ebec8;padding:14px;font-size:14px;}
.storage-notice{position:fixed;left:12px;right:12px;bottom:12px;z-index:20000;border:1px solid #e6c45f;border-radius:6px;padding:16px;background:#142328;color:#ffe9a1;font:14px/1.5 Arial;box-shadow:0 5px 25px #000a;}.storage-notice button{padding:8px 12px;color:#fff;border:1px solid #e6c45f;background:#2b342e;margin:6px;border-radius:4px;}
@keyframes welcome-enter{from{opacity:.4;transform:translateY(5px)}to{opacity:1;transform:none}}
@keyframes welcome-beat{0%,12%,65%,100%{opacity:0}25%,42%{opacity:.32}}
@keyframes welcome-flow{0%,12%{stroke-dashoffset:70;opacity:0}20%{opacity:.8}64%{stroke-dashoffset:-800;opacity:.8}72%,100%{stroke-dashoffset:-850;opacity:0}}
@keyframes welcome-charge{0%,12%{stroke-dashoffset:30;opacity:0}22%{opacity:.85}55%{stroke-dashoffset:-120;opacity:0}100%{stroke-dashoffset:-120;opacity:0}}
@media(max-width:720px){
 #welcome-screen{padding:max(8px,env(safe-area-inset-top)) 8px max(8px,env(safe-area-inset-bottom));}
 .welcome-panel{height:100%;border-radius:14px;}
 .welcome-header{padding:15px 22px 4px;}.welcome-brand{width:133px!important;max-height:34px;}.welcome-skip{font-size:14px;}
 .welcome-content{display:flex;flex-direction:column;justify-content:center;gap:22px;padding:14px 24px 24px;}
 .welcome-art{width:clamp(205px,32svh,310px);max-width:100%;flex-shrink:0;}
 .welcome-copy{width:100%;max-width:430px;}.welcome-kicker{font-size:11px;margin-bottom:13px;}
 .welcome-copy h1{font-size:clamp(33px,9.7vw,46px);margin-bottom:18px;line-height:1.01;text-wrap:balance;}
 .welcome-copy p{font-size:15px;line-height:1.58;}
 .welcome-footer{display:flex;flex-direction:column;gap:10px;padding:0 23px 20px;}
 .welcome-navigation{width:100%;}.welcome-next{min-height:58px;font-size:25px;}.welcome-back{height:38px;width:38px}.welcome-dots button{width:30px;height:38px}.welcome-counter{font-size:14px;}
 .welcome-replay-card{flex-direction:column;align-items:flex-start;}.welcome-replay-card .action-button{width:100%;}
}
@media(max-width:360px){.welcome-header{padding-inline:18px}.welcome-content{padding-inline:19px;gap:20px}.welcome-copy p{font-size:14px}.welcome-art{width:205px}.welcome-footer{padding-inline:19px}.welcome-next{font-size:22px}.welcome-dots button{width:25px}}
@media(max-height:670px) and (max-width:720px){.welcome-content{justify-content:flex-start;}.welcome-art{width:210px}.welcome-header{padding-top:8px}.welcome-footer{padding-bottom:12px}.welcome-copy h1{font-size:34px;}.welcome-next{min-height:52px}}
@media(max-height:520px) and (min-width:721px){.welcome-panel{height:100%}.welcome-content{padding:15px 26px;gap:30px}.welcome-art{width:min(100%,260px);justify-self:center}.welcome-header{padding-top:10px}.welcome-copy h1{font-size:34px;margin-bottom:14px}.welcome-copy p{font-size:14px}.welcome-footer{padding-bottom:12px}.welcome-next{min-height:48px}}
@media(prefers-reduced-motion:reduce){.welcome-motion *,.welcome-copy{animation:none!important}.welcome-motion{display:none}}
.welcome-next>.chevron{position:absolute;right:24px;width:14px;height:22px;object-fit:contain;filter:brightness(0) saturate(100%) invert(78%) sepia(68%) saturate(2039%) hue-rotate(129deg);}