:root {
  color-scheme: dark;
  --bg: #050507;
  --panel: rgba(8, 8, 12, .74);
  --orange: #ff5a00;
  --orange-hot: #ff9a00;
  --cyan: #39dfff;
  --text: #f4f6f8;
  --muted: #9da5ad;
  --line: rgba(255,255,255,.12);
  font-family: Inter, Segoe UI, Arial, sans-serif;
}
* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; background: var(--bg); }
body { color: var(--text); }
button { font: inherit; }
#app, .screen { width: 100%; height: 100%; }
.screen { position: fixed; inset: 0; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .45s ease, visibility .45s; }
.screen.is-active { opacity: 1; visibility: visible; pointer-events: auto; }
.studio-splash, .menu-screen {
  background-position: center;
  background-size: cover;
}
.studio-splash { background-image: url('../assets/images/brandsborg-splash.jpg'); }
.menu-screen { background-image: url('../assets/images/reactor-background.jpg'); }
.splash-shade, .menu-overlay { position: absolute; inset: 0; }
.splash-shade { background: radial-gradient(circle, transparent 20%, rgba(0,0,0,.25) 60%, rgba(0,0,0,.82)); }
.menu-overlay { background: linear-gradient(90deg, rgba(0,0,0,.82), rgba(0,0,0,.12) 52%, rgba(0,0,0,.64)); }
.menu-panel { position: absolute; left: clamp(24px, 7vw, 120px); top: 50%; transform: translateY(-50%); width: min(560px, 86vw); padding: 32px; background: linear-gradient(145deg, rgba(8,8,10,.8), rgba(8,8,10,.3)); border: 1px solid var(--line); backdrop-filter: blur(12px); box-shadow: 0 25px 80px rgba(0,0,0,.5); }
.eyebrow { margin: 0 0 10px; color: var(--orange-hot); letter-spacing: .32em; font-size: .74rem; }
h1 { margin: 0; font-size: clamp(3rem, 7vw, 6.8rem); line-height: .82; letter-spacing: -.04em; }
h1 span { display:block; color: var(--orange-hot); text-shadow: 0 0 28px rgba(255,90,0,.45); }
.tagline { margin: 24px 0 30px; color: #d5d9dd; font-size: 1.05rem; }
.primary-button { min-width: 240px; padding: 15px 24px; border: 1px solid rgba(255,154,0,.65); color: #fff; background: linear-gradient(180deg,#ff7b00,#c63d00); letter-spacing: .16em; font-weight: 800; cursor:pointer; box-shadow: 0 0 28px rgba(255,90,0,.28), inset 0 1px rgba(255,255,255,.3); transition: transform .18s ease, filter .18s ease; }
.primary-button:hover { transform: translateY(-2px) scale(1.01); filter: brightness(1.08); }
.primary-button:active { transform: translateY(1px) scale(.99); }
.menu-meta { display:flex; gap: 28px; flex-wrap: wrap; margin-top: 24px; color: var(--muted); font-size: .72rem; letter-spacing: .13em; }
.menu-meta strong { color: #fff; }
@media (max-width: 700px) {
  .menu-panel { left: 18px; right: 18px; width: auto; padding: 24px; }
  .menu-overlay { background: rgba(0,0,0,.48); }
}
.language-switch { position:absolute; z-index:3; top:max(20px, env(safe-area-inset-top)); right:max(22px, env(safe-area-inset-right)); display:flex; align-items:center; gap:8px; padding:8px 11px; border:1px solid var(--line); background:rgba(0,0,0,.42); backdrop-filter:blur(10px); color:rgba(255,255,255,.42); font-size:.72rem; letter-spacing:.15em; }
.language-switch button { border:0; padding:3px 2px; background:transparent; color:rgba(255,255,255,.52); font-weight:800; letter-spacing:.14em; cursor:pointer; transition:color .18s ease, text-shadow .18s ease; }
.language-switch button:hover, .language-switch button.is-active { color:var(--orange-hot); text-shadow:0 0 12px rgba(255,90,0,.65); }
.language-switch button:focus-visible { outline:1px solid var(--orange-hot); outline-offset:3px; }
.language-divider { color:rgba(255,255,255,.22); user-select:none; }

/* BUILD 0004 polish */
.primary-button, .secondary-button, .ghost-button, .language-switch button { -webkit-tap-highlight-color: transparent; }
.primary-button:focus-visible, .secondary-button:focus-visible, .ghost-button:focus-visible { outline:2px solid var(--orange-hot); outline-offset:3px; }
.menu-panel { animation: menuArrival .7s cubic-bezier(.2,.8,.2,1) both; }
@keyframes menuArrival { from { opacity:0; transform:translateY(calc(-50% + 18px)); } to { opacity:1; transform:translateY(-50%); } }


/* BUILD 0007 — shared Forge information modal */
.help-button { position:static; display:grid; place-items:center; width:24px; height:24px; padding:0!important; border:1px solid rgba(255,255,255,.24)!important; border-radius:50%; background:transparent!important; color:rgba(255,255,255,.66)!important; font-family:Georgia,serif; font-size:.83rem!important; font-weight:700; font-style:italic; line-height:1; letter-spacing:0!important; cursor:pointer; box-shadow:none!important; opacity:.9; transition:color .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease; }
.help-button:hover { color:#fff!important; border-color:var(--orange-hot)!important; box-shadow:0 0 12px rgba(255,90,0,.3)!important; transform:scale(1.08); }
.help-button:focus-visible,.info-close:focus-visible,.info-tab:focus-visible { outline:2px solid var(--orange-hot); outline-offset:3px; }
.info-modal { position:fixed; inset:0; z-index:50; display:grid; place-items:center; padding:22px; background:rgba(0,0,0,.74); backdrop-filter:blur(12px); opacity:0; visibility:hidden; pointer-events:none; transition:opacity .25s ease,visibility .25s; }
.info-modal.is-visible { opacity:1; visibility:visible; pointer-events:auto; }
.info-dialog { width:min(760px,96vw); max-height:min(780px,92vh); overflow:auto; border:1px solid rgba(255,122,0,.54); background:linear-gradient(150deg,rgba(18,10,8,.98),rgba(5,6,10,.98)); box-shadow:0 28px 110px rgba(0,0,0,.72),0 0 70px rgba(255,74,0,.18); transform:translateY(20px) scale(.97); transition:transform .28s cubic-bezier(.2,.8,.2,1); }
.info-modal.is-visible .info-dialog { transform:none; }
.info-header { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; padding:25px 28px 18px; border-bottom:1px solid rgba(255,255,255,.09); }
.info-header h2 { margin:0; font-size:clamp(1.7rem,4vw,2.7rem); letter-spacing:.03em; }
.info-close { width:40px; height:40px; border:1px solid rgba(255,255,255,.16); background:rgba(255,255,255,.04); color:#fff; font-size:1.65rem; line-height:1; cursor:pointer; }
.info-tabs { display:grid; grid-template-columns:1fr 1fr; border-bottom:1px solid rgba(255,255,255,.1); }
.info-tab { padding:15px 18px; border:0; border-bottom:3px solid transparent; background:rgba(255,255,255,.025); color:#959ba2; font-size:.72rem; font-weight:900; letter-spacing:.17em; cursor:pointer; }
.info-tab.is-active { color:#fff; border-bottom-color:var(--orange-hot); background:linear-gradient(180deg,rgba(255,108,0,.12),rgba(255,108,0,.025)); }
.info-panel { padding:25px 28px 30px; }
.info-panel[hidden] { display:none; }
.info-intro { margin:0 0 20px; color:#d5d8dc; line-height:1.65; }
.object-guide { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.guide-card { display:grid; grid-template-columns:54px 1fr; align-items:center; gap:13px; min-height:104px; padding:15px; border:1px solid rgba(255,255,255,.1); background:rgba(255,255,255,.035); }
.guide-icon { display:grid; place-items:center; width:50px; height:50px; border-radius:50%; color:#fff; font-size:1.55rem; font-weight:900; background:#111; box-shadow:inset 0 0 18px rgba(255,255,255,.13),0 0 25px currentColor; }
.guide-card h3 { margin:0 0 6px; font-size:.78rem; letter-spacing:.14em; }
.guide-card p { margin:0; color:#b9bec4; font-size:.86rem; line-height:1.45; }
.guide-heat .guide-icon { color:#ff6a00; }.guide-coolant .guide-icon { color:#45e7ff; }.guide-waste .guide-icon { color:#b7d52a; }.guide-emp .guide-icon { color:#a892ff; }
.info-tip { margin:17px 0 0; padding:14px 16px; border-left:3px solid var(--orange-hot); background:rgba(255,116,0,.07); color:#cfd3d7; line-height:1.55; }
.info-tip strong { color:#ffd08a; letter-spacing:.12em; }
.about-brand { display:flex; align-items:center; gap:18px; padding:3px 0 23px; border-bottom:1px solid rgba(255,255,255,.09); }
.about-mark { display:grid; place-items:center; width:68px; height:68px; border:1px solid rgba(255,154,0,.58); color:#fff; font-weight:950; letter-spacing:.08em; background:radial-gradient(circle,#ff8a00,#5b1300 66%,#140603); box-shadow:0 0 32px rgba(255,90,0,.34); }
.about-brand h3 { margin:0 0 5px; font-size:1.35rem; letter-spacing:.05em; }.about-brand p { margin:0; color:#9ea4aa; font-size:.72rem; letter-spacing:.13em; }
.about-copy { display:grid; grid-template-columns:1fr 1fr; gap:18px 30px; padding-top:22px; color:#c7ccd1; line-height:1.55; }
.about-copy p { margin:0; }.about-copy strong { color:#fff; font-size:.68rem; letter-spacing:.15em; }.legal-copy { grid-column:1/-1; padding-top:18px; border-top:1px solid rgba(255,255,255,.08); color:#858c93; font-size:.78rem; }
body.has-open-modal { overflow:hidden; }
@media (max-width:650px) { .help-button{width:23px;height:23px}.info-modal{padding:10px}.info-header{padding:20px 18px 14px}.info-panel{padding:20px 18px 23px}.object-guide{grid-template-columns:1fr}.guide-card{min-height:88px}.about-copy{grid-template-columns:1fr}.legal-copy{grid-column:auto}.info-tab{font-size:.62rem;padding-inline:8px} }
@media (prefers-reduced-motion:reduce) { .info-dialog,.help-button{transition:none!important} }
