
/* Galactic Racer: post-launch interactive field guide, 2026-10-17 */
.gr-page{background:#050609;color:#f4f6fa;background-image:radial-gradient(ellipse at 80% 3%,rgba(105,16,24,.13),transparent 45%)}
.gr-page .gr-hero{max-width:1420px;padding-top:12px;position:relative}
.gr-page .gr-hero-img{position:relative;aspect-ratio:21/8;border:1px solid #52272d;box-shadow:0 20px 70px #0009}
.gr-page .gr-hero-img:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#05060996,transparent 45%),linear-gradient(90deg,#05060975,transparent 65%);pointer-events:none}
.gr-page .gr-hero-img img{object-position:50% 53%;filter:saturate(1.15) contrast(1.08)}
.gr-page .gr-hero-text{position:relative;margin-top:-95px;padding:22px 24px 10px;background:linear-gradient(90deg,#06080e 0%,#06080ef0 60%,transparent);max-width:1050px}
.gr-page .gr-hero h1{max-width:none;width:100%;font-size:clamp(2.2rem,4.3vw,4.5rem);line-height:1.04;letter-spacing:-.035em;text-wrap:balance;text-shadow:0 9px 28px #000}
.gr-page .gr-hero h1 span{display:inline-block;white-space:nowrap}
.gr-page .gr-availability{color:#ffa69a}
.gr-page .gr-hero-text>p:not(.gr-availability){font-size:clamp(1rem,1.65vw,1.25rem);max-width:790px}
.gr-page .gr-links a:first-child{background:#a9272d;border-color:#ef7d6f;color:#fff}
.gr-page .gr-links a:first-child:hover{background:#c63c44}
.gr-page .gr-facts>div{background:#0e121b;border-top:2px solid #a52a32}
.gr-page .gr-jump{position:relative;z-index:3;gap:7px}
.gr-page .gr-jump a{border-color:#463039;background:#16131c}
.gr-page .gr-jump a:hover{border-color:#da6664;background:#29191f}
.gr-page .gr-section{max-width:1240px}
.gr-page .gr-kicker{color:#ff9b82}
.gr-page .gr-section h2{letter-spacing:-.016em}
.gr-page .gr-section a:not(.gr-command-card):hover{color:#fff}
.gr-page button,.gr-page select{font:inherit}
.gr-page button{touch-action:manipulation}
.gr-page .gr-section-top,.gr-page .gr-milestone-head{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.gr-page .gr-live-dot{font-size:.64rem;font-weight:900;letter-spacing:.1em;color:#ffc5b5;border:1px solid #783840;padding:7px 10px;background:#29151a}
.gr-page .gr-live-dot:before{content:"";display:inline-block;width:7px;height:7px;margin-right:8px;border-radius:50%;background:#fa655c;box-shadow:0 0 14px #f45f57}
.gr-page .gr-command{margin-top:6px;border:1px solid #57333b;background:radial-gradient(circle at 100% 0,rgba(155,48,56,.17),transparent 53%),linear-gradient(140deg,#0f101a,#090b11);padding:30px}
.gr-page .gr-command-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:24px 0}
.gr-page .gr-command-card{min-height:234px;display:flex;flex-direction:column;gap:15px;padding:20px 18px;color:#eaf0f5;text-decoration:none;border:1px solid #64424a;background:linear-gradient(150deg,#281721,#0a121c 72%);transition:border-color .2s,transform .2s,box-shadow .2s}
.gr-page .gr-command-card--planet{background:radial-gradient(circle at 90% 13%,#ac61355c,transparent 48%),linear-gradient(150deg,#271820,#0b1119)}
.gr-page .gr-command-card--build{background:radial-gradient(circle at 85% 5%,#2d77915b,transparent 47%),linear-gradient(150deg,#172533,#0b1119)}
.gr-page .gr-command-card--tour{background:radial-gradient(circle at 85% 5%,#ca3a4e61,transparent 47%),linear-gradient(150deg,#2b1824,#0b1119)}
.gr-page .gr-command-card--fix{background:radial-gradient(circle at 85% 5%,#916b405b,transparent 47%),linear-gradient(150deg,#29231f,#0b1119)}
.gr-page .gr-command-card:hover{border-color:#ffa18d;transform:translateY(-3px);box-shadow:0 16px 25px #0009}
.gr-page .gr-command-index{font-size:.68rem;font-weight:900;letter-spacing:.09em;color:#eea7a0}
.gr-page .gr-command-card strong{font:900 1.75rem/1.05 "Arial Narrow",Impact,sans-serif;text-transform:uppercase;color:#fff}
.gr-page .gr-command-card>span:nth-child(3){font-size:.83rem;line-height:1.55;color:#bbcad6}
.gr-page .gr-command-card b{margin-top:auto;font-size:.68rem;letter-spacing:.1em;color:#ffa69c}
.gr-page .gr-updates-strip{display:flex;align-items:flex-start;gap:15px;border-top:1px solid #5e333c;padding-top:17px}
.gr-page .gr-updates-strip>span{white-space:nowrap;color:#ffaaa3;font-size:.68rem;font-weight:900;letter-spacing:.09em;padding-top:6px}
.gr-page .gr-updates-strip p{color:#c7d0dd;margin:0;font-size:.85rem;line-height:1.65}
.gr-page .gr-updates-strip a{color:#d5e9f4}
.gr-page .gr-career-layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,.75fr);gap:18px;margin-top:27px;align-items:start}
.gr-page .gr-career-steps{display:grid;gap:12px}
.gr-page .gr-career-steps article{position:relative;background:linear-gradient(110deg,#151922,#0b121c);border:1px solid #463540;border-left:3px solid #b8454a;padding:23px 25px 20px}
.gr-page .gr-phase{color:#fa9e89;font-size:.68rem;letter-spacing:.1em;font-weight:900}
.gr-page .gr-career-steps h3{margin:10px 0 12px}
.gr-page .gr-career-steps p,.gr-page .gr-career-aside p{color:#bacbd7;line-height:1.7;font-size:.9rem}
.gr-page .gr-do-next{margin-bottom:0;padding-top:13px;border-top:1px solid #38414c}
.gr-page .gr-career-aside{position:sticky;top:90px;background:linear-gradient(180deg,#23161e,#0b121a);border:1px solid #70474f;padding:22px}
.gr-page .gr-aside-label,.gr-page .gr-readout-label{font-size:.68rem;font-weight:900;letter-spacing:.1em;color:#ffab95}
.gr-page .gr-career-aside h3{margin:15px 0}
.gr-page .gr-survival{display:grid;gap:12px;margin:20px 0}
.gr-page .gr-survival>div{border-bottom:1px solid #473a43;padding:0 0 14px;display:grid;gap:7px}
.gr-page .gr-survival span,.gr-page .gr-world-details span{color:#e59b92;font-size:.66rem;letter-spacing:.06em;font-weight:900}
.gr-page .gr-survival strong{font-size:.85rem;line-height:1.55}
.gr-page .gr-career-aside>a{color:#e0edf4;font-size:.8rem}
.gr-page .gr-milestones{margin:24px 0;background:#121a23;border:1px solid #47505c;padding:22px}
.gr-page .gr-milestone-head h3{margin:0}
.gr-page .gr-milestone-head p{color:#c5d5df;margin:0;font-size:.85rem;display:flex;align-items:center;gap:12px}
.gr-page .gr-milestone-head button{background:#32232b;color:#f6d8d6;border:1px solid #92555a;padding:7px 12px;cursor:pointer}
.gr-page .gr-milestone-note{font-size:.78rem!important;color:#9fb1c0!important}
.gr-page .gr-checks{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.gr-page .gr-checks label{padding:13px 12px;background:#0b131b;border:1px solid #364957;color:#d4e0eb;line-height:1.45;font-size:.85rem;cursor:pointer;display:flex;gap:9px;align-items:flex-start}
.gr-page .gr-checks label:has(input:checked){border-color:#53978c;background:#122923}
.gr-page .gr-checks input{accent-color:#7de0b6;width:17px;height:17px;flex:none}
.gr-page .gr-progress-meter{margin-top:16px;height:8px;background:#303640;overflow:hidden}
.gr-page .gr-progress-meter span{display:block;width:0;height:100%;background:linear-gradient(90deg,#ad313f,#e6a267);transition:width .2s}
.gr-page .gr-help-row{display:flex;gap:17px;flex-wrap:wrap;font-size:.82rem;margin-top:12px}
.gr-page .gr-help-row a{color:#dcebf9}
.gr-page .gr-garage-panel{display:grid;grid-template-columns:minmax(240px,.8fr) minmax(0,1.2fr);border:1px solid #45606c;margin:24px 0;background:#0f1923}
.gr-page .gr-garage-controls{padding:22px;background:linear-gradient(155deg,#162633,#090f17);border-right:1px solid #45606c}
.gr-page .gr-garage-controls h3{font-size:1.15rem}
.gr-page .gr-vehicle-choice{display:grid;gap:8px;margin-bottom:24px}
.gr-page .gr-vehicle-choice button,.gr-page .gr-world-controls button{background:#101922;color:#d9e5ee;border:1px solid #3c5160;padding:12px 13px;text-align:left;cursor:pointer;font-weight:800;transition:background .15s,border-color .15s}
.gr-page .gr-vehicle-choice button:hover,.gr-page .gr-world-controls button:hover{background:#26313b}
.gr-page .gr-vehicle-choice button.is-selected,.gr-page .gr-world-controls button.is-active{background:#8b2831;border-color:#f0877d;color:#fff}
.gr-page .gr-form-label,.gr-page .gr-fix-layout label{display:block;font-weight:900;margin-bottom:11px;color:#dce8f2;font-size:.82rem}
.gr-page .gr-garage-controls select,.gr-page .gr-fix-layout select{width:100%;background:#111c26;color:#eff6fb;border:1px solid #698293;padding:12px;font-size:.88rem;cursor:pointer;max-width:100%}
.gr-page .gr-garage-result{padding:26px 30px;background:radial-gradient(circle at 110% -15%,#9b35442e,transparent 65%),#0e1822}
.gr-page .gr-garage-result h3{font-size:1.85rem;margin-top:12px}
.gr-page .gr-garage-result>p{color:#bdccd8;font-size:.9rem;line-height:1.65}
.gr-page .gr-garage-result h4,.gr-page .gr-world-readout h4{color:#f2ebee;letter-spacing:.08em;text-transform:uppercase;font-size:.72rem;margin:24px 0 12px}
.gr-page .gr-tune-bars{border-block:1px solid #38424d;padding:20px 0;display:grid;gap:12px}
.gr-page .gr-tune-bars>div{display:grid;grid-template-columns:85px 1fr;align-items:center;gap:9px;color:#becbd6;font-size:.76rem}
.gr-page .gr-tune-bars>div>div{height:8px;background:#273642;overflow:hidden}
.gr-page .gr-tune-bars i{display:block;height:100%;background:linear-gradient(90deg,#a7353c,#f7a275);transition:width .23s}
.gr-page .gr-garage-result ol,.gr-page .gr-world-readout ol,.gr-page .gr-fix-layout ol{color:#e0e9ef;line-height:1.75;padding-left:20px;font-size:.9rem}
.gr-page .gr-garage-result li,.gr-page .gr-world-readout li,.gr-page .gr-fix-layout li{padding:4px 0}
.gr-page .gr-advisor-note{font-size:.75rem!important;color:#9baebb!important}
.gr-page .gr-tactics-note{padding:18px 21px;border:1px solid #583b44;background:#1d171f;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.gr-page .gr-tactics-note strong{font-size:.7rem;color:#ffad9c;letter-spacing:.07em}
.gr-page .gr-tactics-note span{flex:1 1 320px;font-size:.8rem;color:#bfcbd6;line-height:1.55}
.gr-page .gr-tactics-note a{color:#dbeaf3;font-size:.78rem}
.gr-page .gr-world-controls{display:flex;flex-wrap:wrap;gap:8px;margin:25px 0 0}
.gr-page .gr-world-controls button{text-align:center;flex:1 1 115px;font-size:.83rem}
.gr-page .gr-world-console{--gr-planet-a:#b8864e;--gr-planet-b:#302330;--gr-planet-glow:#d08a5c;display:grid;grid-template-columns: minmax(0,.95fr) minmax(0,1.05fr);margin-top:11px;min-height:485px;border:1px solid #6b4450;background:#0b121a}
.gr-page .gr-world-console[data-world="lantaana"]{--gr-planet-a:#377977;--gr-planet-b:#152c28;--gr-planet-glow:#78d2c5}
.gr-page .gr-world-console[data-world="ando"]{--gr-planet-a:#a8c5de;--gr-planet-b:#415473;--gr-planet-glow:#a2e2ff}
.gr-page .gr-world-console[data-world="sentinel"]{--gr-planet-a:#77953e;--gr-planet-b:#2d3516;--gr-planet-glow:#b0e776}
.gr-page .gr-world-console[data-world="derven"]{--gr-planet-a:#ad6267;--gr-planet-b:#30202d;--gr-planet-glow:#ff9f83}
.gr-page .gr-world-console[data-world="crait"]{--gr-planet-a:#e9e7df;--gr-planet-b:#b54445;--gr-planet-glow:#ff8c7c}
.gr-page .gr-world-console[data-world="tatooine"]{--gr-planet-a:#e3aa64;--gr-planet-b:#66432c;--gr-planet-glow:#f5c382}
.gr-page .gr-world-art{position:relative;min-height:410px;overflow:hidden;background:radial-gradient(circle at 55% 46%,var(--gr-planet-glow) 0,transparent 34%),radial-gradient(ellipse at 48% 50%,#1a273b 0,#080e17 75%);display:grid;place-items:center;isolation:isolate}
.gr-page .gr-world-art:before{content:"";position:absolute;inset:-50%;background-image:radial-gradient(#fff 0.8px,transparent 1.3px);background-size:41px 39px;opacity:.36;transform:rotate(12deg)}
.gr-page .gr-world-orb{display:block;width:min(63%,290px);aspect-ratio:1;border-radius:50%;position:relative;z-index:2;background:radial-gradient(circle at 30% 25%,#fff8 0,transparent 28%),repeating-linear-gradient(165deg,transparent 0,transparent 16px,#0002 19px,#fff1 25px),radial-gradient(circle at 35% 30%,var(--gr-planet-a),var(--gr-planet-b) 78%);box-shadow:inset -35px -22px 36px #050609b7,0 0 90px 8px var(--gr-planet-b),0 20px 90px #000a}
.gr-page .gr-world-ring{position:absolute;z-index:1;width:85%;height:34%;border:1px solid var(--gr-planet-glow);border-radius:50%;transform:rotate(-28deg);opacity:.7;box-shadow:0 0 24px var(--gr-planet-glow)}
.gr-page .gr-world-gridline{position:absolute;z-index:3;width:100%;height:100%;background:linear-gradient(90deg,transparent 49.9%,#fff1 50%,transparent 50.1%),linear-gradient(0deg,transparent 49.9%,#fff1 50%,transparent 50.1%);pointer-events:none}
.gr-page .gr-world-art small{position:absolute;z-index:4;bottom:20px;left:20px;font-size:.65rem;letter-spacing:.09em;color:#f3cfbf}
.gr-page .gr-world-readout{padding:30px;background:linear-gradient(150deg,#1b1b27,#10151d)}
.gr-page .gr-world-readout h3{font-size:clamp(2.4rem,5vw,4rem);margin:6px 0 15px}
.gr-page .gr-world-readout>p{font-size:.93rem;color:#c5d2db;line-height:1.65}
.gr-page .gr-world-details{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:21px 0}
.gr-page .gr-world-details>div{border:1px solid #51404b;padding:12px;background:#171821}
.gr-page .gr-world-details strong{display:block;margin-top:9px;font-size:.8rem;line-height:1.4}
.gr-page .gr-world-caveat{font-size:.74rem!important;color:#9eb0bc!important}
.gr-page .gr-track-montage{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:15px}
.gr-page .gr-track-montage figure{margin:0;overflow:hidden;border:1px solid #3c4956;background:#111b24}
.gr-page .gr-track-montage img{display:block;width:100%;height:174px;object-fit:cover;transition:transform .2s}
.gr-page .gr-track-montage figure:hover img{transform:scale(1.05)}
.gr-page .gr-track-montage figcaption{padding:9px 12px;color:#bacbd8;font-size:.73rem}
.gr-page .gr-fix-layout{display:grid;grid-template-columns:minmax(235px,.65fr) minmax(0,1.35fr);gap:20px;padding:22px;background:#121821;border:1px solid #50424a;margin:24px 0}
.gr-page .gr-fix-layout>div{padding:8px}
.gr-page .gr-fix-layout article{background:#0c141d;border:1px solid #334a5c;padding:24px}
.gr-page .gr-fix-layout article h3{margin-top:13px}
.gr-page .gr-pc-help{padding:21px 25px;border-left:3px solid #d35d58;background:linear-gradient(90deg,#271820,#0e1822)}
.gr-page .gr-pc-help p{color:#c6d2db;line-height:1.75;font-size:.88rem}
.gr-page .gr-pc-help a{color:#dbeaf6}
.gr-page .gr-reference-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:24px}
.gr-page .gr-reference-grid article{background:linear-gradient(155deg,#211923,#0e1821);border:1px solid #563c46;padding:18px}
.gr-page .gr-reference-grid article span{color:#ffa58a;font-size:.67rem;font-weight:900;letter-spacing:.1em}
.gr-page .gr-reference-grid article h3{font-size:1.3rem;margin:12px 0}
.gr-page .gr-reference-grid article p{color:#c0cdd7;line-height:1.6;font-size:.83rem}
.gr-page .gr-reference-grid article a{color:#d4e8f7;font-size:.77rem}
.gr-page .gr-command a:focus-visible,.gr-page button:focus-visible,.gr-page input:focus-visible,.gr-page select:focus-visible{outline:3px solid #ffb99b;outline-offset:3px}
@media(max-width:1000px){.gr-page .gr-command-grid,.gr-page .gr-reference-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.gr-page .gr-career-layout{grid-template-columns:1fr}.gr-page .gr-career-aside{position:static}}
@media(max-width:730px){.gr-page .gr-hero-text{margin-top:-34px;padding:18px 10px 10px;background:#06080ef0}.gr-page .gr-hero-img{aspect-ratio:16/10}.gr-page .gr-hero h1{font-size:clamp(1.75rem,8.3vw,2.7rem);line-height:1.06}.gr-page .gr-command{padding:18px 14px}.gr-page .gr-command-grid{grid-template-columns:1fr 1fr;gap:8px}.gr-page .gr-command-card{min-height:215px;padding:15px 12px}.gr-page .gr-command-card strong{font-size:1.45rem}.gr-page .gr-world-console,.gr-page .gr-garage-panel,.gr-page .gr-fix-layout{grid-template-columns:1fr}.gr-page .gr-world-art{min-height:310px}.gr-page .gr-garage-controls{border:0;border-bottom:1px solid #45606c}.gr-page .gr-world-readout{padding:20px}.gr-page .gr-reference-grid{grid-template-columns:1fr 1fr}.gr-page .gr-track-montage{grid-template-columns:1fr 1fr}.gr-page .gr-track-montage figure:nth-child(3){grid-column:span 2}.gr-page .gr-checks{grid-template-columns:1fr}}
@media(max-width:490px){.gr-page .gr-command-grid,.gr-page .gr-reference-grid,.gr-page .gr-track-montage{grid-template-columns:1fr}.gr-page .gr-command-card{min-height:0}.gr-page .gr-command-card strong{font-size:1.6rem}.gr-page .gr-command-card b{margin-top:0}.gr-page .gr-track-montage figure:nth-child(3){grid-column:auto}.gr-page .gr-world-details{grid-template-columns:1fr}.gr-page .gr-updates-strip{display:block}.gr-page .gr-updates-strip p{margin-top:12px}.gr-page .gr-hero-text>p:not(.gr-availability){font-size:1rem}.gr-page .gr-milestones{padding:15px}}
@media(prefers-reduced-motion:reduce){.gr-page .gr-command-card,.gr-page .gr-track-montage img,.gr-page .gr-progress-meter span,.gr-page .gr-tune-bars i{transition:none}}

/* Galactic Racer hero: high-speed canyon pursuit and responsive crop. */
.gr-page .gr-hero-img{aspect-ratio:21/9;overflow:hidden;border-color:#873d36;box-shadow:0 20px 70px #000c,0 0 0 1px #d9683c25}
.gr-page .gr-hero-img img{object-position:50% 59%;filter:saturate(1.13) contrast(1.06)}
.gr-page .gr-hero-img:after{background:linear-gradient(0deg,#050609ae 0%,transparent 46%),linear-gradient(90deg,#05060944,transparent 60%)}
.gr-page .gr-hero-credit{position:absolute;right:16px;top:16px;z-index:2;padding:8px 11px;border:1px solid #edd1c34f;background:#080b11bf;color:#f2e7e2;text-decoration:none;font-size:.6rem;font-weight:900;letter-spacing:.09em;backdrop-filter:blur(3px)}
.gr-page .gr-hero-credit:hover,.gr-page .gr-hero-credit:focus-visible{border-color:#f4b49b;color:#fff}
@media(max-width:730px){.gr-page .gr-hero-img{aspect-ratio:16/11}.gr-page .gr-hero-img img{object-position:53% 54%}.gr-page .gr-hero-credit{right:8px;top:8px;font-size:.52rem;padding:6px 8px}}


/* IDS GAMES B02 / GALACTIC RACER — make opening story readable on phones. */
.gr-page .gr-hero,
.gr-page .gr-hero-text,
.gr-page .gr-hero-text>p {
  min-width:0;
  overflow-wrap:break-word;
}
.gr-page .gr-hero h1 {
  line-height:1.1;
  overflow-wrap:break-word;
}
@media(max-width:730px) {
  .gr-page .gr-hero {
    padding-inline:clamp(12px,4vw,20px);
  }
  .gr-page .gr-hero-text {
    margin-top:0!important;
    padding:20px 0 8px!important;
    max-width:100%;
    background:#06080e!important;
  }
  .gr-page .gr-hero h1,
  .gr-page .gr-hero h1 span {
    white-space:normal;
    overflow-wrap:break-word;
    max-width:100%;
    line-height:1.12;
  }
  .gr-page .gr-hero-text>p:not(.gr-availability) {
    max-height:none!important;
    overflow:visible!important;
    line-height:1.65;
  }
}
