/* Sanctuary is a live Oracle surface. Only the orchard and engraved emblems are art. */
.app { padding-bottom: max(106px, 7.5rem, calc(94px + env(safe-area-inset-bottom, 0px))); }

.app-dock { position: fixed; z-index: 40; left: 50%; bottom: 0; width: min(100%, 660px); padding: 7px max(8px, env(safe-area-inset-right, 0px)) max(8px, env(safe-area-inset-bottom, 0px)) max(8px, env(safe-area-inset-left, 0px)); transform: translateX(-50%); color: #dfcebb; }
/* Canonical Kaeris rail: geometry, texture and motion shared by every world. */
.app-dock-rail {
  --dock-tint:#211f22ab; --dock-edge:#a99b896b;
  --dock-light:#d4c4b0; --dock-glow:#b6a18b; --dock-wash:#b6a18b35; --dock-halo:#b6a18ba6; --dock-icon:#f0e2d1;
  position:relative; isolation:isolate; display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr)); min-height:70px; padding:4px;
  border:1px solid var(--dock-edge); border-radius:19px;
  background:linear-gradient(125deg,var(--dock-tint),#09090edd 58%),url('../assets/kaeris-cinema/glass-material.webp') center/560px;
  background-color:#08060deb;
  box-shadow:inset 0 1px #eedee221,inset 0 0 0 1px #000a,0 8px 25px #0005;
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
}
.app-dock-rail[data-dock-theme="kaeris"] { --dock-tint:#211826ab; --dock-edge:#a98c766b; --dock-light:#d1a0f1; --dock-glow:#bd78ef; --dock-wash:#b568ed35; --dock-halo:#b566e3a6; --dock-icon:#eac4ff; }
.app-dock-rail[data-dock-theme="eva"] { --dock-tint:#26251aab; --dock-edge:#b29d6d6b; --dock-light:#e7ca8e; --dock-glow:#d0ae63; --dock-wash:#c4a25b35; --dock-halo:#c4a25ba6; --dock-icon:#f6e4ba; }
.app-dock-rail[data-dock-theme="via"] { --dock-tint:#19232bab; --dock-edge:#94aab86b; --dock-light:#b8dff1; --dock-glow:#91c4e0; --dock-wash:#85bad635; --dock-halo:#85bad6a6; --dock-icon:#d9f1ff; }
.app-dock-rail[data-dock-theme="aeri"] { --dock-tint:#291c24ab; --dock-edge:#b18e9a6b; --dock-light:#eeb3ca; --dock-glow:#d78eae; --dock-wash:#d78eae35; --dock-halo:#d78eaea6; --dock-icon:#ffdae9; }
.app-dock-rail[data-dock-theme="noira"] { --dock-tint:#29191bab; --dock-edge:#b0846c6b; --dock-light:#dfa886; --dock-glow:#c18165; --dock-wash:#ab5a5135; --dock-halo:#b46e56a6; --dock-icon:#f3c9ae; }
.app-dock-rail::before,
.app-dock-rail::after { content: ''; position: absolute; pointer-events: none; border-radius: inherit; }
.app-dock-rail::before {
  inset: 1px;
  background: url('../assets/kaeris-cinema/glass-material.webp') center / 500px;
  opacity: .35;
}
.app-dock-rail::after {
  inset: 1px 10px auto;
  height: 1px;
  background: linear-gradient(90deg,transparent,#e9d9c05c 18%,#f4e6d8a6 50%,#e9d9c05c 82%,transparent);
  opacity: .72;
}
.app-dock-link { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; min-width: 0; min-height: 60px; border: 1px solid transparent; border-radius: 13px; color: #d0bfae; text-decoration: none; font-size: clamp(.72rem,2.7vw,.9rem); letter-spacing: .085em; line-height: 1.1; text-transform: uppercase; transition: color .2s, background .2s, transform .15s; }
.app-dock-link svg { width:27px; height:27px; stroke:currentColor; fill:none; stroke-width:1.25; flex-shrink:0; }
.app-dock-link span { max-width:100%; overflow-wrap:anywhere; text-align:center; }
.app-dock-link[aria-current='page'] { color:#f6e7d7; border-color:transparent; background:radial-gradient(ellipse at 50% 105%,var(--dock-wash),transparent 65%); box-shadow:none; }
.app-dock-link[aria-current='page']::before { content:''; position:absolute; bottom:-5px; left:24%; right:24%; height:2px; pointer-events:none; background:var(--dock-light); box-shadow:0 0 15px 3px var(--dock-halo); opacity:.58; animation:dock-edge-glint .22s ease-out both; }
.app-dock-link[aria-current='page'] svg { filter:drop-shadow(0 0 5px var(--dock-glow)); color:var(--dock-icon); }
.app-dock-link:hover { color:#f5e6d3; background-color:#a6879030; }
.app-dock-link:active { transform: translateY(1px); }
.app-dock-link:focus-visible { z-index:2; outline:2px solid var(--dock-light); outline-offset:2px; }
@keyframes dock-edge-glint { from { opacity:.1; transform:scaleX(.35); } 55% { opacity:1; } to { opacity:.58; transform:scaleX(1); } }

/* Persona atmosphere stays beneath the same live icons and labels. */
.app-dock-rail[data-dock-theme="eva"] { --dock-light:#ffda79; --dock-glow:#ffc247; --dock-wash:#efb84445; --dock-halo:#eeb13ca6; --dock-icon:#fff0bd; }
.app-dock-rail[data-dock-theme="eva"]::after { inset:1px; height:auto; background:radial-gradient(ellipse at 50% 125%,#ffc24732,transparent 68%),linear-gradient(90deg,transparent,#ffe6a957,transparent) top/100% 1px no-repeat; animation:dock-sunlight 7s ease-in-out infinite alternate; }
.app-dock-rail[data-dock-theme="via"]::before { background:url('../assets/oracle/tab-frost-v1.png') center/cover no-repeat,url('../assets/kaeris-cinema/glass-material.webp') center/500px; opacity:.3; filter:grayscale(.8); }
.app-dock-rail[data-dock-theme="via"]::after { background:linear-gradient(90deg,transparent,#c8efff80 18%,#e9faffcc 50%,#c8efff80 82%,transparent); }
.app-dock-rail[data-dock-theme="noira"]::after { inset:2px; height:auto; background:radial-gradient(ellipse at 18% 85%,#c0a9a02b,transparent 40%),radial-gradient(ellipse at 72% 25%,#b4a6a323,transparent 45%),radial-gradient(ellipse at 48% 70%,#8c6b7020,transparent 40%); background-size:145% 150%; filter:blur(5px); animation:dock-smoke 12s ease-in-out infinite alternate; }
.app-dock-rail[data-dock-theme="aeri"]::after { inset:1px; height:auto; background:radial-gradient(ellipse at 20% 110%,#f295be28,transparent 48%),radial-gradient(ellipse at 85% 0%,#ef71931c,transparent 45%); animation:dock-rose-neon 4.8s ease-in-out infinite; }
@keyframes dock-sunlight { from {opacity:.45} to {opacity:.85} }
@keyframes dock-smoke { from {background-position:0% 65%;opacity:.35} to {background-position:100% 35%;opacity:.7} }
@keyframes dock-rose-neon { 0%,100% {opacity:.4} 45% {opacity:.8} 65% {opacity:.55} }
body[data-cinema-still="true"] .app-dock-rail::after { animation:none; }
@media(prefers-reduced-motion:reduce) { .app-dock-rail::after {animation:none!important;} }

.sanctuary-app { --sanctuary-red:#ce5559; --sanctuary-metal:#b39469; }
.sanctuary-shell { container-type:inline-size; border:1px solid #78644e9c; background:#09080b url('../assets/textures/velvet.webp') center / 500px; }
.sanctuary-shell::after { opacity:.39; }
.sanctuary-composition { position:relative; isolation:isolate; }
.sanctuary-hero { position:relative; min-height:clamp(460px,94cqw,605px); padding:0 6.3% 64px; }
.sanctuary-scene { position:absolute; inset:0; z-index:-1; overflow:hidden; pointer-events:none; background:#090707; }
.sanctuary-scene img,.sanctuary-scene .ambient-video { position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:cover; object-position:72% 50%; }
.sanctuary-scene .ambient-video { opacity:0; transition:opacity .4s ease-out; }
.sanctuary-scene.is-playing .ambient-video { opacity:1; }
.sanctuary-scene::after { content:''; position:absolute; inset:0; background:linear-gradient(90deg,#0706097a,transparent 64%); }
.sanctuary-header { position:relative; z-index:4; display:grid; grid-template-columns:1fr auto 1fr; align-items:start; gap:8px; padding-top:20px; color:#d6c6ad; }
.sanctuary-close { display:flex; align-items:center; gap:5px; width:max-content; min-height:44px; padding:0; border:0; background:none; color:inherit; font-size:1.05rem; letter-spacing:.17em; }
.sanctuary-close:hover { color:#fff0d8; }
.sanctuary-heading { display:grid; justify-items:center; gap:1px; white-space:nowrap; text-align:center; }
.sanctuary-heading span:first-child { font-size:clamp(1.5rem,5cqw,2.15rem); letter-spacing:.38em; line-height:1.1; margin-right:-.38em; }
.sanctuary-heading span:last-child { color:#dd6464; font-size:clamp(.72rem,2.5cqw,.92rem); letter-spacing:.36em; margin-right:-.36em; }
.sanctuary-header-mark { justify-self:end; color:#bb8b5b; font-size:1.25rem; padding:8px 0; }
.sanctuary-identity { position:relative; z-index:4; margin-top:clamp(62px,19cqw,120px); text-shadow:0 2px 12px #000; }
.sanctuary-profile-copy { width:52%; min-width:0; }
.sanctuary-overline { margin:0 0 8px; color:#dfccb0; font-size:clamp(.7rem,2.4cqw,.9rem); line-height:1.35; letter-spacing:.15em; }
.sanctuary-profile-copy h1 { margin:0; font-weight:400; color:#f2e7d4; font-size:clamp(4rem,13.5cqw,5.7rem); line-height:.88; letter-spacing:.025em; }
.sanctuary-preview { box-sizing:border-box; width:max-content; max-width:100%; margin:8px 0 0; padding:2px 7px; border:1px solid #ac8c6d72; color:#d7c4a9; background:#0b090a99; font-size:.65rem; letter-spacing:.12em; }
.sanctuary-mortal { margin:19px 0 8px; color:var(--sanctuary-red); font-size:clamp(1.75rem,5.3cqw,2.45rem); line-height:1; letter-spacing:.13em; white-space:nowrap; }
.sanctuary-mortal span { font-size:.65em; }
.sanctuary-rank-line { display:flex; align-items:baseline; gap:10px; margin:0; color:#deceb6; font-size:.8rem; letter-spacing:.22em; }
.sanctuary-rank-line span:last-child { font-size:1.15rem; }
.sanctuary-profile-copy blockquote { margin:12px 0 20px; color:#d7c8b6; font-size:clamp(1.1rem,3.6cqw,1.5rem); font-style:italic; line-height:1.2; }
.sanctuary-ascend { display:inline-flex; align-items:center; flex-wrap:wrap; box-sizing:border-box; max-width:100%; gap:8px; min-height:44px; padding:7px 12px; border:1px solid #a5484a8c; border-radius:5px; background:linear-gradient(100deg,#310f16bb,#120b0dcc); color:#ead7bc; font-size:1.05rem; letter-spacing:.08em; }
.sanctuary-ascend > span { color:#c84c48; }
.sanctuary-ascend small { margin-left:3px; color:#dba890; font-size:.58rem; letter-spacing:.05em; }

/* Both root passes share the same dimensions and anchor. The metal rail lies between them. */
.sanctuary-essence-anchor { position:relative; isolation:isolate; margin:0 3.3%; --root-width:107.1%; }
.sanctuary-root { position:absolute; width:var(--root-width); height:auto; right:-3.55%; top:0; transform:translateY(calc(-1 * var(--root-anchor))); pointer-events:none; opacity:0; }
.sanctuary-essence-anchor.roots-ready .sanctuary-root { opacity:1; }
.sanctuary-root-rear { z-index:0; }
.sanctuary-root-shadow { z-index:3; }
.sanctuary-root-front { z-index:4; }
.sanctuary-essence { --oracle-opacity:.8; position:relative; z-index:1; padding:22px 4.2% 14px; border-radius:14px; background:#0b090bf5 url('../assets/textures/velvet.webp') center / 500px; background-blend-mode:multiply; }
.sanctuary-essence h2 { position:relative; z-index:6; margin:0 0 7px; color:#e5d2bd; font-size:1.25rem; font-weight:400; letter-spacing:.34em; }
.essence-resource { position:relative; z-index:6; display:grid; grid-template-columns:58px minmax(0,1fr) auto; align-items:center; gap:15px; min-height:88px; padding-block:8px; border-bottom:1px solid #9b745455; text-decoration:none; }
.essence-resource:last-of-type { border-bottom:0; }
.essence-resource-link:focus-visible { outline:2px solid var(--dock-light); outline-offset:3px; border-radius:5px; }
.essence-resource-link:hover .resource-copy strong { color:#fff0d8; }
.resource-medallion { display:grid; place-items:center; width:58px; height:58px; border:1px solid #8e735d79; border-radius:50%; box-shadow:inset 0 0 0 5px #0b080a,inset 0 0 0 6px #99714b3c; }
.blood-emblem { display:block; width:auto; height:42px; object-fit:contain; pointer-events:none; }
.resource-heat img { width:30px; height:34px; object-fit:contain; filter:drop-shadow(0 0 5px #d84c2a); }
.resource-copy { display:grid; min-width:0; gap:1px; }
.resource-copy strong { color:#efe2d0; font-size:clamp(1.32rem,4cqw,1.75rem); font-weight:400; letter-spacing:.09em; }
.resource-copy small { max-width:17rem; color:#cbbbA7; font-size:clamp(.9rem,2.6cqw,1.08rem); line-height:1.15; }
.resource-value { justify-self:end; text-align:right; white-space:nowrap; }
.resource-soon { color:#d2b798; font-size:clamp(.66rem,2cqw,.84rem); letter-spacing:.08em; }
.resource-heat-balance { color:#e96865; font-size:clamp(1.35rem,4.5cqw,2rem); letter-spacing:.09em; font-variant-numeric:tabular-nums; }
.sanctuary-body { position:relative; display:grid; gap:18px; padding:28px 3.3% 27px; }
.sanctuary-body h2,.sanctuary-body h3 { font-weight:400; }

.sanctuary-pact { --oracle-opacity:.36; display:grid; grid-template-columns:clamp(96px,24%,150px) minmax(0,1fr) 36px; align-items:center; gap:clamp(9px,2.8vw,22px); min-height:145px; overflow:hidden; padding:14px clamp(13px,3vw,22px) 14px 4px; border-radius:12px; background:linear-gradient(90deg,#160e10,#0b090bf5 70%); }
.sanctuary-pact > img { width:100%; height:122px; object-fit:cover; object-position:50% 52%; mask-image:linear-gradient(90deg,#000 64%,transparent),linear-gradient(0deg,transparent,#000 14% 86%,transparent); mask-composite:intersect; }
.sanctuary-pact h2 { margin:0; color:#d9585b; font-size:clamp(1.25rem,4.5vw,1.9rem); letter-spacing:.12em; line-height:1; }
.sanctuary-pact p { margin:4px 0; color:#c1ac98; font-size:clamp(.94rem,3vw,1.18rem); }
.sanctuary-pact div > span { color:#bd8e78; font-size:.71rem; letter-spacing:.15em; }
.pact-orbit { display:grid; place-items:center; width:35px; height:35px; border:1px solid #b74041b8; border-radius:50%; color:#d85050; font-size:1.55rem; line-height:1; box-shadow:0 0 13px #9e1c2740; }

.sanctuary-settings { display:grid; gap:6px; }
.sanctuary-settings > h2 { margin:3px 0 4px; color:#bda78b; font-size:.86rem; letter-spacing:.34em; text-align:center; }
.sanctuary-setting { --oracle-opacity:.27; display:grid; grid-template-columns:65px minmax(0,1fr) auto; align-items:center; gap:13px; min-height:91px; padding:9px 18px 9px 9px; border-radius:9px; background:linear-gradient(90deg,#111013e8,#0a090af5); }
.sanctuary-setting > img { display:block; width:62px; height:62px; object-fit:contain; padding:4px; background:url('../assets/sanctuary/rank-ring-v1.webp') center / contain no-repeat; filter:sepia(.18) brightness(.95); }
.sanctuary-setting h3 { margin:0; color:#e5d5bf; font-size:clamp(1.1rem,3.5vw,1.5rem); letter-spacing:.045em; line-height:1; }
.sanctuary-setting p { margin:3px 0 0; color:#b9a895; font-size:clamp(.87rem,2.65vw,1.02rem); line-height:1.08; }
.sanctuary-setting > span { color:#ac8873; font-size:.66rem; letter-spacing:.07em; white-space:nowrap; }
.sanctuary-setting-control { width:100%; border:0; color:inherit; font:inherit; text-align:left; cursor:pointer; }
.sanctuary-setting-control > span:not(:last-child) { white-space:normal; letter-spacing:normal; }
.sanctuary-setting-label { display:block; color:#e5d5bf; font-size:clamp(1.1rem,3.5vw,1.5rem); letter-spacing:.045em; line-height:1; }
.sanctuary-setting-description { display:block; margin-top:3px; color:#b9a895; font-size:clamp(.87rem,2.65vw,1.02rem); line-height:1.2; }
.sanctuary-setting-control:focus-visible { outline:2px solid var(--character-focus,#edb990); outline-offset:3px; }

@container (max-width:430px) {
 .sanctuary-hero { padding-inline:6%; padding-bottom:58px; }
 .sanctuary-header { padding-top:17px; }
 .sanctuary-close { font-size:.83rem; letter-spacing:.09em; }
 .sanctuary-header-mark { font-size:1rem; }
 .sanctuary-profile-copy { width:61%; }
 .sanctuary-overline { max-width:15rem; }
 .sanctuary-mortal { font-size:clamp(1.65rem,6cqw,1.9rem); letter-spacing:.12em; }
 .sanctuary-profile-copy blockquote { max-width:12rem; }
 .sanctuary-ascend { padding:7px 9px; gap:6px; font-size:.94rem; }
 .sanctuary-ascend small { font-size:.54rem; margin-left:0; }
 .sanctuary-essence { padding-top:20px; }
 .essence-resource { grid-template-columns:46px minmax(0,1fr) auto; gap:10px; min-height:92px; }
 .resource-medallion { width:45px; height:45px; }
 .resource-heat img { width:26px; height:30px; }
 .blood-emblem { height:32px; }
 .resource-copy strong { font-size:1.28rem; }
 .resource-copy small { font-size:.88rem; }
 .resource-value { max-width:6rem; white-space:normal; }
 .resource-heat-balance { font-size:1.45rem; letter-spacing:.04em; overflow-wrap:anywhere; }
 .sanctuary-setting { grid-template-columns:52px minmax(0,1fr); gap:8px; padding-right:11px; }
 .sanctuary-setting > img { width:50px; height:50px; }
 .sanctuary-setting > span { grid-column:2; margin-top:-6px; }
}
@container (max-width:340px) {
 .sanctuary-header { grid-template-columns:1fr auto; }
 .sanctuary-header-mark { display:none; }
 .sanctuary-heading span:first-child { font-size:1.4rem; }
 .sanctuary-heading span:last-child { font-size:.66rem; }
 .sanctuary-profile-copy { width:69%; }
 .sanctuary-mortal { font-size:1.7rem; letter-spacing:.09em; }
 .essence-resource { grid-template-columns:43px minmax(0,1fr); gap:5px 10px; }
 .resource-value { grid-column:2; margin-bottom:5px; }
 .sanctuary-pact { grid-template-columns:75px minmax(0,1fr) 25px; gap:5px; }
 .pact-orbit { width:25px; height:25px; font-size:1.1rem; }
}
@media (max-width:350px) {
 .app-dock-link { letter-spacing:.02em; }

}
/* A rem-based query responds to enlarged type without shrinking body copy. */
@container (max-width:18rem) {
 .sanctuary-header { grid-template-columns:1fr auto; grid-template-areas:'close mark' 'heading heading'; row-gap:12px; }
 .sanctuary-close { grid-area:close; }
 .sanctuary-heading { grid-area:heading; }
 .sanctuary-header-mark { grid-area:mark; }
 .sanctuary-profile-copy { width:100%; }
 .sanctuary-profile-copy h1 { font-size:3.5rem; }
 .sanctuary-mortal { white-space:normal; overflow-wrap:anywhere; }
 .sanctuary-scene::after { background:linear-gradient(90deg,#070609c9,#07060980 72%,transparent); }
 .essence-resource { grid-template-columns:46px minmax(0,1fr); gap:8px 10px; }
 .resource-value { grid-column:2; max-width:100%; }
 .resource-copy small { overflow-wrap:anywhere; }
 .pact-orbit { font-size:24px; }
}
@media (min-width:760px) { .app-dock { bottom:12px; } }
@media (prefers-reduced-motion:reduce) {
 .sanctuary-scene *, .app-dock-link, .app-dock-link::before { animation:none !important; transition:none !important; }
}
@media (prefers-reduced-transparency:reduce) {
 .app-dock-rail { background:linear-gradient(180deg,#211b20,#0b0a0e); -webkit-backdrop-filter:none; backdrop-filter:none; }
}
@media (prefers-contrast:more) {
 .sanctuary-shell,.sanctuary-essence,.sanctuary-pact,.sanctuary-setting,.app-dock-rail { border-color:#e2bea0; }
 .app-dock-rail { background:linear-gradient(180deg,#211b20,#09080c); -webkit-backdrop-filter:none; backdrop-filter:none; }
 .app-dock-link { color:#f3e4d1; }
 .app-dock-link[aria-current='page'] { border-color:#f6dec0; background:#322331; }
 .sanctuary-scene::after { background:linear-gradient(90deg,#050407ef,#050407c9 65%,#0504075c),linear-gradient(0deg,#050407,transparent 55%); }
 .sanctuary-setting > span,.resource-soon,.sanctuary-preview { color:#f1d4b7; }
}
@media (forced-colors:active) {
 .app-dock-rail { background:Canvas; border-color:CanvasText; box-shadow:none; -webkit-backdrop-filter:none; backdrop-filter:none; }
 .app-dock-rail::before,.app-dock-rail::after,.app-dock-link[aria-current='page']::after { display:none; }
 .app-dock-link { color:CanvasText; }
 .app-dock-link[aria-current='page'] { color:HighlightText; background:Highlight; border-color:Highlight; box-shadow:none; }
 .app-dock-link:focus-visible { outline-color:Highlight; }
}

/* Connected-mode dock layout (moved from application.css, W3-6 fix pass): sanctuary.css is the one
 * stylesheet that styles the canonical rail. Four columns; tighter tracking on narrow phones; a 2×2
 * rail when enlarged text cannot fit one row. */
.application-connected .app-dock-rail { grid-template-columns:repeat(4,minmax(0,1fr)); }
.application-connected .app-dock { container-type:inline-size; container-name:app-dock; }
@media (max-width:360px) { .application-connected .app-dock-link { letter-spacing:.04em; } }
@container app-dock (max-width:18.5rem) {
 .application-connected .app-dock-rail { grid-template-columns:repeat(2,minmax(0,1fr)); gap:2px; }
 .application-connected .app-dock-link { letter-spacing:.04em; }
 .application-connected .app-dock-link span { overflow-wrap:normal; }
}