@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@400;500;600;700&family=Space+Mono:wght@400;700&display=swap');

:root { --lunar-bg:#090b0d; --lunar-panel:#111519; --lunar-line:#394149; --lunar-silver:#e5e8e8; --lunar-cyan:#82e6e3; --lunar-red:#ed5a46; }
html { scroll-behavior:smooth; scrollbar-width:none; }
html::-webkit-scrollbar,body::-webkit-scrollbar,.shelf-track::-webkit-scrollbar,.lunar-orbits::-webkit-scrollbar { display:none; }
body.lunar-app { margin:0; background:var(--lunar-bg); color:var(--lunar-silver); font-family:'Archivo',sans-serif; letter-spacing:0; overflow-x:hidden; scrollbar-width:none; background-image:none; }
.lunar-app *,.lunar-app *::before,.lunar-app *::after { box-sizing:border-box; letter-spacing:0; }
.lunar-app h1,.lunar-app h2,.lunar-app h3 { letter-spacing:0; }
.lunar-header { height:64px; padding:0 13px; display:grid; grid-template-columns:1fr auto; align-items:center; gap:8px; background:#0b0e10; border-bottom:1px solid var(--lunar-line); }
.lunar-brand { display:flex; align-items:center; gap:8px; color:var(--lunar-silver); text-decoration:none; }
.lunar-brand span { width:35px; height:35px; display:grid; place-items:center; border:1px solid #70777c; border-radius:50%; font:700 9px 'Space Mono',monospace; }
.lunar-brand strong { font:700 14px 'Space Mono',monospace; }
.lunar-status { display:none; color:#99a5a9; font:400 8px 'Space Mono',monospace; text-transform:uppercase; }
.lunar-status i { display:inline-block; width:6px; height:6px; margin-right:6px; border-radius:50%; background:var(--lunar-cyan); }
.lunar-account { display:flex; align-items:center; gap:7px; }
.lunar-account .textlink,.lunar-account .btn { color:var(--lunar-silver); text-decoration:none; font:400 8px 'Space Mono',monospace; text-transform:uppercase; }
.lunar-account .btn { padding:8px 9px; border:1px solid #6f777c; border-radius:0; background:transparent; }
.lunar-hero { min-height:calc(100svh - 64px); position:relative; display:flex; align-items:flex-end; padding:110px 15px 36px; background-image:linear-gradient(180deg,rgba(5,6,7,.04) 24%,rgba(9,11,13,.92) 88%,var(--lunar-bg)),url('/static/brand/lunar-station.webp'); background-size:cover; background-position:48% center; }
.lunar-coordinates { position:absolute; top:14px; left:14px; right:14px; display:flex; justify-content:space-between; color:#b7c0c2; font:400 7px 'Space Mono',monospace; }
.lunar-hero-copy { max-width:590px; }
.lunar-hero-copy>p { margin:0 0 9px; color:var(--lunar-cyan); font:400 9px 'Space Mono',monospace; text-transform:uppercase; }
.lunar-hero h1 { margin:0; font-size:52px; line-height:.92; }
.lunar-hero-copy>span { display:block; max-width:34ch; margin:18px 0 22px; color:#bac1c2; font-size:11px; line-height:1.6; }
.lunar-hero button { min-height:48px; padding:0 15px; border:1px solid var(--lunar-silver); border-radius:0; background:rgba(9,11,13,.68); color:#fff; font:700 9px 'Space Mono',monospace; text-transform:uppercase; cursor:pointer; }
.lunar-orbit-readout { position:absolute; top:52px; right:14px; width:120px; padding:10px; border:1px solid rgba(229,232,232,.35); background:rgba(8,10,12,.7); backdrop-filter:blur(8px); }
.lunar-orbit-readout span,.lunar-orbit-readout strong,.lunar-orbit-readout small { display:block; }
.lunar-orbit-readout span,.lunar-orbit-readout small { color:#a3adb0; font:400 7px 'Space Mono',monospace; text-transform:uppercase; }
.lunar-orbit-readout strong { margin:4px 0; font:700 25px 'Space Mono',monospace; }
.lunar-console { padding:25px 12px 30px; border-bottom:1px solid var(--lunar-line); background:var(--lunar-panel); }
.lunar-note { margin:0 0 20px; padding:12px; border-left:2px solid var(--lunar-red); background:#191d21; display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:9px; }
.lunar-note .btn { color:var(--lunar-cyan); white-space:nowrap; }
.lunar-console-head { display:grid; grid-template-columns:1fr auto; margin-bottom:14px; font:400 8px 'Space Mono',monospace; text-transform:uppercase; }
.lunar-console-head span { color:var(--lunar-cyan); }
.lunar-console-head strong { grid-column:1/-1; margin-top:5px; color:#fff; font-size:18px; text-transform:none; }
.lunar-console-head i { grid-column:2; grid-row:1; color:#6f7b80; font-style:normal; }
.lunar-orbits { display:flex; gap:8px; overflow-x:auto; padding-bottom:4px; scrollbar-width:none; }
.lunar-orbits a { flex:0 0 170px; min-height:88px; padding:10px; display:grid; grid-template-columns:35px 1fr; align-items:center; border:1px solid var(--lunar-line); color:var(--lunar-silver); text-decoration:none; background:#0c1013; }
.lunar-orbits b { font:700 18px 'Space Mono',monospace; color:var(--lunar-cyan); }
.lunar-orbits span,.lunar-orbits small { display:block; }
.lunar-orbits span { font-size:12px; font-weight:600; }
.lunar-orbits small { margin-top:4px; color:#6f7b80; font:400 7px 'Space Mono',monospace; text-transform:uppercase; }
.lunar-telemetry { display:grid; grid-template-columns:repeat(4,1fr); border-bottom:1px solid var(--lunar-line); }
.lunar-telemetry div { min-width:0; padding:13px 8px; border-right:1px solid var(--lunar-line); }
.lunar-telemetry div:last-child { border:0; }
.lunar-telemetry span,.lunar-telemetry strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.lunar-telemetry span { color:#6f7b80; font:400 6px 'Space Mono',monospace; text-transform:uppercase; }
.lunar-telemetry strong { margin-top:4px; font:700 10px 'Space Mono',monospace; }
.lunar-deck { max-width:1400px; margin:auto; padding:38px 12px 85px; }
.lunar-app .shelf { width:100%; min-width:0; margin:0 0 50px; }
.lunar-app .shelf-head { display:flex; align-items:end; justify-content:space-between; gap:9px; margin:0 0 13px; padding-left:10px; border-left:2px solid var(--lunar-cyan); }
.lunar-app .shelf-head span { color:#77848a; font:400 7px 'Space Mono',monospace; text-transform:uppercase; }
.lunar-app .shelf-head h2 { margin:3px 0 0; font-size:22px; }
.lunar-app .shelf-head .tally { color:#6f7b80; font:400 7px 'Space Mono',monospace; text-align:right; }
.lunar-app .shelf-track { display:flex!important; gap:8px; width:100%; overflow-x:auto!important; overflow-y:hidden; padding:0 0 8px; scroll-snap-type:x mandatory; scrollbar-width:none; }
.lunar-app .tile { flex:0 0 38vw; max-width:170px; padding:0; border:0; background:transparent; color:var(--lunar-silver); text-align:left; scroll-snap-align:start; cursor:pointer; }
.lunar-app .tile .art { display:block; position:relative; aspect-ratio:3/4; overflow:hidden; border-radius:0; border:1px solid var(--lunar-line); margin:0 0 8px; background:#161b1f; clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%); }
.lunar-app .tile .art img { width:100%; height:100%; object-fit:cover; filter:saturate(.78) contrast(1.06); }
.lunar-app .tile .label { display:block; padding:0; }
.lunar-app .tile .name { display:block; color:#e8ebeb; font-size:10px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lunar-app .tile .kind { display:block; margin-top:3px; color:var(--lunar-cyan); font:400 7px 'Space Mono',monospace; text-transform:uppercase; }
.lunar-app .tile .go,.lunar-app .tile .fresh { display:none; }
.lunar-primary { padding:17px 12px; border:1px solid var(--lunar-line); background:#101418; }
.lunar-primary .tile { flex-basis:68vw; max-width:300px; }
.lunar-primary .tile .art { aspect-ratio:16/10; clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%); }
.lunar-grid { min-width:0; }
.lunar-message {
  margin:-15px 0 50px;
  padding:22px;
  min-height:240px;
  position:relative;
  overflow:hidden;
  border:1px solid var(--lunar-red);
  background:#111519;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
}
.lunar-message::after { content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(90deg,rgba(9,11,13,.96) 0%,rgba(9,11,13,.72) 48%,rgba(9,11,13,.12) 100%); }
.lunar-message>img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 28%; }
.lunar-message>span,.lunar-message>strong,.lunar-message>a { position:relative; z-index:2; }
.lunar-message span { color:var(--lunar-red); font:400 8px 'Space Mono',monospace; text-transform:uppercase; }
.lunar-message strong { max-width:16ch; margin:8px 0 18px; font-size:22px; line-height:1.1; }
.lunar-message a { color:#fff; font:400 8px 'Space Mono',monospace; text-transform:uppercase; }
.lunar-map { padding-top:25px; border-top:1px solid var(--lunar-line); }
.lunar-app .tile-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px 7px; }
.lunar-app .tile-grid .tile { width:100%; max-width:none; }
.lunar-app .tile-grid .tile .name { font-size:8px; }
.lunar-footer { padding:30px 13px 80px; border-top:1px solid var(--lunar-line); display:grid; gap:10px; color:#77848a; font:400 8px 'Space Mono',monospace; }
.lunar-footer strong { color:#fff; font-size:13px; }
.lunar-footer nav { display:flex; flex-wrap:wrap; gap:13px; margin-top:8px; }
.lunar-footer a { color:#c8cecf; }
@media (min-width:850px) {
  .lunar-header { height:76px; grid-template-columns:1fr auto 1fr; padding:0 30px; }
  .lunar-status { display:block; }
  .lunar-account { justify-content:flex-end; }
  .lunar-hero { min-height:780px; padding:90px 7vw; background-position:center; }
  .lunar-hero h1 { font-size:92px; }
  .lunar-orbit-readout { top:45px; right:35px; width:170px; }
  .lunar-console { padding:38px 4vw; }
  .lunar-orbits { display:grid; grid-template-columns:repeat(5,1fr); overflow:visible; }
  .lunar-orbits a { min-width:0; }
  .lunar-telemetry { padding:0 4vw; }
  .lunar-deck { padding:70px 35px 110px; }
  .lunar-grid { display:grid; grid-template-columns:1fr 1fr; gap:0 32px; }
  .lunar-message { margin:20px 0 60px; }
  .lunar-app .tile { flex-basis:170px; }
  .lunar-primary .tile { flex-basis:320px; max-width:320px; }
  .lunar-app .tile-grid { grid-template-columns:repeat(6,minmax(0,1fr)); gap:25px 12px; }
  .lunar-footer { grid-template-columns:auto 1fr auto; align-items:center; padding:38px 35px; }
}

/* Mission-control styling with standard casino sizing and density. */
.lunar-app { font-size:16px; }
.lunar-brand span { font-size:12px; }
.lunar-brand strong { font-size:16px; }
.lunar-status { font-size:12px; }
.lunar-account .textlink,.lunar-account .btn { font-size:12px; }
.lunar-hero { min-height:350px; padding-top:90px; }
.lunar-coordinates { font-size:12px; }
.lunar-hero-copy>p { font-size:12px; }
.lunar-hero h1 { font-size:52px; line-height:.96; }
.lunar-hero-copy>span { font-size:15px; }
.lunar-hero button { min-height:50px; font-size:13px; }
.lunar-orbit-readout span,.lunar-orbit-readout small { font-size:12px; }
.lunar-note { font-size:14px; }
.lunar-console-head { font-size:12px; }
.lunar-console-head strong { font-size:22px; }
.lunar-orbits span { font-size:15px; }
.lunar-orbits small { font-size:12px; }
.lunar-telemetry span { font-size:12px; }
.lunar-telemetry strong { font-size:13px; }
.lunar-app .shelf-head span { font-size:12px; }
.lunar-app .shelf-head h2 { font-size:28px; }
.lunar-app .shelf-head .tally { font-size:12px; }
.lunar-app .tile { flex-basis:44vw; max-width:180px; }
.lunar-app .tile .name,
.lunar-app .tile-grid .tile .name { font-size:14px; }
.lunar-app .tile .kind { font-size:12px; }
.lunar-message span { font-size:12px; }
.lunar-message a { font-size:12px; }
.lunar-footer { font-size:12px; }

@media (min-width:850px) {
  .lunar-hero { min-height:440px; }
  .lunar-hero h1 { font-size:76px; }
  .lunar-deck { max-width:1600px; }
  .lunar-app .tile { flex-basis:190px; max-width:190px; }
  .lunar-primary .tile { flex-basis:300px; max-width:300px; }
}
