/* PROJECT EXASCALE | V1.001.0 | Industrial Frontier
 * Local, full-frame concept artwork. Presentation motion never advances game time. */
.title-screen{--title-gold:#efbb76;--title-ink:#070d12;position:fixed;inset:0;z-index:80;display:grid;grid-template-rows:auto minmax(0,1fr) auto;color:#f5f2e9;font-family:inherit;overflow-x:hidden;overflow-y:auto;isolation:isolate;background:#091219}
.title-screen[hidden]{display:none}
.title-art,.title-shade,.title-grain{position:absolute;inset:0;pointer-events:none;z-index:-1}
.title-art{background:#10242b url('assets/exascale-frontier-keyart.webp') center center/cover no-repeat;transform:scale(1.025);transform-origin:66% 50%;will-change:transform}
.title-screen[data-motion="true"] .title-art{animation:title-drift 30s ease-in-out infinite alternate}
.title-shade{background:linear-gradient(90deg,rgba(5,12,17,.95) 0%,rgba(5,12,17,.83) 22%,rgba(5,12,17,.45) 47%,rgba(5,12,17,.05) 73%),linear-gradient(0deg,rgba(5,11,15,.99) 0%,rgba(5,11,15,.70) 10%,transparent 35%,transparent 76%,rgba(5,11,15,.67) 100%)}
.title-grain{opacity:.18;background:repeating-linear-gradient(0deg,transparent,transparent 3px,#061018 4px);mix-blend-mode:soft-light}
.title-head{min-height:84px;display:flex;align-items:center;justify-content:space-between;gap:18px;margin:0 clamp(22px,4.5vw,86px);border-bottom:1px solid #ffffff25}
.title-wordmark{display:flex;align-items:center;gap:12px;color:#dde8e5;font-size:10px;line-height:1.5;font-weight:700;letter-spacing:.2em}
.title-mark{width:24px;height:29px;color:var(--title-gold);flex:none}
.title-edition{display:flex;align-items:center;gap:14px;color:#d1dedc;font-size:10px;letter-spacing:.17em;white-space:nowrap}.title-edition b{font-weight:600;color:#f2ca94}.title-edition i{height:3px;width:3px;background:var(--title-gold)}
.title-main{position:relative;display:flex;align-items:center;padding:38px clamp(22px,4.5vw,86px) 42px;min-height:0}
.title-copy{position:relative;width:560px;max-width:53%;padding:0 0 8px}
.title-eyebrow{font-size:10px;font-weight:700;letter-spacing:.24em;color:#edc89a;display:flex;gap:12px;align-items:center;margin:0 0 24px}.title-eyebrow span{width:24px;height:1px;background:var(--title-gold);box-shadow:0 0 10px #efbb7660}
.title-screen h1{margin:0;color:#f6f3e9;font-size:clamp(58px,6.5vw,106px);font-weight:900;line-height:.92;letter-spacing:-.06em;text-shadow:0 4px 30px #0005}
.title-screen h1 small{display:block;margin:0 0 13px 4px;font-size:13px;line-height:1.3;letter-spacing:.65em;font-weight:650;color:#d2ddd9}
.title-tagline{margin:25px 0 0;font-size:clamp(24px,2.4vw,37px);line-height:1.14;letter-spacing:-.035em;font-weight:600;color:#e7eeea}.title-tagline em{font-style:normal;color:var(--title-gold)}
.title-intro{color:#c3cecb;font-size:14px;line-height:1.65;margin:17px 0 25px;max-width:430px;text-wrap:pretty}
.title-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;max-width:426px}
.title-play{position:relative;grid-column:1/-1;border:1px solid #ffd89d;border-bottom-color:#aa7538;background:linear-gradient(112deg,#f4cf97,#e9ad60 80%);color:#182020;min-height:66px;padding:14px 53px 13px 19px;font:inherit;font-size:13px;font-weight:850;letter-spacing:.09em;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:4px;box-shadow:0 3px 0 #6b4a2b,0 10px 32px #0005;border-radius:3px;cursor:pointer;text-align:left;transition:background .18s,box-shadow .18s,transform .18s}
.title-play:after{content:'\2192';position:absolute;right:20px;top:50%;transform:translateY(-50%);font-size:26px;font-weight:400;line-height:1}.title-play small{font-weight:600;letter-spacing:0;font-size:11px;line-height:1.45;color:#3d3325}.title-play:hover{background:linear-gradient(112deg,#ffe0b2,#f7c37e 80%);box-shadow:0 3px 0 #6b4a2b,0 12px 36px #0007}.title-play:active{transform:translateY(2px);box-shadow:0 1px 0 #6b4a2b}
.title-secondary{background:#0b171dcc;border:1px solid #8ea49b80;color:#e0e9e3;min-height:47px;min-width:0;padding:10px 13px;font:inherit;font-size:12px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:2px;border-radius:3px;cursor:pointer;text-align:center;transition:background .18s,border-color .18s}.title-secondary small{display:none}.title-secondary:hover{border-color:#efbb7d;background:#1c2b30ed;color:#f7d4a1}.title-actions>.title-secondary:last-child:nth-child(2){grid-column:1/-1}
.title-note{font-size:11px;color:#b2c1ba;line-height:1.5;max-width:426px;margin:13px 0 0;min-height:17px}
.title-scene{position:absolute;right:clamp(22px,4.5vw,86px);bottom:44px;width:270px;text-align:right;text-shadow:0 1px 8px #000}
.title-scene-label{display:block;font-size:10px;letter-spacing:.2em;color:#f6dfba;font-weight:700}.title-scene p{font-size:11px;color:#c2cfcc;line-height:1.6;margin:7px 0 0}.title-art-label{display:inline-block;padding:5px 8px;margin:12px 0 0;border:1px solid #b8c2b94d;border-radius:2px;color:#b9c9c5;background:#0b161ba6;font-size:9px;letter-spacing:.08em}
.title-foot{margin:0 clamp(22px,4.5vw,86px);padding:19px 0 16px;border-top:1px solid #ffffff25;display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:20px;row-gap:13px;align-items:center}
.title-promise{display:flex;align-items:center;gap:clamp(20px,3vw,54px)}
.title-promise span{display:flex;align-items:center;gap:10px;color:#d6e2dc;font-size:10px;font-weight:600;letter-spacing:.12em;white-space:nowrap}.title-promise svg{width:21px;height:21px;flex:none;stroke:#dcb783;stroke-width:1.5;fill:none;stroke-linecap:round;stroke-linejoin:round}
.title-tools{display:flex;gap:8px;align-items:center}
.title-small,.title-import{min-height:44px;padding:8px 13px;background:#0d1a20b8;border:1px solid #81978d73;color:#d7e1da;font:inherit;font-size:10px;font-weight:600;letter-spacing:.03em;border-radius:3px;cursor:pointer;display:flex;align-items:center;justify-content:center;white-space:nowrap}.title-small[hidden]{display:none}.title-small:hover,.title-import:hover{border-color:#efbb7d;color:#f7d4a1}.title-import input{position:absolute;width:1px;height:1px;opacity:0}.title-small:disabled{opacity:.65;cursor:default}
.title-disclosure{grid-column:1/-1;margin:0;font-size:10px;color:#9db1a9;line-height:1.6;max-width:820px}
.title-screen button:focus-visible,.title-screen label:focus-within{outline:2px solid #ffe2ac;outline-offset:4px}
.title-skip{position:fixed;right:max(18px,env(safe-area-inset-right));top:max(18px,env(safe-area-inset-top));z-index:81;min-height:48px;padding:10px 18px;background:#102027ed;border:1px solid #efbb7d;color:#ffe0a4;font:inherit;font-size:13px;font-weight:700;letter-spacing:.04em;border-radius:3px;cursor:pointer;box-shadow:0 4px 20px #0004}.title-skip:focus-visible{outline:2px solid #ffe2ac;outline-offset:4px}
.title-skip[hidden]{display:none}
.title-status{position:fixed;left:50%;bottom:max(24px,env(safe-area-inset-bottom));transform:translateX(-50%);z-index:82;background:#132025;border:1px solid #5fdc9a;color:#e8f3ee;padding:11px 16px;border-radius:4px;font-size:13px;line-height:1.5;max-width:90vw;box-shadow:0 8px 24px #0005}.title-status.warn{border-color:#e5ad62;color:#ffe0a4}.title-status[hidden]{display:none}
body.title-shown .g-hud,body.title-shown .toast,body.title-shown .shift-briefing{visibility:hidden}
body.title-intro .g-hud{pointer-events:none}
body.title-shown .stage > :not(.viewport),body.title-shown .topbar,body.title-shown .hoverlabel{visibility:hidden}
@keyframes title-drift{from{transform:scale(1.025)}to{transform:scale(1.065) translateX(-.5%)}}
@media(min-width:701px) and (max-height:800px){.title-head{min-height:66px}.title-main{padding-top:24px;padding-bottom:24px}.title-copy{max-width:56%;padding:0}.title-eyebrow{margin-bottom:17px}.title-screen h1{font-size:clamp(57px,6vw,88px)}.title-tagline{font-size:29px;margin-top:20px}.title-intro{margin:14px 0 18px;font-size:13px;max-width:410px}.title-foot{padding:12px 0;row-gap:8px}.title-scene{bottom:28px}.title-note{font-size:10px}}
@media(max-width:1050px) and (min-width:701px){.title-copy{max-width:64%}.title-scene{width:205px}.title-promise{gap:17px}.title-promise span{font-size:9px;gap:7px}.title-promise svg{width:18px;height:18px}.title-edition{font-size:9px;gap:9px}.title-screen h1{font-size:clamp(64px,8vw,85px)}.title-shade{background:linear-gradient(90deg,#071018ed 0%,#071018b8 35%,#07101820 100%),linear-gradient(0deg,#071018 0%,#07101866 20%,transparent 70%,#07101877 100%)}}
@media(max-width:700px){
 .title-screen{grid-template-rows:auto 1fr auto;background:#091219;min-height:0}
 .title-art{position:fixed;background-position:64% top;background-size:auto 61vh;transform:none;will-change:auto}.title-screen[data-motion="true"] .title-art{animation:none}
 .title-shade{position:fixed;background:linear-gradient(0deg,#091219 0%,#091219 43%,#091219ea 58%,#09121938 79%,#09121955 100%)}.title-grain{display:none}
 .title-head{min-height:60px;margin:0 20px;align-items:center}.title-wordmark{font-size:8px;letter-spacing:.13em;gap:8px}.title-mark{width:18px;height:23px}.title-edition{font-size:9px;letter-spacing:.07em;gap:0}.title-edition b,.title-edition i{display:none}
 .title-main{display:block;padding:clamp(102px,17vh,150px) 20px 18px;min-height:0}.title-copy{max-width:none;width:auto;padding:0}.title-eyebrow{font-size:9px;letter-spacing:.17em;margin:0 0 17px;gap:9px}.title-screen h1{font-size:clamp(48px,14vw,80px);letter-spacing:-.055em}.title-screen h1 small{font-size:10px;letter-spacing:.5em;margin:0 0 9px 3px}
 .title-tagline{font-size:25px;line-height:1.15;margin-top:19px}.title-tagline br{display:none}.title-intro{font-size:12px;line-height:1.6;margin:13px 0 21px;max-width:450px}.title-actions{max-width:none;gap:9px}.title-play{min-height:62px;font-size:12px;padding-left:16px;padding-right:43px}.title-play small{font-size:10px}.title-secondary{min-height:45px;font-size:11px}.title-note{font-size:10px;margin-top:12px;max-width:none}
 .title-scene{top:15px;right:20px;bottom:auto;width:auto;text-align:right}.title-scene-label,.title-scene p{display:none}.title-art-label{font-size:8px;margin:0;padding:4px 7px;color:#d6dfd8;background:#0b161bbf}
 .title-foot{margin:0 20px;padding:14px 0 max(17px,env(safe-area-inset-bottom));grid-template-columns:1fr;row-gap:12px;align-items:start}.title-promise{justify-content:space-between;gap:8px}.title-promise span{font-size:8px;letter-spacing:.06em;gap:7px}.title-promise svg{width:17px;height:17px}.title-tools{justify-content:flex-start}.title-small,.title-import{font-size:10px;min-height:44px;flex:1}.title-disclosure{font-size:9px;line-height:1.55}
}
@media(max-width:700px) and (max-height:750px){.title-main{padding-top:88px}.title-tagline{font-size:23px;margin-top:16px}.title-intro{margin-top:10px;margin-bottom:17px}.title-screen h1{font-size:clamp(46px,13.5vw,66px)}.title-eyebrow{margin-bottom:13px}.title-foot{row-gap:10px}}
@media(max-height:520px) and (min-width:701px){.title-screen{grid-template-rows:auto auto auto}.title-main{min-height:430px}.title-art,.title-shade{position:fixed}.title-copy{max-width:63%}.title-foot{padding-bottom:16px}}
@media(prefers-reduced-motion:reduce){.title-screen .title-art{animation:none!important;transform:none;will-change:auto}.title-play,.title-secondary{transition:none}}

@media(max-width:700px) and (max-height:520px) and (orientation:landscape){
 .title-screen{grid-template-rows:auto auto auto}.title-head{min-height:48px}.title-main{padding:17px 20px 19px}.title-copy{max-width:61%}.title-eyebrow{display:none}.title-screen h1{font-size:44px}.title-screen h1 small{font-size:8px;margin-bottom:7px}.title-tagline{font-size:19px;margin-top:12px}.title-intro{font-size:10px;line-height:1.5;margin:9px 0 13px}.title-play{min-height:54px;font-size:10px}.title-play small{font-size:9px}.title-secondary{font-size:10px;min-height:44px}.title-note{font-size:9px;margin-top:9px}.title-art{background-size:cover;background-position:center}.title-shade{background:linear-gradient(90deg,#091219ed,#091219af 45%,#09121922),linear-gradient(0deg,#091219 0%,transparent 40%)}.title-scene{top:20px}.title-foot{padding-top:11px;grid-template-columns:1fr auto;align-items:center}.title-promise{gap:13px}.title-promise span{font-size:7px;max-width:85px;white-space:normal;line-height:1.6}.title-promise svg{width:14px;height:14px}.title-tools{gap:6px}.title-small,.title-import{font-size:8px;padding:6px 9px}.title-disclosure{font-size:8px}
}
