/* Lumen Vault — a tactile, gilded optical observatory. */
.lumen-panel { min-width:0; overflow:hidden; border-radius:0 0 15px 15px; background:#10111d; }
#lumenMount { width:100%; min-width:0; }
.lumen-world {
  --lv-ink:#f8edda; --lv-soft:#aaa6b8; --lv-gold:#e2bd7e; --lv-line:rgba(226,189,126,.18);
  position:relative; isolation:isolate; width:100%; height:min(80vh,790px); min-height:690px;
  overflow:hidden; color:var(--lv-ink); background:radial-gradient(ellipse at 55% 49%,#302b3b 0%,#1c1c2d 35%,#11131f 69%,#0d101a 100%);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; -webkit-font-smoothing:antialiased;
}
.lumen-world::before { content:''; position:absolute; inset:0; z-index:-1; opacity:.12; background-image:radial-gradient(#deb577 .6px,transparent .6px); background-size:24px 24px; mask-image:linear-gradient(transparent,#000 50%,transparent); pointer-events:none; }
.lumen-world *, .lumen-world *::before, .lumen-world *::after { box-sizing:border-box; }
.lumen-world [hidden],.lumen-panel[hidden] { display:none!important; }
.lumen-world button { font:inherit; touch-action:manipulation; -webkit-tap-highlight-color:transparent; cursor:pointer; }
.lumen-world button:disabled { opacity:.45; cursor:default; }
.lumen-world button:focus-visible { outline:2px solid #ffe0a5; outline-offset:4px; }
.lumen-world .lumen-stage { position:absolute; top:120px; right:0; bottom:185px; left:0; }
.lumen-world .lumen-canvas,body.cinema .lumen-world .lumen-canvas { position:absolute; inset:0; display:block; width:100%!important; height:100%!important; max-width:none; max-height:none!important; border:0; border-radius:0; background:transparent; outline:0; touch-action:pan-y; }
.lumen-canvas:focus-visible { box-shadow:inset 0 0 0 1px rgba(226,189,126,.45); }
.lumen-stage-shade { position:absolute; inset:0; pointer-events:none; background:linear-gradient(180deg,rgba(17,19,31,.04),transparent 12%,transparent 91%,rgba(17,19,31,.14)); }
.lumen-hud { position:absolute; top:0; right:0; left:0; z-index:3; height:78px; display:flex; align-items:center; gap:22px; padding:0 30px; border-bottom:1px solid var(--lv-line); background:linear-gradient(#11131fd1,#11131f88); }
.lumen-wordmark { display:flex; align-items:center; gap:12px; margin-right:auto; color:#e7d5b9; font-size:12px; font-weight:500; letter-spacing:.17em; line-height:1.5; }
.lumen-wordmark b { font-weight:300; }
.lumen-wordmark small { display:block; margin-top:3px; color:#837e92; font-size:7px; letter-spacing:.15em; }
.lumen-mark { display:grid; width:37px; height:37px; place-items:center; color:var(--lv-gold); border:1px solid #846943; border-radius:50%; font-size:32px; line-height:1; }
.lumen-metrics { display:flex; align-items:center; gap:29px; }
.lumen-metrics div { min-width:52px; }
.lumen-metrics small { display:block; color:var(--lv-soft); font-size:8px; font-weight:550; line-height:1; letter-spacing:.14em; }
.lumen-metrics strong { display:block; margin-top:6px; color:#f6e5c7; font-family:Georgia,serif; font-weight:400; font-size:25px; line-height:1; font-variant-numeric:tabular-nums; }
.lumen-world .lumen-icon-button { min-height:36px; padding:7px 11px; border:1px solid var(--lv-line); border-radius:4px; color:var(--lv-soft); background:#29263544; font-size:10px; }
.lumen-chapter { position:absolute; top:94px; right:34px; left:34px; z-index:2; display:flex; align-items:center; justify-content:space-between; pointer-events:none; }
.lumen-chapter small { display:block; color:var(--lv-gold); font-size:8px; font-weight:550; letter-spacing:.18em; }
.lumen-world .lumen-chapter h3 { color:var(--lv-ink); margin:4px 0 0; font-family:Georgia,serif; font-size:18px; font-weight:400; line-height:1.3; }
.lumen-chapter-track { display:flex; gap:7px; }
.lumen-chapter-track span { display:grid; width:26px; height:26px; place-items:center; border:1px solid #504552; border-radius:50%; color:#817b91; font-size:8px; font-variant-numeric:tabular-nums; }
.lumen-chapter-track span.is-current { border-color:#ddbb7c; color:#efd6a6; box-shadow:0 0 15px #dcba6420; }
.lumen-chapter-track span.is-complete { background:#b48a48; border-color:#b48a48; color:#181824; }
.lumen-playbar { position:absolute; right:20px; bottom:16px; left:20px; z-index:3; display:flex; flex-direction:column; align-items:center; }
#lumenChapterHint { margin:0 0 10px; color:#d3c6bb; font:italic 14px/1.4 Georgia,serif; text-align:center; }
.lumen-tile-controls { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:5px; max-width:100%; margin:0 0 10px; }
.lumen-world .lumen-tile-button { display:flex; align-items:center; justify-content:center; gap:8px; min-width:49px; min-height:37px; padding:6px 9px; border:1px solid #66546a; border-radius:4px; color:#eee1ce; background:linear-gradient(#343042,#211f2f); transition:border-color .15s,background .15s; }
.lumen-tile-button b { color:#ad9a85; font-family:Georgia,serif; font-size:12px; font-weight:400; }
.lumen-tile-button span { font-size:20px; line-height:1; color:#d7caef; }
.lumen-world .lumen-tile-button.is-selected,.lumen-world .lumen-tile-button:hover { border-color:#e7c384; background:#514133; box-shadow:0 0 16px #c79e4c12; }
.lumen-tools { display:flex; align-items:center; gap:8px; }
.lumen-world .lumen-tools button { display:flex; align-items:center; justify-content:center; gap:6px; padding:6px 12px; min-height:33px; border:1px solid #5d4c4059; border-radius:3px; color:#c9bec0; background:#141520a8; font-size:10px; }
.lumen-tools i { color:#d8b674; font-style:normal; font-size:17px; line-height:1; }
.lumen-world .lumen-tools button:hover { color:#fbe7c6; border-color:#b59a655f; }
.lumen-input-hint { margin:9px 0 0; color:#a7a0b1; font-size:9px; line-height:1.45; text-align:center; }
.lumen-action-cost { margin:4px 0 0; color:#8e849b; font-size:8px; line-height:1.4; text-align:center; }
.lumen-overlay { position:absolute; inset:78px 0 0; z-index:5; display:flex; align-items:center; padding:25px 5.6% 32px; overflow-x:hidden; overflow-y:auto; background:linear-gradient(90deg,#11131ff5 0%,#11131feb 25%,#11131fbe 43%,#11131f0d 72%,transparent); scrollbar-width:thin; scrollbar-color:#84704d #141421; }
.lumen-menu { position:relative; width:390px; max-width:100%; flex-shrink:0; }
.lumen-eyebrow { display:flex; align-items:center; gap:10px; margin:0 0 19px; color:var(--lv-gold); font-size:8px; line-height:1.5; font-weight:500; letter-spacing:.15em; }
.lumen-eyebrow::before { content:''; width:24px; height:1px; background:var(--lv-gold); }
.lumen-world .lumen-title { margin:0 0 20px; color:#f0e4d2; font-family:Georgia,"Times New Roman",serif; font-size:80px; font-weight:400; line-height:.84; letter-spacing:.005em; text-shadow:0 3px 35px #0002; }
.lumen-title em { display:block; margin-top:7px; color:#d6b278; font-weight:400; font-style:normal; letter-spacing:.04em; }
.lumen-world .lumen-tagline { margin:0 0 8px; color:#e5d5c0; font:italic 17px/1.4 Georgia,serif; font-weight:400; }
.lumen-story { max-width:335px; margin:0 0 19px; color:#aaa5b4; font-size:11px; line-height:1.75; }
.lumen-guide { display:grid; gap:12px; }
.lumen-guide > div { display:flex; align-items:center; gap:13px; }
.lumen-guide i { display:grid; width:28px; height:28px; place-items:center; border:1px solid #77613b91; border-radius:3px; background:#aa824309; color:#dab976; font-size:20px; font-style:normal; }
.lumen-guide b,.lumen-guide small { display:block; }
.lumen-guide b { margin-bottom:3px; color:#d0b895; font-size:8px; line-height:1.2; font-weight:500; letter-spacing:.16em; }
.lumen-guide small { color:#aaa5b4; font-size:10px; line-height:1.4; }
.lumen-menu-actions { display:flex; flex-wrap:wrap; align-items:center; gap:14px; margin-top:24px; }
.lumen-world .lumen-start { display:flex; justify-content:space-between; align-items:center; gap:24px; min-width:241px; min-height:47px; padding:12px 17px; border:1px solid #eccd94; border-radius:3px; color:#27212b; background:linear-gradient(120deg,#f0d7a7,#dcb573); font-size:12px; line-height:1.5; font-weight:600; box-shadow:0 6px 35px #ba8b3412; transition:transform .15s,filter .15s; }
.lumen-start b { font-size:22px; line-height:1; font-weight:400; }
.lumen-world .lumen-start:hover { filter:brightness(1.1); transform:translateY(-1px); }
.lumen-world .lumen-board { padding:8px 0; border:0; background:transparent; color:#d8b777; font-size:11px; text-decoration:underline; text-underline-offset:4px; }
.lumen-duration { margin:13px 0 0; color:#8d839b; font-size:9px; line-height:1.5; }
.lumen-record { display:flex; align-items:baseline; gap:8px; margin:18px 0 0; color:#817991; font-size:8px; line-height:1.5; letter-spacing:.11em; }
.lumen-record b { color:#c2ad8f; font-family:Georgia,serif; font-size:16px; font-weight:400; letter-spacing:0; }
.lumen-preview-caption { position:absolute; right:8%; bottom:11%; display:flex; align-items:center; gap:12px; color:#ae9878; font-size:8px; letter-spacing:.17em; }
.lumen-preview-caption i { width:65px; height:1px; background:var(--lv-line); }
.lumen-menu-symbol { margin:0 0 15px; color:#d8b573; font-size:49px; line-height:1; }
.lumen-world .lumen-title-small { font-size:46px; line-height:1.04; letter-spacing:-.025em; }
.lumen-results { margin-top:20px; }
.lumen-result-label { margin:0 0 5px; color:#ba9e72; font-size:8px; letter-spacing:.13em; text-transform:uppercase; }
.lumen-final-score { display:block; color:#f1d9a9; font:400 57px/1.1 Georgia,serif; font-variant-numeric:tabular-nums; }
.lumen-results > div { display:flex; gap:31px; margin-top:13px; }
.lumen-results span b,.lumen-results span small { display:block; }
.lumen-results span b { color:#f1e0c6; font:400 22px/1.2 Georgia,serif; }
.lumen-results span small { margin-top:5px; color:#aba0ae; font-size:9px; }
.lumen-help-keyboard { max-width:345px; padding-top:15px; border-top:1px solid var(--lv-line); color:#bfb0b3; font-size:10px; line-height:1.8; }
.lumen-world[data-state="ready"] .lumen-stage { top:94px; bottom:25px; }
.lumen-world[data-state="ready"] .lumen-metrics,.lumen-world[data-state="ready"] #lumenPause,.lumen-world[data-state="ready"] .lumen-chapter,.lumen-world:not([data-state="playing"]) .lumen-playbar { visibility:hidden; }
.lumen-world:not([data-state="playing"]):not([data-state="ready"]) .lumen-overlay { justify-content:center; text-align:center; background:#10111de0; backdrop-filter:blur(4px); }
.lumen-world:not([data-state="playing"]):not([data-state="ready"]) .lumen-menu { width:435px; }
.lumen-world:not([data-state="playing"]):not([data-state="ready"]) .lumen-story { max-width:405px; margin-right:auto; margin-left:auto; }
.lumen-world:not([data-state="playing"]):not([data-state="ready"]) .lumen-menu-actions,.lumen-world:not([data-state="playing"]):not([data-state="ready"]) .lumen-record,.lumen-world .lumen-results > div { justify-content:center; }
.lumen-world[data-help="true"] .lumen-help-keyboard { margin-left:auto; margin-right:auto; }
.lumen-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.lumen-loading { display:flex; min-height:500px; flex-direction:column; justify-content:center; align-items:center; gap:17px; padding:30px; background:#151522; color:#d3b788; text-align:center; font-family:Georgia,serif; }
.lumen-loading p { font:13px/1.7 Inter,system-ui,sans-serif; color:#b8adbd; }
.lumen-loading button { padding:12px 22px; border:1px solid #d3b788; border-radius:3px; background:#e1bd7e; color:#25202c; cursor:pointer; }
body.cinema .lumen-world { height:calc(100dvh - 126px); min-height:630px; max-height:1000px; }
@media (min-width:1100px) { .lumen-world .lumen-stage { left:8%; right:8%; } .lumen-world[data-state="ready"] .lumen-stage { left:0; right:0; } }
@media (max-width:760px) {
  .lumen-hud { gap:13px; padding:0 18px; }
  .lumen-wordmark { font-size:10px; gap:8px; }
  .lumen-metrics { gap:17px; }
  .lumen-metrics div { min-width:42px; }
  .lumen-mark { width:31px; height:31px; font-size:27px; }
  .lumen-world .lumen-title { font-size:67px; }
  .lumen-world .lumen-title-small { font-size:42px; }
  .lumen-menu { width:330px; }
  .lumen-overlay { padding-left:4%; }
}
@media (max-width:599px) {
  .lumen-world { min-height:665px; height:calc(100svh - 85px); max-height:820px; }
  .lumen-hud { height:66px; padding:0 13px; gap:10px; }
  .lumen-wordmark { font-size:9px; letter-spacing:.1em; gap:7px; }
  .lumen-wordmark small { display:none; }
  .lumen-mark { width:24px; height:24px; font-size:22px; }
  .lumen-wordmark b { display:block; }
  .lumen-metrics { gap:12px; margin-left:auto; }
  .lumen-metrics div { min-width:31px; }
  .lumen-metrics strong { font-size:21px; margin-top:5px; }
  .lumen-metrics small { font-size:6px; letter-spacing:.08em; }
  .lumen-world .lumen-icon-button { padding:6px 8px; min-height:32px; font-size:8px; }
  .lumen-chapter { top:80px; right:17px; left:17px; }
  .lumen-chapter small { font-size:7px; }
  .lumen-world .lumen-chapter h3 { margin-top:4px; font-size:17px; max-width:170px; }
  .lumen-chapter-track { gap:4px; }
  .lumen-chapter-track span { width:18px; height:18px; font-size:6px; }
  .lumen-world .lumen-stage { top:126px; bottom:206px; left:0; right:0; }
  .lumen-playbar { bottom:14px; right:12px; left:12px; }
  #lumenChapterHint { max-width:310px; margin-bottom:10px; font-size:12px; }
  .lumen-tile-controls { max-width:350px; gap:5px; }
  .lumen-world .lumen-tile-button { min-width:42px; min-height:36px; padding:6px 7px; gap:6px; }
  .lumen-tile-button b { font-size:10px; }
  .lumen-tile-button span { font-size:18px; }
  .lumen-world .lumen-tools button { padding:7px 10px; min-height:35px; font-size:9px; }
  .lumen-input-hint { max-width:300px; margin-top:9px; font-size:8px; }
  .lumen-action-cost { font-size:7px; }
  .lumen-world[data-state="ready"] .lumen-stage { top:50px; bottom:auto; height:295px; }
  .lumen-overlay { inset:66px 0 0; display:block; padding:244px 24px 23px; background:linear-gradient(180deg,transparent 0%,transparent 25%,#11131fdd 40%,#11131f 56%); }
  .lumen-menu { width:100%; }
  .lumen-eyebrow { margin:0 0 13px; font-size:7px; letter-spacing:.11em; }
  .lumen-world .lumen-title { font-size:42px; margin-bottom:13px; line-height:1; letter-spacing:.015em; }
  .lumen-title br { display:none; }
  .lumen-title em { display:inline; margin-left:10px; letter-spacing:.015em; }
  .lumen-world .lumen-tagline { font-size:15px; margin-bottom:8px; }
  .lumen-story { max-width:none; font-size:10px; line-height:1.7; margin-bottom:16px; }
  .lumen-guide { gap:9px; }
  .lumen-guide > div { gap:10px; }
  .lumen-guide i { width:23px; height:23px; font-size:17px; }
  .lumen-guide b { font-size:7px; margin-bottom:2px; }
  .lumen-guide small { font-size:9px; }
  .lumen-menu-actions { margin-top:18px; gap:13px; }
  .lumen-world .lumen-start { width:100%; min-height:43px; min-width:0; font-size:11px; padding:11px 16px; }
  .lumen-duration { margin-top:11px; font-size:8px; }
  .lumen-record { margin-top:11px; font-size:7px; }
  .lumen-preview-caption { display:none; }
  .lumen-world:not([data-state="playing"]):not([data-state="ready"]) .lumen-overlay { display:flex; align-items:center; padding:30px 24px; }
  .lumen-world .lumen-title-small { font-size:37px; line-height:1.08; }
  .lumen-menu-symbol { font-size:47px; margin-bottom:17px; }
  .lumen-results { margin-top:25px; }
  .lumen-final-score { font-size:57px; }
  .lumen-help-keyboard { font-size:10px; }
  body.cinema .lumen-world { min-height:665px; height:calc(100dvh - 118px); }
}
@media (max-width:370px) {
  .lumen-hud { gap:8px; padding:0 9px; }
  .lumen-metrics { gap:9px; }
  .lumen-metrics strong { font-size:19px; }
  .lumen-wordmark { gap:5px; font-size:8px; }
  .lumen-chapter-track { gap:3px; }
  .lumen-chapter-track span { width:16px; height:16px; }
  .lumen-chapter { right:13px; left:13px; }
  .lumen-world .lumen-chapter h3 { max-width:146px; font-size:15px; }
  .lumen-overlay { padding-left:19px; padding-right:19px; }
  .lumen-world .lumen-title { font-size:37px; }
  .lumen-world .lumen-tile-button { min-width:37px; padding:5px 6px; }
  .lumen-world .lumen-tools button { padding:7px 8px; font-size:8px; }
}
@media (prefers-reduced-motion:reduce) { .lumen-world * { transition:none!important; animation:none!important; } }

.lumen-celebration { position:absolute; bottom:6px; left:50%; z-index:4; display:flex; align-items:center; gap:15px; max-width:90%; margin:0; padding:11px 20px; transform:translateX(-50%); border:1px solid #ddba7955; border-radius:30px; background:#171725d9; color:#f3d8a4; box-shadow:0 0 28px #dcb16616; text-align:center; white-space:nowrap; pointer-events:none; }
.lumen-celebration strong { font:400 16px/1.35 Georgia,serif; }
.lumen-celebration > span { color:#e6bf79; font-size:21px; }
@media (max-width:599px) { .lumen-celebration { bottom:0; gap:10px; padding:9px 15px; } .lumen-celebration strong { font-size:13px; } }

body[data-active-game="lumen"]:has(.lumen-world[data-state="celebrating"]) #gameResult { display:none!important; }