@charset "UTF-8";
:root{color-scheme:dark;--gold:#cbb58b;--pale:#eee8dc;--muted:#a4aaa7;--ink:#0b1318;font-family:Georgia,"Yu Mincho","Hiragino Mincho ProN",serif}
*{box-sizing:border-box}body{margin:0;background:#080f13;color:var(--pale);height:100svh;overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:default}button:focus-visible,a:focus-visible{outline:2px solid #e9d4a5;outline-offset:6px}[hidden]{display:none!important}
.outside{position:fixed;inset:-30px;background:linear-gradient(#080f13a8,#080f13ed),url(assets/olympus.webp) center/cover;filter:blur(18px);pointer-events:none}
.stage{position:relative;isolation:isolate;margin:auto;width:min(100%,62.5svh,640px);height:100svh;overflow:hidden;background:#1b262a;box-shadow:0 0 0 1px #bfa97a30,0 0 100px #0009;touch-action:none;user-select:none;-webkit-user-select:none}
.landscape,.veil{position:absolute;inset:0;pointer-events:none}.landscape{z-index:-4;background:url(assets/olympus.webp) center 42%/cover;transform:scale(1.03);filter:saturate(.66) brightness(.83);transition:filter 1.4s}
.veil{z-index:-2;background:linear-gradient(#061018b0 0%,#09171a05 30%,#07101700 58%,#061014a8 100%);box-shadow:inset 0 0 100px #07101555}


.topbar{position:absolute;z-index:8;top:max(22px,env(safe-area-inset-top));left:26px;right:22px;display:flex;justify-content:space-between;align-items:center}.home{display:flex;align-items:center;gap:9px;text-decoration:none;color:#e3d9c6b3}.home svg{width:29px;height:32px;fill:none;stroke:currentColor;stroke-width:1}.home span{font-size:9px;line-height:1.65;letter-spacing:2px}.toolbar{display:flex;gap:8px}.icon-button{width:36px;height:36px;border:1px solid #d8c69d3b;border-radius:50%;background:#0b161c3d;display:grid;place-items:center;transition:background .2s,opacity .3s}.icon-button svg{width:17px;fill:none;stroke:var(--pale);stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}.icon-button:disabled{opacity:.22}.icon-button[aria-pressed=true] .sound-slash{display:none}
.language-button{min-width:46px;min-height:36px;border:1px solid #d8c69d3b;border-radius:20px;background:#0b161c3d;color:#e5dbc6;font-size:10px;letter-spacing:.06em;padding:0 8px;white-space:nowrap}.toolbar{align-items:center}
html:lang(en) .subtitle{letter-spacing:.25em;padding-left:.25em}html:lang(en) .invitation{letter-spacing:.07em}html:lang(en) .dialog-copy h2{font-size:24px;letter-spacing:.06em;line-height:1.5;padding-left:.06em}html:lang(en) .phase{font-size:9px;letter-spacing:2px}html:lang(en) .ascension{letter-spacing:.18em}
.hud{position:absolute;left:28px;right:28px;top:max(88px,calc(env(safe-area-inset-top) + 70px));display:flex;align-items:center;justify-content:space-between;z-index:4;opacity:.0;transform:translateY(-5px);transition:opacity .7s,transform .7s;pointer-events:none}.eyebrow{display:block;font:9px/1.4 Georgia,serif;letter-spacing:3px;color:#e1d2b4c2}.score-block strong,.time-block strong{display:block;margin-top:5px;font-size:33px;line-height:1;letter-spacing:2px;font-weight:400;font-variant-numeric:tabular-nums;text-shadow:0 2px 15px #0007}.time-block{text-align:right}.time-block strong span{font-size:12px;letter-spacing:0;margin-left:3px;color:#cfcbbe}.phase{display:flex;align-items:center;flex-direction:column;gap:13px;color:#ded3bd;font-size:10px;letter-spacing:4px;margin-top:3px}.phase-stars{display:flex;gap:10px}.phase-stars i{width:4px;height:4px;transform:rotate(45deg);background:#d2c09735;transition:background 1s,box-shadow 1s}.phase-stars i.active{background:#e2c990;box-shadow:0 0 9px #f5d6a16b}.time-track{position:absolute;top:73px;left:0;right:0;height:1px;background:#e7dbbb25}.time-track i{display:block;width:100%;height:100%;background:#cbbb94;transform-origin:left;transform:scaleX(1);box-shadow:0 0 6px #d6b47566}
#arena,.target-layer{position:absolute;inset:0;width:100%;height:100%;z-index:2}.target-layer{pointer-events:none;overflow:hidden}.shadow-target{position:absolute;left:0;top:0;width:52px;height:52px;border:0;border-radius:50%;background:transparent;pointer-events:auto;padding:0;touch-action:none;opacity:1}.shadow-target:focus-visible{outline:1px solid #e4c882;outline-offset:3px;box-shadow:0 0 16px #e4c88266}
.hands{position:absolute;z-index:3;inset:0;pointer-events:none;opacity:.76;transition:opacity 1s}.hand{position:absolute;width:47%;aspect-ratio:1;bottom:-5.5%;filter:brightness(.68) saturate(.65) drop-shadow(0 8px 15px #0006);transform-origin:85% 90%}.hand img{position:absolute;inset:0;width:100%;height:100%;display:none;object-fit:contain}.hand-left{left:-10%;scale:-1 1}.hand-right{right:-10%}.hand[data-pose=idle] [data-frame=idle],.hand[data-pose=charge] [data-frame=charge],.hand[data-pose=attack] [data-frame=attack]{display:block}.hand[data-pose=charge]{transform:translate(0,6px) rotate(3deg)}.hand[data-pose=attack]{transform:translate(-5px,-14px) rotate(-4deg);filter:brightness(.92) saturate(.7) drop-shadow(0 4px 10px #0005)}
.edge-mark{position:absolute;z-index:4;bottom:max(18px,env(safe-area-inset-bottom));color:#cbbfa16e;font-size:7px;letter-spacing:2px;pointer-events:none}.edge-left{left:24px}.edge-right{right:24px}
.screen{position:absolute;inset:0;z-index:5;display:flex;align-items:center;justify-content:center;pointer-events:auto}.intro{background:linear-gradient(transparent 18%,#09121816 32%,#08121bad 62%,#081218e0 100%);transition:opacity .6s,visibility .6s}.intro-copy{position:absolute;left:30px;right:30px;top:40%;text-align:center;display:flex;flex-direction:column;align-items:center}.overline{font-size:8px;letter-spacing:3px;line-height:1.8;color:var(--gold)}.sigil{width:40px;height:40px;margin:21px 0 13px;color:#d4c094}.sigil svg{fill:none;stroke:currentColor;stroke-width:.65;width:100%;height:100%}h1{font-size:clamp(48px,9svh,84px);line-height:1;letter-spacing:.18em;font-weight:400;margin:0 0 13px;padding-left:.18em;text-shadow:0 2px 24px #0004}.subtitle{font-size:11px;letter-spacing:.45em;padding-left:.45em;margin:0;color:#e0d7c6}.fine-rule{display:block;width:28px;height:1px;background:var(--gold);opacity:.65;margin:24px auto}.invitation{font-size:12px;line-height:2.2;letter-spacing:.17em;color:#e7e2d5d4;margin:0 0 28px}.primary{min-height:53px;width:min(100%,254px);border:1px solid #b49a66;background:linear-gradient(110deg,#15252ade,#18262bde);color:#f0e1bf;display:flex;align-items:center;justify-content:space-between;padding:0 23px;font-size:12px;letter-spacing:.25em;transition:background .25s,transform .15s,border-color .25s;box-shadow:0 8px 25px #0002;position:relative}.primary:before,.primary:after{content:"";position:absolute;top:5px;bottom:5px;width:3px;border-top:1px solid #ad936255;border-bottom:1px solid #ad936255}.primary:before{left:5px}.primary:after{right:5px}.primary svg{width:28px;height:14px;fill:none;stroke:currentColor;stroke-width:.8}.primary:active{transform:scale(.97)}.primary:disabled{opacity:.45}.instructions{font-size:9px;letter-spacing:.16em;color:#c9c6b2aa;margin:16px 0 0}.keyboard-note{font-size:9px;line-height:1.9;color:#b7c0b38c;letter-spacing:.06em;margin-top:11px}.loading{font-size:10px;color:var(--gold);letter-spacing:.1em}
.pause-screen,.result-screen{background:#09141bc9;backdrop-filter:blur(8px);text-align:center}.dialog-copy{width:100%;padding:30px;display:flex;align-items:center;flex-direction:column}.dialog-copy h2{font-size:28px;font-weight:400;letter-spacing:.25em;padding-left:.25em;margin:28px 0 8px}.dialog-copy>p{font-size:12px;line-height:2.1;letter-spacing:.12em;color:#d0d1c5}.dialog-copy .primary{margin-top:28px}.text-button{border:0;border-bottom:1px solid #b7a7844d;background:transparent;color:#c5c4b2b8;font-size:11px;padding:10px 0 7px;margin-top:20px;letter-spacing:.2em;min-height:40px}.final-score{font-size:94px;line-height:1.1;font-weight:400;margin:8px 0 12px;letter-spacing:.05em;color:#f3e5c5;font-variant-numeric:tabular-nums}.record b{font-weight:400;color:#f2e3bc;margin-left:10px}.record #newRecord{display:block;margin-top:9px;color:#dcc18a;font-size:8px;letter-spacing:3px}.result-screen .fine-rule{margin:26px auto 20px}.result-screen{animation:resultIn 1s ease both}@keyframes resultIn{from{opacity:0}to{opacity:1}}
.stage[data-state=running] .intro,.stage[data-state=settling] .intro,.stage[data-state=paused] .intro,.stage[data-state=result] .intro{opacity:0;visibility:hidden;pointer-events:none}.stage[data-state=running] .hud,.stage[data-state=settling] .hud,.stage[data-state=paused] .hud{opacity:1;transform:none}.stage[data-state=running] .landscape,.stage[data-state=settling] .landscape{filter:saturate(.64) brightness(.97)}.stage[data-state=paused] .hands,.stage[data-state=result] .hands{opacity:.25}.stage[data-state=running] #arena,.stage[data-state=settling] #arena{cursor:crosshair}
.announcement{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.no-script{position:absolute;z-index:10;bottom:10px;width:100%;text-align:center}.margin-note{position:fixed;left:calc(50% - 37svh);top:50%;transform:translate(-50%,-50%) rotate(-90deg);display:flex;align-items:center;gap:24px;white-space:nowrap;font-size:8px;letter-spacing:3px;color:#baa98766}.margin-note i{width:50px;height:1px;background:#baa98744}
/* Mirror around the image centre, not the casting pivot: the left arm enters from the left edge. */
.hands{opacity:1}.hand{width:48%;bottom:-1.5%;filter:brightness(.82) saturate(.7) drop-shadow(0 8px 15px #0008)}.hand-left{left:-1%;transform-origin:50% 90%}.hand-right{right:-1%}.stage[data-state=paused] .hands,.stage[data-state=result] .hands{opacity:1;filter:brightness(.65)}
.godlight{position:absolute;inset:-15% -20% 14%;z-index:-2;pointer-events:none;background:conic-gradient(from 157deg at 61% 8%,transparent 0deg,#fff5cb68 5deg,transparent 10deg,transparent 13deg,#fff7d68f 19deg,transparent 26deg,transparent 30deg,#fff1bd62 34deg,transparent 40deg);animation:godlight 5s ease-in-out infinite alternate;transform-origin:61% 8%}
@keyframes godlight{0%{opacity:.30;transform:rotate(-8deg)}100%{opacity:.94;transform:rotate(8deg)}}
#skyFx{position:absolute;inset:0;width:100%;height:100%;z-index:-3;pointer-events:none}
.ascension{position:absolute;z-index:4;bottom:25%;left:0;right:0;text-align:center;color:#e2c995;font-size:10px;letter-spacing:.35em;pointer-events:none;opacity:0}.ascension.reveal{animation:ascend 2.2s ease both}@keyframes ascend{10%,60%{opacity:1}0%{translate:0 7px}100%{opacity:0;translate:0 -5px}}
#ascendFx{position:absolute;inset:0;width:100%;height:100%;z-index:4;pointer-events:none}.ascension{z-index:5;font-size:12px;color:#fff0c6;text-shadow:0 0 15px #ffd37f,0 2px 9px #071018}.ascension.reveal{animation-duration:2.8s}.stage[data-state=paused] .ascension{animation-play-state:paused}
.rank-mark{position:absolute;z-index:4;bottom:21px;left:50%;transform:translateX(-50%);font-size:9px;letter-spacing:3px;color:#d0b780;pointer-events:none}
.hand:after{content:"";position:absolute;inset:16% 8% 6%;pointer-events:none;opacity:0;border-radius:50%;background:radial-gradient(ellipse at 60% 70%,#ffdb7e50,transparent 60%);mix-blend-mode:screen}
.stage[data-tier="2"] .hand:after,.stage[data-tier="3"] .hand:after{opacity:.7;animation:wristLight 3.5s ease-in-out infinite alternate}.stage[data-tier="2"] .hand,.stage[data-tier="3"] .hand{filter:brightness(.95) saturate(.8) drop-shadow(0 0 8px #d4ad5940)}
@keyframes wristLight{to{opacity:.25;transform:scale(.93)}}
.stage[data-state=paused] .godlight,.stage[data-state=paused] .hand:after{animation-play-state:paused}
.stage[data-tier="3"] .hand[data-pose=attack]:before{content:"";position:absolute;inset:-8% 8% 26%;z-index:2;pointer-events:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M55 2 47 22 57 28 40 52 50 58 38 88M47 22 32 27 25 39M40 52 27 61 20 79M50 58 68 65 75 84' fill='none' stroke='%23e3f3ff' stroke-width='.9' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;filter:drop-shadow(0 0 3px #b8dfff);opacity:.85}
@media(hover:hover) and (pointer:fine){.primary:hover{background:#283b3e;border-color:#e0c590;transform:translateY(-2px)}.icon-button:hover{background:#bba37230}.text-button:hover{color:#f5e2b8}}
@media(max-width:600px){.landscape{background-image:url(assets/olympus-small.webp)}.outside,.margin-note{display:none}.stage{width:100%;max-width:none}.topbar{left:22px;right:20px}.icon-button{width:40px;height:40px}.language-button{min-height:40px}.intro-copy{top:39%;left:24px;right:24px}.hand{width:50%;bottom:-1.5%}.hand-left{left:0}.hand-right{right:0}.keyboard-note{display:none}}
@media(max-height:740px){.intro-copy{top:34%}.sigil{margin:14px 0 10px;width:32px;height:32px}.fine-rule{margin:18px auto}.invitation{margin-bottom:20px;font-size:11px}.primary{min-height:48px}.instructions{margin-top:12px}h1{font-size:55px}.dialog-copy h2{margin-top:16px}.final-score{font-size:76px}.hud{top:77px}}
@media(max-height:530px){.intro-copy{top:25%}.overline{font-size:7px}.sigil{display:none}h1{font-size:43px;margin-top:12px}.subtitle{font-size:9px}.fine-rule{margin:13px auto}.invitation{font-size:10px;margin-bottom:14px;line-height:1.8}.keyboard-note{display:none}.primary{min-height:43px}.hud{top:66px}.dialog-copy h2{font-size:23px;margin-top:12px}.final-score{font-size:60px}.dialog-copy .primary{margin-top:14px}.text-button{margin-top:10px}.edge-mark{bottom:10px}}

.stage.near-ascension .hand:after{opacity:.85;background:radial-gradient(ellipse at 52% 36%,#ffe7a56b,transparent 54%)}
.hand[data-pose=attack]{animation:hand-recoil 100ms ease-out both}
@keyframes hand-recoil{0%{transform:translate(-5px,-14px) rotate(-4deg)}45%{transform:translate(1px,5px) rotate(2deg)}100%{transform:none}}
.stage[data-state=paused] .hand{animation-play-state:paused}
.stage[data-state=settling] .hands{transition:opacity .7s}
.stage[data-state=settling].fading .hands{opacity:.72}

.palm-beam {
  position: absolute;
  z-index: 2;
  height: 2px;
  pointer-events: none;
  transform-origin: left center;
  background: linear-gradient(90deg, #fff6cc, #f9df9cc9 75%, #f9df9c55);
  box-shadow: 0 0 5px #f6d78b;
  animation: palm-beam-fade 130ms ease-out both;
}
.palm-beam::before,
.palm-beam.is-hit::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 34px;
  height: 34px;
  background: radial-gradient(circle, #fffce6 0%, #ffe098af 23%, transparent 69%);
}
.palm-beam::before { left: 0; translate: -50% -50%; }
.palm-beam.is-hit::after { right: 0; translate: 50% -50%; }
.stage[data-state=paused] .palm-beam { visibility: hidden; }
@keyframes palm-beam-fade {
  0%, 18% { opacity: 1; }
  100% { opacity: 0; }
}

.palm-beam::before {
  width: 46px;
  height: 46px;
}
.palm-reflection {
  position: absolute;
  z-index: 4;
  width: 34px;
  height: 34px;
  pointer-events: none;
  translate: -50% -50%;
  scale: var(--palm-direction) 1;
  animation: palm-beam-fade 130ms ease-out both;
  background:
    radial-gradient(ellipse 11px 5px at 51% 58%, #ffc87965, transparent),
    radial-gradient(ellipse 5px 10px at 32% 38%, #ffe2a078, transparent);
}
.palm-reflection::after {
  content: "";
  position: absolute;
  inset: 3px 4px 12px 11px;
  border-radius: 50%;
  border-top: 1px solid #fff4c8df;
  rotate: -24deg;
  filter: drop-shadow(0 0 3px #ffd27c);
}
.stage[data-state=paused] .palm-reflection { visibility: hidden; }

.quality-setting {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  margin-top: .6rem;
  font-size: .72rem;
  color: #ded3bd;
}
.quality-setting select {
  padding: .35rem .6rem;
  color: #f4ead3;
  background: #171e22;
  border: 1px solid #bda87c70;
  border-radius: .25rem;
  font: inherit;
}
#start.is-measuring { visibility: hidden; }
.stage[data-quality=low] .godlight { animation-duration: 7s; }

.topbar[hidden] { display: none; }

.palm-beam.is-thunder {
  height: 5px;
  translate: 0 -1.5px;
  background: linear-gradient(90deg, #fff, #effaff 62%, #addef4bb);
  box-shadow: 0 0 6px #f0fcff, 0 0 13px #a2d9f5bf;
}
.palm-beam.is-thunder::before,
.palm-beam.is-thunder.is-hit::after {
  background: radial-gradient(circle, #fff 0%, #d9f3ffcc 25%, transparent 70%);
}

/* Advanced mode: concise rules, separate results and a deliberate next-round action. */
.mode-name{font-size:9px;letter-spacing:.08em;color:#dfca9b}
.advanced-start{margin-top:10px}
.advanced-help{max-width:280px;font-size:10px;line-height:1.6;color:#e4d6b9;margin:4px 0}
.result-breakdown{width:min(100%,280px);margin:0;font-size:12px;color:#ded3bd}
.result-breakdown>div{display:flex;justify-content:space-between;gap:16px;margin:8px 0}
.result-breakdown dd{margin:0;font-variant-numeric:tabular-nums}
.dialog-copy .next-trial{margin-top:12px}
.result-screen .dialog-copy{max-height:100%;overflow-y:auto;padding-block:20px}
.stage[data-mode=advanced] .mode-name{color:#a8e8ef}
@media(max-height:740px){.intro-copy:has(.advanced-start:not([hidden])){top:24%}.intro-copy:has(.advanced-start:not([hidden])) .sigil{margin:8px 0}.intro-copy:has(.advanced-start:not([hidden])) .fine-rule{margin:10px auto}.intro-copy:has(.advanced-start:not([hidden])) .invitation{margin-bottom:10px}}
@media(max-height:530px){.intro-copy:has(.advanced-start:not([hidden])){top:12%}.intro-copy:has(.advanced-start:not([hidden])) .invitation,.intro-copy:has(.advanced-start:not([hidden])) .keyboard-note{display:none}.result-screen .dialog-copy h2{margin-top:0}.result-screen .fine-rule{margin:8px auto}.result-screen .final-score{font-size:48px}.result-screen .primary{min-height:36px;margin-top:8px}.result-screen .text-button{min-height:28px;margin-top:5px;padding:4px 0}.result-screen .record{margin:6px 0}}

/* Pause is independently reachable during play; other title controls remain hidden. */
.play-pause{position:absolute;z-index:6;top:max(20px,env(safe-area-inset-top));right:max(20px,env(safe-area-inset-right));width:44px;height:44px;background:#0b161cc9}
.intro-copy .primary{flex-shrink:0}
.intro-copy:has(.advanced-start:not([hidden])){top:24%;bottom:12px;overflow-y:auto;scrollbar-width:thin;padding-bottom:4px}
@media(max-height:740px){.intro-copy:has(.advanced-start:not([hidden])){top:14%}}
@media(max-height:530px){.intro-copy:has(.advanced-start:not([hidden])){top:6%}}

/* Keep the title artwork unchanged while supporting touch and keyboard activation. */
.secret-title{font:inherit;letter-spacing:inherit;line-height:inherit;color:inherit;text-shadow:inherit;border:0;background:none;padding:0;touch-action:manipulation}
@media(prefers-reduced-motion:reduce){.stage *,.stage *::before,.stage *::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:0s!important}}

/* A separate, finite trial run; the title and choice screen also fit short phones. */
.trials-start{margin-top:10px}
.trials-intro{max-width:280px;font-size:10px;line-height:1.7;color:#e4d6b9;margin:5px 0}
.intro-copy,.intro-copy:has(.advanced-start:not([hidden])){top:18%;bottom:12px;overflow-y:auto;scrollbar-width:thin;padding-bottom:8px}
.intro-copy .overline,.intro-copy .sigil,.intro-copy .fine-rule{flex-shrink:0}
.intro-copy .sigil{margin-block:10px}
.intro-copy .fine-rule{margin-block:14px}
.intro-copy .invitation{margin-bottom:14px}
.trial-status{position:absolute;z-index:4;top:175px;left:24px;right:24px;pointer-events:none;color:#fff0cb;display:flex;flex-direction:column;gap:5px;text-shadow:0 1px 5px #000;font-size:12px;line-height:1.6}
.trial-status span{font-size:10px;color:#eee1c4;max-width:100%;overflow-wrap:anywhere}
.blessing-screen{background:#09141bf2;text-align:center}
.blessing-screen .dialog-copy{max-height:100%;overflow-y:auto;padding:24px}
.blessing-screen .dialog-copy h2{font-size:24px;margin:14px 0 8px}
.blessing-screen .dialog-copy>p{font-size:12px;letter-spacing:.03em;max-width:360px}
.blessing-choices{display:grid;gap:10px;width:100%;max-width:360px}
.blessing-card{min-height:90px;text-align:left;border:1px solid #b49a6690;background:#15252a;color:#f0e1bf;padding:14px;display:grid;grid-template-columns:1fr auto;gap:8px;line-height:1.6}
.blessing-card strong{font-size:14px}.blessing-card>span:not(.blessing-rarity),.blessing-card small{grid-column:1/-1;font-size:12px}.blessing-rarity{font-size:11px;color:#ffe6a1}.blessing-card small{color:#b9cccf}
.blessing-card:hover,.blessing-card:focus-visible{background:#253b3e;border-color:#ffe6a1}
.blessing-collection{overflow-wrap:anywhere}.trial-result{max-width:300px}
.stage[data-state=choosing] .hands{opacity:.3}
@media(max-height:740px){.intro-copy,.intro-copy:has(.advanced-start:not([hidden])){top:10%}.trial-status{top:160px}}
@media(max-height:530px){.intro-copy,.intro-copy:has(.advanced-start:not([hidden])){top:6%}.trial-status{top:150px}.blessing-screen .dialog-copy{padding:14px 24px}.blessing-screen .dialog-copy h2{margin-top:5px}}
/* Rarity is always named in text as well as indicated by the border. */
.blessing-card[data-rarity="2"]{border-color:#9ed7df}
.blessing-card[data-rarity="3"]{border-color:#f4cf79;background:#29302d}
.blessing-screen .trial-forecast{color:#e1cba0}
#blessingLife{margin:0;color:#fff0cb}
#trialBlessings{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dialog-copy .trial-result-build{font-size:11px;letter-spacing:.02em;overflow-wrap:anywhere;max-width:320px}
.blessing-odds{width:100%;max-width:360px;text-align:left;font-size:11px;line-height:1.8;color:#d1c9b8}
.blessing-odds summary{cursor:pointer;min-height:44px;display:flex;align-items:center;text-decoration:underline;text-underline-offset:4px}
.blessing-odds p{margin-top:4px}
/* Route choice and local checkpoint controls use the same scrollable menu as blessings. */
.stage[data-state=routing] .hands,.stage[data-state=contracting] .hands{opacity:.3}
.blessing-card:disabled{opacity:.45;cursor:default}
.pause-screen .dialog-copy{max-height:100%;overflow-y:auto;padding-block:18px}
#trialContract{font-weight:bold;color:#fff2ce}
#trialSaveStatus,#checkpointNote{overflow-wrap:anywhere;line-height:1.7}
.blessing-option{width:100%}.blessing-option>.blessing-card{width:100%}.memory-button{margin:2px 0 0;min-height:44px;font-size:11px}.memory-button[aria-pressed=true]{color:#fff0b8;border-color:#edd59a}
#blessingReward{font-size:11px;margin:6px 0}#blessingReroll{margin:0 0 8px;min-height:44px}

.boss-screen .dialog-copy{max-height:100%;overflow-y:auto;padding-block:18px}.boss-screen p{line-height:1.85;font-size:12px}.boss-screen .primary{margin-top:12px}#bossStatus{color:#fff0bd;max-width:100%;line-height:1.65}

.boss-screen{background:#09141bf2;text-align:center}.boss-screen .dialog-copy>*{flex-shrink:0}.boss-screen .dialog-copy h2{margin:12px 0}.boss-screen .dialog-copy>p{letter-spacing:.03em;max-width:360px}
@media(max-height:530px){.stage[data-boss] #trialBlessings{display:none}.stage[data-boss] #bossStatus{font-size:11px}}

@media(max-height:530px){.stage[data-boss] .trial-status{display:grid;grid-template-columns:1fr 1fr;gap:2px;font-size:11px}.stage[data-boss] #bossStatus{grid-column:1/-1;font-size:10px}}

/* Collection is opened outside combat; navigation scrolls with the page. */
.collection-open{font-size:10px;margin:3px 0;min-height:36px}.player-title{font-size:10px;color:#d9cfb6;margin:4px 0;letter-spacing:.12em}
.collection-screen{background:#09141bf5;user-select:text;-webkit-user-select:text;text-align:left}.collection-screen .dialog-copy{height:100%;overflow:auto;overscroll-behavior:contain;align-items:stretch;padding:18px 22px;touch-action:pan-y}.collection-screen .dialog-copy>*{flex-shrink:0}.collection-screen .dialog-copy h2{font-size:21px;letter-spacing:.04em;padding:0;margin:12px 0}.collection-screen p{font-size:12px;line-height:1.85;letter-spacing:.02em}.collection-toolbar{display:flex;justify-content:space-between;gap:12px}.collection-toolbar .text-button{margin:0;min-height:44px}.collection-nav{display:flex;flex-wrap:wrap;gap:5px;margin:10px 0}.collection-nav button{min-height:44px;border:1px solid #84969a66;padding:7px;background:#12232a;color:#d5e3e1;font-size:12px}.collection-nav [aria-selected=true]{border-color:#efd59a;color:#fff0c6}.stage[data-state=collection]{touch-action:pan-y}
.codex-card{padding:12px;border:1px solid #a6b5ad55;background:#12232c;margin:10px 0;overflow-wrap:anywhere}.codex-card summary{cursor:pointer;min-height:44px;font-size:13px;line-height:1.8}.codex-card h3{font-weight:400;font-size:15px;margin:5px 0}.codex-card p,.codex-card dd{font-size:12px;line-height:1.9}.codex-card dt{font-size:12px;color:#f3dcb0;margin-top:9px}.codex-card dd{margin:3px 0 8px}.codex-card small{font-size:11px;color:#bdd1d1}.codex-card a,.myth-links a{display:inline-block;color:#f1dca9;font-size:12px;line-height:1.8;padding:10px 0;text-underline-offset:4px}.myth-links{display:flex;flex-wrap:wrap;gap:0 14px}.collection-warning{color:#ffd29e!important}.collection-setting{display:grid;gap:7px;font-size:13px;margin:18px 0}.collection-setting select{max-width:100%;width:100%;min-height:44px;background:#12232c;color:#f2e8d2;border:1px solid #a4b5ad;padding:6px;font-size:12px}.collection-result{max-width:330px;font-size:11px}.collection-result p{font-size:11px;line-height:1.8}.result-screen .dialog-copy{max-height:100%;overflow-y:auto}.result-screen .dialog-copy>*{flex-shrink:0}.collection-toast{position:absolute;z-index:4;left:20px;right:20px;bottom:22px;pointer-events:none;background:#12232cef;border:1px solid #e2c88a;padding:10px;color:#f4dfb2;font-size:11px;line-height:1.7;text-align:center;animation:collection-discovery .25s ease-out}
@keyframes collection-discovery{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}
.stage[data-aura=moon] .palm-beam{background:linear-gradient(90deg,#e5f9ff,#9dd9edb0 75%,#9dd9ed55);box-shadow:0 0 5px #b5e4f0}.stage[data-aura=moon] .palm-beam::before,.stage[data-aura=moon] .palm-beam::after{background:radial-gradient(circle,#effcff 0%,#9eddf0af 23%,transparent 69%)}
.stage[data-aura=dawn] .palm-beam{background:linear-gradient(90deg,#fff2e7,#f7bea8b0 75%,#f7bea855);box-shadow:0 0 5px #f3b99e}.stage[data-aura=dawn] .palm-beam::before,.stage[data-aura=dawn] .palm-beam::after{background:radial-gradient(circle,#fff6e9 0%,#f3b99eaf 23%,transparent 69%)}
@media(prefers-reduced-motion:reduce){.collection-toast{animation:none}}

.stage[data-state=result]{touch-action:pan-y}.result-screen .dialog-copy{touch-action:pan-y}

.stage[data-state=intro]{touch-action:pan-y}.intro-copy{touch-action:pan-y}

.ranking-screen{background:#09141bf5;text-align:left;user-select:text;-webkit-user-select:text}.ranking-screen .dialog-copy{height:100%;overflow-y:auto;align-items:stretch;padding:18px 22px;touch-action:pan-y;overscroll-behavior:contain}.ranking-screen .dialog-copy>*{flex-shrink:0}.ranking-screen h2{font-size:22px;letter-spacing:.04em;margin:12px 0;padding:0}.ranking-screen h3{font-size:15px;font-weight:400;margin:20px 0 8px}.ranking-screen p{font-size:12px;line-height:1.85;letter-spacing:.02em}.ranking-screen .text-button{min-height:44px;margin-top:6px}.ranking-screen .primary{width:100%;max-width:360px;letter-spacing:.04em;padding:10px 16px;line-height:1.6}.ranking-screen table{width:100%;border-collapse:collapse;font-size:12px;table-layout:fixed}.ranking-screen th,.ranking-screen td{padding:9px 5px;border-bottom:1px solid #879a9a55;text-align:left;overflow-wrap:anywhere}.ranking-screen th:first-child{width:20%}.ranking-screen th:last-child{width:22%}.ranking-modes{display:flex;gap:8px}.ranking-modes button{background:#13252d;border:1px solid #728b8d;padding:10px;color:#e7dfc8;min-height:44px}.ranking-modes [aria-selected=true]{border-color:#efd49a;color:#fff0ca}.rank-name{display:grid;gap:8px;font-size:12px;margin:14px 0}.rank-name input{max-width:100%;background:#142731;border:1px solid #8fa3a3;color:#f4e8cf;padding:10px;font:inherit;min-height:44px}.rank-consent{display:flex;align-items:flex-start;gap:10px;font-size:12px;line-height:1.8}.rank-consent input{flex-shrink:0;width:22px;height:22px;margin-top:4px}.rank-pending{border:1px solid #849b9b66;padding:10px;margin:8px 0}.ranking-result{max-width:330px;font-size:11px}.ranking-result p{font-size:11px;line-height:1.8}.stage[data-state=ranking]{touch-action:pan-y}.rank-data{padding-bottom:16px}

/* One bounded interlude; animate only opacity/transform, never full-screen filters. */
.trial-clear-screen{z-index:8;overflow:hidden;background:linear-gradient(180deg,#08141b8c,#08141be8 48%,#08141b9c);text-align:center;outline:none}
.trial-clear-copy{position:relative;z-index:1;width:100%;padding:24px;color:#f4e6be;animation:trial-clear-copy 1.1s ease-out both}
.trial-clear-copy .overline{display:block;font-size:9px;letter-spacing:.3em;color:#cbb780}
.trial-clear-copy h2{font-size:clamp(22px,5.8vw,34px);font-weight:400;letter-spacing:.1em;line-height:1.6;margin:18px 0}
.trial-clear-copy p{font-size:12px;letter-spacing:.12em;color:#d6dacd;margin:16px 0 0}
.trial-clear-seal{display:block;font-size:32px;line-height:1;color:#e8cb83;margin-bottom:22px}
.trial-clear-rule{display:block;height:1px;width:min(180px,55%);margin:auto;background:linear-gradient(90deg,transparent,#d9bd7b,transparent);transform-origin:center;animation:trial-clear-line 1.1s ease-out both}
.trial-clear-halo{position:absolute;width:min(560px,110vw);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#dfbd671f,transparent 65%);opacity:.7;animation:trial-clear-halo 1.1s ease-out both;pointer-events:none}
.stage[data-state=trial_clear] .hands{opacity:.25}.stage[data-state=trial_clear] .godlight,.stage[data-state=trial_clear] .hand:after{animation-play-state:paused}
@keyframes trial-clear-copy{0%{opacity:0;transform:translateY(8px)}18%,80%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-3px)}}
@keyframes trial-clear-line{0%{transform:scaleX(.12)}55%,100%{transform:scaleX(1)}}
@keyframes trial-clear-halo{0%{opacity:0;transform:scale(1.2)}40%{opacity:.7;transform:scale(1)}100%{opacity:0;transform:scale(.85)}}
@media(prefers-reduced-motion:reduce){.trial-clear-copy,.trial-clear-rule,.trial-clear-halo{animation:none!important}}

.journey-screen{background:#09141bee}.journey-screen .dialog-copy,.boss-screen .dialog-copy{max-height:100%;overflow-y:auto;justify-content:flex-start;gap:8px;overscroll-behavior:contain;touch-action:pan-y}.journey-screen .dialog-copy>*,.boss-screen .dialog-copy>*{flex-shrink:0}.boss-portrait{display:block;height:min(180px,24svh);width:auto;max-width:80%;object-fit:contain}.journey-screen p,.boss-screen p{font-size:12px;line-height:1.8;max-width:360px;text-align:center}.journey-screen .primary{margin-top:8px}.stage[data-state=intermission]{touch-action:pan-y}

.stage[data-boss] #trialDefense,.stage[data-boss] #trialBlessings{display:none}.stage[data-boss] .trial-status{text-shadow:0 1px 4px #071018,0 0 8px #071018}

.boss-appearance{color:#c8b77e;letter-spacing:.08em}.stage[data-boss-cycle="2"] .boss-appearance{color:#c9eaff}.stage[data-boss-cycle="2"] #bossStatus{color:#f2f2d7}
.stage:is([data-state=choosing],[data-state=routing],[data-state=contracting],[data-state=boss_intro],[data-state=paused]){touch-action:pan-y}
.blessing-screen .dialog-copy,.route-screen .dialog-copy,.pause-screen .dialog-copy{touch-action:pan-y;overscroll-behavior:contain}

/* Boss atmosphere sits behind targets, hands and HUD; only opacity changes on entry/exit. */
.boss-surround{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 45%,#35050c12 10%,#3d06118c 65%,#080207ed 100%);opacity:0;transition:opacity .9s ease-out}
.boss-atmosphere{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;transition:opacity .9s ease-out;background:linear-gradient(180deg,#25030beb 0%,#4a0b2096 22%,#3c0a1559 44%,#26081140 66%,#0c040be6 100%),radial-gradient(ellipse at center,transparent 42%,#25020b85 78%,#060207eb 100%)}
body[data-boss-atmosphere] .boss-surround,.stage[data-boss-atmosphere] .boss-atmosphere{opacity:1}
.stage[data-boss-atmosphere]{box-shadow:0 0 0 1px #b8524b55,0 0 70px #630b1c55}
.stage[data-boss-atmosphere] .godlight{animation-play-state:paused}
.stage[data-boss-atmosphere] .boss-screen{background:linear-gradient(180deg,#1b060eef,#16080de8 60%,#0b060de8)}
.stage[data-boss-atmosphere] .pause-screen{background:#19070dd4}
@media(prefers-reduced-motion:reduce){.boss-surround,.boss-atmosphere{transition:none!important}}

/* Foreground clouds obscure only the bottom of the boss portrait. */
.boss-portrait-frame{position:relative;height:min(180px,24svh);aspect-ratio:2/3;flex-shrink:0}
.boss-portrait-frame .boss-portrait{height:100%;width:100%;max-width:none}
.boss-portrait-frame::after{content:"";position:absolute;pointer-events:none;left:-32.5%;top:54%;width:165%;height:52%;background:url(assets/boss-clouds.webp) center/100% 100% no-repeat;mask-image:linear-gradient(#000 72%,transparent)}

/* Cast brass reliquaries: static bevels and engraved geometry, no full-screen filters. */
#blessingScreen{background:radial-gradient(ellipse at 50% 18%,#73532c27,transparent 58%),linear-gradient(145deg,#101c21fa,#070f15f7)}
#blessingScreen .dialog-copy{position:relative;width:calc(100% - 28px);max-height:calc(100% - 28px);padding:28px 20px;border:3px solid #806341;border-image:linear-gradient(130deg,#362a21,#dbb775 21%,#6c4e2d 40%,#edcf8d 57%,#473625 76%,#b28b50) 1;box-shadow:inset 0 0 0 2px #0b1116,inset 0 0 0 3px #af8b4b77,inset 0 0 35px #0007,0 12px 25px #0008;scrollbar-color:#8f7046 #111b20;overscroll-behavior:contain;touch-action:pan-y;justify-content:flex-start}
#blessingScreen .dialog-copy>*{flex-shrink:0}
#blessingScreen .dialog-copy>.overline{color:#dec28d;margin-top:5px}
#blessingScreen .dialog-copy h2{color:#f0d9a9;letter-spacing:.16em;text-shadow:0 2px 2px #000}
#blessingScreen .blessing-choices{gap:16px;padding:10px 5px 14px;perspective:900px}
#blessingScreen .blessing-option{position:relative;perspective:900px}
#blessingScreen .blessing-card{--relic:#c3a06b;position:relative;min-height:130px;isolation:isolate;padding:18px 16px 16px 78px;grid-template-columns:1fr auto;gap:7px 6px;border:3px solid var(--relic);border-radius:3px;background:linear-gradient(130deg,#c4a46d17,transparent 38%,#0005),repeating-linear-gradient(115deg,#a7a28d04 0 1px,transparent 1px 5px),#142127;box-shadow:0 2px 0 #34251c,0 5px 0 #090e12,inset 0 0 0 1px #f1d69866,inset 0 0 0 5px #060d12,inset 0 0 0 6px #bda57555,0 9px 14px #0005;transform-origin:50% 45%;backface-visibility:hidden;transition:border-color .18s,background-color .18s,box-shadow .18s}
#blessingScreen .blessing-card::before{content:"";position:absolute;inset:9px;pointer-events:none;background:linear-gradient(var(--relic),var(--relic)) left top/15px 1px no-repeat,linear-gradient(var(--relic),var(--relic)) left top/1px 15px no-repeat,linear-gradient(var(--relic),var(--relic)) right bottom/15px 1px no-repeat,linear-gradient(var(--relic),var(--relic)) right bottom/1px 15px no-repeat;opacity:.8}
#blessingScreen .blessing-card::after{content:"◆";position:absolute;right:5px;top:0;font-size:10px;color:var(--relic);text-shadow:0 1px #000;pointer-events:none}
#blessingScreen .blessing-card strong{grid-column:1/-1;font-size:15px;line-height:1.6;color:#f6e4be;font-weight:500;letter-spacing:.05em}
#blessingScreen .blessing-rarity{grid-column:1/-1;justify-self:start;line-height:1.4;font-size:10px;letter-spacing:.15em;color:var(--relic);border-bottom:1px solid #c8ac6c44;padding-bottom:3px}
#blessingScreen .blessing-card>span:not(.blessing-emblem):not(.blessing-rarity){font-size:12px;line-height:1.8;color:#e5e3d7}
#blessingScreen .blessing-card small{font-size:10px;line-height:1.6;color:#acbfc0}
#blessingScreen .blessing-card .blessing-emblem{grid-column:auto;grid-row:auto;position:absolute;left:17px;top:26px;width:46px;height:46px;display:grid;place-items:center;border:1px solid #a48b57;border-radius:50%;color:var(--relic);background:radial-gradient(circle,#ad936529,#10191e 72%);box-shadow:0 2px 2px #000,inset 0 0 0 3px #121c21,inset 0 0 0 4px #c7ac6e44}
.blessing-emblem svg{width:38px;height:38px;fill:none;stroke:currentColor;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round}
#blessingScreen .blessing-card[data-rarity="2"]{--relic:#94c4cf}
#blessingScreen .blessing-card[data-rarity="3"]{--relic:#f0ca77;background-color:#2c2920;box-shadow:0 2px 0 #604528,0 5px 0 #0c1012,inset 0 0 0 1px #ffe7aa,inset 0 0 0 5px #211c16,inset 0 0 0 6px #c5a57277,0 9px 16px #0007}
#blessingScreen .blessing-card:focus-visible{outline:2px solid #fff1bc;outline-offset:4px}
@media(hover:hover){#blessingScreen .blessing-card:hover{background-color:#304044;border-color:#f1d9a6}}
.blessing-chosen-notice{display:none;color:#ffe5a3!important;letter-spacing:.2em!important}
.stage[data-state=blessing_chosen] .blessing-chosen-notice{display:block;position:sticky;bottom:12px;padding:12px 18px;border:1px solid #ad8a4b;background:#102025f2;box-shadow:0 4px 20px #0008;z-index:2}
.stage[data-state=blessing_chosen] #blessingChoices .blessing-option:has(.is-chosen){z-index:1}
.stage[data-state=blessing_chosen] #blessingChoices .blessing-card:not(.is-chosen),.stage[data-state=blessing_chosen] .memory-button{opacity:.22;transition:opacity .2s}
.stage[data-state=blessing_chosen] .blessing-card.is-chosen{animation:blessing-received .86s ease-in both;box-shadow:0 0 0 2px #ffe9a3,inset 0 0 0 4px #f0cf7a77,0 0 30px #d4b15f55}
@keyframes blessing-received{0%,25%{opacity:1;transform:rotateY(0) scale(1.025)}40%{opacity:1;transform:translateY(-5px) rotateY(-12deg) scale(1.04)}100%{opacity:0;transform:translateY(-25px) rotateY(180deg) rotateZ(-4deg) scale(.7)}}
.trial-opening-screen{z-index:8;overflow:hidden;outline:none;text-align:center;background:linear-gradient(180deg,#08141b88,#08141be8 45%,#08141b9c)}
.trial-opening-copy{position:relative;z-index:1;color:#f4e5c3;padding:22px;width:100%;animation:opening-copy 1.6s ease-out both}
.trial-opening-copy .overline{font-size:9px;color:#d6bf8b;letter-spacing:.3em}
.opening-seal{display:block;margin:22px auto;color:#e8cc91;font-size:56px;line-height:1;text-shadow:0 0 16px #d3ae6444}
.trial-opening-copy h2{font-size:clamp(22px,5.7vw,32px);font-weight:400;line-height:1.7;letter-spacing:.12em;margin:24px 0}
.trial-opening-copy p{font-size:14px;letter-spacing:.14em;margin:24px 0 12px;color:#f0dfbd}
.opening-footnote{font-size:10px;letter-spacing:.06em;color:#b9b7a5}
.opening-rule{display:block;height:1px;width:62%;margin:auto;background:linear-gradient(90deg,transparent,#e6c786,transparent);animation:opening-rule 1.6s ease-out both}
.opening-orbit{position:absolute;width:76%;aspect-ratio:1;border:1px solid #d6b87833;border-radius:50%;outline:1px solid #d6b8781a;outline-offset:9px;animation:opening-orbit 1.6s ease-out both;pointer-events:none}
.opening-orbit::before,.opening-orbit::after{content:"";position:absolute;inset:12%;border:1px solid #d6b87833;transform:rotate(45deg)}
.opening-orbit::after{inset:26%;transform:rotate(22deg)}
@keyframes opening-copy{0%{opacity:0;transform:translateY(10px)}20%,82%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-5px)}}
@keyframes opening-rule{0%{transform:scaleX(.05)}70%,100%{transform:scaleX(1)}}
@keyframes opening-orbit{0%{opacity:0;transform:scale(1.15) rotate(-12deg)}30%,70%{opacity:1}100%{opacity:0;transform:scale(.95) rotate(8deg)}}
@media(max-width:350px){#blessingScreen .dialog-copy{width:calc(100% - 18px);padding:20px 12px}#blessingScreen .blessing-card{padding-left:66px;padding-right:12px}#blessingScreen .blessing-card .blessing-emblem{left:12px;width:40px;height:40px}.blessing-emblem svg{width:33px;height:33px}}
@media(max-height:530px){.trial-opening-copy{padding:16px}.opening-seal{margin:12px auto;font-size:38px}.trial-opening-copy h2{margin:12px 0;font-size:22px}.trial-opening-copy p{margin:12px 0}.opening-orbit{width:58%}}
@media(prefers-reduced-motion:reduce){.trial-opening-copy,.opening-orbit,.opening-rule,.stage[data-state=blessing_chosen] .blessing-card.is-chosen{animation:none!important}.stage[data-state=blessing_chosen] #blessingChoices .blessing-card:not(.is-chosen),.stage[data-state=blessing_chosen] .memory-button{transition:none}}

/* A fixed number of vector seals travel from the chosen card into the palms. */
.blessing-investiture{--seal:#ddbd7c;position:absolute;inset:0;z-index:9;overflow:hidden;pointer-events:none;color:var(--seal)}
.blessing-investiture[data-rarity="2"]{--seal:#a9dde6}.blessing-investiture[data-rarity="3"]{--seal:#ffe4a2}
.investiture-seal{position:absolute;width:48px;height:48px;border:1px solid currentColor;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,#f6d99c33,#13212788 65%,transparent 72%);box-shadow:0 0 18px #dfbf7244,inset 0 0 0 3px #f4d89a22;pointer-events:none}
.investiture-seal svg{width:40px;height:40px}
.investiture-palm::after{content:"";position:absolute;inset:-9px;border:1px solid currentColor;border-radius:50%;opacity:.4}
.stage[data-investiture=flight] #blessingScreen{animation:investiture-veil 1.28s linear both}
.stage[data-investiture] .hands{opacity:1}
.stage[data-investiture=still] #blessingScreen{opacity:.3}
@keyframes investiture-veil{0%,28%{opacity:1}76%,100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.stage[data-investiture] #blessingScreen{animation:none!important;opacity:.3}}

/* Colossus entrance: reuse the battle-sized portrait and one cached cloud bank. */
.boss-entrance-screen{z-index:5;overflow:hidden;isolation:isolate;text-align:center}
.boss-entrance-shade{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 20%,#26070de6,#05090ff5 75%);animation:boss-murk var(--entrance-duration) ease-out both;pointer-events:none}
.boss-entrance-art{position:absolute;pointer-events:none}
.boss-entrance-portrait{display:block;width:100%;height:100%;object-fit:contain;animation:boss-arrival var(--entrance-duration) ease-out both}
.boss-entrance-cloud{position:absolute;left:-32%;bottom:-3%;width:164%;height:46%;background:url(assets/boss-clouds.webp) center/100% 100% no-repeat;mask-image:linear-gradient(#000 75%,transparent);animation:boss-cloud-part var(--entrance-duration) ease-out both}
.boss-entrance-heading{position:absolute;left:18px;right:18px;top:7%;z-index:1;color:#f2dfb6;text-shadow:0 2px 8px #000;animation:boss-name-arrives var(--entrance-duration) ease both;pointer-events:none}
.boss-entrance-heading .overline{font-size:8px;color:#d3aa77;letter-spacing:.2em}
.boss-entrance-heading h2{font-size:clamp(20px,5.8vw,30px);font-weight:400;line-height:1.6;letter-spacing:.08em;margin:12px 0}
.boss-entrance-heading p{font-size:11px;line-height:1.9;letter-spacing:.05em;margin:0 auto;max-width:300px;color:#d8c5ae}
.boss-entrance-controls{position:absolute;z-index:2;bottom:16px;left:24px;right:24px;display:flex;flex-direction:column;align-items:center;gap:0}
.boss-entrance-controls .text-button{width:min(100%,300px);min-height:44px;margin:0;padding:10px 6px;line-height:1.6;font-size:11px;letter-spacing:.08em;color:#f0dfbe;background:#071018c9;border-bottom:1px solid #ba956469}
.stage[data-state=boss_entrance] .hands{opacity:.15}
@keyframes boss-murk{0%,12%{opacity:.98}75%,100%{opacity:.12}}
@keyframes boss-arrival{0%,10%{opacity:0;transform:translateY(25px) scale(.985)}30%{opacity:.13}78%,100%{opacity:.88;transform:none}}
@keyframes boss-cloud-part{0%,12%{opacity:1;transform:translateY(-8px) scale(1.06)}100%{opacity:.92;transform:translateY(15px) scale(1)}}
@keyframes boss-name-arrives{0%,10%{opacity:0;transform:translateY(6px)}32%,90%{opacity:1;transform:none}100%{opacity:.8}}
@media(max-height:530px){.boss-entrance-heading{top:5%;left:12px;right:12px}.boss-entrance-heading h2{font-size:19px;margin:6px 0}.boss-entrance-heading p{font-size:10px}.boss-entrance-controls{bottom:8px;left:15px;right:15px}}
@media(prefers-reduced-motion:reduce){.boss-entrance-screen *{animation:none!important}.boss-entrance-portrait{opacity:.88}.boss-entrance-shade{opacity:.22}}
.stage[data-state=boss_entrance] .hud,.stage[data-state=boss_entrance] .intro{opacity:0;visibility:hidden}

/* A short, nonblocking vignette; at most three existing blessing emblems. */
.trial-epilogue{--closing:#d5b67b;width:100%;max-width:360px;padding:18px 12px;margin:10px 0 20px;border-block:1px solid #b9975b66;background:radial-gradient(ellipse at 50% 15%,#d8b96d12,transparent 75%);animation:epilogue-arrives .65s ease-out both}
.trial-epilogue[data-tone=faded]{--closing:#b4c4d1;border-color:#91a7bb66;background:radial-gradient(ellipse at 50% 15%,#89abc412,transparent 75%)}
.trial-epilogue[data-tone=quiet]{--closing:#c0bbb0}
.epilogue-seals{display:flex;justify-content:center;gap:12px;margin:18px 0}
.epilogue-seals figure{flex:1;max-width:96px;min-width:0;margin:0;color:var(--closing)}
.epilogue-seals .blessing-emblem{display:grid;place-items:center;width:48px;height:48px;margin:0 auto 10px;border:1px solid currentColor;border-radius:50%;box-shadow:inset 0 0 0 4px #c5ac7130}
.epilogue-seals figure[data-rarity="2"]{color:#acd4dd}.epilogue-seals figure[data-rarity="3"]{color:#f1d48b}
.epilogue-seals figcaption{font-size:10px;line-height:1.8;overflow-wrap:anywhere}
.epilogue-unmarked{font-size:36px;line-height:1.5;color:var(--closing)}
.trial-epilogue p{font-size:12px;line-height:2.2;letter-spacing:.05em;margin:10px 0;color:#d4d3c8}
.trial-epilogue .epilogue-lead{font-size:14px;color:#f0e2c3}.trial-epilogue .epilogue-trace,.trial-epilogue .epilogue-bosses{font-size:10px;letter-spacing:.02em;color:#b7c1bc}
.history-epilogue{border-left:2px solid #b89b6266;margin:16px 0;padding:4px 12px;background:#bbaa6810}
@keyframes epilogue-arrives{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.trial-epilogue{animation:none}}

.epilogue-seals figcaption>span{display:block}.epilogue-seals .epilogue-rarity{margin-top:3px;font-size:9px;letter-spacing:.08em;opacity:.85}

/* A committed route seals before the next choice or combat can begin. */
.stage[data-state=route_chosen]{touch-action:pan-y}
.stage[data-state=route_chosen] #routeScreen .blessing-card:not(.is-chosen){opacity:.22;transition:opacity .22s}
.stage[data-state=route_chosen] #routeScreen .blessing-card.is-chosen{border-color:#f0ce87;box-shadow:inset 0 0 18px #dca75155,0 0 20px #b68a3b55;animation:route-seal .7s ease-in-out both}
.route-chosen-notice{display:none;color:#f1d798;letter-spacing:.12em}
.stage[data-state=route_chosen] .route-chosen-notice{display:block}
@keyframes route-seal{0%{transform:perspective(800px) rotateY(0) scale(1)}40%{transform:perspective(800px) rotateY(-7deg) scale(1.035)}75%{opacity:1}100%{transform:perspective(800px) rotateY(9deg) scale(.97);opacity:.15}}
.boss-health{height:7px;max-width:280px;width:min(65vw,280px);background:#160d16;border:1px solid #a17b50;border-radius:2px;overflow:hidden}
.boss-health>span{display:block;height:100%;width:100%;background:linear-gradient(90deg,#ad5960,#edd39a);transition:width .1s linear}
@media(prefers-reduced-motion:reduce){.stage[data-state=route_chosen] #routeScreen .blessing-card.is-chosen{animation:none}.boss-health>span{transition:none}}
#routeScreen .dialog-copy{border:3px solid #9f8054;border-image:linear-gradient(125deg,#463121,#d9b875 25%,#735236 50%,#ebd299 75%,#473222) 1;box-shadow:inset 0 0 0 2px #0b1116,inset 0 0 0 3px #af8b4b77,0 12px 25px #0008;padding:26px 20px;background:linear-gradient(145deg,#172228,#0b141a)}
#routeChoices .blessing-card{border:2px solid #95764e;background:linear-gradient(130deg,#37403a,#142027 45%,#282e2b);box-shadow:inset 0 0 0 2px #10191c,inset 0 0 0 3px #ad8d5266,0 4px 8px #0006;padding:20px 17px;transform-origin:center}
/* Compact, static sigils retain the whole build without a clipped text line. */
#trialBlessings{display:flex;flex-wrap:wrap;gap:5px;max-width:100%;white-space:normal;overflow:visible;text-overflow:clip;margin-top:5px}
.blessing-badge{position:relative;display:inline-flex;align-items:center;justify-content:center;width:27px;height:29px;border:1px solid #9c8757;border-radius:4px;background:#11202bdd;flex:0 0 auto}
.blessing-badge .blessing-emblem{width:21px;height:21px;min-width:0;margin:0;padding:0;border:0;box-shadow:none;background:none}
.blessing-badge svg{width:100%;height:100%}.blessing-badge b{position:absolute;right:-2px;bottom:-4px;font-size:9px;line-height:12px;padding:0 2px;color:#f6e7c4;background:#10202e;border-radius:2px}
.blessing-badge[data-rarity="2"]{border:2px double #96c7d9;color:#c5eeff}.blessing-badge[data-rarity="3"]{border:2px solid #f0cb70;color:#ffe9a6;background:#40341ccc;box-shadow:inset 0 0 5px #ebc35f44}
@media(max-width:400px){.blessing-badge{width:23px;height:25px}.blessing-badge .blessing-emblem{width:18px;height:18px}#trialBlessings{gap:4px}}
.blessing-badge::after{content:attr(data-code);position:absolute;top:-4px;right:-3px;font-size:8px;line-height:10px;background:#10202e;color:#d9e5e9;padding:0 1px;border-radius:2px}
.stage[data-state=paused] .blessing-badge{pointer-events:auto}
