.lumen-page .ai-orb-1 { background:#bd944c; opacity:.32; }
.lumen-page .ai-orb-2 { background:#28453c; opacity:.6; }
.lumen-page .ai-orb-3 { background:#e7bd65; opacity:.14; }
.lumen-page main { position:relative; }
.lumen-page .cw-hero .container { gap:5rem; }
.lumen-page .cw-hero h1 { max-width:16ch; }
.lumen-gold { color:#edcb83; }
.lumen-app-subtitle { display:block; margin-top:.2rem; font-size:.95rem; font-weight:400; color:#c4c4c4; }
.lumen-page .cw-hero-stage { width:280px; aspect-ratio:660/1434; }
.lumen-page .cw-hero-stage::before { background:radial-gradient(ellipse,#9e7c3b44,#193f3030 45%,transparent 70%); }
.lumen-page .cw-hero-slide img { border-color:#d9b46b44; }
/* A raised gold control makes the game launch stand out from text links. */
.lumen-play { display:inline-flex; align-items:center; justify-content:center; gap:14px; box-sizing:border-box; min-height:64px; padding:16px 30px 16px 24px; border:1px solid #ffe6a2; border-radius:12px; background:linear-gradient(180deg,#ffe49a,#efbd50); color:#242718; font-family:inherit; font-size:19px; line-height:1.25; font-weight:800; text-decoration:none; cursor:pointer; box-shadow:inset 0 1px 0 #fff2c9,0 4px 0 #96702c,0 10px 28px #0005; transition:transform .15s,box-shadow .15s,background .15s; }
.lumen-play:hover { background:linear-gradient(180deg,#ffecb4,#f8cc69); color:#242718; transform:translateY(-2px); box-shadow:inset 0 1px 0 #fff5d8,0 6px 0 #96702c,0 12px 32px #e8b54b26; }
.lumen-play:active { transform:translateY(3px); background:linear-gradient(180deg,#efc66b,#e6b044); box-shadow:inset 0 2px 4px #8d692a26,0 1px 0 #96702c,0 4px 12px #0004; }
.lumen-play:focus-visible { outline:3px solid #fff0bd; outline-offset:7px; }
.lumen-play-icon { display:block; width:26px; height:26px; flex:none; }
.lumen-note,.lumen-platforms { font-size:.9375rem; line-height:1.6; color:#b9c1b9; }
.lumen-actions .lumen-note { margin-top:1rem; }
.lumen-platforms { margin-top:1.75rem; color:#dcbd83; }
.lumen-how,.lumen-gallery-section,.lumen-end { max-width:1200px; padding-top:5rem; padding-bottom:5rem; }
.lumen-how { border-top:1px solid #bb9d5633; }
.lumen-section-heading { margin-bottom:2.5rem; max-width:760px; }
.lumen-kicker { font-size:.875rem; letter-spacing:.15em; color:#d7b879; margin-bottom:1rem; }
.lumen-section-heading h2,.lumen-end h2 { font-size:clamp(1.8rem,3vw,2.7rem); line-height:1.22; font-weight:700; margin-bottom:1rem; text-wrap:balance; }
.lumen-section-heading>p:last-child { font-size:1.125rem; color:#c4c4c4; }
.lumen-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:2rem; }
.lumen-steps article { padding:1.75rem 0; border-top:1px solid #bb9d5644; }
.lumen-step-number { color:#d7b879; font-size:.9375rem; }
.lumen-steps h3 { font-size:1.375rem; font-weight:650; margin:1rem 0 .75rem; }
.lumen-steps p { font-size:1rem; color:#c4c4c4; }
.lumen-gallery { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:3rem; max-width:920px; margin:auto; }
.lumen-gallery figure { margin:0; min-width:0; }
.lumen-gallery img { display:block; width:100%; height:auto; border-radius:24px; border:1px solid #b197583b; box-shadow:0 18px 50px #0006; }
.lumen-gallery figcaption { margin-top:1.25rem; font-size:.9375rem; color:#c4c4c4; text-align:center; }
.lumen-end { text-align:center; border-top:1px solid #bb9d5633; padding-bottom:6rem; }
.lumen-end .lumen-play { margin:1.1rem 0 1.5rem; }
.lumen-end p { color:#c4c4c4; font-size:1rem; margin-bottom:.75rem; }
@media(max-width:1000px) { .lumen-page .cw-hero .container { gap:3rem; } }
/* The shared site's mobile root is 10px. Keep this page's copy comfortably readable. */
@media(max-width:768px) {
  .lumen-page main { font-size:16px; }
  .lumen-page .cw-app-name { font-size:2.4rem; }
  .lumen-app-subtitle,.lumen-note,.lumen-platforms,.lumen-gallery figcaption { font-size:1.5rem; }
  .lumen-page .cw-hero .lead { font-size:1.8rem; }
  .lumen-steps { grid-template-columns:1fr; gap:1rem; }
  .lumen-section-heading h2,.lumen-end h2 { font-size:3rem; }
  .lumen-section-heading>p:last-child,.lumen-steps p,.lumen-end p { font-size:1.6rem; }
  .lumen-steps h3 { font-size:2rem; }
  .lumen-kicker,.lumen-step-number { font-size:1.4rem; }
  .lumen-gallery { gap:1.75rem; }
}
@media(max-width:590px) {
  .lumen-page .cw-hero h1 { font-size:4.2rem; }
  .lumen-page .cw-hero-stage { width:250px; }
  .lumen-page .cw-hero-copy { text-align:center; }
  .lumen-gallery { grid-template-columns:1fr; max-width:280px; gap:3.5rem; }
  .lumen-how,.lumen-gallery-section,.lumen-end { padding-top:4rem; padding-bottom:4rem; }
}
@media(prefers-reduced-motion:reduce) { .lumen-play { transition:none; } }

/* iPad captures keep their full 3:4 proportions alongside the phone gallery. */
.lumen-ipad-section { border-top:1px solid #bb9d5633; }
.lumen-gallery--ipad { grid-template-columns:repeat(2,minmax(0,1fr)); max-width:1120px; }
.lumen-gallery--ipad img { border-radius:20px; }
@media(max-width:590px) {
  .lumen-gallery--ipad { grid-template-columns:1fr; max-width:440px; }
}

/* Four phone captures stay together; tablets retain their larger two-column gallery. */
.lumen-gallery--iphone { grid-template-columns:repeat(4,minmax(0,1fr)); max-width:1120px; gap:2rem; }
@media(max-width:1000px) { .lumen-gallery--iphone { grid-template-columns:repeat(2,minmax(0,1fr)); max-width:620px; } }
@media(max-width:590px) { .lumen-gallery--iphone { grid-template-columns:1fr; max-width:280px; gap:3.5rem; } }