@font-face{font-family:'Homemade Apple';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/HomemadeApple-Regular.woff2) format('woff2')}
:root{color-scheme:dark;--bg:#0c1717;--panel:#122321;--line:#354840;--ink:#e5e5d4;--muted:#a4b7ab;--gold:#d5b777;--mint:#a9dac0}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% 0,#274139 0,transparent 65%),var(--bg);color:var(--ink);font:16px/1.5 Georgia,serif}button,select{font:14px/1.4 system-ui;min-height:44px;border:1px solid #60715d;background:#1d352f;color:var(--ink);border-radius:3px;padding:10px 14px;cursor:pointer}button:hover:not(:disabled){background:#324b3f;border-color:var(--gold)}button:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--gold);outline-offset:3px}button:disabled{opacity:.4;cursor:default}button.primary{background:var(--gold);color:#142521;font-weight:700}header{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 3vw;border-bottom:1px solid var(--line)}.brand{font-size:22px;letter-spacing:2px;color:var(--gold);text-decoration:none}.edition,.casebar,.eyebrow,h2,small,.scene-caption,.turn,#wallet,.dice-key,footer,.stats,.tag{font-family:system-ui;font-size:12px;letter-spacing:1.5px}#wallet{font-size:16px;color:var(--gold)}.casebar{display:flex;justify-content:space-between;padding:12px 3vw;color:var(--muted);border-bottom:1px solid var(--line)}main{max-width:1600px;margin:auto;display:grid;grid-template-columns:minmax(220px,1fr) minmax(380px,2.25fr) minmax(220px,1fr);gap:26px;padding:28px 3vw}h2{font-size:13px;color:var(--muted);margin:0 0 18px;display:flex;justify-content:space-between}h1{font-size:clamp(34px,3.5vw,56px);line-height:1.04;font-weight:400;margin:16px 0 22px;color:#f0e4c7}h3{font-size:21px;font-weight:400;margin:7px 0 14px}p{margin:12px 0}.scene{position:relative;height:235px;overflow:hidden;border:1px solid var(--line)}.scene img{width:100%;height:100%;object-fit:cover;object-position:center 45%}.scene-caption{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,#071512);padding:35px 16px 10px;color:#d4ddcd;display:flex;justify-content:space-between}.story{padding:25px 0}.eyebrow{color:var(--gold)}#narrative{color:#c4d0c4}.objective{border-left:2px solid var(--gold);padding:10px 16px;margin:22px 0;background:#ffffff04}.turn{color:var(--mint);font-size:14px;letter-spacing:.5px;margin:15px 0}.choices{display:grid;gap:10px}.choices button{text-align:left;display:block;width:100%;font-size:16px}.choices button small{display:block;color:inherit;opacity:.8;font-size:13px;letter-spacing:0;margin-top:4px}#report{margin:18px 0 0;color:var(--gold);min-height:48px;font-size:16px}.card{background:linear-gradient(125deg,#20352e,#10221f);border:1px solid var(--line);padding:18px;margin-bottom:16px;position:relative;transition:border-color .2s,opacity .2s}.card.selected{border-color:var(--gold);box-shadow:inset 3px 0 var(--gold)}.card.down{opacity:.5}.card h3{margin:6px 0}.card .tag{color:var(--gold)}.monogram{float:right;font-size:32px;color:#829e83;opacity:.6}.card p{color:var(--muted);font-size:14px}.stats{display:flex;justify-content:space-between;letter-spacing:0;font-size:14px;margin:10px 0 5px}.bar{height:5px;background:#081513;margin-bottom:12px}.bar i{display:block;height:100%;background:#8fb49a;transition:width .4s}.enemy .bar i{background:#bc906f}.card button{width:100%;margin-top:8px}.vacant{border:1px dashed #45564a;padding:24px;text-align:center;color:#8ca092}.vacant>span{display:block;font-size:30px;margin-bottom:10px}.vacant p{font-size:14px}.case-note{margin:28px 0;padding:20px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.case-note p{font-style:italic;font-size:21px}.case-note span{font-size:14px;color:var(--muted)}.resolution{border-top:1px solid var(--line);padding-top:22px}.tray-heading{display:flex;justify-content:space-between;gap:16px;align-items:center}.dice-key{font-size:12px;color:var(--mint);letter-spacing:0}.tray{position:relative;background:radial-gradient(ellipse,#254739,#10281f);border:7px solid #3c3c2c;outline:1px solid #746243;box-shadow:inset 0 0 40px #0009;height:240px}#dice{width:100%;height:200px;display:block}#trayNote,#diceResult{text-align:center;font:12px system-ui;letter-spacing:1px;color:#c4cbb0}#diceResult{font-size:14px;color:var(--gold);margin-top:5px}#bag,.rules{margin-top:24px;padding:18px;border:1px solid var(--line)}#bag:empty{display:none}.item{padding:14px 0;border-bottom:1px solid var(--line)}.item:last-child{border-bottom:0}.item p{color:var(--muted);font-size:14px}.item button{margin:4px 5px 0 0}.item select{max-width:100%;margin:4px 0}.rules summary{cursor:pointer;color:var(--gold)}.rules p{color:var(--muted)}#log{padding-left:22px;color:var(--muted);font-size:14px}#log li{margin:0 0 12px}footer{padding:22px 3vw;display:flex;justify-content:space-between;align-items:center;gap:16px;border-top:1px solid var(--line);color:var(--muted)}footer button{margin:4px}dialog{max-width:440px;background:#172c26;color:var(--ink);border:1px solid var(--gold);padding:28px}dialog::backdrop{background:#000b}.pulse{animation:pulse .6s}@keyframes pulse{50%{box-shadow:0 0 28px #bad8a8;border-color:#e3d39e}}.reduced *{animation:none!important;scroll-behavior:auto!important}.reduced .portrait-haze:before{animation:none!important}@media(max-width:1100px){main{gap:16px;grid-template-columns:210px minmax(300px,1fr) 200px;padding:22px 18px}.card{padding:13px}.edition{display:none}}@media(max-width:800px){header{flex-wrap:wrap;gap:8px;padding:16px}.brand{font-size:17px}.casebar{font-size:10px;gap:12px}main{grid-template-columns:1fr;display:flex;flex-direction:column;padding:18px 14px}.crew{order:1}.crew #crew{display:grid;grid-template-columns:1fr 1fr;gap:10px}.crew .card{margin:0}.vacant{margin-top:10px;padding:10px;display:flex;justify-content:center;gap:12px;align-items:center}.vacant>span{font-size:16px;margin:0}.vacant p{display:none}article{order:3}.hostiles{order:2}#enemies{display:grid;grid-template-columns:1fr 1fr;gap:10px}.hostiles h2{margin:10px 0}.case-note,#log,.hostiles h2:last-of-type{display:none}.scene{height:180px}.scene-caption{font-size:10px}.story{padding-top:20px}h1{font-size:40px}.card h3{font-size:19px}.monogram{display:none}.card p{font-size:13px}.stats{font-size:13px}.tag{font-size:10px;letter-spacing:.7px}footer{flex-direction:column;text-align:center}.tray-heading{gap:8px}.tray-heading h3{font-size:18px}}@media(max-width:370px){.crew #crew,#enemies{grid-template-columns:1fr}.brand{font-size:15px}}
/* Paired character sheets: stable left/right positions at every width. */
main{display:block;max-width:1060px;padding:24px clamp(10px,3vw,36px)}main>article{max-width:850px;margin:36px auto 0}.battlefield{width:100%;min-width:0}.hp-hud{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(12px,3vw,32px);padding:16px;background:#10211ef5;border:1px solid #5b6b57;position:sticky;top:0;z-index:5;backdrop-filter:blur(12px)}.hp-hud h2{margin:0 0 8px;color:var(--mint);font-size:13px}.hp-hud .enemy h2{color:#dbaa7b}.hud-unit{display:flex;justify-content:space-between;gap:6px;font:14px/1.5 system-ui}.hud-unit span{min-width:0;overflow-wrap:anywhere}.hud-unit b{white-space:nowrap}.hp-hud .bar{height:3px;margin:4px 0 7px}.roster-heading{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:20px 0 8px}.roster-heading h2{margin:0}.roster{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;align-items:stretch}.roster .character-sheet{padding:0;margin:0;border:1px solid #6c9787;display:flex;flex-direction:column;min-width:0;overflow:hidden}.roster .enemy{border-color:#a27c58}.roster .card.selected{border-color:#b9e9d6;box-shadow:0 0 0 1px #b9e9d660}.roster .enemy.selected{border-color:#e7ae7c;box-shadow:0 0 0 1px #e7ae7c60}.sheet-ribbon{display:flex;justify-content:space-between;gap:6px;padding:12px 16px;font:13px/1.4 system-ui;letter-spacing:1px;background:#b9cbb4;color:#192e25}.enemy .sheet-ribbon{background:#b99a78;color:#2c231d}.portrait-slot{min-height:145px;height:clamp(145px,23vw,230px);display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(ellipse,#36574a,#132a24);border-bottom:1px solid #557162;color:#b7cebf}.portrait-slot>span{font-size:clamp(40px,6vw,70px);line-height:1.2;letter-spacing:8px}.portrait-slot small{font:12px system-ui;letter-spacing:1px;margin-top:12px;color:#afc3b7}.enemy .portrait-slot{background:radial-gradient(ellipse,#4d4031,#282a22);color:#d3b494;border-color:#776044}.sheet-body{padding:20px;flex:1}.roster .tag{font-size:12px;letter-spacing:1px;color:var(--muted)}.roster h3{font-size:clamp(22px,3.2vw,34px);overflow-wrap:anywhere;margin:8px 0 20px}.roster .stats{font:16px/1.5 system-ui;gap:6px;flex-wrap:wrap}.roster .bar{height:7px;margin:8px 0 18px}.roster .ward i{background:#aebdcf}.roster .armour i{background:#99846b}.roster p{font:16px/1.5 system-ui;overflow-wrap:anywhere}.sheet-equipment{border-top:1px solid var(--line);margin-top:28px;padding-top:18px}.sheet-equipment .eyebrow{font-size:12px;letter-spacing:1px}.sheet-controls{border-top:1px solid var(--line)}.sheet-controls>button{margin:0;width:100%;border:0;border-radius:0;background:#34534570;min-height:52px;color:var(--mint);font-weight:bold}.enemy .sheet-controls>button{background:#60402a70;color:#ebba8f}.skill-block{padding:18px 20px}.skill-block>b{font:600 16px system-ui}.skill-block p{margin:10px 0}.skill-block button{margin:8px 0 0}.empty-sheet{border:1px dashed #547263;min-height:200px;display:flex;flex-direction:column;min-width:0}.empty-sheet.enemy{border-color:#80694f}.empty-sheet .sheet-ribbon{opacity:.6}.empty-content{padding:18px;text-align:center;color:var(--muted)}.empty-content>span{font-size:32px}.empty-content h3{font-size:22px;margin:0}.empty-content p{font-size:14px}.to-actions{display:block;text-align:center;margin-top:16px;color:var(--gold);padding:12px;border:1px solid var(--line);font:16px system-ui}#choices{scroll-margin-top:150px}.encounter-record{max-width:850px;margin:26px auto}.encounter-record #log{display:block}.encounter-record h2{display:block}@media(max-width:800px){main{display:block;padding:16px 10px}.roster{gap:10px}.sheet-ribbon{padding:10px 8px;font-size:12px;letter-spacing:.2px}.sheet-body{padding:14px 10px}.skill-block{padding:14px 10px}.roster .stats{font-size:14px}.roster .tag{font-size:12px;letter-spacing:.3px}.roster h3{font-size:25px}.roster p{font-size:14px}.roster .card button{font-size:14px;padding:10px 7px}.hp-hud{padding:10px;gap:12px}.hud-unit{font-size:12px}.hp-hud h2{font-size:12px}.roster-heading h2{font-size:12px;letter-spacing:.6px}.portrait-slot{height:150px;min-height:150px}.portrait-slot small{font-size:12px;letter-spacing:0}.sheet-equipment{margin-top:22px}.empty-content{padding:16px 8px}.empty-content h3{font-size:20px}.roster .sheet-controls>button{margin:0}.scene{height:200px}}

.skill-charge{height:7px!important;background:#081513}.skill-charge i{background:var(--gold);transition:width .3s}.roster{grid-auto-flow:row}.skill-block .stats b{font-size:14px}
/* Harbour campaign */
[hidden]{display:none!important}header{justify-content:center;text-align:center;padding:26px 12px 23px}.brand{display:flex;flex-direction:column;font-size:clamp(28px,5.5vw,54px);line-height:1.15;letter-spacing:3px;color:#e2c990}.brand-small{font:12px system-ui;letter-spacing:4px;margin-bottom:12px;color:var(--muted)}main{max-width:1050px}.map-intro{max-width:650px;margin:0 auto 26px;text-align:center}.map-intro h1{font-size:clamp(40px,6vw,68px);margin:16px 0}.map-intro p{color:var(--muted);max-width:540px;margin:auto}.map-intro em{color:var(--gold)}.route-map{height:700px;position:relative;isolation:isolate;border:1px solid #7b7658;border-radius:4px;overflow:hidden;background:linear-gradient(#10221c30,#0a1b1999),url('harbour-map.webp') center/cover;box-shadow:inset 0 0 75px #000b}.route-map:after{content:'';position:absolute;inset:0;box-shadow:inset 0 0 75px #081813;pointer-events:none;z-index:-1}#mapPaths,#mapNodes{position:absolute;inset:0;width:100%;height:100%}#mapPaths{overflow:visible}#mapPaths path{fill:none;stroke:#d0c19e;stroke-width:.45;stroke-dasharray:1.1 1.2;opacity:.65;vector-effect:non-scaling-stroke;stroke-width:3px}#mapPaths .available-path{stroke:#fff0b6;opacity:1;stroke-width:4px}#mapPaths .travelled{stroke:#8bd3b1;stroke-dasharray:none;opacity:.9}.map-node{position:absolute;transform:translate(-50%,-50%);width:165px;min-height:92px;display:flex;align-items:center;flex-direction:column;justify-content:center;background:#102620ed;border:1px solid #ac9e78;box-shadow:0 6px 20px #0009;text-align:center;padding:8px 10px;transition:filter .3s,box-shadow .3s}.map-node>span{font-size:25px;line-height:1.1;color:var(--gold)}.map-node b{font:18px Georgia,serif;margin:4px 0}.map-node small{font:10px system-ui;letter-spacing:1px;color:#c3cdbd}.map-node:disabled{opacity:.72;filter:saturate(.4);background:#142520e8}.map-node.available{border:2px solid #ecd28b;box-shadow:0 0 22px #c8b66b35,0 8px 18px #000a}.map-node.visited{border-color:#85baa0}/* a visited place you can travel back to (a shop, or a cleared location next door): calm green, no glow, so it never looks like the current location */.map-node.available.visited{border:1px solid #85baa0;box-shadow:0 6px 20px #0009}.map-node.boss{background:#31252ce8}.map-key{display:flex;justify-content:center;flex-wrap:wrap;gap:18px;font:13px system-ui;color:var(--muted);margin:18px 0}#mapStatus{text-align:center;color:var(--gold)}.encounter-intro{margin-bottom:26px}.encounter-intro .scene{height:270px}.encounter-intro .story{max-width:850px;margin:auto;padding-bottom:0}.encounter-intro h1{font-size:clamp(36px,5vw,56px)}.action-area{max-width:850px;margin:26px auto}.resolution{max-width:850px;margin:0 auto 25px}.tray{background:linear-gradient(#112d2220,#112d2230),url('occult-felt.webp') center 38%/cover;height:260px;overflow:hidden}#dice{height:210px;position:relative;z-index:1}#trayNote,#diceResult{position:relative;z-index:1}.hp-hud{position:relative;top:auto;backdrop-filter:none}.character-sheet{scroll-margin-top:12px}.portrait-slot{position:relative;height:220px;min-height:0;overflow:hidden;background:#132720}.portrait-slot img{height:100%;width:100%;object-fit:cover;object-position:center 36%;display:block;animation:portraitBreath 6s ease-in-out infinite;transform-origin:50% 75%}.portrait-haze{position:absolute;inset:0;pointer-events:none;overflow:hidden;box-shadow:inset 0 -30px 35px #10221f80}.portrait-haze:before{content:'';position:absolute;left:0;top:0;width:200%;height:200%;background:linear-gradient(120deg,transparent 15%,#c2e6c017 50%,transparent 85%);animation:portraitHaze 9s ease-in-out infinite;will-change:transform,opacity}.enemy .portrait-haze:before{background-image:linear-gradient(120deg,transparent 15%,#ead2b815 50%,transparent 85%)}.down .living-portrait{animation:none;filter:grayscale(1) brightness(.55)}.roster .sheet-body{padding:16px}.roster .sheet-equipment{margin-top:16px;padding-top:12px}.roster .sheet-equipment p{margin:8px 0}.roster h3{margin-bottom:14px}.roster .sheet-controls>button{font-weight:500;min-height:44px}.skill-block{padding:12px 16px}.skill-entry{margin-bottom:12px}.skill-label{display:flex;align-items:center;justify-content:space-between;gap:8px;font:14px system-ui}.skill-label>span{white-space:nowrap;color:var(--gold)}.skill-label>b{padding:10px 0;font-size:15px}.skill-label .skill-ready{margin:0!important;width:auto!important;flex:1;background:#d6bb78;color:#142820;border:1px solid #efda9b;font-weight:700;box-shadow:0 0 14px #d0b57730}.roster .skill-charge{margin:4px 0 12px;height:5px!important}.satchel{max-width:850px;margin:28px auto;background:#122720;border:1px solid #5a6853}.satchel>summary{cursor:pointer;padding:17px;display:flex;justify-content:space-between;gap:10px;color:var(--gold);font:15px system-ui}.satchel>summary:before{content:'▸';margin-right:0}.satchel[open]>summary:before{content:'▾'}.satchel>summary span:first-child{flex:1}#bag{border:0;margin:0;padding:0 18px 18px}#wallet{padding:14px 0 4px;border-top:1px solid var(--line)}.rules,.encounter-record{max-width:850px;margin:22px auto}.encounter-record{padding:16px;border:1px solid var(--line)}.encounter-record summary{cursor:pointer;color:var(--gold)}#combatFX{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none;z-index:30}.attacking .living-portrait{animation:portraitAttack .55s ease-out}.impact .portrait-slot{animation:portraitHit .55s ease-out}.fizzle .portrait-slot{animation:fizzle .6s ease-out}#overflow{max-width:560px;width:calc(100% - 30px);max-height:85vh;overflow:auto}#swapChoices{display:grid;gap:8px;margin:18px 0}#swapChoices button{text-align:left}dialog h2{font:24px Georgia;color:var(--gold)}@keyframes portraitBreath{50%{transform:scale(1.045) translateY(-2px)}}@keyframes portraitHaze{50%{transform:translate(-50%,-50%);opacity:.4}}@keyframes portraitAttack{40%{transform:scale(1.12) translateX(6px)}}@keyframes portraitHit{20%{filter:brightness(1.7);transform:translateX(-5px)}40%{transform:translateX(5px)}60%{transform:translateX(-3px)}}@keyframes fizzle{50%{filter:brightness(.6)}}@media(max-width:800px){header{padding:22px 12px}.brand{font-size:31px;letter-spacing:1.7px}.brand-small{font-size:11px;letter-spacing:2.5px}.route-map{height:640px}.map-node{width:138px;min-height:88px;padding:7px}.map-node b{font-size:16px}.map-intro h1{font-size:44px}.map-intro p{font-size:16px}.encounter-intro .scene{height:190px}.portrait-slot{height:180px}.roster .sheet-body{padding:12px 10px}.skill-block{padding:10px}.skill-label{font-size:12px;gap:4px}.skill-label>b{font-size:14px}.roster .skill-ready{padding:8px 4px;font-size:13px}.satchel>summary{font-size:14px;padding:14px 10px}.sheet-ribbon{font-size:12px}.roster h3{font-size:23px}.hp-hud{padding:10px}.tray{height:245px}#dice{height:195px}.roster .stats{font-size:14px}.roster .sheet-equipment p{font-size:14px}}@media(max-width:370px){.map-node{width:118px}.map-node b{font-size:14px}.brand{font-size:27px}.portrait-slot{height:155px}.roster h3{font-size:21px}}
/* Persistent health summary and weapon-linked actions. */
.hp-hud{position:sticky;top:0;z-index:25;background:#10211ef7;box-shadow:0 6px 16px #0007;backdrop-filter:blur(12px)}.character-sheet,#choices{scroll-margin-top:var(--hud-offset,170px)}.sheet-equipment>button{margin:0 0 14px!important;background:#315446;border-color:#719b82}.sheet-equipment>p{margin-bottom:8px!important}#choices:has(.item){border-top:1px solid var(--gold);padding-top:18px}
.enemy-power{margin-top:22px;padding-top:14px;border-top:1px solid #805541}.enemy-power .skill-label{color:#edaf92}.enemy-power .enemy-charge{height:5px;margin:8px 0 10px;background:#301d1b}.enemy-charge i{background:linear-gradient(90deg,#b94b42,#f1a06a);box-shadow:0 0 9px #d45c423b}.enemy-power small{font:12px/1.4 system-ui;color:#d5a896}
.map-node.current,.map-node.current:disabled{opacity:1;filter:none;border:2px solid #d8ecff;background:#14283aee;box-shadow:0 0 0 1px #d8ecff40,0 0 24px #a9d2ff66,0 8px 18px #000a}.map-node.current small{color:#d8ecff;font-weight:700}.map-node.current:before{content:'';position:absolute;inset:-5px;border:1px solid #d8ecff66;box-shadow:0 0 22px 3px #bfdcff99;opacity:.3;pointer-events:none;animation:herePulse 2.8s ease-in-out infinite}.map-node.current:after{content:'';position:absolute;top:-7px;left:50%;width:12px;height:12px;margin-left:-6px;border-radius:50%;background:radial-gradient(circle at 40% 35%,#fff,#d8ecff 45%,#8fbfff);box-shadow:0 0 10px 2px #cfe6ffcc;pointer-events:none}@keyframes herePulse{50%{opacity:.9}}.reduced .map-node.current:before{animation:none;opacity:.6}@media(max-width:800px){.map-node{width:30%;min-height:78px;padding:6px 4px}.map-node>span{font-size:20px}.map-node b{font-size:14px}}
.roster .tag.status{color:#e7ae7c;margin-top:4px}
.clue-list{max-width:760px;margin:14px auto 0;padding:14px 18px;border:1px solid #7b7658;background:#0d1e1acc;font:15px/1.5 system-ui;color:var(--muted)}.clue-list p{margin:8px 0}.clue-list b{color:var(--gold)}.clue-open{color:#8bd3b1}.clue-found{border-left:3px solid var(--gold);padding-left:12px}
#selectView{padding-bottom:10px}.pick-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}.pick-card{padding:0;display:flex;flex-direction:column;border:1px solid #6c9787;overflow:hidden}.pick-card.selected{border-color:#ecd28b;box-shadow:0 0 0 1px #ecd28b80}.pick-card.soon{opacity:.6}.pick-card .portrait-slot{height:170px}.pick-body{padding:12px 14px;flex:1;font:14px/1.45 system-ui}.pick-body h3{font-size:22px;margin:6px 0 8px}.pick-body .tag{font-size:11px;letter-spacing:1px;color:var(--muted)}.pick-body .stats{display:flex;gap:14px;color:var(--gold)}.pick-body p{margin:8px 0}.pick-body ul{padding-left:18px;margin:6px 0}.pick-body li{margin:4px 0}.pick-rule{color:var(--muted)}.pick-grid{align-items:start}.pick-body .pick-more{display:block;width:100%;margin:10px 0 0;padding:7px 10px;min-height:36px;font:600 12px/1.2 system-ui;letter-spacing:.8px;text-transform:uppercase;text-align:left;background:transparent;color:var(--gold);border:1px solid #6c978799;border-radius:4px;cursor:pointer}.pick-body .pick-more:hover{background:#ecd28b14;border-color:var(--gold)}.pick-body .pick-more[aria-expanded=true]{border-color:var(--gold)}.pick-info{margin-top:4px}.pick-card>button{margin:0;border-radius:0;border:0;border-top:1px solid var(--line);min-height:44px}.pick-card>button.selected-pick{background:#d6bb78;color:#142820;font-weight:700}#pickStatus{text-align:center;color:var(--gold);margin:18px 0 10px}#startRun{display:block;margin:0 auto 20px;min-width:260px}.skill-label.passive>b{color:var(--muted);font-weight:500}
.skill-block select{width:100%;margin:6px 0 10px}.sharp{color:#edaf92}.press{border-left:3px solid #8bd3b1;padding-left:12px}.clue-list .follow-story{margin-top:10px;width:100%}
.tray{position:relative}#harpoon{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;justify-content:center;gap:10px;padding:0 6%;margin:0;width:100%;border:0;border-radius:0;background:#081411cc;cursor:crosshair;touch-action:manipulation}.hp-track{position:relative;display:block;height:34px;background:#3a1f1c;border:1px solid #8a5a48;border-radius:3px}.hp-track i{position:absolute;top:0;bottom:0}.hp-hit{background:#8f7a3f}.hp-perfect{background:#e4c877;box-shadow:0 0 12px #e4c87799}.hp-line{width:4px;margin-left:-2px;top:-8px!important;bottom:-8px!important;background:#f4f1e6;box-shadow:0 0 10px #fff}.hp-labels{display:grid;grid-template-columns:30fr 16fr 8fr 16fr 30fr;text-align:center;font:11px system-ui;letter-spacing:1px;color:var(--muted)}#harpoon.res-perfect .hp-line{background:#ffe7a0}#harpoon.res-miss .hp-line{background:#e46b5f}
.skill-item{margin-bottom:10px}.skill-label .skill-btn{margin:0!important;width:auto!important;flex:1;background:#1c332b;color:#9fb5a8;border:1px solid #3f5a4d;font-weight:600}.skill-label .skill-btn.skill-ready{background:#d6bb78;color:#142820;border:1px solid #efda9b;font-weight:700;box-shadow:0 0 14px #d0b57750}.skill-label .skill-btn.skill-ready:disabled{opacity:.6}.skill-desc{display:block;margin:4px 0 2px;font:12px/1.35 system-ui;color:var(--muted)}
.skill-label .skill-btn:disabled:not(.skill-ready){opacity:1;color:#8fa699;background:#172b24;border-color:#3a5347}.skill-desc{letter-spacing:0}
.skill-block .skill-btn{display:block;position:relative;width:100%;margin:8px 0 0;overflow:hidden;color:#d3e2d9;font-weight:600;border:1px solid #4b6b5c;background:linear-gradient(90deg,#7a6a3a var(--fill),#172b24 var(--fill));transition:background .3s}.skill-block .skill-btn:after{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(90deg,transparent 0 calc(100% / var(--segs) - 2px),#0b1915 calc(100% / var(--segs) - 2px) calc(100% / var(--segs)))}.skill-block .skill-btn>span{position:relative;z-index:1}.skill-block .skill-btn:disabled{opacity:1}.skill-block .skill-btn.skill-ready{background:#d6bb78;color:#142820;border-color:#efda9b;font-weight:700;box-shadow:0 0 14px #d0b57760}.skill-block .skill-btn.skill-ready:after{display:none}.skill-block .skill-btn.skill-ready:disabled{opacity:.6;box-shadow:none}.skill-passive{padding:10px 0 0;font:14px system-ui;color:var(--muted)}.skill-passive b{color:var(--ink)}
.portrait-slot img{transform-origin:50% 22%}
body.selecting:before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,#07110f1f 0%,#07110f59 40%,#07110fcc 100%),url('select-bg.webp') center top/cover no-repeat}body.selecting header{background:transparent}
.screen-shake{animation:screenShake .45s ease-out}@keyframes screenShake{15%{transform:translate(-6px,3px)}30%{transform:translate(5px,-4px)}45%{transform:translate(-4px,2px)}60%{transform:translate(3px,-2px)}80%{transform:translate(-1px,1px)}}.reduced .screen-shake{animation:none}
.clue-tokens{display:flex;justify-content:center;gap:clamp(14px,4vw,40px);margin:0 0 22px}.clue-token{margin:0;display:flex;flex-direction:column;align-items:center;gap:6px;width:104px}.clue-token img{width:104px;height:104px;display:block;filter:grayscale(1) brightness(.42) contrast(.9);opacity:.55;transition:filter .6s,opacity .6s,transform .6s}.clue-token figcaption{font:11px/1.3 system-ui;letter-spacing:1px;text-transform:uppercase;color:var(--muted);text-align:center;opacity:.7}.clue-token.found img{filter:drop-shadow(0 0 14px #d5b77766);opacity:1}.clue-token.found figcaption{color:var(--gold);opacity:1}.clue-token.fresh img{animation:clueReveal 1.1s ease-out}@keyframes clueReveal{0%{transform:scale(.6) rotate(-25deg);filter:grayscale(1) brightness(2);opacity:.3}55%{transform:scale(1.15) rotate(6deg);filter:drop-shadow(0 0 30px #ffe2a0)}100%{transform:none}}@media(max-width:800px){.clue-token{width:76px}.clue-token img{width:76px;height:76px}.clue-token figcaption{font-size:10px;letter-spacing:.5px}}.reduced .clue-token.fresh img{animation:none}
body.mapping:before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,#07110f33 0%,#07110f8c 38%,#07110fd9 100%),url('map-bg-innsmouth.webp') center top/cover no-repeat}body.mapping header{background:transparent}
#battlefield+.resolution{margin-top:32px}
#trayVerdict{position:absolute;inset:0;z-index:4;display:flex;align-items:center;justify-content:center;pointer-events:none;font:700 clamp(44px,9vw,84px)/1 Georgia,serif;letter-spacing:.06em;opacity:0}#trayVerdict.verdict-success{color:#f2d58c;text-shadow:0 0 18px #e0b75a,0 0 42px #b8872a;animation:verdictFlash 1.6s ease-out forwards}#trayVerdict.verdict-failure{color:#ff6b5e;text-shadow:0 0 18px #d8352b,0 0 42px #8e1712;animation:verdictFlash 1.6s ease-out forwards}@keyframes verdictFlash{0%{opacity:0;transform:scale(.6)}12%{opacity:1;transform:scale(1.12)}22%{transform:scale(1)}35%{opacity:.55}45%{opacity:1}75%{opacity:1}100%{opacity:0;transform:scale(1.04)}}.reduced #trayVerdict.verdict-success,.reduced #trayVerdict.verdict-failure{animation:verdictFade 1.6s linear forwards}@keyframes verdictFade{0%,80%{opacity:1}100%{opacity:0}}.map-node.revealed{border:2px solid #f2d58c;box-shadow:0 0 26px #e0b75a88,0 8px 18px #000a;animation:revealPulse 2.4s ease-in-out infinite}.map-node.revealed small{color:#f2d58c;font-weight:700}@keyframes revealPulse{50%{box-shadow:0 0 38px #f2d58ccc,0 8px 18px #000a}}.reduced .map-node.revealed{animation:none}
.map-node.revealed:disabled{opacity:1;filter:none}
.item.clue-reward{display:flex;align-items:center;gap:18px;border-color:#b8963f;background:linear-gradient(90deg,#2a2614cc,#12211dcc)}.clue-reward img{width:88px;height:88px;flex:none;filter:drop-shadow(0 0 14px #d5b77788);animation:clueReveal 1.1s ease-out}.clue-reward b{color:var(--gold)}.clue-reward p{margin:6px 0 0}@media(max-width:800px){.item.clue-reward{gap:12px}.clue-reward img{width:64px;height:64px}}.reduced .clue-reward img{animation:none}
.burning{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:2;background:linear-gradient(0deg,#ff6a0080 0%,#ff8a1f33 32%,transparent 62%);mix-blend-mode:screen;animation:burnGlow 1.3s ease-in-out infinite}.burning i{position:absolute;bottom:-14%;width:30%;height:78%;background:url('fx/burn_flame_outer.png') center bottom/contain no-repeat;transform-origin:50% 100%;animation:flameLick 1.1s ease-in-out infinite;filter:drop-shadow(0 0 8px #ff7a1c)}.burning i:nth-child(odd){background-image:url('fx/burn_flame_core.png');height:58%;width:22%}.burning i:nth-child(1){left:-4%;animation-duration:.95s;animation-delay:-.2s}.burning i:nth-child(2){left:10%;animation-duration:1.2s;animation-delay:-.7s}.burning i:nth-child(3){left:24%;animation-duration:1s;animation-delay:-.4s}.burning i:nth-child(4){left:38%;animation-duration:1.3s;animation-delay:-.1s}.burning i:nth-child(5){left:52%;animation-duration:.9s;animation-delay:-.55s}.burning i:nth-child(6){left:64%;animation-duration:1.15s;animation-delay:-.3s}.burning i:nth-child(7){left:78%;animation-duration:1.05s;animation-delay:-.8s}.burning b{position:absolute;bottom:6%;width:5px;height:5px;border-radius:50%;background:#ffd27a;box-shadow:0 0 8px 2px #ff9a3a;opacity:0;animation:emberRise 1.8s linear infinite}.burning b:nth-child(8){left:12%;animation-delay:-.1s}.burning b:nth-child(9){left:26%;animation-delay:-.9s}.burning b:nth-child(10){left:40%;animation-delay:-1.4s}.burning b:nth-child(11){left:55%;animation-delay:-.5s}.burning b:nth-child(12){left:67%;animation-delay:-1.1s}.burning b:nth-child(13){left:80%;animation-delay:-.3s}.burning b:nth-child(14){left:33%;animation-delay:-1.6s}.burning b:nth-child(15){left:73%;animation-delay:-.7s}@keyframes flameLick{0%,100%{transform:scaleY(.82) scaleX(1) skewX(-3deg);opacity:.85}35%{transform:scaleY(1.08) scaleX(.9) skewX(4deg);opacity:1}65%{transform:scaleY(.94) scaleX(1.06) skewX(-5deg);opacity:.9}}@keyframes emberRise{0%{transform:translate(0,0) scale(1);opacity:0}10%{opacity:1}100%{transform:translate(14px,-150px) scale(.3);opacity:0}}@keyframes burnGlow{50%{background-color:#ff5a0014}}.reduced .burning,.reduced .burning i,.reduced .burning b{animation:none}.reduced .burning b{display:none}.firebomb-btn{border-color:#c46a1c}

.roster button.firebomb-btn{border-color:#c46a1c}
.roster .cover-btn{margin-top:8px}
.cover-desc{margin-bottom:12px}
.marked{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:2;display:grid;place-items:center;box-shadow:inset 0 0 38px 6px #ff2a2a66;animation:markGlow 1.6s ease-in-out infinite}.marked i{grid-area:1/1;width:min(62%,150px);aspect-ratio:1;background:url('fx/mark_reticle.png') center/contain no-repeat;filter:drop-shadow(0 0 10px #ff2020);mix-blend-mode:screen;animation:markSpin 6s linear infinite,markPulse 1.6s ease-in-out infinite}.marked b{grid-area:1/1;width:min(62%,150px);aspect-ratio:1;background:url('fx/mark_ring.png') center/contain no-repeat;mix-blend-mode:screen;opacity:0;animation:markRing 1.6s ease-out infinite}.marked b+b{animation-delay:-.8s}
@keyframes markSpin{to{rotate:360deg}}@keyframes markPulse{0%,100%{scale:1;opacity:.8}50%{scale:.88;opacity:1}}@keyframes markRing{0%{transform:scale(.5);opacity:.9}100%{transform:scale(1.7);opacity:0}}@keyframes markGlow{0%,100%{box-shadow:inset 0 0 30px 4px #ff2a2a4d}50%{box-shadow:inset 0 0 52px 10px #ff2a2a8c}}
.bleeding{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:2;animation:bleedBeat 1.1s ease-in-out infinite}.bleeding s{position:absolute;width:44%;aspect-ratio:1;background:url('fx/bleed_splat.png') center/contain no-repeat;opacity:.85;text-decoration:none}.bleeding s:nth-of-type(1){top:-10%;left:-8%;rotate:25deg}.bleeding s:nth-of-type(2){top:-14%;right:-10%;rotate:-60deg;width:36%}.bleeding i{position:absolute;top:0;width:4px;height:0;border-radius:0 0 3px 3px;background:linear-gradient(#5e0010,#a3001c);animation:bloodRun 3.2s cubic-bezier(.55,0,.8,.6) infinite}.bleeding i::after{content:'';position:absolute;left:50%;bottom:-6px;width:9px;height:11px;translate:-50% 0;border-radius:50% 50% 50% 50%/40% 40% 60% 60%;background:radial-gradient(circle at 35% 35%,#e0344a,#8a0014 70%)}.bleeding i:nth-of-type(1){left:9%;animation-delay:-.4s}.bleeding i:nth-of-type(2){left:23%;width:3px;animation-duration:4s;animation-delay:-2.2s}.bleeding i:nth-of-type(3){left:71%;animation-duration:3.6s;animation-delay:-1.1s}.bleeding i:nth-of-type(4){left:86%;width:5px;animation-delay:-2.8s}.bleeding i:nth-of-type(5){left:47%;width:3px;animation-duration:4.4s;animation-delay:-3.4s}.bleeding b{position:absolute;top:30%;width:7px;height:9px;border-radius:50% 50% 50% 50%/40% 40% 60% 60%;background:#b0001f;opacity:0;animation:bloodDrop 1.6s ease-in infinite}.bleeding b:nth-of-type(1){left:9%;animation-delay:-.3s}.bleeding b:nth-of-type(2){left:71%;animation-delay:-1s}.bleeding b:nth-of-type(3){left:86%;animation-delay:-.7s}
@keyframes bloodRun{0%{height:0;opacity:1}70%{height:62%;opacity:1}100%{height:70%;opacity:0}}@keyframes bloodDrop{0%{transform:translateY(0);opacity:0}15%{opacity:1}100%{transform:translateY(260%);opacity:0}}@keyframes bleedBeat{0%,100%{box-shadow:inset 0 0 26px 2px #8a001455}14%{box-shadow:inset 0 0 58px 12px #b0001f99}28%{box-shadow:inset 0 0 30px 4px #8a001466}42%{box-shadow:inset 0 0 50px 9px #b0001f88}}
.key-token .key-art{position:relative;display:block;width:104px;height:104px;filter:grayscale(1) brightness(.42) contrast(.9);opacity:.55;transition:filter .6s,opacity .6s}.key-art svg,.key-art img{position:absolute;inset:0;width:100%;height:100%;display:block}.key-token.found .key-art{filter:drop-shadow(0 0 14px #d5b77788);opacity:1}.key-token.fresh .key-art{animation:clueReveal 1.1s ease-out}@media(max-width:800px){.key-token .key-art{width:76px;height:76px}}.reduced .key-token.fresh .key-art{animation:none}
.map-node.key-pulse,.map-node.key-pulse:disabled{opacity:1;filter:none;border:2px solid #f2d58c;animation:keyPulse 1.4s ease-in-out 3}.map-node.key-pulse small{color:#f2d58c;font-weight:700}@keyframes keyPulse{0%,100%{box-shadow:0 0 14px #e0b75a55,0 8px 18px #000a}50%{box-shadow:0 0 44px 10px #f2d58ccc,0 8px 18px #000a;transform:translate(-50%,-50%) scale(1.07)}}.reduced .map-node.key-pulse{box-shadow:0 0 30px #f2d58caa,0 8px 18px #000a}
.key-token .key-art img{filter:none;opacity:1;width:100%;height:100%;animation:none}
.sanctuary-btn{text-align:left;display:block;width:100%;margin-top:10px;border-color:#c9a45a}.sanctuary-btn small{display:block;opacity:.8;font-size:13px;letter-spacing:0;margin-top:4px}
.item-hint{font-size:13px;color:var(--muted);margin:6px 0 2px}
#trayVerdict.verdict-neutral{color:#c9d3c6;text-shadow:0 0 16px #6f8a7c,0 0 36px #33483f;animation:verdictFlash 1.6s ease-out forwards}.reduced #trayVerdict.verdict-neutral{animation:verdictFade 1.6s linear forwards}
.scene-outcome{border-left:2px solid var(--gold);padding:4px 0 4px 14px;color:#e6dcc0;font-style:italic}
.objective:empty{display:none}
#pushluck{position:absolute;inset:0;z-index:3;display:grid;grid-template-columns:1fr 1fr 1fr;grid-template-rows:1fr auto auto;gap:6px 10px;padding:10px 4%;background:#0a1613f7;touch-action:none;user-select:none;-webkit-user-select:none}
#pushluck .pl-stage{grid-column:1/-1;grid-row:1;width:100%;height:100%;min-height:0}
#pushluck .pl-centre{grid-column:2;grid-row:1;align-self:center;text-align:center;display:flex;flex-direction:column;gap:4px;pointer-events:none}
#pushluck .pl-centre b{font:600 clamp(15px,2.4vw,20px) Georgia,serif;color:#f0e4c7;letter-spacing:.04em}
#pushluck .pl-centre small{font:11px/1.35 system-ui;color:var(--muted);letter-spacing:.5px}
#pushluck .pl-bars{grid-column:1/-1;grid-row:2;display:grid;gap:5px}
#pushluck .pl-row{display:grid;grid-template-columns:clamp(96px,22%,150px) 1fr;align-items:center;gap:10px;font:11px system-ui;letter-spacing:1px;text-transform:uppercase;color:var(--muted)}
#pushluck .pl-bar{height:9px;background:#0b1a17;border:1px solid #3d5048;border-radius:5px;overflow:hidden}
#pushluck .pl-bar i{display:block;height:100%;width:0}
#pushluck .pl-balance i{background:linear-gradient(90deg,#8f7a3f,#e4c877)}
#pushluck .pl-danger i{background:linear-gradient(90deg,#4a1512,#d8352b)}
#pushluck .pl-danger-row.shown span{color:#ff8a7e}
#pushluck .pl-hold{grid-column:1/-1;grid-row:3;margin:0;min-height:46px;font:700 15px system-ui;letter-spacing:1px;text-transform:uppercase;background:#2a3f37;border:1px solid #c9a45a;color:#f0e4c7;cursor:pointer;touch-action:none}
#pushluck.holding .pl-hold{background:#6b5627;box-shadow:0 0 18px #c9a45a66 inset}
#pushluck.res-good .pl-hold{background:#6b5627;color:#fff1c8;border-color:#f2d58c}
#pushluck.res-bad .pl-hold{background:#5a1d19;color:#ffd0c8;border-color:#d8352b}
#pushluck.res-neutral .pl-hold{background:#24332e;color:#c9d3c6}
@media(max-width:800px){#pushluck{padding:8px 10px}#pushluck .pl-row{font-size:10px;letter-spacing:.4px}}
#pushluck .pl-hold:disabled{opacity:1;cursor:default}
.blinded{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:2}.blinded::before{content:'';position:absolute;left:-5%;right:-5%;top:14%;height:34%;backdrop-filter:blur(5px) grayscale(.7) brightness(1.15);-webkit-backdrop-filter:blur(5px) grayscale(.7) brightness(1.15);background:linear-gradient(180deg,transparent,#e9eef022 30%,#e9eef044 50%,#e9eef022 70%,transparent);mask-image:linear-gradient(180deg,transparent,#000 25%,#000 75%,transparent);-webkit-mask-image:linear-gradient(180deg,transparent,#000 25%,#000 75%,transparent)}.blinded i{position:absolute;top:12%;height:38%;width:70%;background:url('fx/smoke_07.png') center/contain no-repeat;opacity:.55;filter:brightness(2.2) grayscale(1);animation:blindDrift 7s linear infinite}.blinded i:nth-of-type(1){left:-30%}.blinded i:nth-of-type(2){left:15%;animation-delay:-2.4s;animation-duration:8s;opacity:.45}.blinded i:nth-of-type(3){left:55%;animation-delay:-4.8s;animation-duration:6.5s}.blinded b{position:absolute;width:4px;height:4px;border-radius:50%;background:#fff;box-shadow:0 0 8px 2px #fff;opacity:0;animation:blindGlint 2.6s ease-in-out infinite}.blinded b:nth-of-type(1){left:18%;top:24%}.blinded b:nth-of-type(2){left:38%;top:34%;animation-delay:-.9s}.blinded b:nth-of-type(3){left:62%;top:22%;animation-delay:-1.7s}.blinded b:nth-of-type(4){left:80%;top:38%;animation-delay:-.4s}.blinded b:nth-of-type(5){left:50%;top:18%;animation-delay:-2.2s}.blinded b:nth-of-type(6){left:28%;top:42%;animation-delay:-1.3s}
@keyframes blindDrift{0%{transform:translateX(-20%)}100%{transform:translateX(60%)}}@keyframes blindGlint{0%,100%{opacity:0;transform:scale(.4)}50%{opacity:.9;transform:scale(1)}}
.item.recruit-card{display:flex;align-items:flex-start;gap:16px;border:1px solid #b8963f;background:linear-gradient(90deg,#2a2614cc,#12211dcc);padding:14px}.recruit-card img{width:88px;height:88px;flex:none;object-fit:cover;border:1px solid #b8963f}.recruit-card b{color:var(--gold)}.recruit-card p{margin:6px 0 8px}.recruit-card button{margin:0}@media(max-width:800px){.recruit-card img{width:64px;height:64px}}
.roster button.flare-btn,#choices button.flare-btn{border-color:#d0573a}
.weapon-desc{margin:4px 0 2px}
.mindstatic{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:2;background:radial-gradient(ellipse at 50% 40%,#9b6bff40,transparent 62%),radial-gradient(ellipse at 50% 100%,#3a1a6a88,transparent 72%);box-shadow:inset 0 0 40px 6px #5a2fa066;animation:mysticBreath 4.5s ease-in-out infinite}.mindstatic i{position:absolute;left:50%;top:42%;width:120%;aspect-ratio:1;translate:-50% -50%;background:url('fx/twirl_01.png') center/contain no-repeat;filter:sepia(1) hue-rotate(215deg) saturate(3.5) brightness(1.5);opacity:.65;mix-blend-mode:screen;animation:mysticSpin 14s linear infinite}.mindstatic i:nth-of-type(2){width:80%;background-image:url('fx/twirl_02.png');opacity:.3;animation-duration:9s;animation-direction:reverse;filter:sepia(1) hue-rotate(250deg) saturate(4) brightness(1.4);opacity:.5}.mindstatic b{position:absolute;width:7px;height:7px;border-radius:50%;background:#fbf4ff;box-shadow:0 0 10px 4px #c9a0ff,0 0 22px 9px #7a4dff88;opacity:0;animation:mysticMote 3.2s ease-in-out infinite}.mindstatic b:nth-of-type(1){left:18%;top:30%}.mindstatic b:nth-of-type(2){left:34%;top:62%;animation-delay:-.6s;animation-duration:3.8s}.mindstatic b:nth-of-type(3){left:52%;top:22%;animation-delay:-1.3s}.mindstatic b:nth-of-type(4){left:68%;top:54%;animation-delay:-2s;animation-duration:2.8s}.mindstatic b:nth-of-type(5){left:82%;top:34%;animation-delay:-2.6s}.mindstatic b:nth-of-type(6){left:44%;top:78%;animation-delay:-1.8s;animation-duration:4.2s}.mindstatic b:nth-of-type(7){left:26%;top:12%;animation-delay:-3s;width:4px;height:4px}@keyframes mysticSpin{to{rotate:360deg}}@keyframes mysticBreath{0%,100%{opacity:.75}50%{opacity:1}}@keyframes mysticMote{0%{opacity:0;transform:translateY(8px) scale(.5)}30%{opacity:1;transform:translateY(0) scale(1)}70%{opacity:.8}100%{opacity:0;transform:translateY(-14px) scale(.6)}}
.dreadfx{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:2;backdrop-filter:brightness(.62) saturate(.55);-webkit-backdrop-filter:brightness(.62) saturate(.55);box-shadow:inset 0 -40px 70px 20px #000e,inset 0 0 90px 30px #2a0000d9;animation:dreadPulse 3.2s ease-in-out infinite}.dreadfx i{position:absolute;bottom:-25%;width:75%;aspect-ratio:1;background:url('fx/smoke_07.png') center/contain no-repeat;filter:brightness(.45) sepia(1) hue-rotate(-40deg) saturate(4);opacity:.75;animation:dreadRise 6s ease-in-out infinite}.dreadfx i:nth-of-type(1){left:-20%}.dreadfx i:nth-of-type(2){left:25%;animation-delay:-2s;opacity:.6}.dreadfx i:nth-of-type(3){left:60%;animation-delay:-4s}@keyframes dreadPulse{0%,100%{opacity:.8}50%{opacity:1}}@keyframes dreadRise{0%,100%{transform:translateY(10%) rotate(0)}50%{transform:translateY(-12%) rotate(20deg)}}
@media (prefers-reduced-motion:reduce){.mindstatic,.mindstatic i,.dreadfx,.dreadfx i{animation:none}.mindstatic b{animation:none;opacity:.8}}
.petrified{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:2;backdrop-filter:grayscale(1) sepia(.25) contrast(1.15) brightness(.85);-webkit-backdrop-filter:grayscale(1) sepia(.25) contrast(1.15) brightness(.85);box-shadow:inset 0 0 40px 8px #1b1a17b3}.petrified::before,.petrified::after{content:'';position:absolute;inset:0;background:linear-gradient(118deg,transparent 46%,#1d1b18cc 46.4%,#1d1b18cc 47%,transparent 47.4%),linear-gradient(62deg,transparent 58%,#1d1b18b3 58.3%,#1d1b18b3 58.8%,transparent 59.1%),linear-gradient(160deg,transparent 30%,#1d1b1899 30.3%,#1d1b1899 30.7%,transparent 31%)}.petrified::after{transform:scaleX(-1) translateY(12%);opacity:.7}.petrified i{position:absolute;inset:0;background:radial-gradient(circle at 30% 20%,#ffffff14,transparent 40%),radial-gradient(circle at 75% 70%,#00000033,transparent 45%)}
.disoriented{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:2;backdrop-filter:hue-rotate(0deg) blur(.6px);-webkit-backdrop-filter:hue-rotate(0deg) blur(.6px);animation:disoHue 4s linear infinite}.disoriented i{position:absolute;left:50%;top:50%;width:130%;aspect-ratio:1;translate:-50% -50%;background:url('fx/twirl_02.png') center/contain no-repeat;filter:sepia(1) hue-rotate(120deg) saturate(3) brightness(1.3);opacity:.6;mix-blend-mode:screen;animation:disoSpin 6s linear infinite}.disoriented::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 45%,transparent 20%,#20e0c033 55%,#7a4dff4d 100%);mix-blend-mode:screen}.disoriented i:nth-of-type(2){width:90%;opacity:.45;animation-direction:reverse;animation-duration:4.5s;filter:sepia(1) hue-rotate(230deg) saturate(3)}@keyframes disoSpin{to{rotate:360deg}}@keyframes disoHue{to{backdrop-filter:hue-rotate(360deg) blur(.6px);-webkit-backdrop-filter:hue-rotate(360deg) blur(.6px)}}
@media (prefers-reduced-motion:reduce){.disoriented,.disoriented i{animation:none}}
#bag .item.corroding{animation:corrodeEat .7s ease-in forwards;box-shadow:inset 0 0 30px #7fd12a88,0 0 18px #7fd12a66}@keyframes corrodeEat{0%{filter:none}60%{filter:sepia(1) hue-rotate(40deg) saturate(3) brightness(.8)}100%{filter:sepia(1) hue-rotate(40deg) saturate(3) brightness(.5);opacity:.3;transform:scale(.96)}}
#montage{position:fixed;inset:0;z-index:100;background:#000;overflow:hidden;opacity:1;transition:opacity .7s}#montage.mt-out{opacity:0;transition:opacity 1.4s}body.montage-open{overflow:hidden}
.mt-slide{position:absolute;inset:-4%;background:var(--pos,center)/cover no-repeat;opacity:0;transition:opacity 1.6s ease-in-out;will-change:transform,opacity}.mt-slide.on{opacity:1}
.mt-in.on{animation:mtIn 12s ease-out forwards}.mt-pan.on{animation:mtPan 12s linear forwards}.mt-rise.on{animation:mtRise 12s ease-out forwards}
@keyframes mtIn{from{transform:scale(1.02) translate(0,0)}to{transform:scale(1.12) translate(-2%,1.5%)}}@keyframes mtPan{from{transform:scale(1.1) translate(2.5%,0)}to{transform:scale(1.1) translate(-2.5%,-1%)}}@keyframes mtRise{from{transform:scale(1.12)}to{transform:scale(1.02)}}.mt-rise{transform-origin:62% 8%}
.mt-shade{position:absolute;inset:0;background:linear-gradient(180deg,#000a 0,transparent 22%,transparent 50%,#000c 100%),radial-gradient(ellipse at 50% 55%,transparent 55%,#000b 100%);pointer-events:none}
.mt-caption{position:absolute;left:0;right:0;bottom:max(9vh,calc(56px + env(safe-area-inset-bottom,0px)));display:grid;justify-items:center;padding:0 24px;pointer-events:none}
.mt-card{grid-area:1/1;max-width:44rem;text-align:center;color:#e5e5d4;opacity:0;transform:translateY(10px);transition:opacity 1.1s ease,transform 1.6s ease;text-shadow:0 2px 14px #000,0 0 3px #000}.mt-card.on{opacity:1;transform:none}
.mt-card small{display:block;font:600 12px/1.4 system-ui;letter-spacing:.32em;text-transform:uppercase;color:#d5b777;margin-bottom:10px}
.mt-card p{margin:0;font:italic 400 clamp(17px,2.4vw,24px)/1.5 Georgia,serif;text-wrap:balance}
.mt-namecard b{display:block;font:700 clamp(38px,7vw,72px)/1 Georgia,serif;letter-spacing:.04em;color:#d5b777}
.mt-titlecard h2{margin:0 0 14px;font:700 clamp(46px,10vw,104px)/1 Georgia,serif;letter-spacing:.08em;text-transform:uppercase;color:#f1ead2}
.mt-skip{position:absolute;right:max(16px,env(safe-area-inset-right,0px));bottom:max(16px,env(safe-area-inset-bottom,0px));background:#0008;color:#e5e5d4;border:1px solid #e5e5d455;border-radius:4px;padding:8px 14px;font:600 13px system-ui;letter-spacing:.08em;cursor:pointer}.mt-skip:hover,.mt-skip:focus-visible{background:#000c;border-color:#d5b777;color:#d5b777}
@media (prefers-reduced-motion:reduce){.mt-slide.on{animation:none}.mt-card{transform:none}}
@media (max-aspect-ratio:1/1){.mt-in{--pos:58% center}.mt-pan{--pos:30% center}.mt-rise{--pos:74% center;transform-origin:74% 8%}}
body[data-chapter="2"].mapping:before{background:linear-gradient(180deg,#07110f33 0%,#07110f8c 38%,#07110fd9 100%),url('map-bg-dunwich.webp') center top/cover no-repeat,url('montage-dunwich.webp') center top/cover no-repeat}
.map-node.study{background:#2a2433e8}/* a sealed location while the party holds its key: an animated gold frame until the key is used there */.map-node.key-ready,.map-node.key-ready:disabled{opacity:1;filter:none;border:2px solid #f2d58c}.map-node.key-ready small{color:#f2d58c;font-weight:700}.map-node.key-ready:before{content:'';position:absolute;inset:-6px;border:2px solid #f2d58c;box-shadow:0 0 24px 5px #e0b75acc,inset 0 0 14px #f2d58c55;pointer-events:none;animation:keyFrame 1.8s ease-in-out infinite;will-change:transform,opacity}@keyframes keyFrame{0%,100%{opacity:.3;transform:scale(.97)}50%{opacity:1;transform:scale(1.04)}}.reduced .map-node.key-ready:before{animation:none;opacity:.85}
@media(max-width:800px){body[data-chapter="2"] .map-node{width:23%;min-height:72px;padding:5px 2px}body[data-chapter="2"] .map-node b{font-size:12px;line-height:1.15;margin:3px 0}body[data-chapter="2"] .map-node small{font-size:8px;letter-spacing:.5px}body[data-chapter="2"] .map-node>span{font-size:16px}}

body[data-chapter="2"] .scene img{object-position:center 18%}
#skipToDunwich,#skipToArkham,#skipToYuggoth,#skipToGreatRace,#skipToRlyeh{display:block;margin:-8px auto 20px;min-width:260px;background:transparent;border:1px dashed #ac9e78;color:#c3cdbd;font-size:13px;letter-spacing:.04em}#skipToDunwich:disabled,#skipToArkham:disabled,#skipToYuggoth:disabled,#skipToGreatRace:disabled,#skipToRlyeh:disabled{opacity:.45}
.poisoned{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:2;background:radial-gradient(ellipse at 50% 100%,#3d6a0c99,transparent 65%),radial-gradient(ellipse at 50% 40%,#5f8f1a33,transparent 70%);box-shadow:inset 0 0 36px 6px #2f5a0a88;animation:poisonHaze 3.4s ease-in-out infinite}
.poisoned i{position:absolute;left:50%;top:60%;width:110%;aspect-ratio:1;translate:-50% -50%;background:url('fx/smoke_07.png') center/contain no-repeat;filter:sepia(1) hue-rotate(40deg) saturate(3.5) brightness(.8);opacity:.55;animation:poisonSwirl 9s linear infinite}
.poisoned i:nth-of-type(2){width:80%;top:72%;opacity:.45;animation-duration:6.5s;animation-direction:reverse;filter:sepia(1) hue-rotate(55deg) saturate(4) brightness(.65)}
.poisoned b{position:absolute;bottom:-6%;width:10px;height:10px;border-radius:50%;border:1.5px solid #b6e34a;background:radial-gradient(circle at 35% 35%,#e8ffb0aa,#7fae2233 60%,transparent 70%);box-shadow:0 0 6px #9fd13a88;opacity:0;animation:poisonBubble 2.6s ease-in infinite}
.poisoned b:nth-of-type(1){left:12%}.poisoned b:nth-of-type(2){left:26%;animation-delay:-.7s;width:7px;height:7px}.poisoned b:nth-of-type(3){left:38%;animation-delay:-1.5s}.poisoned b:nth-of-type(4){left:51%;animation-delay:-.3s;width:13px;height:13px}.poisoned b:nth-of-type(5){left:63%;animation-delay:-2.1s;width:8px;height:8px}.poisoned b:nth-of-type(6){left:74%;animation-delay:-1.1s}.poisoned b:nth-of-type(7){left:86%;animation-delay:-1.8s;width:6px;height:6px}.poisoned b:nth-of-type(8){left:45%;animation-delay:-2.4s;width:9px;height:9px}
@keyframes poisonHaze{0%,100%{opacity:.8}50%{opacity:1}}@keyframes poisonSwirl{to{rotate:360deg}}
@keyframes poisonBubble{0%{opacity:0;transform:translateY(0) scale(.6)}15%{opacity:1}78%{opacity:1;transform:translateY(-120px) scale(1)}86%{opacity:.9;transform:translateY(-128px) scale(1.7)}100%{opacity:0;transform:translateY(-130px) scale(2.2)}}
@media (prefers-reduced-motion:reduce){.poisoned,.poisoned i{animation:none}.poisoned b{animation:none;opacity:.8;bottom:30%}}
.bell-btn{border-color:#5f9bff!important;box-shadow:inset 0 0 12px #3f6fd044}.bell-btn:not(:disabled):hover{background:#1c2f4a}
.bell-shiver{animation:bellShiver .6s linear}@keyframes bellShiver{0%,100%{transform:translate(0,0)}10%{transform:translate(-2px,1px)}20%{transform:translate(2px,-1px)}30%{transform:translate(-2px,0)}40%{transform:translate(2px,1px)}50%{transform:translate(-1px,-1px)}60%{transform:translate(1px,1px)}70%{transform:translate(-1px,0)}80%{transform:translate(1px,0)}}
@media (prefers-reduced-motion:reduce){.bell-shiver{animation:none}}
.loot-choose{margin:0 0 10px;padding:8px 12px;border-left:3px solid var(--gold);background:#d5b7770f;color:var(--ink)}.loot-choose b{color:var(--gold)}
.item.loot-pick{border-color:#d5b77788}.loot-extra{display:block;font:600 10px system-ui;letter-spacing:.12em;color:var(--mint);margin-bottom:4px}

/* .45 Trench Sweeper: gunmetal and brass, its own slot below the main weapon */
.tommy-btn{box-shadow:inset 0 0 12px #c0442a33}.tommy-btn:not(:disabled):hover{background:#2e2a1e}
.sheet-equipment p.tommy-slot{color:#d9b56a;letter-spacing:.02em}
/* Passive gear (no button of its own) grouped at the top of the equipment block */
.passive-gear{list-style:none;margin:0 0 14px;padding:10px 12px;display:grid;gap:8px;border:1px solid #3c5a4d;border-radius:6px;background:#12241f}
.passive-gear li{display:grid;gap:2px}.passive-gear b{font:600 13px system-ui;color:#d9e6dc;letter-spacing:.02em}.passive-gear small{font-size:12px;color:#9fb8aa;line-height:1.35}
/* The False Reflection (Bishop Brook): a still pool drawn over the dice tray */
#reflection{position:absolute;inset:0;z-index:3;background:#071314;touch-action:manipulation;user-select:none;-webkit-user-select:none}
#reflection .rf-stage{position:absolute;inset:0;width:100%;height:100%}
#reflection .rf-caption{position:absolute;left:0;right:0;top:8px;text-align:center;display:flex;flex-direction:column;gap:2px;pointer-events:none}
#reflection .rf-caption b{font:600 clamp(15px,2.4vw,20px) Georgia,serif;color:#f0e4c7;letter-spacing:.04em;text-shadow:0 1px 6px #000}
#reflection .rf-caption small{font:11px/1.35 system-ui;color:var(--muted);letter-spacing:.5px}
#reflection .rf-picks{position:absolute;inset:0}
#reflection .rf-picks button{position:absolute;margin:0;padding:0;min-height:0;background:transparent!important;border:0;border-radius:50%;cursor:pointer}
#reflection .rf-picks button:disabled{cursor:default}
#reflection .rf-picks button:not(:disabled):hover,#reflection .rf-picks button:focus-visible{box-shadow:0 0 0 3px #e8c97a88,0 0 24px #e8c97a55}
#reflection.res-good .rf-caption b{color:#f2d58c}#reflection.res-bad .rf-caption b{color:#ff8a7a}
.resume-card{max-width:850px;margin:22px auto;padding:0;background:#122720;border:1px solid #5a6853}.resume-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:14px 17px}.resume-chapter{display:block;margin-top:4px;font:17px Georgia,serif}.resume-card button{width:auto;min-width:200px;margin:0}.resume-details{border-top:1px solid var(--line)}.resume-details>summary{cursor:pointer;padding:12px 17px;color:var(--gold);font:14px system-ui}.resume-details>p{margin:0 17px 14px;color:var(--muted)}@media(max-width:500px){.resume-card button{width:100%}}
.stats.vitals b{margin-left:4px}
.stats.vitals{flex-wrap:nowrap;gap:8px}.stats.vitals span{white-space:nowrap}
.stats.vitals .lbl-short{display:none}
@media(max-width:800px){.roster .stats.vitals{font-size:13px;gap:4px}.stats.vitals b{margin-left:2px}}
@media(max-width:480px){.stats.vitals .lbl-long{display:none}.stats.vitals .lbl-short{display:inline}.roster .stats.vitals{font-size:12.5px}}
@media(max-width:340px){.stats.vitals{flex-wrap:wrap}}
/* Chill (the Hollow's Tongue's Night Whisper): frost creeping in at the portrait's edges */
.chilled{position:absolute;inset:0;pointer-events:none;z-index:2;background:radial-gradient(ellipse at 50% 45%,transparent 45%,#b8e4ff55 80%,#e6f7ffaa 100%);box-shadow:inset 0 0 30px 6px #cfeeff99;mix-blend-mode:screen;animation:chillBreath 3.2s ease-in-out infinite}
@keyframes chillBreath{50%{opacity:.65}}
/* Madness: a slow violet pulse creeping in from the edges of the portrait until their next attack */
.maddened{position:absolute;inset:0;pointer-events:none;z-index:2;background:radial-gradient(ellipse at 50% 45%,transparent 40%,#7a2fa844 75%,#3a0f55aa 100%);box-shadow:inset 0 0 34px 8px #b070e066;animation:madPulse 2.4s ease-in-out infinite}
@keyframes madPulse{0%,100%{opacity:.55;filter:hue-rotate(0deg)}50%{opacity:1;filter:hue-rotate(-25deg)}}
.reduced .chilled,.reduced .maddened{animation:none}
/* Curse (status 16, owner request): a black, slowly swirling cloud with a white skull over the portrait */
.cursed{position:absolute;inset:0;pointer-events:none;z-index:3;display:grid;place-items:center;overflow:hidden;background:radial-gradient(ellipse at 50% 50%,#000000aa 0 30%,#0000 68%)}
.cursed i{position:absolute;left:50%;top:50%;width:82%;aspect-ratio:1;margin:-41% 0 0 -41%;border-radius:50%;background:conic-gradient(from 0deg,#000e,#2b2b2bcc 18%,#000c 32%,#3a3a3a99 50%,#000e 66%,#1d1d1dcc 82%,#000e);filter:blur(9px);opacity:.92;animation:curseSwirl 7s linear infinite}
.cursed i+i{width:58%;margin:-29% 0 0 -29%;opacity:.8;animation-duration:4.5s;animation-direction:reverse}
.cursed svg{position:relative;width:30%;max-width:96px;filter:drop-shadow(0 0 5px #000) drop-shadow(0 0 12px #000);animation:curseSkull 2.6s ease-in-out infinite}
@keyframes curseSwirl{to{transform:rotate(360deg)}}
@keyframes curseSkull{0%,100%{opacity:.78;transform:scale(.96)}50%{opacity:1;transform:scale(1.04)}}
.reduced .cursed i,.reduced .cursed svg{animation:none}
@media(prefers-reduced-motion:reduce){.cursed i,.cursed svg{animation:none}}
.chill-note{font-style:normal;font:600 10.5px/1 system-ui;letter-spacing:.8px;color:#bfe6ff;margin:0 auto 0 8px;align-self:center}
.passive-note{border-left:2px solid #bfe6ff66;padding-left:10px;color:#cfe3ea!important}
/* Trophy shelf and the locked investigator slot (character select) */
.trophy-shelf{max-width:760px;margin:0 0 22px}
#trophyShelf{padding:0 18px 18px}.trophy-group+.trophy-group{margin-top:14px}.trophy-head{display:flex;justify-content:space-between;gap:8px;font:600 11.5px/1.3 system-ui;letter-spacing:.9px;text-transform:uppercase;color:var(--gold);padding-bottom:6px;border-bottom:1px solid var(--line)}.trophy-head span{color:var(--muted);font-weight:500}#trophyShelf .trophy-row{grid-template-columns:repeat(4,minmax(0,1fr))}#trophyShelf .trophy.final{grid-column:auto}@media (max-width:600px){#trophyShelf .trophy-row{grid-template-columns:repeat(3,minmax(0,1fr))}#trophyShelf{padding:0 12px 14px}}#trophyShelf .trophy-shelf{max-width:none;margin:0}.trophies-tab{margin-top:-14px}
.trophy-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:8px}
.trophy{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;padding:14px 8px 12px;border:1px solid var(--line);background:#0f201c;text-align:center}
.trophy svg{width:56px;height:56px}
.trophy b{font:600 13px/1.3 system-ui}
.trophy small{font-size:11px;letter-spacing:.6px;color:var(--muted)}
.trophy.missing{color:#3c5249;border-style:dashed}
.trophy.missing b{color:#6f857a;font-weight:500}
.trophy.missing .q{position:absolute;top:26px;left:50%;transform:translateX(-50%);font:600 22px/1 Georgia,serif;color:#8ea397}
.trophy.found{color:var(--gold);border-color:#8a7442;background:radial-gradient(ellipse at 50% 30%,#3b3320,#0f201c 70%)}
.trophy.found b{color:#f0e4c7}
.trophy-hint{color:var(--muted);font-size:14px;margin:10px 0 0}
.trophy-card{display:flex;gap:14px;align-items:center;border:1px solid #8a7442;padding:14px;background:radial-gradient(ellipse at 10% 50%,#3b3320,transparent 60%)}
.trophy-card svg{flex:none;width:64px;height:64px;color:var(--gold)}
@media(max-width:480px){.trophy-row{gap:6px}.trophy svg{width:40px;height:40px}.trophy.missing .q{top:20px;font-size:17px}.trophy b{font-size:11.5px}}
/* Mini boss: a gilded frame with a slow sweep of light round the border */
@property --mb-angle{syntax:'<angle>';inherits:false;initial-value:0deg}
.character-sheet.mini-boss{position:relative;border-color:#d5b777;box-shadow:0 0 0 1px #d5b77766,0 0 22px 2px #d5b77744,inset 0 0 26px #d5b77720;animation:miniGlow 3.6s ease-in-out infinite}
.character-sheet.mini-boss::before{content:'';position:absolute;inset:0;padding:3px;pointer-events:none;z-index:4;background:conic-gradient(from var(--mb-angle),transparent 0 55%,#8a6d2e 64%,#ffe9a8 72%,#fffbe8 76%,#ffe9a8 80%,#8a6d2e 88%,transparent 96%);filter:drop-shadow(0 0 4px #ffe3a0);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);animation:miniSweep 5s linear infinite}
.character-sheet.mini-boss .sheet-ribbon{background:linear-gradient(90deg,#b8955a,#ecd28e 50%,#b8955a);color:#2a1f0c;font-weight:600}
.character-sheet.mini-boss .portrait-slot{box-shadow:inset 0 0 0 1px #d5b77788,inset 0 -30px 40px -20px #d5b77733}
.character-sheet.mini-boss .tag{color:#ecd28e}
.character-sheet.mini-boss.down{animation:none;box-shadow:none}
.character-sheet.mini-boss.down::before{display:none}
@keyframes miniGlow{50%{box-shadow:0 0 0 1px #d5b777aa,0 0 32px 5px #d5b77766,inset 0 0 34px #d5b77733}}
@keyframes miniSweep{to{--mb-angle:360deg}}
.reduced .character-sheet.mini-boss,.reduced .character-sheet.mini-boss::before{animation:none}
/* Guide: the mini boss's gilded sweep on the buttons that move the story on (enter the encounter, scene choices, leave the loot) */
button.guide:not(:disabled){position:relative;border-color:#d5b777;box-shadow:0 0 0 1px #d5b77766,0 0 18px 1px #d5b77740;animation:miniGlow 3.6s ease-in-out infinite}
button.guide:not(:disabled)::before{content:'';position:absolute;inset:-1px;border-radius:inherit;padding:2px;pointer-events:none;background:conic-gradient(from var(--mb-angle),transparent 0 55%,#8a6d2e 64%,#ffe9a8 72%,#fffbe8 76%,#ffe9a8 80%,#8a6d2e 88%,transparent 96%);filter:drop-shadow(0 0 3px #ffe3a0);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);animation:miniSweep 5s linear infinite}
.reduced button.guide,.reduced button.guide::before{animation:none}
/* Dynamite Bundle: a full-screen flash that burns out through orange, and a quake of the whole page */
.blast-flash{position:fixed;inset:0;z-index:60;pointer-events:none;background:radial-gradient(circle at 50% 55%,#fff 0,var(--flash,#fff1cf) 30%,#ff8a2a99 62%,#40100000 100%);animation:blastFlash 900ms ease-out forwards}
@keyframes blastFlash{0%{opacity:0}6%{opacity:1}22%{opacity:.85}100%{opacity:0}}
main.quake{animation:quake 1.05s cubic-bezier(.36,.07,.19,.97)}
@keyframes quake{0%{transform:translate(0,0)}6%{transform:translate(-14px,9px) rotate(-.6deg)}12%{transform:translate(13px,-11px) rotate(.5deg)}18%{transform:translate(-11px,-7px)}26%{transform:translate(9px,8px) rotate(.3deg)}36%{transform:translate(-7px,5px)}48%{transform:translate(5px,-4px)}62%{transform:translate(-3px,3px)}78%{transform:translate(2px,-1px)}100%{transform:translate(0,0)}}
.reduced main.quake{animation:none}
.dynamite-btn,.tommy-btn{border-color:#c0442a!important;background:linear-gradient(180deg,#5a1d12,#3a130c)!important;color:#ffd9b8!important}
.dynamite-btn:hover:not(:disabled),.tommy-btn:hover:not(:disabled){background:linear-gradient(180deg,#7a2716,#4a170e)!important;border-color:#ff8a4a!important}

/* Whateley's Study: three face-down lesson cards; the chosen one flips first, the others follow greyed out */
.study-offer{color:var(--muted);font-style:italic;margin:0 0 14px}.study-offer em{display:block;font-style:normal;font-family:system-ui;font-size:13px;letter-spacing:.3px;color:var(--gold);margin-top:6px}
.study-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:6px 0 16px;perspective:1400px}
.study-card{position:relative;min-height:400px}
.study-inner{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.3,.1,.2,1) var(--d,0s)}
.study-card.revealed .study-inner{transform:rotateY(180deg)}
.study-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:6px;border:1px solid #6b5a36;display:flex;flex-direction:column;padding:16px;overflow:auto}
.study-back{background:radial-gradient(circle at 50% 38%,#3a2a19 0,#1c140c 55%,#0f0b07 100%);box-shadow:inset 0 0 0 6px #120d08,inset 0 0 0 7px #5a4526,0 10px 26px #0008;justify-content:flex-end;align-items:stretch}
.study-sigil{position:absolute;left:50%;top:40%;width:120px;height:120px;transform:translate(-50%,-50%);border:2px solid #b8924e;border-radius:50%;box-shadow:0 0 18px #d5b77733,inset 0 0 18px #d5b77722;animation:sigilGlow 3.2s ease-in-out infinite}
.study-sigil::before{content:'';position:absolute;inset:18px;border:1px solid #b8924e;transform:rotate(45deg)}
.study-sigil::after{content:'✦';position:absolute;inset:0;display:grid;place-items:center;color:#e3c27d;font-size:34px;text-shadow:0 0 12px #e3c27d88}
.study-chain{position:absolute;left:-4%;right:-4%;top:40%;height:14px;transform:rotate(-14deg);background:repeating-linear-gradient(90deg,#2b2b2b 0 16px,#6f6a60 16px 18px,#2b2b2b 18px 20px,transparent 20px 22px);opacity:.85;box-shadow:0 2px 4px #000a}
.study-turn{position:relative;z-index:1;width:100%;background:#2a1f12;border-color:#8a6d3c;color:#f0dcae}
.study-front{transform:rotateY(180deg);background:linear-gradient(#f1e6c8,#dccb9f);color:#2b2012;border-color:#8a6d3c;gap:8px;box-shadow:0 10px 26px #0008}
.study-front small{color:#6e5530;letter-spacing:1.4px}.study-front b{font-size:22px;line-height:1.15;text-wrap:balance}.study-front p{margin:0;font-size:15px}
.study-teach{display:flex;flex-direction:column;gap:6px;margin-top:auto}.study-teach button{background:#2a1f12;border-color:#8a6d3c;color:#f0dcae}
.study-card.chosen.revealed .study-front{box-shadow:0 0 0 2px var(--gold),0 0 34px #d5b77766,0 10px 26px #0008}
.study-card.missed .study-front{filter:grayscale(.85) brightness(.62)}
.study-learned{font-family:system-ui;font-size:13px;letter-spacing:1px;color:#6e5530;margin-top:auto!important}
@keyframes sigilGlow{50%{box-shadow:0 0 30px #d5b77755,inset 0 0 26px #d5b77744}}
.reduced .study-inner{transition:none}.reduced .study-sigil{animation:none}
@media (max-width:700px){.study-cards{grid-template-columns:1fr}.study-card{min-height:300px}}

/* Sentinel Hill: choices the party earned earlier in the chapter stand out with a gold edge */
.finale-earned{border-color:var(--gold)!important;box-shadow:inset 0 0 14px #d5b77733}
/* The Case File (Chapter One → Two transition): a lamp-lit desk; photo, journal, ledger and map; the map burns to Dunwich */
@property --burn{syntax:'<length-percentage>';inherits:true;initial-value:-4%}
#montage.cf{--ink:#2b2014;--red:#9e1b14;--paper:#efe4c6;font-family:Georgia,serif}
.cf .cf-deskwrap{position:absolute;inset:0;-webkit-mask:radial-gradient(circle at 72% 70%,transparent var(--burn),#000 calc(var(--burn) + 1.5%));mask:radial-gradient(circle at 72% 70%,transparent var(--burn),#000 calc(var(--burn) + 1.5%))}
.cf.cf-burning .cf-deskwrap,.cf.cf-burning .cf-char{animation:cfBurn 2.8s cubic-bezier(.5,0,.8,.6) forwards}
@keyframes cfBurn{to{--burn:150%}}
.cf .cf-char{position:absolute;inset:0;pointer-events:none;opacity:0;background:radial-gradient(circle at 72% 70%,transparent calc(var(--burn) - .5%),#ffb04a calc(var(--burn) + .2%),#7a2a08 calc(var(--burn) + 1.2%),#1a0a04cc calc(var(--burn) + 2.6%),transparent calc(var(--burn) + 5%));mix-blend-mode:screen}
.cf.cf-burning .cf-char{opacity:1}.cf.cf-dunwich .cf-char{opacity:0;transition:opacity 1.5s}
.cf .cf-desk{position:absolute;inset:0;background:repeating-linear-gradient(92deg,#0000 0 9px,#00000018 9px 11px,#0000 11px 23px),repeating-linear-gradient(88deg,#0000 0 41px,#ffffff08 41px 43px,#0000 43px 97px),linear-gradient(180deg,#2a1a10,#1a0f08 60%,#120a05);filter:brightness(.18) saturate(.6);transition:filter 1.6s ease}
.cf .cf-cold{position:absolute;inset:0;background:linear-gradient(180deg,#1c2c3a55,#0a121a99);transition:opacity 2s}
.cf .cf-lamp{position:absolute;inset:0;background:radial-gradient(ellipse 60% 55% at 46% 40%,#ffd9902e,#ffb04a14 45%,transparent 75%);opacity:0;transition:opacity 1.2s}
.cf.cf-lit .cf-desk{filter:brightness(.62) saturate(.9)}.cf.cf-lit .cf-lamp{opacity:1;animation:cfFlicker 5s 1.4s infinite}.cf.cf-lit .cf-cold{opacity:.35}
@keyframes cfFlicker{0%,100%{opacity:1}41%{opacity:.93}43%{opacity:1}71%{opacity:.96}}
.cf .cf-photo,.cf .cf-paper{position:absolute;left:50%;top:50%;opacity:0;transition:transform 1.3s cubic-bezier(.2,.8,.2,1),opacity .9s,filter 1.2s;box-shadow:0 18px 40px #000c,0 2px 6px #0008}
.cf .cf-photo{width:min(62vw,440px);padding:12px 12px 30px;background:#e9e1cc;transform:translate(-78%,-120%) rotate(-14deg)}
.cf .cf-photo.on{opacity:1;transform:translate(-62%,-62%) rotate(-5deg)}
.cf .cf-photo img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;filter:sepia(.35) contrast(1.05)}
.cf .cf-photo span{position:absolute;left:14px;bottom:6px;font:italic 14px/1 'Homemade Apple','Segoe Script','Brush Script MT',cursive;color:#3a2a18}
.cf .cf-pin{position:absolute;top:-6px;left:50%;width:16px;height:16px;margin-left:-8px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ff8a7a,#9e1b14 60%,#4a0806);box-shadow:0 3px 4px #0009}
.cf .cf-stain{position:absolute;border-radius:50%;background:radial-gradient(circle,#4a3a1f00 30%,#4a3a1f55 62%,#2a2010aa 70%,#4a3a1f33 74%,transparent 78%);mix-blend-mode:multiply;transform:scale(0);opacity:.9;transition:transform 4s cubic-bezier(.2,.6,.3,1)}
.cf .cf-stain.s1{width:62%;aspect-ratio:1;left:-8%;top:30%}.cf .cf-stain.s2{width:44%;aspect-ratio:1;right:4%;top:-6%;transition-delay:.8s}.cf .cf-stain.s3{width:36%;aspect-ratio:1;right:20%;bottom:8%;transition-delay:1.6s}
.cf .cf-stain.on{transform:scale(1)}
.cf .cf-dim{filter:brightness(.45) blur(.6px)}
.cf .cf-paper{background:linear-gradient(90deg,#0000 0 48px,#c0443a44 48px 49px,#0000 49px),repeating-linear-gradient(180deg,#0000 0 29px,#6a8aa833 29px 30px),radial-gradient(ellipse at 30% 20%,#fff8e6,var(--paper) 55%,#dccb9f);color:var(--ink);border-radius:2px}
.cf .cf-journal{width:min(90vw,620px);padding:22px 26px 26px 62px;transform:translate(-44%,40%) rotate(4deg)}
.cf .cf-journal.on{opacity:1;transform:translate(-44%,-38%) rotate(2deg)}
.cf .cf-head{font:600 11px/1.4 system-ui;letter-spacing:.24em;text-transform:uppercase;color:#6e5530;margin-bottom:12px}
.cf .cf-ink{margin:0;font:clamp(15px,2.3vw,21px)/30px 'Homemade Apple','Segoe Script','Brush Script MT',cursive;color:#1f2a4a;white-space:nowrap;overflow:hidden;clip-path:inset(0 100% 0 0);transition:clip-path var(--w,1.4s) linear}
.cf .cf-ink.on{clip-path:inset(0 0 0 0)}
.cf .cf-ledger{width:min(92vw,640px);padding:20px 24px 24px;transform:translate(10%,-50%) rotate(-3deg);background:linear-gradient(90deg,#0000 0 76px,#9e1b1444 76px 77px,#0000 77px 190px,#9e1b1444 190px 191px,#0000 191px),repeating-linear-gradient(180deg,#0000 0 31px,#6a8aa840 31px 32px),radial-gradient(ellipse at 70% 20%,#f6ecd2,#e4d4a8 60%,#cdb888)}
.cf .cf-ledger.on{opacity:1;transform:translate(-50%,-50%) rotate(-2deg)}
.cf .cf-rows{position:relative}
.cf .cf-row{display:grid;grid-template-columns:52px 114px 1fr;gap:10px;height:32px;align-items:center;font:15px/1 Georgia,serif;color:#3a2a18;opacity:0;transform:translateX(-6px);transition:opacity .45s,transform .45s}
.cf .cf-row.on{opacity:1;transform:none}
.cf .cf-row b{font:clamp(14px,2vw,18px)/1 'Homemade Apple','Segoe Script',cursive;color:#1f2a4a}
.cf .cf-row em{font:italic 13px/1.2 Georgia,serif;color:#5a4428;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cf .cf-ring{position:absolute;left:var(--ring-l,36px);top:-9px;width:var(--ring-w,164px);height:calc(100% + 18px);overflow:visible;transform:rotate(-2.5deg);pointer-events:none}
.cf .cf-ring path{fill:none;stroke:var(--red);stroke-width:2.6;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.2s cubic-bezier(.45,.05,.55,.95);opacity:.92}
.cf .cf-ring.on path{stroke-dashoffset:0}
.cf .cf-map{width:min(94vw,860px,calc((82vh - 40px) * 1.2));padding:10px;transform:translate(-50%,-30%) rotate(6deg) scale(1.08);background:#d9c69a}
.cf .cf-map.on{opacity:1;transform:translate(-50%,-50%) rotate(-1deg)}
.cf .cf-map img{display:block;width:100%;height:auto}
.cf .cf-map svg{position:absolute;left:10px;top:10px;width:calc(100% - 20px);height:calc(100% - 20px)}
.cf .cf-route{fill:none;stroke:#b3150c;stroke-width:9;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;opacity:.9;filter:drop-shadow(0 0 2px #fff6);transition:stroke-dashoffset 5.2s cubic-bezier(.4,0,.6,1)}
.cf .cf-route.on{stroke-dashoffset:0}
.cf .cf-x{fill:none;stroke:#b3150c;stroke-width:7;opacity:0;transform:scale(2.2);transition:opacity .3s,transform .4s cubic-bezier(.3,1.6,.5,1)}
.cf .cf-x.on{opacity:.95;transform:scale(1)}
.cf .cf-dun{position:absolute;inset:0;opacity:0;transition:opacity 1.2s}
.cf .cf-dun-img{position:absolute;inset:-5%;background:url('montage-dunwich.webp') 74% center/cover no-repeat;background-size:cover;transform-origin:74% 20%}
.cf.cf-burning .cf-dun{opacity:1}.cf.cf-dunwich .cf-dun-img{animation:cfPush 11s ease-out forwards}
@keyframes cfPush{from{transform:scale(1.12)}to{transform:scale(1)}}
.cf .cf-fx{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.cf .cf-grain{position:absolute;inset:-50%;pointer-events:none;opacity:.12;background:repeating-radial-gradient(circle at 17% 32%,#fff 0 .6px,#0000 .6px 3px),repeating-radial-gradient(circle at 71% 62%,#000 0 .7px,#0000 .7px 2.6px);animation:cfGrain .5s steps(4) infinite;mix-blend-mode:overlay}
@keyframes cfGrain{0%{transform:translate(0,0)}25%{transform:translate(-3%,2%)}50%{transform:translate(2%,-3%)}75%{transform:translate(-2%,-1%)}}
.cf .cf-bars{position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 9vh 0 #000,inset 0 -9vh 0 #000,inset 0 0 160px #000c}
.cf .cf-title{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:grid;grid-template-columns:minmax(0,40rem);justify-content:center;justify-items:center;gap:22px;padding:0 24px;pointer-events:none;text-align:center}.cf .cf-title:before{content:'';position:absolute;left:50%;top:50%;width:min(96vw,900px);height:130%;transform:translate(-50%,-50%);background:radial-gradient(ellipse at center,#000000b0,#00000060 45%,transparent 70%);opacity:0;transition:opacity .8s;z-index:-1}.cf .cf-title.on:before{opacity:1}
.cf .cf-stamp{display:grid;gap:6px;padding:18px 34px 20px;border:4px double #c0392b;color:#e0483a;background:#0000;transform:rotate(-7deg) scale(2.6);opacity:0;text-shadow:0 0 1px #c0392b;filter:drop-shadow(0 4px 18px #000)}
.cf .cf-stamp small{font:800 clamp(14px,1.8vw,19px)/1 system-ui;letter-spacing:.42em;text-transform:uppercase}
.cf .cf-stamp b{font:700 clamp(52px,11vw,110px)/1 Georgia,serif;letter-spacing:.1em;text-transform:uppercase}
.cf .cf-title.on .cf-stamp{opacity:.92;transform:rotate(-6deg) scale(1);transition:transform .22s cubic-bezier(.5,0,.9,.4),opacity .1s}
.cf .cf-title p{max-width:40rem;margin:0;font:italic clamp(16px,2.3vw,23px)/1.5 Georgia,serif;color:#e8e2cc;text-shadow:0 2px 14px #000,0 0 3px #000;opacity:0;transition:opacity 1.4s;text-wrap:balance}
.cf .cf-title.lined p{opacity:1}
.cf.cf-thud .cf-dun{animation:cfThud .45s ease-out}
@keyframes cfThud{0%{transform:translate(0,0)}20%{transform:translate(-5px,4px)}45%{transform:translate(4px,-3px)}70%{transform:translate(-2px,2px)}100%{transform:none}}
.cf-reduce *{transition-duration:.4s!important;animation:none!important}.cf-reduce .cf-ink{clip-path:none}.cf-reduce .cf-deskwrap.cf-gone{opacity:0;transition:opacity 1s}
@media (max-width:600px){.cf .cf-ink{white-space:normal;font-size:13px;line-height:26px}.cf .cf-journal{transform:translate(-50%,40%) rotate(3deg)}.cf .cf-journal.on{transform:translate(-50%,-38%) rotate(1.5deg)}.cf .cf-stamp{padding:12px 20px 14px}.cf .cf-ledger{padding:14px}.cf .cf-row{grid-template-columns:40px 96px 1fr;font-size:13px}.cf .cf-ring{left:28px;width:134px}.cf .cf-journal{padding:16px 16px 18px 56px}}

/* Chapter Three header: keep the two investigators and the Arkham shop signs in frame */
body[data-chapter] .scene img[src$="arkham.webp"]{object-position:center 44%}

/* Chapter Three (Arkham): four columns, five rows of locations; the owner's Arkham panorama stands in until the Arkham map art arrives */
body[data-chapter="3"].mapping:before{background:linear-gradient(180deg,#07110f40 0%,#07110f99 38%,#07110fe0 100%),url('montage-arkham.webp') center top/cover no-repeat}
/* Four columns, five rows (owner request): phones use the same box size as Chapter Two */
@media(max-width:800px){body[data-chapter="3"] .map-node{width:23%;min-height:72px;padding:5px 2px}
body[data-chapter="3"] .map-node b{font-size:12px;line-height:1.15;margin:3px 0}
body[data-chapter="3"] .map-node small{font-size:8px;letter-spacing:.5px}
body[data-chapter="3"] .map-node>span{font-size:16px}}
body[data-chapter="3"] .scene img{object-position:center 44%}

/* Full / compact investigator sheets (FULL SHEET ON / OFF) */
.heroes-heading{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.sheet-toggle{font:600 10px/1 system-ui;letter-spacing:.08em;padding:5px 8px;min-height:0;border:1px solid var(--line);border-radius:4px;background:transparent;color:var(--mint);cursor:pointer}
.compact-sheets .sheet-toggle{color:#ebba8f;border-color:#ebba8f80}
.charge-compact{display:none}
.sheet-portrait{cursor:pointer}
.down .sheet-portrait.foe-portrait{cursor:default}
.compact-sheets section.character-sheet[id^=hero] .skill-desc,.compact-sheets section.character-sheet[id^=hero] .sheet-equipment>.eyebrow,.compact-sheets section.character-sheet[id^=hero] .sheet-equipment>p,.compact-sheets section.character-sheet[id^=hero] .select-btn,.compact-sheets section.character-sheet[id^=hero] .charge-full,.compact-sheets section.character-sheet[id^=hero] .passive-gear{display:none}
.compact-sheets section.character-sheet[id^=hero] .charge-compact{display:block;margin:8px 0 2px}
.compact-sheets section.character-sheet[id^=hero] .sheet-controls{border-top:0}
.compact-sheets section.character-sheet[id^=hero].selected .sheet-portrait{outline:2px solid var(--mint);outline-offset:-2px}
/* Compact portraits: one fixed size for investigators and enemies alike, so the art never stretches; a taller partner in the row leaves the space at the foot of the sheet body instead */
.compact-sheets section.character-sheet[id^=hero] .portrait-slot,.compact-sheets section.character-sheet[id^=foe] .portrait-slot{height:200px;min-height:0}
@media(max-width:800px){.compact-sheets section.character-sheet[id^=hero] .portrait-slot,.compact-sheets section.character-sheet[id^=foe] .portrait-slot{height:150px}}
.compact-sheets section.character-sheet[id^=foe] .foe-desc,.compact-sheets section.character-sheet[id^=foe] .power-desc{display:none}
.compact-sheets section.character-sheet[id^=foe] .move-desc{margin-top:2px}
.compact-sheets section.character-sheet[id^=foe] .sheet-body{flex:1;padding-bottom:12px}
.compact-sheets section.character-sheet[id^=foe] .sheet-body h3{margin:4px 0 8px}
.compact-sheets section.character-sheet[id^=foe] .sheet-equipment{margin-top:8px;padding-top:10px}
.compact-sheets section.character-sheet[id^=hero] .sheet-body{flex:1;padding-bottom:6px}
.compact-sheets section.character-sheet[id^=hero] .skill-block{padding:4px 16px 12px}
.compact-sheets section.character-sheet[id^=hero] .sheet-equipment{margin-top:8px;border-top:0;padding-top:0}
.compact-sheets section.character-sheet[id^=hero] .sheet-body h3{margin:4px 0 8px}

/* Wen Ah-Lok's pride of Ulthar cats (shown on his sheet in both modes) */
.pride{margin:10px 0 4px}
.pride-label{font:600 11px system-ui;letter-spacing:.12em;color:var(--gold);margin-bottom:6px}
.pride-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.cat-chip{display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 4px;border:1px solid #5b6b57;border-radius:6px;background:#0f1f1c;text-align:center;min-width:0}
.cat-chip svg{width:26px;height:26px}
.cat-chip b{font:600 12px system-ui;color:var(--ink);overflow-wrap:anywhere}
.cat-chip small{font:11px/1.3 system-ui;color:var(--muted);overflow-wrap:anywhere}
.cat-chip.empty{justify-content:center;border-style:dashed;color:#56685f;font:11px system-ui;min-height:58px}
.cat-chip.cat-tom{border-color:#e0a95a80}.cat-chip.cat-temple{border-color:#9fd8c080}.cat-chip.cat-dream{border-color:#b9a6f080}
.compact-sheets .cat-chip small{display:none}
@media(max-width:480px){.cat-chip b{font-size:10.5px}.cat-chip small{font-size:10px}.cat-chip svg{width:22px;height:22px}}
/* Fog: swirling yellow vapour shot through with crackling lightning, over a fogged enemy's portrait */
.character-sheet.fogged{border-color:#e8d24a;animation:fogPulse 2.6s ease-in-out infinite}
@keyframes fogPulse{50%{box-shadow:0 0 0 1px #f3d84a99,0 0 26px 4px #e8c23a55}}
.fog-veil{position:absolute;inset:0;pointer-events:none;z-index:3;overflow:hidden;mix-blend-mode:screen}
.fog-swirl{position:absolute;left:50%;top:50%;width:170%;aspect-ratio:1;translate:-50% -50%;border-radius:50%;filter:blur(5px)}
.fog-swirl.s1{background:conic-gradient(from 0deg,transparent 0 6%,#f6e05aaa 15%,transparent 27%,#e8b52abb 41%,transparent 54%,#fff3a099 67%,transparent 80%);animation:fogSpin 11s linear infinite}
.fog-swirl.s2{width:130%;background:conic-gradient(from 90deg,transparent 0 10%,#ffd84a99 21%,transparent 35%,#f0c030aa 51%,transparent 65%,#fff6b088 79%,transparent 93%);animation:fogSpin 7s linear infinite reverse}
.fog-swirl.s3{width:110%;background:radial-gradient(circle,#ffe76a66 0,#e8b52a4d 38%,transparent 66%);filter:blur(12px);animation:fogBreathe 3.2s ease-in-out infinite}
@keyframes fogSpin{to{rotate:360deg}}
@keyframes fogBreathe{50%{scale:1.25;opacity:.6}}
.fog-crackle{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.fog-crackle path{fill:none;stroke:#fffbe0;stroke-width:2;stroke-linejoin:round;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 2px #ffe34a) drop-shadow(0 0 6px #f0c030);opacity:0;animation:fogCrackle 2.4s linear infinite}
.fog-crackle .b2{animation-delay:.55s}.fog-crackle .b3{animation-delay:1.1s}.fog-crackle .b4{animation-delay:1.6s}.fog-crackle .b5{animation-delay:.9s;animation-duration:1.9s}.fog-crackle .b6{animation-delay:2s;animation-duration:2.9s}
@keyframes fogCrackle{0%,100%{opacity:0}3%{opacity:1}6%{opacity:.15}8%{opacity:.9}12%{opacity:0}}
.reduced .character-sheet.fogged,.reduced .fog-swirl,.reduced .fog-crackle path{animation:none}.reduced .fog-crackle path{opacity:.55}
.cat-chip .cn-short{display:none}
.cat-chip b{overflow-wrap:normal;word-break:normal}
@media(max-width:480px){.cat-chip .cn-long{display:none}.cat-chip .cn-short{display:inline}}
.cat-chip .cat-pic{width:46px;height:46px;border-radius:50%;object-fit:cover;object-position:50% 50%;border:2px solid;display:block}
@media(max-width:480px){.cat-chip .cat-pic{width:34px;height:34px}}
/* Cats of Ulthar: one full sheet per summoned cat, stacked under the investigators in summon order */
.roster .cat-sheet{border-color:var(--cat,#9fb3a8)}
.cat-sheet.cat-tom{--cat:#e0a95a}.cat-sheet.cat-temple{--cat:#9fd8c0}.cat-sheet.cat-dream{--cat:#b9a6f0}
.cat-sheet .sheet-ribbon{background:var(--cat);color:#1a1712;font-weight:600}
.cat-sheet .tag{color:var(--cat)}
.cat-sheet .portrait-slot{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--cat) 55%,transparent)}
.cat-sheet.down .living-portrait{filter:grayscale(1) brightness(.5)}
.pride-note{display:block;font:12px system-ui;color:var(--muted);margin-top:2px}
.compact-sheets section.character-sheet[id^=cat] .cat-desc,.compact-sheets section.character-sheet[id^=cat] .cat-act,.compact-sheets section.character-sheet[id^=cat] .sheet-equipment>.eyebrow{display:none}
.compact-sheets section.character-sheet[id^=cat] .portrait-slot{height:200px;min-height:0}
@media(max-width:800px){.compact-sheets section.character-sheet[id^=cat] .portrait-slot{height:150px}}
.compact-sheets section.character-sheet[id^=cat] .sheet-body{flex:1;padding-bottom:10px}
.compact-sheets section.character-sheet[id^=cat] .sheet-body h3{margin:4px 0 8px}
.compact-sheets section.character-sheet[id^=cat] .sheet-equipment{margin-top:8px;border-top:0;padding-top:0}
.compact-sheets section.character-sheet[id^=hero] .btn-detail{display:none}

/* The Drowned Fane (secret Chapter One side chapter): darker, colder map until its own art is supplied */
body[data-chapter="fane"].mapping:before{background:linear-gradient(180deg,#02080a33 0%,#03100f8c 40%,#020807e0 100%),url('fane.webp') center top/cover no-repeat}
body[data-chapter="fane"] .route-map{background:linear-gradient(#0613114d,#020a09b3),url('fane.webp') center 60%/cover no-repeat}
body[data-chapter="fane"] .scene img{object-position:center 58%}
body[data-chapter="fane"] .map-node.combat small{letter-spacing:.6px}
.fane-btn{text-align:left;display:block;width:100%;margin-top:10px}
.fane-btn small{display:block;opacity:.8;font-size:13px;letter-spacing:0;margin-top:4px}
.fane-btn:disabled{border-color:#5d6b63}

/* Chapter One (and the Drowned Fane) map boxes: one fixed height on phones, whatever the name or status label (owner request) */
@media(max-width:800px){body[data-chapter="1"] .map-node,body[data-chapter="fane"] .map-node{height:92px;min-height:0;overflow:hidden}body[data-chapter="1"] .map-node b,body[data-chapter="fane"] .map-node b{line-height:1.15;margin:3px 0}body[data-chapter="1"] .map-node small,body[data-chapter="fane"] .map-node small{white-space:nowrap;font-size:9px;letter-spacing:.3px}}

/* The descent into the Drowned Fane (montage.js playDescent): two shots that cover the screen, a slow downward drift on the
   steps, a cross-fade into the torch-lit hall with flickering flames and embers, then a verdigris-and-gold stamped title. */
#montage.fd{background:#000}
.fd-shot{position:absolute;left:50%;top:50%;width:max(100vw,177.7vh);aspect-ratio:1672/941;transform:translate(-50%,-50%);opacity:0;transition:opacity 1.6s ease}
.fd-shot.on{opacity:1}.fd-shot.gone{opacity:0;transition:opacity 1.8s ease}
.fd-img{position:absolute;inset:0;background:center/cover no-repeat;transform-origin:50% 100%}
.fd-steps.on .fd-img{animation:fdDescend 6s cubic-bezier(.3,.1,.6,1) forwards}
@keyframes fdDescend{from{transform:scale(1.18) translateY(-4%)}to{transform:scale(1.06) translateY(2%)}}
.fd-hall .fd-img{transform-origin:50% 55%;filter:brightness(.35) saturate(.8);transition:filter 1.4s ease}
.fd-hall.on .fd-img{animation:fdPush 11.5s ease-out forwards}
.fd-hall.lit .fd-img{filter:brightness(1) saturate(1)}
@keyframes fdPush{from{transform:scale(1.02)}to{transform:scale(1.12)}}
.fd-torch{position:absolute;width:9%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,#ffd27a88 0,#ff8a2a44 35%,transparent 70%);mix-blend-mode:screen;opacity:0;transition:opacity .6s}
.fd-hall.lit .fd-torch{opacity:1;animation:fdFlicker .19s steps(2) infinite alternate}
.fd-torch+.fd-torch{animation-delay:.09s}
@keyframes fdFlicker{from{transform:translate(-50%,-50%) scale(1);filter:brightness(1)}to{transform:translate(-50%,-52%) scale(1.12);filter:brightness(1.25)}}
.fd-ember{position:absolute;width:4px;height:4px;border-radius:50%;background:#ffd88a;box-shadow:0 0 6px #ffb340;opacity:0}
.fd-hall.lit .fd-ember{animation:fdEmber 2.1s ease-out var(--d) infinite}
@keyframes fdEmber{0%{opacity:0;transform:translate(0,0)}15%{opacity:1}100%{opacity:0;transform:translate(10px,-60px)}}
.fd-cap{position:absolute;left:0;right:0;bottom:14vh;margin:0 auto;max-width:40rem;padding:0 24px;text-align:center;font:italic clamp(16px,2.2vw,22px)/1.5 Georgia,serif;color:#e8e2cc;text-shadow:0 2px 14px #000,0 0 3px #000;opacity:0;transition:opacity 1s;text-wrap:balance}
.fd-cap.on{opacity:1}
.fd-cap1{top:50%;bottom:auto;transform:translateY(-50%)}
.fd-title .cf-stamp{border-color:#5fae9a;color:#e6c77a;text-shadow:0 0 1px #5fae9a}
.fd-title .cf-stamp b{font-size:clamp(24px,6vw,60px);letter-spacing:.06em;white-space:nowrap}
.fd-title .cf-stamp small{letter-spacing:.3em;white-space:nowrap}
@media(max-width:600px){.fd-title .cf-stamp small{font-size:11px;letter-spacing:.18em}}
.fd-reduce .fd-img,.fd-reduce .fd-torch,.fd-reduce .fd-ember{animation:none!important}

/* The Old Church's map diamond: a bright, flickering blue flame burns inside it and throws tiny embers, marking the secret beneath (until the Drowned Fane is done) */
.map-node>span.has-flame{position:relative;display:inline-block}
.secret-flame{position:absolute;left:50%;bottom:20%;width:.4em;height:.66em;transform:translateX(-50%);pointer-events:none;filter:drop-shadow(0 0 2px #9fe6ff) drop-shadow(0 0 6px #3fa9ff) drop-shadow(0 0 12px #1f6fffaa)}
.secret-flame:before,.secret-flame b{content:'';position:absolute;left:50%;bottom:0;border-radius:50% 50% 50% 50%/62% 62% 38% 38%;transform-origin:50% 100%}
.secret-flame:before{width:100%;height:100%;margin-left:-50%;background:radial-gradient(ellipse at 50% 78%,#ffffff 0 16%,#a8ecff 34%,#3d9dff 62%,#1a4dff00 78%);animation:secretFlicker .9s ease-in-out infinite alternate}
.secret-flame b{width:50%;height:58%;margin-left:-25%;background:radial-gradient(ellipse at 50% 80%,#ffffff 0 38%,#d6f6ff 62%,#d6f6ff00 82%);animation:secretFlicker .55s ease-in-out infinite alternate-reverse}
.secret-flame em{position:absolute;left:50%;bottom:70%;width:2px;height:2px;margin-left:-1px;border-radius:50%;background:#e4f8ff;box-shadow:0 0 3px #7fd4ff,0 0 6px #3f9dff;opacity:0;animation:secretEmber 2.5s ease-out var(--d) infinite}
@keyframes secretFlicker{0%{transform:scale(1,1) skewX(0)}25%{transform:scale(.9,1.12) skewX(-5deg)}50%{transform:scale(1.06,.92) skewX(4deg)}75%{transform:scale(.95,1.16) skewX(-3deg)}100%{transform:scale(1.03,.97) skewX(5deg)}}
@keyframes secretEmber{0%{opacity:0;transform:translate(0,0) scale(1)}12%{opacity:1}70%{opacity:.8}100%{opacity:0;transform:translate(var(--x),-22px) scale(.4)}}
.reduced .secret-flame:before,.reduced .secret-flame b,.reduced .secret-flame em{animation:none}.reduced .secret-flame em{display:none}
@media(prefers-reduced-motion:reduce){.secret-flame:before,.secret-flame b{animation:none}.secret-flame em{display:none}}
/* Chapter One and Two mini-boss locations: the same flame in red, inside the diamond, until the location is cleared (owner request) */
.secret-flame.boss-flame{filter:drop-shadow(0 0 2px #ff6a5a) drop-shadow(0 0 6px #ff1a1a) drop-shadow(0 0 12px #b00000aa)}
.secret-flame.boss-flame:before{background:radial-gradient(ellipse at 50% 78%,#ffe9e0 0 12%,#ff6a4f 32%,#e0120c 60%,#b0000000 78%)}
.secret-flame.boss-flame b{background:radial-gradient(ellipse at 50% 80%,#fff3ec 0 30%,#ff9a80 60%,#ff9a8000 82%)}
.secret-flame.boss-flame em{background:#ffc4b8;box-shadow:0 0 3px #ff4a3a,0 0 6px #e0120c}/* Carcosa: a pale yellow flame at the Round Hillock */.secret-flame.king-flame{filter:drop-shadow(0 0 2px #fff2a8) drop-shadow(0 0 6px #f2d24a) drop-shadow(0 0 12px #c9a22baa)}.secret-flame.king-flame:before{background:radial-gradient(ellipse at 50% 78%,#fffbe8 0 12%,#fbe98a 32%,#e6c23a 60%,#c9a22b00 78%)}.secret-flame.king-flame b{background:radial-gradient(ellipse at 50% 80%,#fffef4 0 30%,#fff1a8 60%,#fff1a800 82%)}.secret-flame.king-flame em{background:#fff4c0;box-shadow:0 0 3px #f2d24a,0 0 6px #c9a22b}

/* Select screen: clicking an investigator's portrait picks (or unpicks) them, as the Select button does (owner request) */
.pick-portrait[onclick]{cursor:pointer}
.pick-portrait[onclick]:hover .living-portrait{filter:brightness(1.12)}
.pick-card.selected .pick-portrait{box-shadow:inset 0 0 0 2px #ecd28b}

/* Camilla's Three Masks */.mask-row{margin:2px 0 12px}.mask-label{margin:0 0 6px;font:600 13px system-ui;color:var(--gold)}.mask-label small{display:block;font-weight:400;color:var(--muted);margin-top:2px;line-height:1.35;letter-spacing:normal;font-size:13px}.mask-btns{display:grid;grid-template-columns:1fr;gap:8px}.mask-btns .mask-btn{margin:0;width:100%;min-height:44px;padding:10px 12px;font-size:15px;font-weight:600}.mask-btns .mask-btn.on,.mask-btns .mask-btn.on:disabled{opacity:1;border-color:#f2d58c;color:#f2d58c;background:#2a2a1c}

/* Pallid (Camilla's Unmask): while it lasts the portrait drains pale and jaundiced, the Yellow Sign hangs over it,
   breathing and now and then flickering as if it isn't quite there, a ring of small Signs turns slowly around it, and a
   pale ripple spreads out from it every few seconds. Transform and opacity only, so it stays cheap to animate. */
.portrait-slot:has(.pallid-mark) img{filter:saturate(.35) sepia(.35) brightness(1.05)}
.pallid-mark{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;z-index:4;overflow:hidden;background:radial-gradient(ellipse at 50% 55%,rgba(255,238,170,.18),rgba(255,222,120,.06) 45%,rgba(20,16,0,.28) 100%)}
.pallid-mark svg{grid-area:1/1;fill:none;stroke-linecap:round;stroke-linejoin:round}
.pallid-mark .sign{width:58%;height:58%;stroke:#ffd84a;stroke-width:6;filter:drop-shadow(0 0 6px rgba(255,210,60,.85));opacity:.6;animation:pallidBreathe 3.2s ease-in-out infinite,pallidFlicker 7s steps(1) infinite}
.pallid-mark .orbit{width:96%;height:96%;stroke:#fff1a8;stroke-width:9;opacity:.45;animation:pallidTurn 18s linear infinite}
.pallid-mark::after{content:'';grid-area:1/1;width:40%;aspect-ratio:1;border-radius:50%;border:2px solid rgba(255,230,140,.7);opacity:0;animation:pallidRipple 3.2s ease-out infinite}
@keyframes pallidBreathe{50%{opacity:.9;transform:scale(1.05)}}
@keyframes pallidFlicker{0%,100%{visibility:visible}62%{visibility:hidden}63%{visibility:visible}64.5%{visibility:hidden}66%{visibility:visible}}
@keyframes pallidTurn{to{transform:rotate(360deg)}}
@keyframes pallidRipple{0%{opacity:.75;transform:scale(.6)}100%{opacity:0;transform:scale(2.4)}}
@media (prefers-reduced-motion:reduce){.pallid-mark .sign,.pallid-mark .orbit,.pallid-mark::after{animation:none}}
.reduced .pallid-mark .sign,.reduced .pallid-mark .orbit,.reduced .pallid-mark::after{animation:none}

.mask-worn{margin:6px 0 0;font-size:12px;opacity:.75;letter-spacing:normal}
.compact-sheets .mask-worn{display:none}

/* The crossing into Carcosa (montage.js playCrossing) — built on the Fane descent's .fd-shot layers */
.cr-ring .fd-img{transform-origin:47% 65%;filter:brightness(.8)}
.cr-ring.on .fd-img{animation:crPush 9.5s ease-in-out forwards}
@keyframes crPush{from{transform:scale(1)}to{transform:scale(1.14)}}
.cr-leaves{position:absolute;width:14%;aspect-ratio:1.6;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(ellipse,#fff3b8aa 0,#f5c84255 35%,transparent 70%);mix-blend-mode:screen;opacity:.25;transition:opacity 1.4s}
.cr-ring.lit .cr-leaves{opacity:1;animation:crBreathe 2.4s ease-in-out infinite}
@keyframes crBreathe{50%{transform:translate(-50%,-50%) scale(1.15);opacity:.75}}
.cr-lamp{position:absolute;width:5%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,#ffd27a77 0,transparent 70%);mix-blend-mode:screen;animation:fdFlicker .23s steps(2) infinite alternate}
.cr-mote{position:absolute;width:4px;height:4px;border-radius:50%;background:#fff1a8;box-shadow:0 0 6px #f5c842;opacity:0}
.cr-ring.lit .cr-mote{animation:fdEmber 2.4s ease-out var(--d) infinite}
.cr-rise{position:absolute;left:-10%;right:-10%;bottom:-75%;height:95%;background:radial-gradient(ellipse 22% 30% at 15% 45%,#ece7f4 0,#ece7f400 100%),radial-gradient(ellipse 25% 32% at 38% 38%,#e4def0 0,#e4def000 100%),radial-gradient(ellipse 24% 30% at 62% 44%,#ece7f4 0,#ece7f400 100%),radial-gradient(ellipse 22% 34% at 85% 40%,#e2dcee 0,#e2dcee00 100%),linear-gradient(to top,#d9d3e6 0,#d9d3e6 45%,#d9d3e600 85%);filter:blur(10px);opacity:0;transition:transform 4.2s ease-in,opacity 2.4s}
.cr-ring.rising .cr-rise{opacity:.85;transform:translateY(-48%)}
.cr-shore .fd-img{transform-origin:49% 30%;filter:brightness(.55) saturate(.8);transition:filter 2s ease}
.cr-shore.on .fd-img{animation:crDrift 8.5s ease-out forwards}
@keyframes crDrift{from{transform:scale(1.12) translateY(2%)}to{transform:scale(1.02) translateY(0)}}
.cr-shore.lit .fd-img{filter:brightness(1) saturate(1)}
.cr-sun{position:absolute;width:11%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,#fff0c0cc 0,#ffb84a66 30%,transparent 70%);mix-blend-mode:screen;opacity:0;transition:opacity 2.4s}
.cr-shore.lit .cr-sun{opacity:1;animation:crSun 3.6s ease-in-out infinite}
.cr-sun+.cr-sun{animation-delay:1.8s}
@keyframes crSun{50%{transform:translate(-50%,-50%) scale(1.12)}}
.cr-haze{position:absolute;inset:0;background:linear-gradient(to top,#e7dcc855,transparent 40%);mix-blend-mode:screen;opacity:0;transition:opacity 3s}
.cr-shore.lit .cr-haze{opacity:1;animation:crHaze 6s ease-in-out infinite alternate}
@keyframes crHaze{to{transform:translateX(-2%)}}
.cr-title .cf-stamp{border-color:#d9b44a;color:#f0d87a;text-shadow:0 0 1px #d9b44a}
.fd-reduce .cr-leaves,.fd-reduce .cr-lamp,.fd-reduce .cr-mote,.fd-reduce .cr-sun,.fd-reduce .cr-haze{animation:none!important}

/* Carcosa (secret Chapter Two side chapter): the owner's map of the road from the Shore of Hali to the pale gate */
body[data-chapter="carcosa"].mapping:before{background:linear-gradient(180deg,#120c1a33 0%,#120c1a8c 40%,#0b0812e0 100%),url('carcosa-map.webp') center top/cover no-repeat}
body[data-chapter="carcosa"] .route-map{background:linear-gradient(#1a12224d,#0d0a14a6),url('carcosa-map.webp') center 55%/cover no-repeat}
body[data-chapter="carcosa"] .scene img{object-position:center 55%}
body[data-chapter="carcosa"] .map-node.combat small{letter-spacing:.6px}
@media(max-width:800px){body[data-chapter="carcosa"] .map-node{height:92px;min-height:0;overflow:hidden}body[data-chapter="carcosa"] .map-node b{line-height:1.15;margin:3px 0}body[data-chapter="carcosa"] .map-node small{white-space:nowrap;font-size:9px;letter-spacing:.3px}}

/* The Elder Ward while it holds (this round): a faint gold ward circle and star turning slowly over each portrait */
.elder-ward{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;z-index:4}
.elder-ward svg{width:62%;height:62%;fill:none;stroke:#ffe9a0;stroke-width:2;stroke-linejoin:round;filter:drop-shadow(0 0 5px rgba(255,216,112,.85));opacity:.5;animation:elderTurn 14s linear infinite,elderGlow 2.8s ease-in-out infinite}
.elder-ward svg .thin{stroke-width:.8}
@keyframes elderTurn{to{transform:rotate(360deg)}}
@keyframes elderGlow{50%{opacity:.8}}
@media (prefers-reduced-motion:reduce){.elder-ward svg{animation:none}}
.reduced .elder-ward svg{animation:none}
/* The Arkham Telephone Exchange (end of Chapter 3) */.exchange-head{color:var(--gold);font-size:19px;margin:24px 0 6px;padding-top:18px;border-top:1px solid var(--line)}#narrative .hint{font:13px/1.5 system-ui;color:var(--mint)}

/* Chapter 3: the Arkham map is a row taller (the Telephone Exchange sits on a top row above the Sanitarium and St. Mary’s) */body[data-chapter="3"] .route-map{height:840px}@media(max-width:800px){body[data-chapter="3"] .route-map{height:768px}}

/* Danny Corcoran's effects: the Magnesium Flash white-out and photographic negative, the Press Pass shield, the Harm cracks */
.mag-whiteout{position:fixed;inset:0;z-index:60;pointer-events:none;background:radial-gradient(circle at 50% 45%,#fff,#fffbe8 55%,#f3f0e6);opacity:0;animation:magWhite .52s ease-out forwards}
@keyframes magWhite{0%{opacity:0}12%{opacity:var(--peak,.9)}100%{opacity:0}}
.mag-negative .portrait-slot img,.mag-negative img{filter:invert(1) grayscale(.6) brightness(1.25) contrast(1.3)!important;transition:filter .5s ease-in}
.press-shield{position:absolute;inset:0;pointer-events:none;z-index:4;border:2px solid rgba(255,226,150,.85);box-shadow:inset 0 0 26px rgba(255,220,130,.45),0 0 14px rgba(255,215,120,.35);background:radial-gradient(ellipse at 50% 40%,rgba(255,240,200,.14),rgba(255,220,140,.04) 60%,transparent);overflow:hidden;animation:pressPulse 2.4s ease-in-out infinite}
.press-shield i{position:absolute;top:-20%;bottom:-20%;width:28%;left:-40%;background:linear-gradient(100deg,transparent,rgba(255,250,225,.35),transparent);transform:skewX(-14deg);animation:pressGlint 3.2s ease-in-out infinite}
@keyframes pressPulse{50%{box-shadow:inset 0 0 38px rgba(255,220,130,.6),0 0 20px rgba(255,215,120,.5)}}
@keyframes pressGlint{0%,55%{left:-40%}100%{left:125%}}
.harm-mark{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;z-index:4;overflow:hidden;background:radial-gradient(ellipse at 50% 50%,rgba(150,70,230,.16),rgba(60,10,100,.1) 50%,rgba(20,0,40,.4) 100%)}
.harm-mark svg{grid-area:1/1;fill:none;stroke-linecap:round;stroke-linejoin:round}
.harm-mark .cracks{width:88%;height:88%;stroke:#d9b6ff;stroke-width:1.6;filter:drop-shadow(0 0 4px #a35cff) drop-shadow(0 0 10px #7a2fd0);animation:harmPulse 1.8s ease-in-out infinite}
.harm-mark .ticks{width:94%;height:94%;stroke:#c79bff;stroke-width:1;opacity:.55;animation:harmTurn 14s linear infinite}
.harm-mark .ticks .dash{stroke-dasharray:3 4;stroke-width:1.4}
@keyframes harmPulse{0%,100%{opacity:.45}50%{opacity:.95}}
@keyframes harmTurn{to{transform:rotate(360deg)}}
.foe-portrait:has(.harm-mark) img{filter:saturate(.7) hue-rotate(-12deg) brightness(.92)}
.reduced .press-shield,.reduced .press-shield i,.reduced .harm-mark .cracks,.reduced .harm-mark .ticks{animation:none}
@media (prefers-reduced-motion:reduce){.press-shield,.press-shield i,.harm-mark .cracks,.harm-mark .ticks,.mag-whiteout{animation:none}}
/* Chapter 4: Yuggoth — the owner's map of the black city behind the route map and the map page; nodes sized like Arkham's four columns */body[data-chapter="4"].mapping:before{background:linear-gradient(180deg,#0b0a1440 0%,#0b0a1499 38%,#07060de0 100%),url('yuggoth-map.webp') center top/cover no-repeat}body[data-chapter="4"] .route-map{background:linear-gradient(#120f2033,#0a0814a6),url('yuggoth-map.webp') center/cover no-repeat}@media(max-width:800px){body[data-chapter="4"] .map-node{width:23%;min-height:72px;padding:5px 2px}body[data-chapter="4"] .map-node b{font-size:12px;line-height:1.15;margin:3px 0}body[data-chapter="4"] .map-node small{font-size:8px;letter-spacing:.5px}body[data-chapter="4"] .map-node>span{font-size:16px}}body[data-chapter="4"] .scene img{object-position:center 40%}
/* The Chapter 3 → 4 Case File: a wide star chart, then M.U.'s machine (its lenses light one by one) and a violet flash to Yuggoth */.cf-map.cf-map-wide{width:min(96vw,1100px,calc((82vh - 40px) * 2))}.cf-machine .cf-dun{display:none}.cf-mach,.cf-yug{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);opacity:0;transition:opacity 1.2s}.cf-mach{width:max(100vw,150vh);aspect-ratio:3/2}.cf-yug{width:max(100vw,177.7vh);aspect-ratio:1672/941;transition:opacity 1.8s}.cf-burning .cf-mach,.cf-yug.on{opacity:1}.cf-mach-img,.cf-yug-img{position:absolute;inset:0;background:center/cover no-repeat}.cf-mach-img{transform-origin:55.5% 42.7%;filter:brightness(.55)}.cf-dunwich .cf-mach-img{animation:cfMachPush 5s ease-out forwards}@keyframes cfMachPush{to{transform:scale(1.1);filter:brightness(1)}}.cf-yug-img{transform:scale(1.12)}.cf-yug.on .cf-yug-img{animation:cfYugDrift 8.5s ease-out forwards}@keyframes cfYugDrift{to{transform:scale(1)}}.cf-lens{position:absolute;aspect-ratio:1;transform:translate(-50%,-50%) scale(.3);border-radius:50%;background:radial-gradient(circle,#f4ecff 0,#b48cffcc 18%,#7a3cff55 42%,transparent 70%);mix-blend-mode:screen;opacity:0;transition:opacity .5s,transform .9s cubic-bezier(.3,1.4,.5,1)}.cf-lens.on{opacity:1;transform:translate(-50%,-50%) scale(1);animation:cfLens 1.4s ease-in-out .9s infinite alternate}@keyframes cfLens{to{filter:brightness(1.5)}}.cf-flash{position:absolute;inset:0;background:radial-gradient(circle at 55% 43%,#faf5ff 0,#b48cffee 35%,#2a1050 100%);opacity:0;pointer-events:none;transition:opacity .35s}.cf-flash.on{opacity:1}.cf-flash.on.off{opacity:0;transition:opacity 1.6s}.cf-reduce .cf-mach-img,.cf-reduce .cf-yug-img,.cf-reduce .cf-lens{animation:none!important}
/* The City of the Great Race: the Hall of Other Minds' green marker while a Record-Plate is carried */.secret-flame.archive-flame{filter:drop-shadow(0 0 2px #9effc8) drop-shadow(0 0 6px #2fd47a) drop-shadow(0 0 12px #0f8a4aaa)}.secret-flame.archive-flame:before{background:radial-gradient(ellipse at 50% 78%,#f2fff7 0 14%,#8ff0bb 34%,#22b865 62%,#0a6a3a00 78%)}.secret-flame.archive-flame b{background:radial-gradient(ellipse at 50% 80%,#ffffff 0 34%,#c8ffe0 62%,#c8ffe000 82%)}.secret-flame.archive-flame em{background:#e6fff0;box-shadow:0 0 3px #7fe0aa,0 0 6px #2fb46a}
/* The City of the Great Race: its map, and the crossing cut-scene (plates light, the lens opens, a corridor of years, a green flash, the ramp) */body[data-chapter="great"].mapping:before{background:linear-gradient(180deg,#0d121433 0%,#0d12148c 40%,#080b0ce0 100%),url('great-race-map.webp') center top/cover no-repeat}body[data-chapter="great"] .route-map{background:linear-gradient(#0f15174d,#080c0da6),url('great-race-map.webp') center 55%/cover no-repeat}body[data-chapter="great"] .scene img{object-position:center 45%}body[data-chapter="great"] .map-node.combat small{letter-spacing:.6px}body[data-chapter="great"] .map-node{height:92px;min-height:0;overflow:hidden}body[data-chapter="great"] .map-node b{line-height:1.15;margin:3px 0}body[data-chapter="great"] .map-node small{white-space:nowrap;font-size:9px;letter-spacing:.3px}
.gr-cyl .fd-img{transform-origin:41.7% 23%;filter:brightness(.5) saturate(.8);transition:filter 1.6s ease,transform 3.4s cubic-bezier(.5,0,.9,.6)}.gr-cyl.on .fd-img{animation:crPush 9.5s ease-in-out forwards}.gr-cyl.lit .fd-img{filter:brightness(1) saturate(1)}.gr-cyl.deep .fd-img{animation:none;transform:scale(2.6);transform-origin:76% 29%;filter:brightness(1.4) saturate(.9)}
.gr-plate{position:absolute;width:22%;aspect-ratio:2.2;transform:translate(-50%,-50%);border-radius:40%;background:radial-gradient(ellipse,#c8ffe099 0,#5fe0a044 40%,transparent 70%);mix-blend-mode:screen;opacity:0;transition:opacity .6s}.gr-plate.on{opacity:1;animation:crBreathe 2.2s ease-in-out infinite}
.gr-lens{position:absolute;width:20%;aspect-ratio:1;transform:translate(-50%,-50%) scale(.6);border-radius:50%;background:radial-gradient(circle,#f4fff8 0,#9ff0c4cc 18%,#2fc47a55 45%,transparent 70%);mix-blend-mode:screen;opacity:0;transition:opacity .8s,transform 1.4s cubic-bezier(.3,1.4,.5,1)}.gr-cyl.lit .gr-lens{opacity:1;transform:translate(-50%,-50%) scale(1.15);animation:grSpin 3s linear infinite}@keyframes grSpin{to{filter:hue-rotate(25deg) brightness(1.25)}}
.gr-deep{position:absolute;width:16%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,#ffffff 0,#d8fff0aa 25%,transparent 70%);mix-blend-mode:screen;opacity:0;transition:opacity 2s}.gr-cyl.deep .gr-deep{opacity:1}
.gr-flash{position:absolute;inset:0;background:radial-gradient(circle at 60% 40%,#ffffff 0,#c8ffe0ee 35%,#0b2a1c 100%);opacity:0;pointer-events:none;transition:opacity .35s}.gr-flash.on{opacity:1}.gr-flash.on.off{opacity:0;transition:opacity 1.6s}
.gr-ramp .fd-img{transform-origin:30% 50%;filter:brightness(.55) saturate(.8);transition:filter 2s ease}.gr-ramp.on .fd-img{animation:crDrift 8.5s ease-out forwards}.gr-ramp.lit .fd-img{filter:brightness(1) saturate(1)}
.gr-title .cf-stamp{border-color:#6fd49a;color:#a8f0c6;text-shadow:0 0 1px #6fd49a;max-width:calc(100vw - 48px);box-sizing:border-box}.gr-title .cf-stamp b{white-space:normal;line-height:1.1}.gr-title .cf-stamp b span{display:inline-block;white-space:nowrap}
.gr-title .cf-stamp{text-align:center}@media(max-width:600px){.gr-title .cf-stamp small{white-space:normal;line-height:1.5}}
.fd-reduce .gr-plate,.fd-reduce .gr-lens,.cf-reduce .gr-cyl .fd-img,.cf-reduce .gr-ramp .fd-img{animation:none!important}

/* ── Ossek-Ul's skills (12 Oct 2026): Polaris Beam and Cylinder Whisper ── */
.polaris-scan .portrait-slot::after{content:'';position:absolute;inset:0;pointer-events:none;z-index:3;mix-blend-mode:screen;background:linear-gradient(180deg,transparent 0,transparent 44%,rgba(210,245,255,.95) 50%,rgba(140,210,255,.3) 53%,transparent 60%),repeating-linear-gradient(0deg,rgba(150,215,255,.13) 0 2px,transparent 2px 5px),linear-gradient(rgba(74,168,255,.22),rgba(74,168,255,.22));background-size:100% 300%,100% 100%,100% 100%;animation:polarisScan 1.05s ease-in-out forwards}
@keyframes polarisScan{0%{background-position:0 100%,0 0,0 0;opacity:0}10%{opacity:1}88%{opacity:1}100%{background-position:0 0,0 -40px,0 0;opacity:0}}
.polaris-ghost{position:fixed;z-index:55;pointer-events:none;overflow:hidden;animation:polarisGhost 1.15s cubic-bezier(.2,.7,.3,1) forwards}
.polaris-ghost img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) sepia(1) hue-rotate(165deg) saturate(3.2) brightness(1.35) contrast(1.15);mix-blend-mode:screen;-webkit-mask-image:radial-gradient(ellipse 70% 70% at 50% 50%,#000 55%,transparent 100%);mask-image:radial-gradient(ellipse 70% 70% at 50% 50%,#000 55%,transparent 100%)}
@keyframes polarisGhost{0%{opacity:0;transform:none}22%{opacity:.9;transform:translate(calc(var(--dx)*.08),calc(var(--dy)*.08)) scale(1.02)}100%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(1.1);filter:blur(3px)}}
.polaris-materialize{animation:polarisCard 1.3s ease-out}
.polaris-materialize .living-portrait{animation:polarisForm 1.25s ease-out!important}
@keyframes polarisCard{0%{box-shadow:0 0 0 0 rgba(150,215,255,0)}30%{box-shadow:0 0 46px 8px rgba(150,215,255,.75),inset 0 0 30px rgba(150,215,255,.4)}100%{box-shadow:0 0 0 0 rgba(150,215,255,0)}}
@keyframes polarisForm{0%{opacity:0;filter:grayscale(1) sepia(1) hue-rotate(165deg) saturate(3) brightness(3) blur(8px);transform:scaleY(.04)}35%{opacity:.9;transform:scaleY(1.04)}55%{filter:grayscale(1) sepia(1) hue-rotate(165deg) saturate(2.5) brightness(1.6) blur(1px)}100%{opacity:1;filter:none;transform:none}}
.ally-polaris .portrait-slot::after{content:'';position:absolute;inset:0;pointer-events:none;z-index:2;mix-blend-mode:screen;background:repeating-linear-gradient(0deg,rgba(150,215,255,.10) 0 2px,transparent 2px 5px),linear-gradient(180deg,rgba(74,168,255,.18),rgba(74,168,255,.06));animation:polarisShimmer 2.6s linear infinite}
.ally-polaris .living-portrait{filter:saturate(.55) brightness(1.08) contrast(1.05)}
@keyframes polarisShimmer{0%{background-position:0 0,0 0;opacity:.85}50%{opacity:1}100%{background-position:0 -50px,0 0;opacity:.85}}
.polaris-dissolve{animation:polarisDissolve 1.15s ease-in forwards}
@keyframes polarisDissolve{0%{opacity:1;filter:none}40%{filter:brightness(1.6) saturate(.4)}100%{opacity:0;filter:brightness(2.4) blur(6px) saturate(0)}}
.cyl-sucked .living-portrait{animation:cylSuck 1s cubic-bezier(.6,0,.85,.35) forwards!important}
@keyframes cylSuck{0%{transform:none;filter:none}35%{filter:sepia(.6) hue-rotate(70deg) saturate(1.6) brightness(1.2)}100%{transform:rotate(600deg) scale(.03);filter:sepia(1) hue-rotate(70deg) saturate(2) brightness(2) blur(2px);opacity:.15}}
.cyl-hidden .living-portrait{opacity:0}
.cyl-emerge .living-portrait{animation:cylEmerge 1s cubic-bezier(.2,.9,.3,1.25)!important}
.cyl-emerge{animation:cylCard 1.1s ease-out}
@keyframes cylEmerge{0%{opacity:0;transform:translateY(40%) scale(.05) rotate(-300deg);filter:sepia(1) hue-rotate(70deg) brightness(3) blur(4px)}60%{opacity:1;filter:sepia(.4) hue-rotate(60deg) brightness(1.4)}100%{transform:none;filter:none}}
@keyframes cylCard{0%{box-shadow:0 0 0 0 rgba(159,232,180,0)}35%{box-shadow:0 0 44px 8px rgba(159,232,180,.7),inset 0 0 26px rgba(216,168,90,.45)}100%{box-shadow:0 0 0 0 rgba(159,232,180,0)}}
.ally-captive{box-shadow:inset 0 0 0 1px rgba(216,168,90,.55),0 0 18px rgba(159,232,180,.18)}
.satchel-receive{animation:satchelReceive .95s ease-out}
@keyframes satchelReceive{0%{box-shadow:0 0 0 0 rgba(159,232,180,0)}30%{box-shadow:0 0 34px 6px rgba(159,232,180,.65)}100%{box-shadow:0 0 0 0 rgba(159,232,180,0)}}
@media (prefers-reduced-motion:reduce){.polaris-scan .portrait-slot::after,.polaris-ghost,.polaris-materialize,.polaris-materialize .living-portrait,.ally-polaris .portrait-slot::after,.polaris-dissolve,.cyl-sucked .living-portrait,.cyl-emerge,.cyl-emerge .living-portrait,.satchel-receive{animation:none!important}.polaris-ghost{display:none}.cyl-hidden .living-portrait{opacity:1}}

/* ── Chapter 5: R'lyeh (phase a, 12 Oct 2026) — a dark-sea stand-in until the owner's map arrives; five rows, nodes sized like Chapter 4's ── */
body[data-chapter="5"].mapping:before{background:linear-gradient(180deg,#0b111240 0%,#0b11129c 40%,#06090ae6 100%),url('rlyeh-map-wide.webp') center top/cover no-repeat}
[data-chapter="5"] .route-map{height:820px;background:linear-gradient(#0d141530,#080d0e8c),url('rlyeh-map-wide.webp') center/cover no-repeat}
[data-chapter="5"] .scene img{object-position:center 35%}
@media(max-width:800px){[data-chapter="5"] .map-node{width:23%;min-height:72px;padding:5px 2px}
[data-chapter="5"] .map-node b{font-size:12px;line-height:1.15;margin:3px 0}
[data-chapter="5"] .map-node small{font-size:8px;letter-spacing:.5px}
[data-chapter="5"] .map-node>span{font-size:16px}}
/* Phones keep the owner's tall map, which shows the whole climb from the steamer to the Door; wider screens use the wide one. */
@media (max-width:600px){[data-chapter="5"] .route-map{height:780px;background:linear-gradient(#0d141530,#080d0e8c),url('rlyeh-map.webp') center/cover no-repeat}body[data-chapter="5"].mapping:before{background:linear-gradient(180deg,#0b111240 0%,#0b11129c 40%,#06090ae6 100%),url('rlyeh-map.webp') center 30%/cover no-repeat}}
.bell-track{margin:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-width:150px}
.bell-track .bells{display:grid;grid-template-columns:repeat(6,14px);gap:7px 8px;padding:10px 12px;border:1px solid #8a7444;border-radius:999px;background:radial-gradient(ellipse,#2a2316,#120f0a);box-shadow:inset 0 0 12px #000c,0 0 10px #c9a2541f}
.bell-track i{width:14px;height:14px;border-radius:50% 50% 45% 45%;background:#3a3122;border:1px solid #6b5a3a;position:relative}
.bell-track i.mark{border-color:#b04a3a}
.bell-track i.struck{background:radial-gradient(circle at 40% 35%,#fff1c4,#d9a94c 55%,#7a5a22);border-color:#f3d58a;box-shadow:0 0 8px #e8b95a99}
.bell-track figcaption{font-size:10px;letter-spacing:.14em;color:#d9c08a}
[data-chapter="5"] .clue-tokens{flex-wrap:wrap}
@media (max-width:600px){.bell-track{flex-basis:100%}}
/* The Chapter 4 → 5 Case File: the ship's chart, then the Sable Petrel in the storm (amber deck lanterns, lightning) and a green flash to R'lyeh */
.cf-map.cf-map-chart{width:min(96vw,1000px,calc((82vh - 40px) * 1.5))}
.cf-sea .cf-lens{background:radial-gradient(circle,#fff6dc 0,#ffc66acc 18%,#ff9a2a55 42%,transparent 70%)}
.cf-sea .cf-flash{background:radial-gradient(circle at 60% 40%,#f2fff4 0,#8fe8a8ee 35%,#0a2a1a 100%)}
.cf-storm::after{content:'';position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen;background:radial-gradient(ellipse at 78% 22%,#eef6ff 0,#cbb3ff88 28%,transparent 62%);opacity:0}
.cf-dunwich .cf-storm::after{animation:cfLightning 3.4s linear .6s infinite}
@keyframes cfLightning{0%,100%{opacity:0}4%{opacity:.85}6%{opacity:.1}8%{opacity:.7}12%{opacity:0}61%{opacity:0}63%{opacity:.6}66%{opacity:0}}
.cf-reduce .cf-storm::after{animation:none!important}
/* Chapter 5 ending: the epilogue, the tally, the credits */
.epilogue{margin:26px 0 0;padding:18px 0 0;border-top:1px solid var(--line)}.epilogue h4{margin:0 0 12px;font:600 12px/1.4 system-ui;letter-spacing:.18em;color:var(--gold)}.epilogue p{margin:0 0 12px}.epilogue p b{color:var(--gold);font-weight:600}.epilogue.tally p{margin:0 0 4px;font:14px/1.55 system-ui;color:var(--muted)}.epilogue.credits p{font-size:14px;color:var(--muted)}.epilogue .the-end{margin:28px 0 6px;text-align:center;font:400 30px/1.2 Georgia,serif;letter-spacing:.32em;color:var(--gold)}.epilogue .trophy-note{text-align:center;color:var(--mint);font:14px/1.4 system-ui}
.trophy.final{grid-column:1/-1;border-color:var(--gold)}
/* Ossek-Ul's Lens of Ages: the struck portrait yellows and crazes like an old photograph, then clears */
.lens-aged .living-portrait{animation:lensAged .9s ease-out}
.lens-aged .portrait-slot::after{content:'';position:absolute;inset:0;pointer-events:none;z-index:3;mix-blend-mode:screen;background:radial-gradient(ellipse 60% 60% at 50% 50%,rgba(255,230,170,.35),transparent 70%),repeating-linear-gradient(115deg,transparent 0 22px,rgba(255,240,200,.18) 22px 23px,transparent 23px 41px),repeating-linear-gradient(35deg,transparent 0 31px,rgba(200,255,225,.14) 31px 32px,transparent 32px 57px);animation:lensCraze .9s ease-out forwards}
@keyframes lensAged{0%{filter:none}18%{filter:sepia(1) contrast(1.35) brightness(1.45) saturate(.8)}45%{filter:sepia(.85) contrast(1.2) brightness(1.05) blur(.6px)}100%{filter:none}}
@keyframes lensCraze{0%{opacity:0}15%{opacity:1}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.lens-aged .living-portrait,.lens-aged .portrait-slot::after{animation:none}}
/* Ezra Coffin: the Pocket Pistol's shot pips, the Waking Arm's tier ladder, and The Call's darkness */
.pocket-btn .shot-pips{display:inline-flex;gap:4px;margin-left:8px;vertical-align:middle}.pocket-btn .shot-pips i{width:7px;height:12px;border-radius:2px 2px 1px 1px;border:1px solid #b9a26a;background:transparent}.pocket-btn .shot-pips i.live{background:linear-gradient(#f3d58c,#a8823a)}
.waking-skill .wake-ladder{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;pointer-events:none;cursor:default;display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin-top:6px}.wake-tier{display:flex;flex-direction:column;align-items:center;padding:4px 2px;border:1px solid #2c403a;border-radius:3px;font:11px/1.2 system-ui;color:#7f938b;text-align:center;background:#0f1d1a}.wake-tier b{font:600 13px/1.2 system-ui;color:#9fb3ab}.wake-tier.past{border-color:#3d5a52;color:#9fb3ab}.wake-tier.now{border-color:#7fe0c4;color:#e6fff7;background:linear-gradient(#18352e,#0f1d1a);box-shadow:0 0 0 1px #7fe0c455 inset}.wake-tier.now b{color:#bdfbe6}
.waking-skill .skill-btn.waking-full{animation:wakingFull 1.6s ease-in-out infinite}@keyframes wakingFull{0%,100%{box-shadow:0 0 0 0 #5fe0bd00}50%{box-shadow:0 0 0 3px #5fe0bd66,0 0 18px #5fe0bd55}}
.waking-call-dim{position:fixed;inset:0;z-index:29;pointer-events:none;background:radial-gradient(ellipse at 50% 100%,rgba(8,40,36,.55),rgba(2,8,8,.82) 70%);animation:wakingDim 2.2s ease-in-out forwards}@keyframes wakingDim{0%{opacity:0}18%{opacity:1}70%{opacity:.9}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.waking-skill .skill-btn.waking-full,.waking-call-dim{animation:none}.waking-call-dim{display:none}}
/* Kingsport (the Chapter Three side chapter): its map */
body[data-chapter="kingsport"].mapping:before{background:linear-gradient(180deg,#0c121433 0%,#0c12148c 40%,#070b0ce0 100%),url('kingsport-map.webp') center top/cover no-repeat}body[data-chapter="kingsport"] .route-map{background:linear-gradient(#0e14164d,#080c0da6),url('kingsport-map.webp') center/cover no-repeat}body[data-chapter="kingsport"] .scene img{object-position:center 55%}
/* Kingsport's crossing: the river at dusk (a slow drift, the stern lantern swinging), then the bells in the snow */
/* Kingsport crossing (reworked 13 Oct 2026 for phones): the camera is moved by montage.js (transform, origin top-left); dimming is an
   overlay's opacity rather than a filter on the huge painting; lamps glow without blend modes; snow is a small canvas */
.kp-shot .fd-img{transform-origin:0 0;will-change:transform;animation:none}.kp-shot .fd-img::after{content:'';position:absolute;inset:0;background:#000;opacity:.6;transition:opacity 2s ease;pointer-events:none}.kp-shot.lit .fd-img::after{opacity:0}
.kp-belfry .fd-img::after{background:radial-gradient(ellipse 60% 50% at 73.5% 12%,transparent 0,#000 75%);opacity:.75}.kp-belfry.lit .fd-img::after{opacity:.35}.kp-sky{background:#0b100f}.kp-sky .fd-img::before{content:'';position:absolute;left:0;right:0;bottom:100%;height:30%;background:linear-gradient(#0b100f,#1b2321)}
.kp-lamp{position:absolute;z-index:1;width:7%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,#fff1c8aa 0,#ffbf6a55 20%,#ff9a3a1c 45%,transparent 68%);opacity:0;transition:opacity 1.2s;will-change:opacity}.kp-lamp.kp-small{width:4%}.kp-lamp.kp-tiny{width:2.6%}.kp-lamp.kp-stern{width:10%}
.lit .kp-lamp{opacity:1;animation:kpFlicker 1.1s ease-in-out infinite alternate}.lit .kp-lamp:nth-child(2n){animation-duration:1.5s;animation-delay:-.4s}.lit .kp-lamp:nth-child(3n){animation-duration:.9s;animation-delay:-.7s}.lit .kp-stern{animation:kpSwing 2.6s ease-in-out infinite}
@keyframes kpFlicker{0%{opacity:.7;transform:translate(-50%,-50%) scale(.9)}100%{opacity:1;transform:translate(-50%,-50%) scale(1.08)}}@keyframes kpSwing{0%,100%{transform:translate(-56%,-50%) scale(1)}50%{transform:translate(-44%,-48%) scale(1.06)}}
.kp-bell,.kp-ring{position:absolute;z-index:2;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;will-change:transform,opacity}.kp-bell{width:7%;background:radial-gradient(circle,#fff6d8 0,#ffd27acc 18%,#ffb24a40 45%,transparent 70%);opacity:0;transition:opacity 1.4s}.lit .kp-bell{opacity:.55}.kp-bell.toll{animation:kpToll 1.9s ease-out}@keyframes kpToll{0%{opacity:.55;transform:translate(-50%,-50%) scale(1)}10%{opacity:1;transform:translate(-50%,-50%) scale(1.9)}100%{opacity:.55;transform:translate(-50%,-50%) scale(1)}}
.kp-ring{width:6%;border:1.5px solid #ffe2a0aa;box-shadow:0 0 14px #ffcf7a77,inset 0 0 10px #ffcf7a44;opacity:0}.kp-ring.toll{animation:kpRing 2s cubic-bezier(.2,.6,.3,1) both}@keyframes kpRing{0%{opacity:.75;transform:translate(-50%,-50%) scale(.6)}60%{opacity:.25}100%{opacity:0;transform:translate(-50%,-50%) scale(4.6)}}
.kp-fog{position:absolute;inset:-15%;pointer-events:none;will-change:transform;background:radial-gradient(ellipse 40% 18% at 30% 60%,#dfe8e626,transparent 70%),radial-gradient(ellipse 50% 20% at 75% 45%,#dfe8e61f,transparent 70%),radial-gradient(ellipse 35% 14% at 55% 75%,#dfe8e61a,transparent 70%);animation:kpFog 16s linear infinite alternate}.kp-fog2{opacity:.8;animation-duration:12s}@keyframes kpFog{from{transform:translateX(-4%)}to{transform:translateX(4%)}}
.kp-snowc{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:0;transition:opacity 2s}.kp-snowc.on{opacity:.9}
@media (max-width:700px){.kp .cf-grain{display:none}.kp .fd-cap{bottom:16vh}}
.kp-title .cf-stamp{border-color:#e7c27a;color:#f3d79a;text-shadow:0 0 1px #e7c27a;max-width:calc(100vw - 48px);box-sizing:border-box;text-align:center}.kp-title .cf-stamp b{white-space:normal;line-height:1.1}@media(max-width:600px){.kp-title .cf-stamp small{white-space:normal;line-height:1.5}}
.fd-reduce .kp-lamp,.fd-reduce .kp-bell,.fd-reduce .kp-ring,.fd-reduce .kp-fog{animation:none!important}

/* The Turntale Games intro (owner's animated logo) before the game: the logo on its own near-white, then a fade to black */
body.splash-open{overflow:hidden}
#splash{position:fixed;inset:0;z-index:300;display:flex;flex-direction:column;background:radial-gradient(ellipse at center,#fff 0,#faf9fc 60%,#eeedf6 100%);color:#302438;font-family:system-ui,sans-serif}
#splash::after{content:'';position:absolute;inset:0;background:#000;opacity:0;pointer-events:none;transition:opacity .75s ease}
#splash.out::after{opacity:1}#splash.out{animation:splashGone .55s .8s ease forwards;pointer-events:none}@keyframes splashGone{to{opacity:0}}
.splash-stage{position:relative;flex:1;min-height:0;margin:24px 16px 0;overflow:hidden;opacity:0;transition:opacity .4s}
.splash-stage canvas{display:block;width:100%;height:100%}
#splashStatus{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
#splash #splashSkip{all:unset;box-sizing:border-box;text-align:center;display:none;align-self:center;flex:none;margin:12px auto max(22px,env(safe-area-inset-bottom));border:1px solid #49325c35;border-radius:30px;background:#ffffffa0;color:#49385b;padding:11px 18px;min-height:42px;font:500 12px system-ui,sans-serif;cursor:pointer}
#splash #splashSkip:hover{background:#fff}#splash #splashSkip:focus-visible{outline:2px solid #9061b4;outline-offset:3px}
#splash.playing .splash-stage{opacity:1}#splash.playing #splashSkip{display:block}
@media(max-width:420px){.splash-stage{margin:12px 8px 0}}

/* The opening cut-scene (owner request, 13 Oct 2026; montage.js playOpening) */
.in .in-shot{transition:opacity 1.2s ease}.in .in-mont{transition:opacity .12s linear}.in .in-mont.on{transition:opacity .12s linear}
.in-eye{position:absolute;left:50%;top:50%;width:70vw;height:2px;margin-left:-35vw;margin-top:-1px;border-radius:50%;background:radial-gradient(ellipse at center,#f4f8ff 0,#c9d6ff 30%,#c9d6ff00 70%);opacity:0;transform:scaleX(.05);transition:opacity 1s ease,transform 1.6s cubic-bezier(.2,.7,.2,1)}
.in-eye.on{opacity:1;transform:scaleX(1)}.in-eye.open{transform:scaleX(1.2) scaleY(260);opacity:.0;transition:transform 1.1s cubic-bezier(.6,0,.9,.4),opacity 1.1s ease .2s}.in-eye.gone{display:none}
.in-beam{position:absolute;z-index:1;width:76%;aspect-ratio:1;transform:translate(-50%,-50%) rotate(0deg);background:conic-gradient(from 251deg at 50% 50%,#fff7df00 0deg,#fff7dfb0 7deg,#fff8e6e0 9deg,#fff7dfb0 11deg,#fff7df00 18deg,#fff7df00 360deg);-webkit-mask-image:radial-gradient(circle at 50% 50%,#000 0,#000a 12%,#0004 30%,#0000 50%);mask-image:radial-gradient(circle at 50% 50%,#000 0,#000a 12%,#0004 30%,#0000 50%);mix-blend-mode:screen;filter:blur(2px);opacity:0;transition:opacity 1.5s;will-change:transform,opacity}
/* lies over the beam painted into the picture (lamp at 86.9% / 30.9%, shining left and a little down): it brightens and fades as the light turns, with a slight shimmer, rather than sweeping off it */
.lit .in-beam{animation:inBeam 3.6s ease-in-out infinite}@keyframes inBeam{0%,100%{opacity:.2;transform:translate(-50%,-50%) rotate(-1.5deg)}45%{opacity:.8;transform:translate(-50%,-50%) rotate(1.2deg)}60%{opacity:.65;transform:translate(-50%,-50%) rotate(.6deg)}}
.lit .in-lamp{animation:inLamp 3.6s ease-in-out infinite}@keyframes inLamp{0%,100%{opacity:.55;transform:translate(-50%,-50%) scale(.85)}45%{opacity:1;transform:translate(-50%,-50%) scale(1.25)}}
.in-glow{position:absolute;z-index:1;width:34%;aspect-ratio:1.6;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(ellipse,#59ffb055 0,#2fd08a22 40%,#2fd08a00 70%);opacity:0;transition:opacity 2s;animation:inGlow 3.2s ease-in-out infinite alternate;will-change:opacity}
.lit .in-glow{opacity:1}.in-reef{width:30%}@keyframes inGlow{from{opacity:.45}to{opacity:1}}
.in-flash{position:absolute;inset:0;pointer-events:none;opacity:0;background:#eaf2ff}
.in-flash.lightning{animation:inLight 1.1s ease-out}.in-flash.lightning2{animation:inLight 1.1s ease-out;--a:.35}
@keyframes inLight{0%{opacity:0}4%{opacity:var(--a,.75)}10%{opacity:.08}16%{opacity:calc(var(--a,.75)*.8)}100%{opacity:0}}
.in-flash.hit{background:#fff;animation:inHit .32s ease-out}.in-flash.soft{background:#cfe8ff;animation:inHit .7s ease-out;--h:.25}.in-flash.gold{background:#ffe6a8;animation:inHit 1.4s ease-out;--h:.55}
@keyframes inHit{from{opacity:var(--h,.42)}to{opacity:0}}
.in-fx{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:0;transition:opacity 1s}.in-fx.on{opacity:1}
.in-cap{z-index:3}
.in-telegram{position:absolute;left:50%;bottom:16vh;z-index:3;width:min(86vw,640px);margin:0;transform:translate(-50%,12px) rotate(-1.2deg);padding:12px 18px 14px;background:linear-gradient(#efe2bdf2,#e6d5a8f2);color:#2a2116;box-shadow:0 10px 30px #000a;font:700 clamp(13px,1.9vw,19px)/1.45 "Courier New",Courier,monospace;letter-spacing:.08em;opacity:0;transition:opacity .5s,transform .5s}
.in-telegram.on{opacity:1;transform:translate(-50%,0) rotate(-1.2deg)}.in-telegram.gone{opacity:0;transition:opacity .25s}
.in-tg-head{display:block;font-size:.62em;letter-spacing:.3em;color:#7a5a2a;border-bottom:1px dashed #7a5a2a88;padding-bottom:5px;margin-bottom:6px}
.in-tg-text:after{content:'▌';animation:inCaret .6s steps(2) infinite}@keyframes inCaret{50%{opacity:0}}
.in-label{position:absolute;left:max(24px,5vw);top:calc(9vh + 18px);z-index:3;margin:0;font:600 clamp(11px,1.4vw,14px)/1 system-ui,sans-serif;letter-spacing:.42em;text-transform:uppercase;color:#e8dcc0;text-shadow:0 2px 10px #000;opacity:0}
.in-label.on{animation:inLabel 1.35s ease-out forwards}@keyframes inLabel{0%{opacity:0;transform:translateX(-14px)}15%{opacity:1;transform:none}80%{opacity:1}100%{opacity:.0}}
.in-rays{position:absolute;inset:-10% 0 30% 0;z-index:1;pointer-events:none;background:repeating-linear-gradient(100deg,#bff3ff00 0,#bff3ff00 7%,#bff3ff1c 9%,#bff3ff00 12%);-webkit-mask-image:linear-gradient(#000,#0000);mask-image:linear-gradient(#000,#0000);will-change:transform;animation:inRays 9s ease-in-out infinite alternate}
@keyframes inRays{from{transform:translateX(-3%) skewX(-4deg)}to{transform:translateX(3%) skewX(4deg)}}
.in-hub{width:10%}
.in-water{position:absolute;inset:0;opacity:0;transition:opacity 1.6s;background:radial-gradient(ellipse at 50% 58%,#0f2a2f 0,#071518 55%,#020708 100%);overflow:hidden}
.in-water.on{opacity:1}.in-water i{position:absolute;left:-20%;right:-20%;top:52%;height:60%;background:repeating-radial-gradient(ellipse at 50% 0,#7fe0d90e 0 2px,#7fe0d900 3px 26px);transform-origin:50% 0;transform:perspective(500px) rotateX(62deg);will-change:transform;animation:inWater 7s linear infinite}
@keyframes inWater{from{background-position:0 0}to{background-position:0 260px}}
.in-title{position:absolute;left:0;right:0;top:44%;transform:translateY(-50%);z-index:4;text-align:center;pointer-events:none;padding:0 16px}
.in-tw{position:relative}.in-title h2{display:block;margin:0;font:400 clamp(34px,6.6vw,96px)/1.05 Georgia,"Times New Roman",serif;letter-spacing:.1em;text-transform:uppercase;color:#e9d39c;text-shadow:0 0 28px #d5b77755,0 2px 0 #3a2c10}
.in-title h2 span{display:inline-block;opacity:0;transform:translateY(46px);filter:blur(8px)}
.in-title.on h2 span{animation:inRise 2.8s cubic-bezier(.2,.7,.2,1) forwards}.in-title.on h2 span:nth-child(2){animation-delay:.45s}.in-title.on h2 span:nth-child(3){animation-delay:.9s}
@keyframes inRise{to{opacity:1;transform:none;filter:blur(0)}}
.in-reflect{position:absolute;left:0;right:0;top:100%;margin-top:.02em;font:400 clamp(34px,6.6vw,96px)/1.05 Georgia,"Times New Roman",serif;letter-spacing:.1em;text-transform:uppercase;color:#e9d39c;transform:scaleY(-.5) translateY(-100%);transform-origin:50% 0;opacity:0;-webkit-mask-image:linear-gradient(#000a,#0000 80%);mask-image:linear-gradient(#000a,#0000 80%);filter:blur(1.5px)}
.in-title.on .in-reflect{animation:inReflect 3.4s ease .9s forwards}@keyframes inReflect{0%{opacity:0}100%{opacity:.32}}
.in-title.struck h2{animation:inStruck 1.6s ease-out}@keyframes inStruck{0%{text-shadow:0 0 60px #ffe7a8,0 0 120px #ffd27a,0 2px 0 #3a2c10;color:#fff3cf}100%{text-shadow:0 0 28px #d5b77755,0 2px 0 #3a2c10;color:#e9d39c}}
.in-title p{margin:clamp(40px,5.5vw,72px) 0 0;font:italic clamp(18px,2.6vw,30px)/1.3 Georgia,serif;color:#f0e4c7;opacity:0;transform:translateY(8px);transition:opacity 1.4s ease,transform 1.4s ease}
.in-title.ask p{opacity:1;transform:none}
.in-sound{position:absolute;right:max(16px,env(safe-area-inset-right,0px));top:calc(9vh + 12px);z-index:6;background:#000a;color:#efe6cf;border:1px solid #efe6cf66;border-radius:20px;padding:8px 14px;font:600 12px system-ui;letter-spacing:.1em;cursor:pointer}
.in .mt-skip{z-index:6}
/* the jolt on a hit moves the picture inside the frame, a little enlarged, so its edge never shows (owner report: hard edges in the montage) */
.in.cf-thud .in-shot.on{animation:inThud .45s ease-out}@keyframes inThud{0%{transform:translate(-50%,-50%) scale(1.035)}20%{transform:translate(calc(-50% - 4px),calc(-50% + 3px)) scale(1.035)}45%{transform:translate(calc(-50% + 3px),calc(-50% - 2px)) scale(1.03)}70%{transform:translate(calc(-50% - 1px),calc(-50% + 1px)) scale(1.015)}100%{transform:translate(-50%,-50%)}}
@media (max-width:700px){.in .cf-grain{display:none}.in-telegram{bottom:20vh}.in-title{top:38%}.in-title p{margin-top:92px}.in-title h2,.in-reflect{font-size:clamp(34px,11.5vw,60px);letter-spacing:.08em}}
.fd-reduce .in-beam,.fd-reduce .in-glow,.fd-reduce .in-rays,.fd-reduce .in-water i,.fd-reduce .in-tg-text:after{animation:none!important}
.in-c0{top:50%;bottom:auto;transform:translateY(-50%);font-size:clamp(20px,3vw,34px);letter-spacing:.06em}
.intro-replay{display:inline-flex;align-items:center;gap:8px;margin:2px auto 0;background:transparent;border:1px solid #d5b77755;color:#d5b777;border-radius:20px;padding:7px 16px;font:600 12px system-ui;letter-spacing:.14em;text-transform:uppercase;cursor:pointer}
.intro-replay:hover{background:#d5b77714;border-color:#d5b777aa}

/* the opening on portrait screens: the owner's tall paintings */
.in .fd-shot.tall{width:max(100vw,calc(100vh * 1024 / 1536));aspect-ratio:1024/1536}
.in-c6{font-size:clamp(22px,3.2vw,36px);color:#f0e4c7;letter-spacing:.02em}

/* the opening's first scene: the title, a rule, then the date (owner request, 14 Oct 2026) */
.in-open{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);z-index:4;text-align:center;padding:0 16px;pointer-events:none}
.in-open h2{margin:0;font:400 clamp(30px,6vw,84px)/1.08 Georgia,"Times New Roman",serif;letter-spacing:.14em;text-transform:uppercase;color:#e9d39c}
.in-open h2 span{display:inline-block;opacity:0;transform:translateY(26px) scale(.96);filter:blur(10px);background:linear-gradient(100deg,#c9a85a 0,#e9d39c 40%,#fff6d6 50%,#e9d39c 60%,#c9a85a 100%) 0 0/250% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-shadow:none}
.in-open.on h2 span{animation:inOpenRise 2.4s cubic-bezier(.2,.7,.2,1) forwards,inOpenSheen 3.2s ease-in-out 2.2s forwards}
.in-open.on h2 span:nth-child(2){animation-delay:.45s,2.45s}.in-open.on h2 span:nth-child(3){animation-delay:.9s,2.7s}
@keyframes inOpenRise{to{opacity:1;transform:none;filter:blur(0)}}@keyframes inOpenSheen{from{background-position:100% 0}to{background-position:-50% 0}}
.in-open h2:after{content:'';display:block}
.in-rule{display:block;width:min(46vw,420px);height:1px;margin:clamp(14px,2vw,24px) auto;background:linear-gradient(90deg,#d5b77700,#d5b777 50%,#d5b77700);transform:scaleX(0);transition:transform 1.6s cubic-bezier(.3,.7,.2,1) 1.9s}
.in-open.on .in-rule{transform:scaleX(1)}
.in-open p{margin:0;font:italic clamp(18px,2.4vw,28px)/1.3 Georgia,serif;color:#e8e2cc;letter-spacing:.06em;opacity:0;transform:translateY(8px);transition:opacity 1.4s ease 2.6s,transform 1.4s ease 2.6s}
.in-open.on p{opacity:1;transform:none}
.in-open.gone{opacity:0;transition:opacity 1.3s ease}
.in-open h2{text-shadow:0 0 30px #d5b77733}
.fd-reduce .in-open h2 span{animation:none!important;opacity:1;transform:none;filter:none}

/* montage cuts: full brightness at once (the shots are too short for the 2s veil), and the title words spaced on every screen */
.in .in-mont .fd-img::after{display:none}
.in-open h2{display:flex;flex-wrap:wrap;justify-content:center;gap:0 .55em}
@media (max-width:600px){.in-open h2{flex-direction:column;align-items:center;gap:.06em;font-size:clamp(34px,11vw,54px);letter-spacing:.16em}.in-open h2 span{padding-left:.16em}}
/* buttons under the map (the side chapters' ways in and back): their small print on its own line (owner report, 14 Oct 2026) */
#clueList button small{display:block;margin-top:4px;font-size:12.5px;letter-spacing:.02em;opacity:.85}

/* Cassilda's Song: the dusk of Carcosa (twin suns sinking, black stars) under the effects canvas, and the song's lines */
.cs-dusk{position:fixed;inset:0;z-index:29;pointer-events:none;opacity:0;--o:.85;transition:opacity .8s ease;background:linear-gradient(180deg,#e8b94a40 0,#c98b2a2a 22%,#3a245018 55%,#10081800 80%)}
.cs-dusk.on{opacity:.85}.cs-dusk.off{opacity:0;transition:opacity 1.2s ease}
.cs-sun{position:absolute;left:36%;top:7%;width:min(24vw,190px);aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%);background:radial-gradient(circle,#fff8dc 0,#ffe7a0 22%,#f4c35a66 42%,#f4c35a00 70%);animation:csSink 6s cubic-bezier(.4,0,.6,1) forwards;will-change:transform}
.cs-sun2{left:63%;top:10%;width:min(19vw,150px);animation-duration:6.6s;opacity:.85}
@keyframes csSink{from{transform:translate(-50%,-50%)}to{transform:translate(-50%,40%)}}
.cs-dusk b{position:absolute;width:6px;height:6px;border-radius:50%;background:#050208;box-shadow:0 0 6px 2px #7a4fd099}
.cs-dusk b:nth-of-type(1){left:14%;top:6%}.cs-dusk b:nth-of-type(2){left:22%;top:15%;width:4px;height:4px}.cs-dusk b:nth-of-type(3){left:78%;top:5%}.cs-dusk b:nth-of-type(4){left:86%;top:16%;width:4px;height:4px}.cs-dusk b:nth-of-type(5){left:51%;top:3%;width:5px;height:5px}
.cs-lyric{position:fixed;left:0;right:0;top:calc(var(--hud-offset,90px) + 6px);z-index:31;padding:10px 16px 12px;background:linear-gradient(90deg,#08050c00,#08050cd9 18%,#08050cd9 82%,#08050c00);text-align:center;pointer-events:none;font:italic clamp(18px,2.6vw,30px)/1.3 Georgia,"Times New Roman",serif;color:#ffeab0;letter-spacing:.03em;text-shadow:0 0 18px #e7b54a99,0 2px 6px #000,0 0 2px #000;opacity:0;transform:translateY(8px)}
.cs-lyric.on{animation:csLine .7s ease-out forwards}@keyframes csLine{to{opacity:1;transform:none}}.cs-lyric.out{opacity:0;transition:opacity 1s ease}
.reduced .cs-sun,.reduced .cs-lyric.on{animation:none}.reduced .cs-lyric.on{opacity:1;transform:none}
/* The Sable Petrel · the ship's card in the Waking's last phase (Ram the Door / Fire the Flares) */
.roster .boat-sheet{--boat:#d9b26a;border-color:var(--boat);background:linear-gradient(180deg,#1b2430,#121820)}
.boat-sheet .sheet-ribbon{background:var(--boat);color:#1a1712;font-weight:600}
.boat-sheet .tag{color:var(--boat)}
.boat-sheet .boat-portrait{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--boat) 55%,transparent)}
.boat-sheet .boat-portrait img{object-fit:cover;object-position:50% 55%}
.boat-sheet .seal-bar{margin:.2rem 0 .5rem}
.boat-sheet .boat-ram-btn{border-color:var(--boat);background:linear-gradient(180deg,#5a4320,#3a2a12);color:#fff3d6;font-weight:600}
.boat-sheet .boat-ram-btn:not(:disabled):hover{filter:brightness(1.15)}
.boat-sheet.ramming{animation:boatRam .55s cubic-bezier(.3,.7,.2,1)}
@keyframes boatRam{0%{transform:none}25%{transform:translateY(-14px) scale(1.03)}45%{transform:translateY(-22px) scale(1.04);box-shadow:0 0 30px #ffb45a99}70%{transform:translateY(4px)}100%{transform:none}}
@media (prefers-reduced-motion:reduce){.boat-sheet.ramming{animation:none}}
.intro-replay.test-final{margin:6px 4px 0}
/* The Sable Petrel ramming the door (boatRamFx in effects.js) */
.boat-ram-ship{position:fixed;z-index:29;pointer-events:none;will-change:transform,opacity;filter:drop-shadow(0 10px 24px #000c) brightness(1.15) contrast(1.08)}
.boat-ram-ship img{width:100%;height:100%;object-fit:cover;object-position:50% 55%;-webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 52%,#000 68%,transparent 100%);mask-image:radial-gradient(ellipse 50% 50% at 50% 52%,#000 68%,transparent 100%)}
.rammed{animation:rammedCard .85s cubic-bezier(.2,.8,.3,1)}
@keyframes rammedCard{0%{transform:none}12%{transform:translate(10px,-14px) rotate(1.6deg) scale(.97);filter:brightness(1.8)}30%{transform:translate(-6px,6px) rotate(-1deg)}50%{transform:translate(4px,-3px)}100%{transform:none;filter:none}}
@media (prefers-reduced-motion:reduce){.rammed{animation:none}.boat-ram-ship{display:none}}
/* The One Behind the Door's attacks (godFx in effects.js) */
@property --x{syntax:'<length>';inherits:false;initial-value:0px}
@property --y{syntax:'<length>';inherits:false;initial-value:0px}
@property --r{syntax:'<length>';inherits:false;initial-value:140px}
.god-veil{position:fixed;inset:0;z-index:28;pointer-events:none;opacity:0;transition:opacity .5s ease,--x .4s ease,--y .4s ease,--r .4s ease;
  background:radial-gradient(circle at var(--x) var(--y),rgba(0,0,0,0) 0,rgba(0,0,0,0) var(--r),rgba(3,16,11,.72) calc(var(--r)*2.3),rgba(1,7,5,.88) 100%)}
.god-veil.on{opacity:1}
.god-veil.deep{background:radial-gradient(circle at var(--x) var(--y),rgba(0,0,0,0) 0,rgba(0,0,0,0) var(--r),rgba(2,10,7,.86) calc(var(--r)*2),rgba(0,4,2,.95) 100%)}
.god-rise{animation:godRise 1.8s cubic-bezier(.3,.6,.3,1);position:relative;z-index:29}
@keyframes godRise{0%{transform:none;filter:none}25%{transform:scale(1.05);filter:brightness(1.45) saturate(1.35);box-shadow:0 0 0 2px #5dffa088,0 0 60px #3dff9a66}45%{transform:scale(1.04) translate(-3px,2px)}50%{transform:scale(1.045) translate(3px,-2px)}55%{transform:scale(1.04) translate(-2px,-1px)}100%{transform:none;filter:none;box-shadow:none}}
main.god-dreaming{animation:godDream 2.6s ease-in-out}
@keyframes godDream{0%,100%{filter:none}25%{filter:hue-rotate(45deg) saturate(1.6) blur(1.4px)}50%{filter:hue-rotate(-30deg) saturate(1.9) blur(.6px)}75%{filter:hue-rotate(20deg) saturate(1.4) blur(1.1px)}}
.god-dreamed{animation:godDreamed 1.1s ease-out}
@keyframes godDreamed{0%{filter:none;transform:none}20%{filter:hue-rotate(70deg) saturate(2) brightness(1.3);transform:skewX(-3deg) scale(1.02)}45%{transform:skewX(2deg)}70%{filter:hue-rotate(-20deg);transform:skewX(-1deg)}100%{filter:none;transform:none}}
.god-crushed{animation:godCrushed .95s cubic-bezier(.2,.8,.3,1)}
@keyframes godCrushed{0%{transform:none}10%{transform:translateY(16px) scale(.95,.9);filter:brightness(2) saturate(.4)}28%{transform:translateY(-6px) scale(1.01,1.03)}45%{transform:translate(5px,2px)}60%{transform:translate(-4px,-1px)}100%{transform:none;filter:none}}
.god-sea{position:fixed;left:0;right:0;bottom:0;height:0;z-index:28;pointer-events:none;background:linear-gradient(180deg,rgba(150,235,205,.5) 0,rgba(26,84,70,.72) 4%,rgba(6,34,28,.9) 55%,rgba(2,16,13,.96) 100%);animation:godSeaRise 1.5s cubic-bezier(.35,.1,.3,1) forwards;transition:height .55s cubic-bezier(.6,0,.8,.3),opacity .55s}
.god-sea::before{content:'';position:absolute;left:0;right:0;top:-26px;height:28px;background:radial-gradient(ellipse 50% 100% at 50% 100%,rgba(70,140,118,.85) 58%,rgba(0,0,0,0) 62%) 0 0/140px 28px repeat-x;animation:godSeaCrest 1.1s linear infinite}
.god-sea.drain{animation:none;height:0;opacity:0}
@keyframes godSeaRise{to{height:42vh}}
@keyframes godSeaCrest{to{background-position:140px 0}}
.god-banner{position:fixed;left:0;right:0;top:36%;z-index:31;pointer-events:none;text-align:center;font:italic 900 clamp(26px,6.4vw,66px) Georgia,'Times New Roman',serif;letter-spacing:.06em;color:#dfffe9;text-shadow:0 0 18px #3dff9a,0 0 46px #0b6b46,0 3px 0 #031a10;animation:godBanner 2.3s ease forwards;padding:0 16px}
.god-banner span{display:inline-block}
.god-banner-dream{color:#f2e9ff;text-shadow:0 0 18px #b07cff,0 0 48px #4b1d9b,0 3px 0 #12052a}
.god-banner-hour{top:auto;bottom:12vh;color:#fffbe8;text-shadow:0 0 18px #9dffcf,0 0 52px #e8c25a,0 3px 0 #1a1203}
@keyframes godBanner{0%{opacity:0;transform:scale(1.4);filter:blur(12px);letter-spacing:.45em}18%{opacity:1;transform:scale(1);filter:blur(0);letter-spacing:.07em}75%{opacity:1;transform:scale(.98)}100%{opacity:0;transform:scale(.95) translateY(-12px);filter:blur(5px)}}
@media (prefers-reduced-motion:reduce){.god-veil,.god-sea,.god-banner{display:none}.god-rise,.god-dreamed,.god-crushed,main.god-dreaming{animation:none}}
.god-flash{position:fixed;inset:0;z-index:60;pointer-events:none;background:radial-gradient(circle at 50% 45%,#fff 0,var(--flash,#e8fff2) 30%,rgba(90,255,170,.45) 60%,rgba(0,40,20,0) 100%);animation:godFlash .5s ease-out forwards}
@keyframes godFlash{0%{opacity:0}12%{opacity:.85}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.god-flash{display:none}}
/* Difficulty choice under Travel to Innsmouth (Hard unlocks after finishing the game) */
.difficulty{max-width:560px;margin:-6px auto 24px;padding:0 16px;text-align:center}
.difficulty .eyebrow{margin-bottom:8px}
.diff-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}#difficulty .diff-row{grid-template-columns:repeat(3,1fr)}
.diff-btn{display:flex;flex-direction:column;align-items:center;gap:4px;padding:12px 14px;border-radius:10px;border:1px solid #d5b77744;background:#0d1c18cc;color:#e8dcc0;cursor:pointer;text-align:center;transition:border-color .2s,background .2s,box-shadow .2s}
.diff-btn b{font:600 15px/1.2 Georgia,'Times New Roman',serif;letter-spacing:.04em}
.diff-btn small{font-size:12px;line-height:1.35;opacity:.75;letter-spacing:normal;text-transform:none}
.diff-btn:not(:disabled):hover{border-color:#d5b777aa}
.diff-btn.on{border-color:#d5b777;background:#1b2a22;box-shadow:0 0 0 1px #d5b77755,0 0 18px #d5b77722}
.diff-btn.hard.on{border-color:#c4453a;background:#2a1414;box-shadow:0 0 0 1px #c4453a77,0 0 20px #c4453a33;color:#ffe2dc}
.diff-btn.locked{opacity:.5;cursor:not-allowed}
.diff-btn.easy.on{border-color:#7fc7a0;background:#13261e;box-shadow:0 0 0 1px #7fc7a077,0 0 20px #7fc7a033;color:#e2f5ea}
/* Kelvin Grenade: the card frosts over for a moment (effects.js FX.kelvin) */
.kelvin-frozen{animation:kelvinFrozen 1.4s ease-out}
@keyframes kelvinFrozen{0%{filter:none;box-shadow:none}12%{filter:saturate(.15) brightness(1.55) hue-rotate(160deg);box-shadow:inset 0 0 0 2px #e6f8ff,inset 0 0 40px #9fdcffaa,0 0 24px #8fd4ff88}60%{filter:saturate(.4) brightness(1.15) hue-rotate(150deg);box-shadow:inset 0 0 0 1px #cfeeff,inset 0 0 26px #9fdcff66}100%{filter:none;box-shadow:none}}
.roster button.firebomb-btn.kelvin-btn{border-color:#5fb6e6}
@media (prefers-reduced-motion:reduce){.kelvin-frozen{animation:none}}
/* The finale cut-scene (playFinale in montage.js) */
.fn .fd-shot{width:max(100vw,150vh);aspect-ratio:1536/1024}
.fn .fd-shot.fn-ship{width:max(100vw,177.7vh);aspect-ratio:1672/941}
.fn .fd-shot.tall{width:max(100vw,calc(100vh * 1024 / 1536));aspect-ratio:1024/1536}
.fn-seam{position:absolute;z-index:1;width:1.1%;transform:translateX(-50%);border-radius:50%;background:linear-gradient(90deg,#9dffb000,#c8ffd0 35%,#ffffff 50%,#c8ffd0 65%,#9dffb000);box-shadow:0 0 30px 10px #6dff9a88,0 0 90px 30px #2fd08a55;mix-blend-mode:screen;animation:fnSeam 1.4s ease-in-out infinite alternate}
.fn-seam.shut{animation:fnSeamShut .55s cubic-bezier(.6,0,.9,.4) forwards}
@keyframes fnSeam{from{opacity:.75;filter:brightness(.9)}to{opacity:1;filter:brightness(1.3)}}
@keyframes fnSeamShut{0%{opacity:1;transform:translateX(-50%) scaleX(1.6);filter:brightness(2)}35%{opacity:1;transform:translateX(-50%) scaleX(3);filter:brightness(3)}100%{opacity:0;transform:translateX(-50%) scaleX(0)}}
.fn-dawn{position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse at 60% 8%,#ffd99088 0,#ffb86a33 30%,#ff9a5a00 60%),linear-gradient(#ffcf8a22,#00000000 60%);opacity:0;transition:opacity 9s ease;mix-blend-mode:screen}
.fn-dawn.on{opacity:1}
.fn-sunwash{position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse at 53% 30%,#ffe2a055 0,#ffc97a1f 35%,#ffc97a00 65%);mix-blend-mode:screen;animation:fnSun 6s ease-in-out infinite alternate}
.fn-sunwash2{background:radial-gradient(ellipse at 35% 28%,#ffd8a055 0,#ffb4801f 35%,#ffb48000 65%)}
@keyframes fnSun{from{opacity:.55}to{opacity:1}}
.fn .in-flash.green{background:#d8ffe4;animation:inHit 1s ease-out;--h:.8}
.fn-quake .fn-shot.on .fd-img{animation:fnQuake 1.1s cubic-bezier(.36,.07,.19,.97)}
@keyframes fnQuake{0%,100%{translate:0 0}8%{translate:-14px 9px}16%{translate:13px -10px}24%{translate:-10px -6px}34%{translate:9px 7px}46%{translate:-6px 4px}60%{translate:4px -3px}78%{translate:-2px 1px}}
.fn-dim{position:absolute;inset:0;z-index:3;pointer-events:none;background:radial-gradient(ellipse at 50% 45%,#000000a0,#000000e8);opacity:0;transition:opacity 2.4s ease}
.fn-dim.on{opacity:1}
.fn .fd-cap small{display:block;margin-top:4px;font-size:.8em;letter-spacing:.2em;text-transform:uppercase;font-style:normal;opacity:.85}
.fn .fn-c9,.fn .fn-c10{font-size:clamp(18px,2.5vw,26px)}
.fn-title{top:42%}
.fn-title p{font-size:clamp(16px,2.2vw,26px);line-height:1.5}
@media (prefers-reduced-motion:reduce){.fn-seam,.fn-sunwash,.fn-quake .fd-img{animation:none!important}}
.intro-replay.fn-replay{margin:6px 4px 0}
.fn-shade{position:absolute;left:0;right:0;bottom:0;height:46vh;z-index:2;pointer-events:none;background:linear-gradient(#00000000,#00000059 45%,#000000b3 100%)}
.fn .fd-cap{text-shadow:0 2px 16px #000,0 0 4px #000,0 0 2px #000}
/* Reset progress confirmation (select screen footer) */
#confirmProgress button.danger{border-color:#c4453a;background:#3a1512;color:#ffe2dc}
#confirmProgress button.danger:hover{background:#4d1b17}
/* Masteries (owner design 14 Oct 2026): the gold edge (the mini bosses' sweep), the select-card switch, the tab */
.gold-ring{position:absolute;inset:0;z-index:5;pointer-events:none;padding:3px;border-radius:inherit;background:conic-gradient(from var(--mb-angle),transparent 0 55%,#8a6d2e 64%,#ffe9a8 72%,#fffbe8 76%,#ffe9a8 80%,#8a6d2e 88%,transparent 96%);filter:drop-shadow(0 0 4px #ffe3a0);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);animation:miniSweep 5s linear infinite}
.reduced .gold-ring{animation:none}
@media (prefers-reduced-motion:reduce){.gold-ring{animation:none}}
.pick-card.mastered .pick-portrait,.character-sheet.mastered .sheet-portrait{position:relative;box-shadow:inset 0 0 0 1px #d5b77799,0 0 22px 2px #d5b77744}
.character-sheet.mastered .sheet-portrait .portrait-slot{box-shadow:inset 0 0 0 1px #d5b77788,inset 0 -30px 40px -20px #d5b77733}
.pick-card.mastered{border-color:#b8955a}
.mastery-switch{position:relative;display:flex;align-items:center;gap:8px;width:100%;margin:10px 0 2px;padding:8px 12px;border:1px solid #8a7442;border-radius:8px;background:#141c18;color:#e8dcc0;font:600 12px system-ui;letter-spacing:.06em;cursor:pointer;text-align:left}
.mastery-switch svg{width:22px;height:22px;flex:none;color:#d5b777}
.mastery-switch span{flex:1}
.mastery-switch b{padding:2px 8px;border-radius:10px;background:#2a2418;color:#b8a77e;font-size:11px;letter-spacing:.12em}
.mastery-switch.on{background:linear-gradient(90deg,#3a2e14,#241d10);color:#fff3cf}
.mastery-switch.on b{background:linear-gradient(90deg,#b8955a,#ecd28e);color:#2a1f0c}
.mastery-switch:hover{filter:brightness(1.12)}
.mastery-shelf{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px;margin-top:8px}
.mastery{position:relative;display:flex;align-items:center;gap:12px;padding:12px;border:1px solid var(--line);background:#0f201c;border-radius:6px}
.mastery-icon{position:relative;flex:none;width:52px;height:52px;color:#5d6b63}
.mastery-icon svg{width:100%;height:100%}
.mastery-icon .q{position:absolute;inset:0;display:grid;place-items:center;font:700 22px Georgia,serif;color:#8a9a90}
.mastery.found .mastery-icon{color:var(--gold)}
.mastery.found{border-color:#8a7442;background:radial-gradient(ellipse at 20% 50%,#3b3320,#0f201c 70%)}
.mastery-text b{display:block;color:#f0e4c7;font:600 14px Georgia,serif}
.mastery-text small{display:block;margin-top:3px;color:#b8b09a;font-size:12px;line-height:1.4}
.mastery.missing .mastery-text b{color:#9aa69f}
.mastery-card svg{width:56px;height:56px;color:var(--gold);flex:none}
.mastery-card{display:flex;gap:14px;align-items:center;border:1px solid #8a7442;padding:14px;margin-top:14px;background:radial-gradient(ellipse at 10% 50%,#3b3320,transparent 60%)}
#masteryShelf{padding:0 18px 18px}
.mastery-text small,.mastery-text b{letter-spacing:normal;text-transform:none}
@media (max-width:700px){#masteryShelf{padding:0 12px 14px}}
.mastery-toast{position:fixed;left:50%;top:max(16px,env(safe-area-inset-top,0px));z-index:70;transform:translate(-50%,-20px);opacity:0;display:flex;align-items:center;gap:14px;width:min(92vw,520px);padding:14px 18px;border:1px solid #b8955a;border-radius:10px;background:radial-gradient(ellipse at 15% 50%,#3b3320,#141c18 70%);box-shadow:0 10px 40px #000c,0 0 24px #d5b77744;color:#f0e4c7;animation:masteryToast .6s cubic-bezier(.2,.8,.3,1) forwards}
.mastery-toast.out{transition:opacity .8s,transform .8s;opacity:0!important;transform:translate(-50%,-20px)!important;animation:none}
.mastery-toast svg{width:48px;height:48px;flex:none;color:var(--gold)}
.mastery-toast small{display:block;font:600 11px system-ui;letter-spacing:.18em;color:#d5b777}
.mastery-toast b{display:block;font:600 16px Georgia,serif;margin:2px 0}
.mastery-toast span{display:block;font-size:12.5px;color:#cfc4a6}
@keyframes masteryToast{to{opacity:1;transform:translate(-50%,0)}}
/* Prof. Vale's mastery skills (valeFx in effects.js) */
.vale-wash{position:fixed;inset:0;z-index:28;pointer-events:none;opacity:0;transition:opacity .6s ease}
.vale-wash.on{opacity:1}
.vale-wash.vw-seal{background:radial-gradient(ellipse at 50% 40%,rgba(30,60,30,.2),rgba(4,16,8,.72) 70%,rgba(2,8,4,.88))}
.vale-wash.vw-fog{background:radial-gradient(ellipse at 50% 45%,rgba(30,10,50,.35),rgba(8,2,16,.85) 65%,rgba(2,0,6,.94))}
.vale-wash.vw-fire{background:radial-gradient(ellipse at 50% 20%,rgba(120,10,0,.35),rgba(40,4,2,.78) 65%,rgba(14,0,0,.9));animation:vwFire 1.3s ease-in-out infinite alternate}
@keyframes vwFire{to{filter:brightness(1.25) saturate(1.2)}}
.vale-casting{animation:valeCast 2.4s ease-in-out;position:relative;z-index:29}
@keyframes valeCast{0%,100%{filter:none;box-shadow:none}20%,80%{filter:brightness(1.25) saturate(1.15);box-shadow:0 0 0 2px #d5b777aa,0 0 50px 6px #d5b77766}}
.vale-sealed{animation:valeSealed 1.5s ease-out}
@keyframes valeSealed{0%{filter:none;transform:none}10%{filter:brightness(1.9) sepia(.4) hue-rotate(50deg);transform:scale(.96)}30%{transform:scale(1.01)}60%{filter:brightness(1.2) saturate(.6) hue-rotate(40deg)}100%{filter:none;transform:none}}
.vale-fogged{animation:valeFogged 1.6s ease-in-out}
@keyframes valeFogged{0%{filter:none}30%,70%{filter:brightness(.55) saturate(.3) hue-rotate(230deg) blur(1.2px)}100%{filter:none}}
.vale-burned{animation:valeBurned 1.4s cubic-bezier(.2,.8,.3,1)}
@keyframes valeBurned{0%{transform:none;filter:none}10%{transform:translateY(10px) scale(.96);filter:brightness(2.2) saturate(1.4) hue-rotate(-20deg)}30%{transform:translate(-5px,-3px)}50%{transform:translate(4px,2px);filter:brightness(1.3) sepia(.5) saturate(2) hue-rotate(-30deg)}100%{transform:none;filter:none}}
@media (prefers-reduced-motion:reduce){.vale-wash{display:none}.vale-casting,.vale-sealed,.vale-fogged,.vale-burned{animation:none}}
.vale-lit{position:relative;z-index:29}
/* Frank's Kelvin Bombs (kelvinFx in effects.js) */
.kelvin-vignette{position:fixed;inset:0;z-index:28;pointer-events:none;opacity:0;transition:opacity .7s ease;background:radial-gradient(ellipse at 50% 50%,rgba(200,235,255,0) 45%,rgba(160,215,245,.18) 70%,rgba(220,245,255,.55) 100%),repeating-conic-gradient(from 10deg at 50% 50%,rgba(255,255,255,0) 0deg 7deg,rgba(235,250,255,.06) 8deg 9deg);-webkit-mask-image:radial-gradient(ellipse at 50% 50%,transparent 40%,#000 85%);mask-image:radial-gradient(ellipse at 50% 50%,transparent 40%,#000 85%)}
.kelvin-vignette.on{opacity:1}
.kelvin-charge{animation:kelvinCharge 1.5s ease-in-out;position:relative;z-index:29}
@keyframes kelvinCharge{0%,100%{filter:none;box-shadow:none}25%,70%{filter:brightness(1.12) saturate(.85);box-shadow:0 0 0 2px #d6f2ffcc,0 0 46px 8px #7fd2ff77,inset 0 0 30px #bfe8ff44}}
.kelvin-drain{animation:kelvinDrain 1.2s ease-in-out}
@keyframes kelvinDrain{0%{filter:none}40%,80%{filter:saturate(.15) brightness(.85) contrast(1.1)}100%{filter:none}}
.kelvin-hit{animation:kelvinHit 1.3s cubic-bezier(.2,.8,.3,1)}
@keyframes kelvinHit{0%{transform:none;filter:none}8%{transform:scale(.95) translateY(8px);filter:brightness(2) saturate(.15)}25%{transform:translate(-4px,-2px)}40%{transform:translate(3px,1px);filter:brightness(1.2) saturate(.3)}100%{transform:none;filter:none}}
.kelvin-ice{position:fixed;z-index:31;pointer-events:none;overflow:hidden;border-radius:2px;background:radial-gradient(circle at var(--ox) var(--oy),rgba(240,252,255,.75),rgba(190,232,255,.45) 30%,rgba(150,205,240,.3) 70%,rgba(120,190,235,.38)),repeating-linear-gradient(60deg,rgba(255,255,255,0) 0 14px,rgba(255,255,255,.18) 15px 16px),repeating-linear-gradient(-60deg,rgba(255,255,255,0) 0 18px,rgba(255,255,255,.14) 19px 20px);box-shadow:inset 0 0 0 1px rgba(240,252,255,.9),inset 0 0 40px rgba(191,232,255,.8),0 0 24px rgba(127,210,255,.6);clip-path:circle(0% at var(--ox) var(--oy));animation:kelvinFreeze .45s cubic-bezier(.2,.7,.3,1) forwards}
.kelvin-ice svg{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:rgba(255,255,255,.85);stroke-width:.6;filter:drop-shadow(0 0 2px #9fe4ff)}
.kelvin-ice.shatter{animation:kelvinShatter .55s ease-in forwards}
@keyframes kelvinFreeze{to{clip-path:circle(150% at var(--ox) var(--oy))}}
@keyframes kelvinShatter{0%{clip-path:circle(150% at var(--ox) var(--oy));opacity:1;transform:none}100%{clip-path:circle(150% at var(--ox) var(--oy));opacity:0;transform:scale(1.06)}}
.kelvin-wave{position:fixed;inset:0;z-index:29;pointer-events:none;background:radial-gradient(circle at var(--x) var(--y),rgba(255,255,255,0) 0,rgba(200,238,255,.0) 30%,rgba(210,242,255,.42) 34%,rgba(170,225,250,.18) 40%,rgba(160,215,245,0) 48%);background-size:100% 100%;animation:kelvinWave 1.6s cubic-bezier(.2,.6,.3,1) forwards}
@keyframes kelvinWave{0%{transform:scale(.15);opacity:1}100%{transform:scale(2.6);opacity:0}}
@media (prefers-reduced-motion:reduce){.kelvin-vignette,.kelvin-ice,.kelvin-wave{display:none}.kelvin-charge,.kelvin-drain,.kelvin-hit{animation:none}}
.kelvin-flash{position:fixed;inset:0;z-index:60;pointer-events:none;background:radial-gradient(circle at 50% 50%,#ffffff 0,#e6f8ff 30%,rgba(150,215,255,.5) 62%,rgba(40,90,140,0) 100%);animation:kelvinFlash .5s ease-out forwards}
@keyframes kelvinFlash{0%{opacity:0}10%{opacity:.85}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.kelvin-flash{display:none}}
/* Eliza Marsh's mastery skills (elizaFx in effects.js) */
.eliza-wash{position:fixed;inset:0;z-index:28;pointer-events:none;opacity:0;transition:opacity .7s ease}
.eliza-wash.on{opacity:1}
.eliza-wash.ew-song{background:radial-gradient(ellipse at 50% 60%,rgba(20,90,80,.25),rgba(4,30,30,.72) 70%,rgba(2,14,16,.86));animation:ewSong 3s ease-in-out infinite alternate}
.eliza-wash.ew-reef{background:radial-gradient(ellipse at 50% 80%,rgba(20,90,70,.3),rgba(2,24,22,.8) 70%,rgba(0,10,10,.9))}
.eliza-wash.ew-tide{background:radial-gradient(ellipse at 50% 50%,rgba(10,30,40,.4),rgba(2,10,14,.85) 70%,rgba(0,4,6,.94))}
@keyframes ewSong{to{filter:brightness(1.2) hue-rotate(-12deg)}}
.eliza-casting{animation:elizaCast 2.2s ease-in-out;position:relative;z-index:29}
@keyframes elizaCast{0%,100%{filter:none;box-shadow:none}25%,75%{filter:brightness(1.15) saturate(1.1);box-shadow:0 0 0 2px #9ff5e0aa,0 0 46px 6px #3fd6a866}}
.eliza-lit{position:relative;z-index:29}
.eliza-lulled{animation:elizaLulled 1.4s ease-in-out}
@keyframes elizaLulled{0%,100%{filter:none}35%,70%{filter:brightness(1.15) saturate(.7) blur(.8px) sepia(.25) hue-rotate(110deg)}}
.eliza-rise{animation:elizaRise 1.2s cubic-bezier(.2,.8,.3,1)}
@keyframes elizaRise{0%{transform:translateY(60px);opacity:.2;filter:brightness(.4) saturate(.4) hue-rotate(120deg)}60%{transform:translateY(-6px);opacity:1}100%{transform:none;filter:none}}
.eliza-drowned{animation:elizaDrowned 1.3s cubic-bezier(.2,.8,.3,1)}
@keyframes elizaDrowned{0%{transform:none;filter:none}12%{transform:translate(14px,10px) scale(.96);filter:brightness(.55) saturate(.4) hue-rotate(160deg)}35%{transform:translate(-6px,4px)}60%{transform:translate(3px,-2px);filter:brightness(.8) saturate(.6) hue-rotate(150deg)}100%{transform:none;filter:none}}
.eliza-sea{position:fixed;left:0;right:0;bottom:0;height:0;z-index:28;pointer-events:none;background:linear-gradient(180deg,rgba(190,250,230,.5) 0,rgba(30,110,95,.72) 4%,rgba(6,44,40,.9) 55%,rgba(2,20,18,.96) 100%);animation:elizaSea 1.1s cubic-bezier(.35,.1,.3,1) forwards;transition:height .6s cubic-bezier(.6,0,.8,.3),opacity .6s}
.eliza-sea::before{content:'';position:absolute;left:0;right:0;top:-24px;height:26px;background:radial-gradient(ellipse 50% 100% at 50% 100%,rgba(60,150,128,.85) 58%,rgba(0,0,0,0) 62%) 0 0/120px 26px repeat-x;animation:godSeaCrest 1.1s linear infinite}
.eliza-sea.drain{animation:none;height:0;opacity:0}
@keyframes elizaSea{to{height:34vh}}
.eliza-wave{position:fixed;top:-12vh;bottom:-12vh;left:0;width:110vw;z-index:30;pointer-events:none;transform:translateX(-115vw);animation:elizaWave 1.6s cubic-bezier(.45,.05,.6,.95) forwards;border-radius:0 46% 54% 0 / 0 38% 62% 0;background:linear-gradient(90deg,rgba(2,10,14,0) 0,rgba(3,14,20,.82) 18%,rgba(6,26,36,.94) 55%,rgba(14,52,64,.95) 82%,rgba(40,100,112,.95) 93%,rgba(150,205,210,.95) 98%);box-shadow:18px 0 40px 6px rgba(220,240,240,.55),inset -14px 0 30px rgba(230,248,248,.65)}
.eliza-wave i{position:absolute;right:-20px;top:4%;bottom:4%;width:70px;border-radius:50%;background:radial-gradient(ellipse at 30% 50%,rgba(255,255,255,.95),rgba(220,240,242,.55) 45%,rgba(255,255,255,0) 70%);filter:blur(5px);animation:elizaFoam .35s ease-in-out infinite alternate}
@keyframes elizaWave{0%{transform:translateX(-115vw)}100%{transform:translateX(120vw)}}
@keyframes elizaFoam{from{transform:scaleX(.8) translateY(-6px)}to{transform:scaleX(1.15) translateY(6px)}}
@media (prefers-reduced-motion:reduce){.eliza-wash,.eliza-sea,.eliza-wave{display:none}.eliza-casting,.eliza-lulled,.eliza-rise,.eliza-drowned{animation:none}}
/* Sister Agnes's mastery (agnesFx in effects.js) */
.agnes-wash{position:fixed;inset:0;z-index:28;pointer-events:none;opacity:0;transition:opacity .7s ease}
.agnes-wash.on{opacity:1}
.agnes-wash.aw-candles{background:radial-gradient(ellipse at 50% 50%,rgba(60,40,10,.2),rgba(14,10,4,.7) 70%,rgba(6,4,2,.85))}
.agnes-wash.aw-waxen{background:radial-gradient(ellipse at 50% 42%,rgba(60,70,60,.25),rgba(8,12,10,.82) 68%,rgba(2,4,3,.94))}
.agnes-wash.aw-greenflame{background:radial-gradient(ellipse at 50% 70%,rgba(30,90,20,.35),rgba(6,20,6,.8) 70%,rgba(2,8,2,.92));animation:awGreen 1.2s ease-in-out infinite alternate}
@keyframes awGreen{to{filter:brightness(1.25) saturate(1.2)}}
.agnes-casting{animation:agnesCast 2.2s ease-in-out;position:relative;z-index:29}
@keyframes agnesCast{0%,100%{filter:none;box-shadow:none}25%,75%{filter:brightness(1.15);box-shadow:0 0 0 2px #e9ffd8aa,0 0 40px 6px #7dff5a55,0 0 60px 10px #ffd27a33}}
.agnes-lit{position:relative;z-index:29}
.agnes-whited{animation:agnesWhited 1.3s ease-out}
@keyframes agnesWhited{0%{filter:none}12%{filter:brightness(2.4) saturate(0) contrast(.7)}55%{filter:brightness(1.3) saturate(.3) sepia(.4) hue-rotate(50deg)}100%{filter:none}}
.agnes-burned{animation:agnesBurned 1.3s cubic-bezier(.2,.8,.3,1)}
@keyframes agnesBurned{0%{transform:none;filter:none}10%{transform:translateY(6px) scale(.97);filter:brightness(1.8) sepia(.6) hue-rotate(50deg) saturate(2)}40%{transform:translate(-3px,-1px)}100%{transform:none;filter:none}}
.agnes-flash{position:fixed;inset:0;z-index:60;pointer-events:none;background:radial-gradient(circle at 50% 42%,#fff 0,var(--flash,#f4f1e8) 30%,rgba(160,255,120,.35) 62%,rgba(0,20,0,0) 100%);animation:agnesFlash .6s ease-out forwards}
@keyframes agnesFlash{0%{opacity:0}12%{opacity:.8}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.agnes-wash,.agnes-flash{display:none}.agnes-casting,.agnes-whited,.agnes-burned{animation:none}}
/* Eli Bowden's mastery, The Old Firm: Break the Cuffs, Powder Burn, Black Wind, Old Faithful */
.eli-wash{position:fixed;inset:0;z-index:28;pointer-events:none;opacity:0;transition:opacity .7s ease}
.eli-wash.on{opacity:1}
.eli-wash.elw-cuffs{background:radial-gradient(ellipse at 50% 50%,rgba(70,55,35,.2),rgba(14,12,10,.72) 70%,rgba(5,4,3,.88))}
.eli-wash.elw-powder{background:radial-gradient(ellipse at 50% 45%,rgba(120,80,30,.25),rgba(30,22,14,.75) 68%,rgba(10,8,5,.9))}
.eli-wash.elw-wind{background:radial-gradient(ellipse at 50% 50%,rgba(40,28,60,.35),rgba(6,4,10,.86) 66%,rgba(0,0,2,.95));animation:elwWind 1.4s ease-in-out infinite alternate}
@keyframes elwWind{to{filter:brightness(.8) hue-rotate(-15deg)}}
.eli-casting{animation:eliCast 2.2s ease-in-out;position:relative;z-index:29}
@keyframes eliCast{0%,100%{filter:none;box-shadow:none}25%,75%{filter:brightness(1.12);box-shadow:0 0 0 2px #e8d6aaaa,0 0 40px 6px #c9a46a55}}
.eli-casting.ec-wind{animation-name:eliCastWind}
@keyframes eliCastWind{0%,100%{filter:none;box-shadow:none}25%,75%{filter:brightness(.9) contrast(1.15);box-shadow:0 0 0 2px #6a4a9aaa,0 0 50px 10px #1a1030cc}}
.eli-lit{position:relative;z-index:29}
.eli-cuffed{animation:eliCuffed 1.3s cubic-bezier(.2,.8,.3,1)}
@keyframes eliCuffed{0%{transform:none;filter:none}8%{transform:scale(.95) translateY(4px);filter:brightness(1.6) saturate(.2)}30%{transform:translateX(-4px);filter:saturate(.3) sepia(.3)}50%{transform:translateX(3px)}100%{transform:none;filter:none}}
.eli-burned{animation:eliBurned 1.2s cubic-bezier(.2,.8,.3,1)}
@keyframes eliBurned{0%{transform:none;filter:none}10%{transform:translateY(5px) scale(.97);filter:brightness(1.9) sepia(.7) saturate(2.2)}45%{transform:translate(-3px,-1px);filter:brightness(1.2) sepia(.3)}100%{transform:none;filter:none}}
.eli-warded{animation:eliWarded 1s ease-out}
@keyframes eliWarded{0%{filter:none}20%{filter:brightness(.6) contrast(1.3)}100%{filter:none}}
.eli-flash{position:fixed;inset:0;z-index:60;pointer-events:none;background:radial-gradient(circle at 50% 45%,#fff 0,var(--flash,#fff2d0) 28%,rgba(255,150,60,.35) 60%,rgba(20,10,0,0) 100%);animation:agnesFlash .6s ease-out forwards}
/* Black Wind: a dark spinning ward on each investigator's card for the round it holds */
.character-sheet.black-wind{position:relative;box-shadow:0 0 0 2px #7a5ab0,0 0 30px 6px #3a1f6acc}
.character-sheet.black-wind::after{content:'';position:absolute;inset:-5px;border-radius:inherit;pointer-events:none;background:conic-gradient(from var(--bw),#b49aff,#3a2a5a00 22%,#6a4aa0dd 50%,#3a2a5a00 72%,#b49aff);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;padding:5px;animation:blackWindSpin 2.4s linear infinite;z-index:2}
@property --bw{syntax:'<angle>';inherits:false;initial-value:0deg}
@keyframes blackWindSpin{to{--bw:360deg}}
@media (prefers-reduced-motion:reduce){.eli-wash,.eli-flash{display:none}.eli-casting,.eli-cuffed,.eli-burned,.eli-warded,.character-sheet.black-wind::after{animation:none}}
/* Maud Ferris's mastery, The Deeper Slumber: Dream Them Down, The Gate of Deeper Slumber, Kadath in the Cold Waste */
.maud-wash{position:fixed;inset:0;z-index:28;pointer-events:none;opacity:0;transition:opacity .7s ease}
.maud-wash.on{opacity:1}
.maud-wash.mw-dreamdown{background:radial-gradient(ellipse at 50% 55%,rgba(90,60,180,.22),rgba(14,8,32,.74) 70%,rgba(6,3,14,.9))}
.maud-wash.mw-deepgate{background:radial-gradient(ellipse at 50% 46%,rgba(120,90,220,.28),rgba(10,6,22,.86) 64%,rgba(2,1,8,.95))}
.maud-wash.mw-kadath{background:linear-gradient(180deg,rgba(4,6,20,.95),rgba(16,20,44,.82) 60%,rgba(30,36,70,.7))}
.maud-casting{animation:maudCast 2.2s ease-in-out;position:relative;z-index:29}
@keyframes maudCast{0%,100%{filter:none;box-shadow:none}25%,75%{filter:brightness(1.1) saturate(.85);box-shadow:0 0 0 2px #d8d0ffaa,0 0 44px 8px #7a5cff55}}
.maud-lit{position:relative;z-index:29}
.maud-lifted{animation:maudLifted 1.4s ease-in-out}
@keyframes maudLifted{0%{transform:none;filter:none}35%{transform:translateY(-10px);filter:brightness(1.25) saturate(.7) hue-rotate(-20deg)}100%{transform:none;filter:none}}
.maud-slumber{animation:maudSlumber 1.6s ease-in-out}
@keyframes maudSlumber{0%{filter:none;transform:none}30%{filter:brightness(.55) saturate(.2) blur(1.5px);transform:scale(.97)}70%{filter:brightness(.7) saturate(.35) hue-rotate(220deg) blur(.6px)}100%{filter:none;transform:none}}
/* Dream Them Down: the ally is in the dream for the round — a soft violet haze and a slow drift */
.character-sheet.dreaming{position:relative;box-shadow:0 0 0 2px #a898f0,0 0 30px 6px #6a4ad066}
.character-sheet.dreaming .portrait-slot{animation:dreamDrift 3s ease-in-out infinite;filter:saturate(.75) hue-rotate(-12deg) brightness(1.06)}
@keyframes dreamDrift{50%{transform:translateY(-3px)}}
@media (prefers-reduced-motion:reduce){.maud-wash{display:none}.maud-casting,.maud-lifted,.maud-slumber,.character-sheet.dreaming .portrait-slot{animation:none}}
/* Wen Ah-Lok's mastery, The Moon-War: The Moon-Leap, Rally the Pride, The Moon-War */
.wen-wash{position:fixed;inset:0;z-index:28;pointer-events:none;opacity:0;transition:opacity .7s ease}
.wen-wash.on{opacity:1}
.wen-wash.ww-moonleap{background:radial-gradient(ellipse at 72% 22%,rgba(200,215,255,.25),rgba(8,12,30,.78) 55%,rgba(2,4,12,.92))}
.wen-wash.ww-rally{background:radial-gradient(ellipse at 50% 50%,rgba(60,50,90,.2),rgba(10,10,24,.72) 70%,rgba(3,3,10,.88))}
.wen-wash.ww-moonwar{background:radial-gradient(ellipse at 72% 22%,rgba(220,230,255,.32),rgba(6,10,28,.84) 52%,rgba(1,2,8,.95))}
.wen-casting{animation:wenCast 2.4s ease-in-out;position:relative;z-index:29}
@keyframes wenCast{0%,100%{filter:none;box-shadow:none}25%,75%{filter:brightness(1.12);box-shadow:0 0 0 2px #dfe8ffaa,0 0 44px 8px #9fb4ff55}}
.wen-lit{position:relative;z-index:29}
.wen-raked{animation:wenRaked 1s cubic-bezier(.2,.8,.3,1)}
@keyframes wenRaked{0%{transform:none;filter:none}10%{transform:translateX(-6px) rotate(-1deg);filter:brightness(1.8) saturate(.4)}35%{transform:translateX(5px) rotate(.6deg)}100%{transform:none;filter:none}}
.cat-general{border-color:#d8a05a80;--cat:#d8a05a}
.cat-leaper{border-color:#c8d0e680;--cat:#c8d0e6}
@media (prefers-reduced-motion:reduce){.wen-wash{display:none}.wen-casting,.wen-raked{animation:none}}
/* Ezra Coffin's mastery, Sea-Change: the Ink Sac, Drag Them Under, the regrowth */
.ezra-water{position:fixed;left:0;right:0;bottom:0;height:0;z-index:28;pointer-events:none;background:linear-gradient(180deg,rgba(150,210,220,.35) 0,rgba(20,50,60,.75) 6%,rgba(4,14,20,.92) 60%);box-shadow:0 -2px 12px rgba(180,230,240,.4);animation:ezraRise .9s ease-out forwards}
.ezra-water.drain{animation:ezraDrain .8s ease-in forwards}
@keyframes ezraRise{to{height:62vh}}
@keyframes ezraDrain{from{height:62vh}to{height:0}}
.ezra-casting{animation:ezraCast 2s ease-in-out;position:relative;z-index:29}
@keyframes ezraCast{0%,100%{filter:none;box-shadow:none}25%,75%{filter:brightness(1.1) saturate(1.2) hue-rotate(-10deg);box-shadow:0 0 0 2px #9fe8c0aa,0 0 40px 8px #2a8a6a55}}
.ezra-dragged{animation:ezraDragged 1.6s ease-in-out;position:relative;z-index:29}
@keyframes ezraDragged{0%{transform:none;filter:none}35%{transform:translateY(40px) scale(.94);filter:brightness(.5) saturate(.4) hue-rotate(160deg) blur(1px)}70%{transform:translateY(8px);filter:brightness(.8) hue-rotate(80deg)}100%{transform:none;filter:none}}
.ezra-drowned{animation:ezraDrowned 1.6s ease-in forwards;position:relative;z-index:29}
@keyframes ezraDrowned{0%{transform:none;filter:none}40%{transform:translateY(50px) scale(.92);filter:brightness(.4) saturate(.3) hue-rotate(160deg) blur(1.5px)}100%{transform:translateY(30px) scale(.94);filter:brightness(.35) saturate(.2) blur(1px)}}
.ezra-inked{animation:ezraInked 1.4s ease-out}
@keyframes ezraInked{0%{filter:none}15%{filter:brightness(.25) contrast(1.4)}100%{filter:none}}
.ezra-regrown{animation:ezraRegrown 1.4s ease-out}
@keyframes ezraRegrown{0%{filter:none}30%{filter:brightness(1.3) saturate(1.4) hue-rotate(-25deg)}100%{filter:none}}
@media (prefers-reduced-motion:reduce){.ezra-water{display:none}.ezra-casting,.ezra-dragged,.ezra-drowned,.ezra-inked,.ezra-regrown{animation:none}}
/* Camilla's mastery, No Mask: "You, Sir, Should Unmask" and The Second Act */
.cam-casting{animation:camCast 2.6s ease-in-out;position:relative;z-index:29}
@keyframes camCast{0%,100%{filter:none;box-shadow:none}25%,75%{filter:brightness(1.12) saturate(.7);box-shadow:0 0 0 2px #ffe680aa,0 0 44px 8px #d8b03a55}}
.cam-lit{position:relative;z-index:29}
.cam-unmasked{animation:camUnmasked 1.2s ease-out}
@keyframes camUnmasked{0%{filter:none}15%{filter:brightness(1.9) saturate(0) contrast(.8)}100%{filter:none}}
.cam-pallid{animation:camPallid 1.2s ease-out}
@keyframes camPallid{0%{filter:none}20%{filter:brightness(1.4) sepia(.8) saturate(1.8) hue-rotate(5deg)}100%{filter:none}}
.cam-sky{position:fixed;inset:0;z-index:28;pointer-events:none;opacity:0;transition:opacity .8s ease;background:linear-gradient(180deg,#120a1c 0%,#3a2440 45%,#a8704a 78%,#e8b070 100%)}
.cam-sky.on{opacity:.92}
.cam-sky i{position:absolute;bottom:14%;width:18vmin;height:18vmin;border-radius:50%;background:radial-gradient(circle,#fff3c8 0,#ffd27a 55%,rgba(255,200,110,0) 72%)}
.cam-sky i:first-child{left:56%}.cam-sky i:nth-child(2){left:70%;width:12vmin;height:12vmin;bottom:16%}
.cam-sky b{position:absolute;width:3vmin;height:3vmin;background:#050208;clip-path:polygon(50% 0,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0 50%,39% 39%)}
.cam-sky b:nth-of-type(1){left:12%;top:12%}.cam-sky b:nth-of-type(2){left:30%;top:22%;transform:scale(.7)}.cam-sky b:nth-of-type(3){left:48%;top:8%}.cam-sky b:nth-of-type(4){left:78%;top:18%;transform:scale(.8)}.cam-sky b:nth-of-type(5){left:90%;top:6%;transform:scale(.6)}
.cam-curtain{position:fixed;inset:0;z-index:60;pointer-events:none}
.cam-curtain span{position:absolute;top:0;bottom:0;width:51%;background:repeating-linear-gradient(90deg,#4a0a12 0,#7a1420 3vw,#3a060c 6vw);box-shadow:inset 0 -40px 60px rgba(0,0,0,.6);animation:camCurtainL 1.5s ease-in-out forwards}
.cam-curtain span:first-child{left:0;transform:translateX(-100%)}
.cam-curtain span:last-child{right:0;transform:translateX(100%);animation-name:camCurtainR}
@keyframes camCurtainL{0%{transform:translateX(-100%)}40%,55%{transform:translateX(0)}100%{transform:translateX(-100%)}}
@keyframes camCurtainR{0%{transform:translateX(100%)}40%,55%{transform:translateX(0)}100%{transform:translateX(100%)}}
@media (prefers-reduced-motion:reduce){.cam-sky,.cam-curtain{display:none}.cam-casting,.cam-unmasked,.cam-pallid{animation:none}}
/* Maud's rebuilt cinematics: the pull into the Gate, Kadath's sky, and the dream-sleep overlay */
.maud-pulled{animation:maudPulled 1.6s cubic-bezier(.5,0,.3,1);position:relative;z-index:29}
@keyframes maudPulled{0%{transform:none;filter:none}40%{transform:translateY(-14px) scale(.88) rotate(-1.5deg);filter:blur(2px) saturate(.2) brightness(1.3) hue-rotate(230deg)}70%{transform:translateY(-6px) scale(.94);filter:blur(1px) saturate(.4) brightness(.8)}100%{transform:none;filter:none}}
.maud-kadath-sky{position:fixed;inset:0;z-index:28;pointer-events:none;opacity:0;transition:opacity .9s ease;background:linear-gradient(180deg,#02040c 0%,#0a1430 45%,#1a2a52 75%,#2a3a66 100%);overflow:hidden}
.maud-kadath-sky.on{opacity:.96}
.maud-kadath-sky i{position:absolute;left:-20%;right:-20%;height:24vh;top:6vh;background:linear-gradient(90deg,rgba(80,255,200,0),rgba(90,255,190,.35),rgba(140,120,255,.35),rgba(80,255,200,0));filter:blur(18px);transform:skewY(-6deg);animation:auroraDrift 6s ease-in-out infinite alternate}
.maud-kadath-sky i+i{top:14vh;height:16vh;opacity:.7;transform:skewY(4deg);animation-duration:8s;animation-direction:alternate-reverse}
.maud-kadath-sky img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 30%;transform:translateY(14%) scale(1.06);animation:kadathRise 2s cubic-bezier(.2,.8,.2,1) forwards}
.maud-kadath-sky.has-img i{opacity:.35;mix-blend-mode:screen}
@keyframes auroraDrift{to{transform:translateX(8%) skewY(-2deg)}}
@keyframes kadathRise{to{transform:none}}
.maud-tray-lift{position:relative;z-index:29}
.enemy.dream-asleep .portrait-slot{box-shadow:inset 0 0 0 2px #a898f0,inset 0 0 40px #3a2a8a88}
.enemy.dream-asleep .living-portrait{filter:saturate(.45) brightness(.8) hue-rotate(-20deg)}
.enemy.dream-asleep .portrait-slot::before{content:'☾ z z';position:absolute;right:10%;top:12%;z-index:4;font:600 clamp(14px,2.4vw,22px)/1 serif;letter-spacing:.2em;color:#e8e2ff;text-shadow:0 0 10px #8a70e0;pointer-events:none;animation:dreamZ 3s ease-in-out infinite}
@keyframes dreamZ{0%{transform:translateY(6px);opacity:.3}50%{transform:translateY(-6px);opacity:1}100%{transform:translateY(6px);opacity:.3}}
@media (prefers-reduced-motion:reduce){.maud-kadath-sky{display:none}.maud-pulled,.maud-kadath-sky i,.enemy.dream-asleep .portrait-slot::before{animation:none}}
/* The Second Act's stage (owner rework): a darkened theatre with a warm glow from the footlights below */
.cam-stage{position:fixed;inset:0;z-index:28;pointer-events:none;opacity:0;transition:opacity .7s ease;background:radial-gradient(ellipse at 50% 110%,rgba(255,190,80,.35),rgba(60,30,8,.55) 35%,rgba(8,4,2,.9) 70%),#050302}
.cam-stage.on{opacity:.9}
.cam-stage i{position:absolute;left:0;right:0;top:0;height:9vh;background:repeating-linear-gradient(90deg,#4a0a12 0,#7a1420 3vw,#3a060c 6vw);box-shadow:0 8px 20px rgba(0,0,0,.7);border-bottom:3px solid #c9a24c;clip-path:polygon(0 0,100% 0,100% 70%,92% 100%,84% 70%,76% 100%,68% 70%,60% 100%,52% 70%,44% 100%,36% 70%,28% 100%,20% 70%,12% 100%,4% 70%,0 100%)}
@media (prefers-reduced-motion:reduce){.cam-stage{display:none}}
/* Ossek-Ul's mastery, The Cone Restored: the Lightning Weapon and the Exchange of Minds */
.ossek-casting{animation:ossekCast 1.8s ease-in-out;position:relative;z-index:29}
@keyframes ossekCast{0%,100%{filter:none;box-shadow:none}25%,75%{filter:brightness(1.15);box-shadow:0 0 0 2px #b8d4ffaa,0 0 40px 8px #6a9aff55}}
.ossek-shocked{animation:ossekShocked .9s steps(6,end)}
@keyframes ossekShocked{0%{filter:none}20%{filter:brightness(2.2) saturate(0) contrast(1.4)}40%{filter:brightness(.8) hue-rotate(180deg)}60%{filter:brightness(1.8) saturate(.2)}100%{filter:none}}
.ossek-exchanged{animation:ossekExchanged 1.5s ease-in-out}
@keyframes ossekExchanged{0%{filter:none;transform:none}30%{filter:sepia(.9) saturate(1.6) blur(1px);transform:rotate(-2deg) scale(.97)}60%{filter:hue-rotate(110deg) saturate(1.4);transform:rotate(1.5deg)}100%{filter:none;transform:none}}
@media (prefers-reduced-motion:reduce){.ossek-casting,.ossek-shocked,.ossek-exchanged{animation:none}}
/* Ossek-Ul's Release Steam */
.ossek-steaming{animation:ossekSteaming 1.5s ease-in-out;position:relative;z-index:29}
@keyframes ossekSteaming{0%,100%{transform:none;filter:none}10%,30%,50%{transform:translateX(-2px)}20%,40%{transform:translateX(2px)}35%{filter:brightness(1.15) sepia(.3)}}
.ossek-scalded{animation:ossekScalded 1.2s ease-out}
@keyframes ossekScalded{0%{filter:none}15%{filter:brightness(1.9) saturate(.3) contrast(.8)}45%{filter:brightness(1.2) sepia(.6) saturate(1.8) hue-rotate(-15deg)}100%{filter:none}}
@media (prefers-reduced-motion:reduce){.ossek-steaming,.ossek-scalded{animation:none}}
.ossek-flash{position:fixed;inset:0;z-index:60;pointer-events:none;background:radial-gradient(circle at 50% 45%,rgba(220,235,255,.55),rgba(120,170,255,.18) 50%,rgba(0,0,0,0) 80%);animation:agnesFlash .35s ease-out forwards}
@media (prefers-reduced-motion:reduce){.ossek-flash{display:none}}
/* Maud's Deeper Dream Die: each sign has its own reaction on the enemy's card (no screen shake) */
.df-gate{animation:dfGate 1s ease-out}
@keyframes dfGate{0%{transform:none;filter:none}35%{transform:scale(.95);filter:brightness(.6) saturate(.3) hue-rotate(220deg)}100%{transform:none;filter:none}}
.df-wood{animation:dfWood 1s steps(5,end)}
@keyframes dfWood{0%{filter:none}20%{filter:sepia(.6) hue-rotate(60deg) saturate(1.8)}40%{filter:none}60%{filter:sepia(.5) hue-rotate(60deg) saturate(1.6)}100%{filter:none}}
.df-gaunt{animation:dfGaunt 1s ease-out}
@keyframes dfGaunt{0%{filter:none}20%{filter:brightness(.12) contrast(1.4)}60%{filter:brightness(.5)}100%{filter:none}}
.df-gugs{animation:dfGugs .8s cubic-bezier(.2,.9,.3,1)}
@keyframes dfGugs{0%{transform:none}18%{transform:translateY(16px) scaleY(.94)}40%{transform:translateY(-4px)}60%{transform:translateY(3px)}100%{transform:none}}
.df-celeph{animation:dfCeleph 1s ease-out}
@keyframes dfCeleph{0%{filter:none}30%{filter:brightness(1.35) sepia(.6) saturate(1.6)}100%{filter:none}}
.df-kadath{animation:dfKadath .9s ease-out}
@keyframes dfKadath{0%{transform:none;filter:none}10%{transform:translateX(-7px) rotate(-.8deg);filter:brightness(2) saturate(.2)}25%{transform:translateX(6px) rotate(.6deg)}40%{transform:translateX(-4px)}55%{transform:translateX(3px);filter:brightness(1.2)}100%{transform:none;filter:none}}
@media (prefers-reduced-motion:reduce){.df-gate,.df-wood,.df-gaunt,.df-gugs,.df-celeph,.df-kadath{animation:none}}
/* Safety net shown when a script error stops the game mid-turn (game.js showRescue) */
#rescue{position:fixed;left:50%;bottom:16px;transform:translateX(-50%);z-index:90;width:min(460px,calc(100% - 32px));box-sizing:border-box;padding:16px 18px;background:var(--panel);border:1px solid var(--gold);border-radius:10px;color:var(--ink);box-shadow:0 10px 40px #000a;font-size:15px}
#rescue[hidden]{display:none}
#rescue p{margin:6px 0;color:var(--muted)}
#rescue code{display:block;margin:6px 0 12px;padding:6px 8px;background:#0008;border-radius:6px;color:var(--gold);font-size:13px;word-break:break-word}
#rescue button{width:100%}
/* Artifacts: quest items kept at the foot of the satchel, outside its slots (game.js renderArtifacts) */
#artifacts{margin-top:14px;padding-top:6px;border-top:2px solid #5a6853}
#artifacts h4{margin:10px 0 2px;font:13px system-ui;letter-spacing:1.5px;color:var(--gold);display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px}
#artifacts h4 small{color:var(--muted);letter-spacing:.5px;font-size:12px}
#bag .artifact-count{font:13px system-ui;color:var(--gold);margin-left:6px}
/* Danny's mastery, Stop the Presses (effects.js dannyFx / exposeFx) */
.danny-wash{position:fixed;inset:0;z-index:28;pointer-events:none;opacity:0;transition:opacity .6s ease;background:radial-gradient(ellipse at 50% 40%,rgba(120,95,55,.25),rgba(30,24,16,.78) 68%,rgba(10,8,5,.9))}
.danny-wash.on{opacity:1}
.danny-plate .portrait-slot img{animation:dannyPlate .85s ease-out}
@keyframes dannyPlate{0%{filter:none}18%{filter:sepia(1) brightness(1.9) contrast(1.2)}60%{filter:sepia(.9) brightness(1.05) contrast(1.15)}100%{filter:none}}
.reduced .danny-plate .portrait-slot img{animation:none}
/* Party Equipment, under the satchel (game.js renderEquipment) */
.equip-tab{margin-top:-14px}
#equipList{padding:0 18px 18px}
.gear-card{padding:14px 0}
.gear-who{font-size:17px;color:var(--gold)}
.gear-card .gear-base{margin:2px 0 8px;font:12px system-ui;letter-spacing:1px;color:var(--muted);text-transform:uppercase}
.gear-dead{opacity:.7}
.gear-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 12px;padding:8px 0;border-top:1px solid #ffffff10}
.gear-name small{display:block;font:11px system-ui;letter-spacing:1px;color:var(--muted);text-transform:uppercase}
.gear-empty .gear-name b{color:var(--muted);font-weight:400;font-style:italic}
.gear-actions{display:flex;flex-wrap:wrap;gap:6px}
.gear-actions button{margin:0}
/* The Dust Hat (game.js hatFaded): the wearer's card thins out like dust in a sunbeam for the round they are Faded */
.hat-faded .portrait-slot img{filter:grayscale(.75) brightness(.85) contrast(.85) blur(1.2px);opacity:.5;transition:filter .8s,opacity .8s}
.hat-faded .portrait-slot:after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 40%,rgba(220,210,185,.18),rgba(40,36,30,.35));animation:hatDust 3s ease-in-out infinite}
@keyframes hatDust{50%{opacity:.55}}
.reduced .hat-faded .portrait-slot:after{animation:none}
/* The White Ship (Chapter Five's secret side chapter): map, the Long Swell's moonlight marker, and the crossing / way home */
body[data-chapter="whiteship"].mapping:before{background:linear-gradient(180deg,#0a0f1a33 0%,#0a0f1a8c 40%,#06090fe0 100%),url('white-ship-map.webp') center top/cover no-repeat}
body[data-chapter="whiteship"] .route-map{background:linear-gradient(#0c13204d,#070b14a6),url('white-ship-map.webp') center 55%/cover no-repeat}
body[data-chapter="whiteship"] .scene img{object-position:center 45%}
.moon-flame{filter:drop-shadow(0 0 2px #ffffff) drop-shadow(0 0 6px #cfe0ff) drop-shadow(0 0 12px #8fb0ffaa)}
.moon-flame:before{background:radial-gradient(ellipse at 50% 78%,#ffffff 0 16%,#e4ecff 36%,#a8c0ff 62%,#6f8fd800 78%)}
.moon-flame b{background:radial-gradient(ellipse at 50% 80%,#ffffff 0 34%,#eef3ff 62%,#eef3ff00 82%)}
.ws-moon .fd-img{transform-origin:53% 40%;filter:brightness(.45) saturate(.8);transition:filter 1.8s ease}
.ws-moon.on .fd-img{animation:crPush 7s ease-in-out forwards}
.ws-moon.lit .fd-img{filter:brightness(1.05) saturate(1)}
.ws-glow{position:absolute;width:26%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,#ffffffcc 0,#dfe8ff66 30%,transparent 70%);mix-blend-mode:screen;opacity:0;transition:opacity 1.6s}
.ws-moon.lit .ws-glow{opacity:.8;animation:crBreathe 2.6s ease-in-out infinite}
.ws-voyage .fd-img{transform-origin:62% 40%;filter:brightness(.5) saturate(.8);transition:filter 2s ease}
.ws-voyage.on .fd-img{animation:crDrift 8s ease-out forwards}
.ws-voyage.lit .fd-img{filter:brightness(1) saturate(1)}
.ws-bird{position:absolute;width:7%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,#bfe4ffcc 0,#5fb4ff44 45%,transparent 70%);mix-blend-mode:screen;opacity:0;transition:opacity 1.2s}
.ws-voyage.lit .ws-bird{opacity:1;animation:crBreathe 1.8s ease-in-out infinite}
.ws-pillars .fd-img{transform-origin:58% 45%;filter:brightness(.55) saturate(.85);transition:filter 2s ease}
.ws-pillars.on .fd-img{animation:crPush 6s ease-in forwards;filter:brightness(1)}
.ws-flash{position:absolute;inset:0;background:radial-gradient(circle at 55% 45%,#ffffff 0,#e8f0ffee 40%,#0b1424 100%);opacity:0;pointer-events:none;transition:opacity 1.4s}
.ws-flash.on{opacity:1}
.ws-title .cf-stamp{border-color:#cfdcff;color:#eef3ff;text-shadow:0 0 1px #cfdcff;max-width:calc(100vw - 48px);box-sizing:border-box;text-align:center}
.ws-title .cf-stamp b{white-space:normal;line-height:1.1}
.ws-title .cf-stamp b span{display:inline-block;white-space:nowrap}
.ws-title .cf-stamp small{white-space:normal;line-height:1.5}
.cf-reduce .ws-moon .fd-img,.cf-reduce .ws-voyage .fd-img,.cf-reduce .ws-pillars .fd-img,.fd-reduce .ws-glow,.fd-reduce .ws-bird{animation:none!important}
#harpoon.sway .hp-track{background:#3a1f1c}
#harpoon.sway .sw-early{background:#4a5a48}
#harpoon.sway .sw-razor{background:#fff2b0;box-shadow:0 0 14px #fff2b0cc}
#harpoon.sway .sw-fill{left:0;width:0;background:linear-gradient(90deg,#9fd6e800,#9fd6e855);pointer-events:none}
#harpoon.res-razor .hp-line{background:#fff2b0}
#harpoon.res-crit .hp-line{background:#ffe7a0}
/* Silas Venn: the Azure Bird's sheet, Death's bird skulls, Resonance's ring, Thalarion Touch's wash and grip */
.cat-sheet.bird-sheet{--cat:#7fc4ff}
.bird-slot{display:grid;place-items:center;background:radial-gradient(ellipse at 50% 45%,#2a4a6a,#0c1622 75%)}
.bird-slot .bird-icon{width:min(70%,220px);filter:drop-shadow(0 0 14px #7fc4ffaa);animation:birdBob 2.4s ease-in-out infinite}
@keyframes birdBob{50%{transform:translateY(-6px)}}
.doom-skulls{position:absolute;left:8px;bottom:8px;display:flex;gap:4px;z-index:5;pointer-events:none;padding:4px 6px;border-radius:3px;background:#0b0808cc;border:1px solid #6a5a50}
.doom-skulls svg{width:40px;height:22px;filter:drop-shadow(0 0 4px #000)}
.silas-ringing{box-shadow:0 0 0 2px #7fc4ff,0 0 24px #7fc4ffaa;transition:box-shadow .3s}
.silas-gripped{filter:brightness(.55) saturate(.6)}
.silas-casting{box-shadow:0 0 0 2px #2a0a14,0 0 30px #000}
.silas-touch{position:fixed;inset:0;z-index:28;pointer-events:none;opacity:0;transition:opacity .6s ease;background:radial-gradient(ellipse at 50% 50%,rgba(30,20,40,.55),rgba(4,2,6,.92) 75%)}
.silas-touch.on{opacity:1}
.silas-touch img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 18%;opacity:.85;transition:opacity .7s ease;transform-origin:50% 20%;animation:touchVision 4.2s cubic-bezier(.2,.7,.3,1) forwards}
.silas-touch.vision{background:#05030a}
.silas-touch.vision img{opacity:1}
.silas-touch.dim img{opacity:.6}
@keyframes touchVision{0%{transform:scale(1.14) translateY(4%)}100%{transform:scale(1) translateY(0)}}
@media (prefers-reduced-motion:reduce){.silas-touch img{animation:none}}
.silas-hands{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none;z-index:30}
@media (prefers-reduced-motion:reduce){.bird-slot .bird-icon{animation:none}}
.hp-hud.silas-hud-lift{z-index:30}
.silas-struck-hit .portrait-slot img{animation:svStruck .5s ease-out}
.silas-struck-crit .portrait-slot img{animation:svStruckGold .6s ease-out}
.silas-struck-razor .portrait-slot img{animation:svStruckWhite .7s ease-out}
@keyframes svStruck{20%{filter:brightness(1.5) saturate(.6) hue-rotate(-20deg)}}
@keyframes svStruckGold{20%{filter:brightness(1.7) sepia(.5)}}
@keyframes svStruckWhite{15%{filter:brightness(2.4) saturate(.3)}50%{filter:brightness(1.4)}}
@media (prefers-reduced-motion:reduce){[class*="silas-struck-"] .portrait-slot img{animation:none}}
/* Resonance: the night-blue wash while the fork rings, and the ring that stays on a marked enemy's portrait */
.silas-res-wash{position:fixed;inset:0;z-index:28;pointer-events:none;opacity:0;transition:opacity .5s ease;background:radial-gradient(ellipse at 50% 30%,rgba(60,110,170,.35),rgba(6,14,30,.82) 70%,rgba(2,6,14,.92))}
.silas-res-wash.on{opacity:1}
.res-mark{position:absolute;inset:0;pointer-events:none;z-index:4;box-shadow:inset 0 0 0 2px #9fd6ff88,inset 0 0 26px #4a9ad877;animation:resPulse 2.2s ease-in-out infinite}
.res-mark::after{content:'';position:absolute;left:50%;top:50%;width:46%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;border:2px solid #cfeaff;opacity:0;animation:resRing 2.2s ease-out infinite}
@keyframes resPulse{50%{box-shadow:inset 0 0 0 2px #cfeaffcc,inset 0 0 40px #7fc4ffaa}}
@keyframes resRing{0%{opacity:.7;width:20%}100%{opacity:0;width:95%}}
@media (prefers-reduced-motion:reduce){.res-mark,.res-mark::after{animation:none}}
/* The Azure Bird: the moonlit shaft it comes down through, its landing, its dissolving card, and the shimmer as the party Fades */
.silas-moonshaft{position:fixed;top:0;bottom:0;width:min(46vw,360px);transform:translateX(-50%);z-index:29;pointer-events:none;opacity:0;transition:opacity .6s ease;background:linear-gradient(180deg,rgba(220,240,255,.5),rgba(127,196,255,.18) 55%,rgba(127,196,255,0));mask-image:linear-gradient(90deg,transparent,#000 30%,#000 70%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 30%,#000 70%,transparent)}
.silas-moonshaft.on{opacity:1}
.silas-bird-land .portrait-slot img{animation:svLand 1.1s ease-out}
@keyframes svLand{0%{filter:brightness(2.2) saturate(.4);transform:scale(1.06)}100%{filter:none;transform:none}}
.silas-bird-dissolve .portrait-slot img{transition:opacity .9s ease,filter .9s ease;opacity:.25;filter:brightness(1.8) blur(3px)}
.silas-fading .portrait-slot img{animation:svFade 1.2s ease-in-out}
@keyframes svFade{40%{opacity:.45;filter:brightness(1.4) saturate(.5) hue-rotate(-15deg)}}
@media (prefers-reduced-motion:reduce){.silas-bird-land .portrait-slot img,.silas-fading .portrait-slot img{animation:none}}
/* Death's skulls: ember eyes, the next to go flickers, a crumbling skull, and the card struck by the last */
.doom-skulls{background:linear-gradient(180deg,#140a0acc,#060404e6);border-color:#7a3a30;box-shadow:0 0 12px #000,inset 0 0 8px #3a0a0a}
.doom-skulls svg circle:nth-of-type(2){fill:#ff5a3c;animation:skullEye 1.6s ease-in-out infinite}
.doom-skulls svg:last-child{animation:skullNext 1.4s ease-in-out infinite}
.doom-skulls.last{border-color:#c0402c;box-shadow:0 0 16px #c0281c88,inset 0 0 10px #5a0a0a}
.doom-skulls.last svg:last-child{animation:skullNext .7s ease-in-out infinite}
@keyframes skullEye{50%{fill:#ffb08a}}
@keyframes skullNext{50%{filter:drop-shadow(0 0 6px #ff5a3c) brightness(1.15);transform:translateY(-1px)}}
.doom-skulls svg.skull-crumbling{animation:skullCrack .38s steps(6) forwards}
@keyframes skullCrack{0%{transform:none;filter:drop-shadow(0 0 4px #ff5a3c)}40%{transform:translateX(-1px) rotate(-6deg);filter:drop-shadow(0 0 10px #ff3a1c) brightness(1.4)}70%{transform:translateX(1px) rotate(5deg)}100%{transform:scale(1.15) rotate(-3deg);filter:drop-shadow(0 0 14px #ff3a1c) brightness(1.8);opacity:.6}}
.silas-deathstruck .portrait-slot img{animation:deathStruck .85s ease-out}
@keyframes deathStruck{10%{filter:brightness(.25) sepia(1) saturate(4) hue-rotate(-30deg)}40%{filter:brightness(.6) saturate(.4)}}
@media (prefers-reduced-motion:reduce){.doom-skulls svg,.doom-skulls svg circle,.silas-deathstruck .portrait-slot img{animation:none!important}}
/* Silas's mastery: the golden dawn of Cathuria and an investigator lit as they rise or mend */
.silas-cathuria{position:fixed;inset:0;z-index:28;pointer-events:none;opacity:0;transition:opacity .7s ease,background .6s ease;background:radial-gradient(ellipse at 50% 46%,rgba(255,232,170,.96),rgba(150,92,30,.97) 45%,rgba(40,20,6,.99))}
.silas-cathuria.on{opacity:1}
.silas-cathuria.dim{background:radial-gradient(ellipse at 50% 42%,rgba(255,226,150,.25),rgba(40,22,6,.85) 62%,rgba(10,6,2,.95))}
.silas-cathuria img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:55% 35%;opacity:1;transition:opacity .7s ease;animation:touchVision 4s cubic-bezier(.2,.7,.3,1) forwards}
.silas-cathuria.dim img{opacity:.55}
.silas-risen .portrait-slot img{animation:svRisen 1.3s ease-out}
@keyframes svRisen{0%{filter:brightness(2.4) sepia(.6) saturate(1.4)}100%{filter:none}}
@media (prefers-reduced-motion:reduce){.silas-cathuria img,.silas-risen .portrait-slot img{animation:none}}
.bird-slot{position:relative}
.bird-slot img.living-portrait{position:absolute;inset:0;width:100%;height:100%}
.silas-ascend{animation:svAscend 1.7s cubic-bezier(.3,.8,.3,1)}
@keyframes svAscend{0%{transform:translateY(0)}35%{transform:translateY(-14px);box-shadow:0 0 0 2px #ffe7a0,0 0 40px #ffd27aaa}100%{transform:translateY(0)}}
@media (prefers-reduced-motion:reduce){.silas-ascend{animation:none}}
#testWhite,#testHardFinale{display:block;margin:10px auto 0}
#testHardFinale{margin-bottom:18px}
#testWhite:disabled,#testHardFinale:disabled{opacity:.45}
#harpoon.sway.sw-wait .hp-line{animation:swReady .3s ease-in-out infinite alternate}
@keyframes swReady{to{opacity:.45}}
/* Hard mode: an Hour-Touched champion's card, and the Unnamable's portrait that sharpens as it is hurt */
.enemy.hour-touched{border-color:#3fbf7a;box-shadow:0 0 0 1px #0d2a1c,0 0 22px #2fa86a66,inset 0 0 30px #04140c}
.enemy.hour-touched .sheet-ribbon{background:linear-gradient(90deg,#0f2a1d,#1d5a3a);color:#d8ffe8}
.enemy.hour-touched .portrait-slot img{filter:saturate(.7) hue-rotate(-12deg) brightness(.92)}
.enemy.hour-touched .portrait-slot::after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 60%,transparent 40%,#04140ccc 100%);animation:hourPulse 2.6s ease-in-out infinite}
@keyframes hourPulse{50%{opacity:.55}}
.enemy.unnamable .portrait-slot img{filter:blur(var(--blur,0px)) grayscale(.2) brightness(1.35) contrast(1.1);transition:filter .6s ease}
/* The Unnamable (owner feedback 9 Nov 2026): a lighter blur so the painting shows from the start, and a caption so it reads as deliberate */
.unnamable .portrait-slot{position:relative}.unnamable .portrait-slot::after{content:'IT WILL NOT HOLD STILL';position:absolute;left:0;right:0;bottom:6px;text-align:center;font:600 10px system-ui;letter-spacing:.18em;color:#d8e3dccc;text-shadow:0 1px 3px #000}
@media (prefers-reduced-motion:reduce){.enemy.hour-touched .portrait-slot::after{animation:none}}
.enemy.hour-touched .portrait-slot{position:relative}
/* Hard finale: the Sable Petrel's hull — a bar, a shudder when struck, smoke when low, and a grey wreck when sunk */
.boat-sheet .hull-bar i{background:linear-gradient(90deg,#b8742c,#e2b45a)}
.boat-sheet.boat-low .hull-bar i{background:linear-gradient(90deg,#a02a1c,#e0603a)}
.boat-sheet .boat-warn{margin:6px 0 10px;font-size:13px;color:#f0b080}
.boat-sheet.boat-low .portrait-slot::after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 40% 30%,#0000 30%,#1a0c08aa 100%);animation:hourPulse 1.6s ease-in-out infinite}
.boat-sheet.boat-low .portrait-slot{position:relative}
.boat-sheet.boat-sunk .portrait-slot img{filter:grayscale(1) brightness(.45);transform:rotate(4deg) translateY(10%);transition:all 1.2s ease}
.boat-sheet.boat-sunk{opacity:.7}
.boat-sheet.boat-hit{animation:boatShudder .6s ease-out}
@keyframes boatShudder{15%{transform:translateX(-6px) rotate(-.6deg)}35%{transform:translateX(5px) rotate(.5deg)}60%{transform:translateX(-3px)}}
@media (prefers-reduced-motion:reduce){.boat-sheet.boat-hit,.boat-sheet.boat-low .portrait-slot::after{animation:none}}
.frank-stand{animation:frankStand 1s ease-out}
@keyframes frankStand{20%{box-shadow:0 0 0 3px #e2b45a,0 0 30px #e2b45a99;transform:translateY(-4px)}}
@media (prefers-reduced-motion:reduce){.frank-stand{animation:none}}
.hay-crumple .portrait-slot img{animation:hayCrumple .6s ease-out}
@keyframes hayCrumple{12%{transform:scale(.9,.94) skewX(-4deg);filter:brightness(1.6)}40%{transform:scale(1.03)}}
@media (prefers-reduced-motion:reduce){.hay-crumple .portrait-slot img{animation:none}}
/* The Compendium (owner request 20 Oct 2026): a numbered page for every enemy, under the masteries tab */
#compendiumShelf{padding:0 18px 18px}#compendiumShelf>.trophy-hint{margin:0 0 12px}
.comp-group+.comp-group{margin-top:18px}
.comp-sub{display:flex;justify-content:space-between;gap:8px;margin:12px 0 0;padding-bottom:5px;border-bottom:1px dashed var(--line);font:600 10.5px/1.3 system-ui;letter-spacing:.9px;text-transform:uppercase;color:#9fb8c8}.comp-sub span{color:var(--muted);font-weight:500}
.comp-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px;margin-top:10px}
.comp-page{position:relative;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:linear-gradient(180deg,rgba(236,224,196,.06),rgba(0,0,0,.18))}
.comp-no{position:absolute;top:6px;left:8px;z-index:2;font:600 10.5px system-ui;letter-spacing:.08em;color:#e8d7ae;text-shadow:0 1px 3px #000;background:rgba(10,14,16,.55);padding:2px 6px;border-radius:4px}
.comp-page.blank{align-items:center;justify-content:center;min-height:150px;gap:6px;border-style:dashed;background:repeating-linear-gradient(135deg,rgba(255,255,255,.015) 0 8px,rgba(0,0,0,.05) 8px 16px)}
.comp-page.blank b{font:500 13px Georgia,serif;color:var(--muted)}.comp-q{font:600 34px Georgia,serif;color:rgba(213,183,119,.35)}
.comp-art{height:150px;overflow:hidden;background:#0c1113}.comp-art img{width:100%;height:100%;object-fit:cover;display:block}
.comp-page.met:not(.beaten) .comp-art img{filter:saturate(.55) brightness(.85)}
.comp-body{padding:9px 11px 11px}.comp-body small{display:block;font:600 10px system-ui;letter-spacing:.12em;color:var(--gold)}.comp-body>b{display:block;font:600 15px Georgia,serif;margin:3px 0 4px;color:#efe4c8}
.comp-body p{margin:0;font-size:12.5px;line-height:1.45;color:#c9bfa5}.comp-body p.comp-hint{margin-top:6px;font-style:italic;color:var(--muted)}
.comp-stats{display:flex;flex-wrap:wrap;gap:4px 12px;margin:8px 0 4px;font-size:12px;color:var(--muted)}.comp-stats b{color:#efe4c8}
.comp-moves{list-style:none;margin:6px 0 0;padding:6px 0 0;border-top:1px solid var(--line);font-size:12px;line-height:1.4;color:#b8ae95}.comp-moves li+li{margin-top:4px}.comp-moves b{color:#e3d6b4;font-weight:600}.comp-moves li.pow b{color:#e7a36b}
.comp-page.boss{border-color:#8a6d3b;box-shadow:inset 0 0 0 1px rgba(213,183,119,.25),0 0 14px rgba(213,183,119,.08)}.comp-page.boss .comp-no{color:#f3d48a}
.comp-dot{display:inline-block;width:8px;height:8px;margin-right:8px;border-radius:50%;background:#e2b24f;box-shadow:0 0 6px #e2b24f;vertical-align:1px}
.comp-toast{position:fixed;left:50%;bottom:max(18px,env(safe-area-inset-bottom,0px));z-index:70;transform:translateX(-50%);display:flex;align-items:center;gap:12px;width:min(92vw,460px);padding:10px 14px;border:1px solid #6f5a33;border-radius:9px;background:rgba(16,20,22,.94);box-shadow:0 8px 30px rgba(0,0,0,.5);animation:compIn .45s ease-out;pointer-events:none}
.comp-toast svg{width:30px;height:30px;flex:none;color:var(--gold)}.comp-toast small{display:block;font:600 10.5px system-ui;letter-spacing:.16em;color:#d5b777}.comp-toast b{display:block;font:500 13.5px Georgia,serif;color:#efe4c8;margin-top:2px}
.comp-toast.out{transition:opacity .7s,transform .7s;opacity:0;transform:translate(-50%,12px)}
@keyframes compIn{from{opacity:0;transform:translate(-50%,14px)}to{opacity:1;transform:translate(-50%,0)}}
@media (max-width:700px){#compendiumShelf{padding:0 12px 14px}.comp-row{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}.comp-art{height:120px}}
@media (prefers-reduced-motion:reduce){.comp-toast{animation:none}}
/* The Compendium, phase (b): the three views, places and clues */
.comp-views{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 10px}
.comp-view{font:600 12px system-ui;letter-spacing:.06em;text-transform:uppercase;padding:7px 12px;border-radius:999px;border:1px solid var(--line);background:rgba(0,0,0,.2);color:#cfc4a6;cursor:pointer}.comp-view span{font-weight:500;color:var(--muted);margin-left:4px}
.comp-view.on{border-color:#b8955a;background:rgba(184,149,90,.16);color:#f0dfb5}.comp-view:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.comp-places{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.comp-place{position:relative;border:1px solid var(--line);border-radius:8px;padding:30px 13px 12px;background:linear-gradient(180deg,rgba(236,224,196,.06),rgba(0,0,0,.18))}
.comp-place .comp-no{background:none;text-shadow:none;color:var(--muted);padding:0}
.comp-place small{display:block;font:600 10px system-ui;letter-spacing:.12em;color:var(--gold)}.comp-place>b{display:block;font:600 15px Georgia,serif;color:#efe4c8;margin:3px 0 2px}
.comp-place i{display:block;font:italic 13px/1.4 Georgia,serif;color:#d9c79c;margin-bottom:5px}.comp-place p{margin:0;font-size:12.5px;line-height:1.5;color:#c9bfa5}
.comp-place details{margin-top:6px}.comp-place summary{cursor:pointer;font:600 11px system-ui;letter-spacing:.08em;text-transform:uppercase;color:var(--gold)}.comp-place details p{margin-top:6px}
.comp-place.blank{min-height:64px;border-style:dashed;display:flex;align-items:center;justify-content:center;padding:22px 12px 12px;background:repeating-linear-gradient(135deg,rgba(255,255,255,.015) 0 8px,rgba(0,0,0,.05) 8px 16px)}.comp-place.blank b{font:500 13px Georgia,serif;color:var(--muted);margin:0}
.comp-clues{grid-template-columns:repeat(3,1fr)}@media (max-width:980px){.comp-clues{grid-template-columns:1fr}}
.comp-clue{display:flex;gap:12px;align-items:flex-start;border:1px solid var(--line);border-radius:8px;padding:11px 13px;background:linear-gradient(180deg,rgba(236,224,196,.06),rgba(0,0,0,.18))}.comp-clue img{flex:none;border-radius:50%}
.comp-clue small{display:block;font:600 10px system-ui;letter-spacing:.12em;color:var(--gold)}.comp-clue p{margin:4px 0 0;font:italic 13px/1.5 Georgia,serif;color:#d6cbb0}
.comp-clue.blank{border-style:dashed}.comp-clue.blank .comp-q{flex:none;width:56px;text-align:center;font-size:30px}.comp-clue.blank p{font-style:normal;color:var(--muted)}
@media (max-width:700px){.comp-places,.comp-clues{grid-template-columns:1fr}}
/* The Compendium, phase (c): the Case Files */
.comp-files{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.comp-file{position:relative;display:flex;flex-direction:column;gap:10px;border:1px solid var(--line);border-radius:8px;padding:30px 13px 13px;background:linear-gradient(180deg,rgba(236,224,196,.06),rgba(0,0,0,.18))}
.comp-file .comp-no{background:none;text-shadow:none;color:var(--muted);padding:0}.comp-file b{font:600 15px Georgia,serif;color:#efe4c8}
.comp-file button{align-self:flex-start;margin-top:auto;padding:6px 12px;font:600 12px system-ui;letter-spacing:.06em;border-radius:6px;border:1px solid #b8955a;background:rgba(184,149,90,.14);color:#f0dfb5;cursor:pointer}.comp-file button:hover{background:rgba(184,149,90,.26)}
.comp-file.blank{border-style:dashed;justify-content:center;min-height:80px;background:repeating-linear-gradient(135deg,rgba(255,255,255,.015) 0 8px,rgba(0,0,0,.05) 8px 16px)}.comp-file.blank b{font:500 13px Georgia,serif;color:var(--muted)}
/* The Compendium: the Investigators */
.comp-heroes{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}.comp-hero .comp-art{height:190px}.comp-hero .comp-body p{margin-bottom:6px}.comp-hero .comp-stats{margin:4px 0 0}
@media (max-width:700px){.comp-hero .comp-art{height:150px}}
/* Randolph Carter's letter — the Compendium's reward (owner-approved 20 Oct 2026) */
.carter-letter{position:fixed;inset:0;z-index:80;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(6,9,10,.78);backdrop-filter:blur(2px);animation:clIn .6s ease-out}
.cl-paper{position:relative;width:min(560px,100%);max-height:calc(100vh - 32px);overflow:auto;padding:26px 28px 22px;border-radius:6px;background:linear-gradient(180deg,#efe3c6,#e2d2ad);color:#2b2318;box-shadow:0 20px 60px rgba(0,0,0,.6),inset 0 0 40px rgba(120,90,40,.25);font:15px/1.6 Georgia,serif}
.cl-paper small{display:block;font:600 11px system-ui;letter-spacing:.2em;color:#7a5b2a;margin-bottom:10px}.cl-paper p{margin:0 0 10px}.cl-date{font-style:italic;color:#5c4a30}.cl-sign{margin-top:14px}.cl-sign b{font:italic 600 19px Georgia,serif}
.cl-note{display:flex;gap:10px;align-items:center;margin:14px 0 12px;padding:10px 12px;border-radius:6px;background:rgba(43,35,24,.08);font:13px/1.45 system-ui;color:#3a2f20}.cl-note svg{width:28px;height:28px;flex:none;color:#7a5b2a}
.cl-paper button{padding:8px 14px;font:600 13px system-ui;border-radius:6px;border:1px solid #7a5b2a;background:#2b2318;color:#efe3c6;cursor:pointer}
@keyframes clIn{from{opacity:0}to{opacity:1}}@media (prefers-reduced-motion:reduce){.carter-letter{animation:none}}
/* Randolph Carter's effects (owner request 20 Oct 2026: top-tier visuals) */
.carter-canvas{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none}
.carter-night{position:fixed;inset:0;z-index:28;pointer-events:none;opacity:0;transition:opacity .45s ease;background:radial-gradient(ellipse at 50% 35%,rgba(40,20,80,.35),rgba(6,4,16,.78) 70%,rgba(2,2,8,.9))}
.carter-night.deep{z-index:30;background:radial-gradient(ellipse at 50% 45%,rgba(60,30,110,.45),rgba(6,4,18,.9) 65%,rgba(2,2,8,.96))}
.carter-night.on{opacity:1}
.carter-dream-veil{position:fixed;inset:0;z-index:60;pointer-events:none;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .7s ease;background:radial-gradient(ellipse at 50% 50%,rgba(255,250,255,.78),rgba(214,196,255,.55) 45%,rgba(120,90,190,.25) 80%,rgba(40,20,80,0))}
.carter-dream-veil p{margin:0;font:italic 500 clamp(26px,4.6vw,46px) Georgia,serif;color:#2a1c48;letter-spacing:.02em;text-shadow:0 0 18px rgba(255,255,255,.9);transform:translateY(8px);transition:transform 1.4s ease}
.carter-dream-veil.on{opacity:1}.carter-dream-veil.on p{transform:none}
.carter-unlocked .sheet-portrait{animation:carterUnlocked 1.2s ease-out}
@keyframes carterUnlocked{0%{filter:brightness(2.2) saturate(.4)}30%{filter:brightness(1.5) hue-rotate(-20deg);box-shadow:0 0 40px rgba(190,150,255,.8)}100%{filter:none;box-shadow:none}}
.carter-rewinding .sheet-portrait{animation:carterRewind 1.9s ease-in-out}
@keyframes carterRewind{0%{filter:none}20%{filter:sepia(.9) contrast(1.1) brightness(.9)}80%{filter:sepia(1) contrast(1.15) brightness(.85) blur(.5px)}90%{filter:sepia(0) brightness(1.6)}100%{filter:none}}
.carter-waking .sheet-portrait{animation:carterWake 1.8s ease-out}
@keyframes carterWake{0%{filter:blur(8px) brightness(1.8) saturate(.3);opacity:.5}60%{filter:blur(2px) brightness(1.2)}100%{filter:none;opacity:1}}
.carter-casting .sheet-portrait{animation:carterCast 4.2s ease-in-out}
@keyframes carterCast{0%,100%{box-shadow:none}20%,80%{box-shadow:0 0 30px rgba(190,150,255,.75),inset 0 0 40px rgba(190,150,255,.35)}}
.gaunt-lift{animation:gauntLift .95s cubic-bezier(.55,0,.6,1) forwards}
@keyframes gauntLift{0%{transform:none}15%{transform:translateY(8px) rotate(-1deg)}100%{transform:translateY(-110vh) rotate(4deg);opacity:.2}}
.gaunt-away{opacity:.28;filter:grayscale(.8) blur(1px);transform:translateY(-14px);transition:opacity .4s,transform .4s}
.gaunt-away .sheet-portrait{position:relative}.gaunt-away .sheet-portrait::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 20%,rgba(10,8,18,.0),rgba(10,8,18,.6))}
.gaunt-drop{animation:gauntDrop .85s cubic-bezier(.3,1.35,.5,1)}
@keyframes gauntDrop{0%{transform:translateY(-70vh) rotate(-3deg);opacity:.3}70%{transform:translateY(6px)}100%{transform:none;opacity:1}}
.gaunt-tickle{animation:gauntTickle 1.4s ease-in-out}
@keyframes gauntTickle{0%,100%{transform:none}10%{transform:rotate(-2deg) translateX(-4px)}20%{transform:rotate(2deg) translateX(4px)}30%{transform:rotate(-3deg)}40%{transform:rotate(3deg) translateY(-3px)}50%{transform:rotate(-2deg) scale(.98)}60%{transform:rotate(2deg)}70%{transform:rotate(-1deg) translateX(3px)}85%{transform:rotate(1deg)}}
.lock-pips{position:absolute;left:50%;bottom:8px;transform:translateX(-50%);display:flex;gap:5px;padding:4px 8px;border-radius:999px;background:rgba(10,8,20,.72);border:1px solid rgba(190,170,255,.45);z-index:3;pointer-events:none}
.lock-pips i{display:block;width:12px;height:16px;opacity:.45}.lock-pips i svg{width:100%;height:100%;fill:#8c84a8}
.lock-pips i.on{opacity:1;filter:drop-shadow(0 0 4px #c9a8ff)}.lock-pips i.on svg{fill:#f2e6ff}
@media (prefers-reduced-motion:reduce){.gaunt-lift,.gaunt-drop,.gaunt-tickle,.carter-unlocked .sheet-portrait,.carter-rewinding .sheet-portrait,.carter-waking .sheet-portrait,.carter-casting .sheet-portrait{animation:none}}
/* Carter's mastery: The Sunset City vision */
.carter-sunset{position:fixed;inset:0;z-index:55;pointer-events:none;opacity:0;transition:opacity .7s ease;overflow:hidden;background:#1a0f2a}
.carter-sunset.on{opacity:1}.carter-sunset img{width:100%;height:100%;object-fit:cover;object-position:50% 40%;transform-origin:60% 40%}
.carter-sunset::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 45%,rgba(0,0,0,0) 45%,rgba(20,8,30,.55))}
@media (prefers-reduced-motion:reduce){.carter-sunset{display:none}}
/* ── Strange Tides: the moon bar, the omen card, the mini-games ── */
.diff-btn.tides.on{border-color:#9fb4e0;background:#141c2c;box-shadow:0 0 0 1px #9fb4e077,0 0 20px #9fb4e033;color:#e6ecff}
#tides{margin-top:-10px}
.tides-bar{position:sticky;top:var(--hud-h,0px);z-index:20;margin:0 auto 14px;max-width:980px;padding:0 12px}
.tides-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 14px;padding:8px 14px;border:1px solid #9fb4e055;border-radius:12px;background:#0b1220ee;box-shadow:0 6px 18px #0008;backdrop-filter:blur(10px)}
.tides-name{font:600 11.5px/1 system-ui;letter-spacing:1.2px;color:#c6d3f2}
.tide-moons{display:flex;align-items:center;gap:2px}
.tide-moon{width:22px;height:22px;opacity:.38;transition:opacity .4s,transform .4s}
.tide-moon.on{opacity:1;transform:scale(1.22);filter:drop-shadow(0 0 6px #f3efe0aa)}
.tide-step{width:8px;height:1px;background:#9fb4e055}
.tides-say{font:13px/1.3 Georgia,serif;color:#dfe6f7}
.tides-carry{display:flex;gap:6px}
.tide-carry{display:inline-flex;width:24px;height:24px;border-radius:50%;border:1px solid currentColor;align-items:center;justify-content:center;background:#0006}
.tide-carry svg{width:16px;height:16px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.omen-veil{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(4,7,14,.82);backdrop-filter:blur(3px);opacity:0;transition:opacity .45s}
.omen-veil.on{opacity:1}
.omen-card{width:min(720px,100%);max-height:calc(100vh - 32px);overflow:auto;border:1px solid #9fb4e066;border-radius:14px;background:#0d1420;box-shadow:0 20px 60px #000c,0 0 40px #9fb4e01a;transform:translateY(14px);transition:transform .5s}
.omen-veil.on .omen-card{transform:none}
.omen-art{display:block;width:100%;aspect-ratio:16/7;object-fit:cover;border-radius:14px 14px 0 0;filter:saturate(.8) brightness(.85)}
.omen-body{padding:16px 20px 20px}
.omen-kicker{display:block;font:600 11px/1 system-ui;letter-spacing:1.4px;color:#9fb4e0;margin-bottom:6px}
.omen-body h2{margin:0 0 8px;font:600 24px/1.2 Georgia,serif;color:#f3efe0}
.omen-text{margin:0 0 14px;font:16px/1.55 Georgia,serif;color:#dfe2ea}
.omen-opts{display:grid;gap:8px}
.omen-opt{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:3px;padding:11px 14px;border-radius:10px;border:1px solid #9fb4e044;background:#131c2c;color:#e8ecf6;text-align:left;cursor:pointer;transition:border-color .2s,background .2s,opacity .3s}
.omen-opt b{font:600 15px/1.25 Georgia,serif}
.omen-opt small{font-size:12.5px;line-height:1.4;opacity:.78}
.omen-opt:not(:disabled):hover{border-color:#9fb4e0aa;background:#18233a}
.omen-opt.who{border-color:#d5b77799;background:#1c1d18}
.omen-who{font:600 10.5px/1 system-ui;letter-spacing:1px;text-transform:uppercase;color:var(--gold)}
.omen-opt.danger{border-color:#c4453a88;background:#22121a}
.omen-opt.danger b::before{content:'⚠ ';color:#ff8a7a}
.omen-opt.dim{opacity:.35}
.omen-opt.chosen{border-color:#f3efe0;box-shadow:0 0 0 1px #f3efe077}
.omen-play{margin-top:14px;text-align:center}
.omen-hint{font:14px/1.45 Georgia,serif;color:#cfd7ea;margin:0 0 10px}
.omen-tally{display:block;font:12px/1.4 system-ui;color:#9fb4e0;margin-top:4px}
.omen-die span{display:inline-block;font-size:64px;line-height:1;color:#f3efe0;transition:transform .3s}
.omen-die.done span{transform:scale(1.15);text-shadow:0 0 14px #f3efe0aa}
.omen-grid{display:grid;grid-template-columns:repeat(3,64px);gap:8px;justify-content:center}
.omen-mark{width:64px;height:64px;border-radius:8px;border:1px solid #9fb4e044;background:#141c2a;color:#cbbfa0;font:26px/1 Georgia,serif;cursor:pointer}
.omen-mark.fresh{animation:omenFresh 3.2s ease-in-out infinite;color:#ddd2b2}
.omen-mark.got{border-color:#7fd6a8;background:#12261c;color:#bff0d4;animation:none}
.omen-mark.wrong{border-color:#c4453a;background:#24121a;color:#ff9a8a;opacity:.7;animation:none}
@keyframes omenFresh{0%,100%{text-shadow:none}50%{text-shadow:0 0 7px #f3efe099}}
.omen-strings{display:flex;justify-content:center;gap:18px;padding:6px 0}
.omen-string{width:34px;height:120px;border:0;border-radius:6px;background:linear-gradient(90deg,transparent 46%,var(--c) 46% 54%,transparent 54%),#ffffff08;cursor:pointer;transition:background .2s}
.omen-string:disabled{cursor:default}
.omen-string.lit{animation:omenPluck .55s ease-out}
.omen-string.wrong{background:linear-gradient(90deg,transparent 40%,#c4453a 40% 60%,transparent 60%),#c4453a22}
@keyframes omenPluck{0%{box-shadow:0 0 0 0 var(--c);background:linear-gradient(90deg,transparent 30%,var(--c) 30% 70%,transparent 70%),#ffffff18}100%{box-shadow:0 0 22px 0 transparent}}
.omen-replay{margin-left:6px;padding:3px 10px;border-radius:8px;border:1px solid #9fb4e066;background:transparent;color:#cfd7ea;font:12px system-ui;cursor:pointer}
.omen-replay:disabled{opacity:.4}
.omen-result{margin-top:14px;padding-top:12px;border-top:1px solid #9fb4e033}
.omen-result p{font:15.5px/1.55 Georgia,serif;color:#f3efe0;margin:0 0 12px}
.omen-go{padding:10px 22px;border-radius:10px;border:1px solid var(--gold);background:#1b2a22;color:#f3efe0;font:600 14px Georgia,serif;cursor:pointer}
@media (max-width:600px){.omen-body{padding:12px 14px 16px}.omen-body h2{font-size:20px}.omen-text{font-size:15px}.omen-art{aspect-ratio:16/8}.tides-in{gap:6px 10px;padding:7px 10px}.tide-moon{width:18px;height:18px}.tide-step{width:4px}.omen-grid{grid-template-columns:repeat(3,56px)}.omen-mark{width:56px;height:56px}}
@media (prefers-reduced-motion:reduce){.omen-mark.fresh{animation:none;text-shadow:0 0 5px #f3efe088}.omen-veil,.omen-card{transition:none}}
.omen-scene{position:relative;margin:0 auto;overflow:hidden;border-radius:10px;border:1px solid #9fb4e055;cursor:crosshair;touch-action:manipulation;user-select:none;-webkit-user-select:none;box-shadow:0 8px 24px #0009}
.omen-scene img{position:absolute;max-width:none;height:auto;pointer-events:none}
.omen-spot{position:absolute;transform:translate(-50%,-50%);border:0;padding:0;border-radius:50%;background:radial-gradient(closest-side,#f3efe022,transparent);cursor:crosshair;animation:omenSpot 3.4s ease-in-out infinite}
.omen-spot:nth-of-type(2){animation-delay:-1.1s}.omen-spot:nth-of-type(3){animation-delay:-2.3s}
.omen-spot:focus-visible{outline:2px solid #9fb4e0;outline-offset:2px}
.omen-spot.got{animation:none;background:none;box-shadow:0 0 0 2px #e8c878,0 0 16px 2px #e8c87888}
.omen-miss{position:absolute;width:18px;height:18px;transform:translate(-50%,-50%);pointer-events:none}
.omen-miss::before,.omen-miss::after{content:'';position:absolute;left:50%;top:0;width:2px;height:100%;background:#ff8a7a;box-shadow:0 0 6px #ff8a7a}
.omen-miss::before{transform:rotate(45deg)}.omen-miss::after{transform:rotate(-45deg)}
.omen-scene.over{cursor:default}
@keyframes omenSpot{0%,100%{opacity:.15}50%{opacity:.9}}
@media (prefers-reduced-motion:reduce){.omen-spot{animation:none;opacity:.6}}
/* Charles Dexter Wardlow and Josiah Curran (owner request 21 Oct 2026): the form row's Hold pips, the card in Curran's form and once he has
   taken the body, Researched enemies, and the effects' veils and card animations (effects.js window.wardFx). */
.form-row .hold-pips{display:inline-flex;gap:5px;margin-left:8px;vertical-align:middle}
.form-row .hold-pip{width:11px;height:11px;border-radius:50%;border:1px solid rgba(134,255,166,.55);background:rgba(10,24,14,.6);display:inline-block}
.form-row .hold-pip.on{background:radial-gradient(circle at 40% 35%,#eaffd8,#62f08a 55%,#1f4a2c);box-shadow:0 0 8px rgba(110,255,150,.8)}
.form-row .hold-pip.hold-new{animation:holdNew .9s ease-out}
@keyframes holdNew{0%{transform:scale(2.2);filter:brightness(2)}100%{transform:none;filter:none}}
.card.ward-curran{box-shadow:inset 0 0 0 1px rgba(110,255,150,.35),0 0 18px rgba(60,200,100,.18)}
.card.ward-curran .sheet-portrait img{filter:saturate(.85) hue-rotate(-8deg) contrast(1.05)}
.card.ward-taken{box-shadow:inset 0 0 0 2px rgba(110,255,150,.7),0 0 26px rgba(60,220,110,.35);animation:wardTakenPulse 2.4s ease-in-out infinite}
.card.ward-taken .sheet-portrait{position:relative}
.card.ward-taken .sheet-portrait::after{content:'';position:absolute;inset:0;pointer-events:none;background:
  linear-gradient(118deg,transparent 46%,rgba(140,255,170,.55) 47%,transparent 48.5%),linear-gradient(64deg,transparent 58%,rgba(140,255,170,.45) 59%,transparent 60.2%),
  linear-gradient(160deg,transparent 30%,rgba(140,255,170,.4) 31%,transparent 32%),radial-gradient(ellipse at 50% 40%,transparent 50%,rgba(6,20,10,.55))}
@keyframes wardTakenPulse{0%,100%{box-shadow:inset 0 0 0 2px rgba(110,255,150,.55),0 0 18px rgba(60,220,110,.25)}50%{box-shadow:inset 0 0 0 2px rgba(150,255,180,.9),0 0 34px rgba(60,220,110,.5)}}
.card.enemy.ward-researched .sheet-portrait{position:relative}
.card.enemy.ward-researched .sheet-portrait::before{content:'';position:absolute;inset:6px;pointer-events:none;border:1px dashed rgba(243,210,122,.75);border-radius:4px;box-shadow:0 0 12px rgba(243,210,122,.35) inset;z-index:2}
.ward-shift-curran .sheet-portrait{animation:wardShiftC 1.3s ease-out}
@keyframes wardShiftC{0%{filter:none}35%{filter:brightness(2.4) saturate(0) blur(2px)}55%{filter:brightness(.5) hue-rotate(60deg) saturate(1.6)}100%{filter:none}}
.ward-shift-wardlow .sheet-portrait{animation:wardShiftW 1.3s ease-out}
@keyframes wardShiftW{0%{filter:hue-rotate(60deg) brightness(.6)}40%{filter:brightness(2) sepia(.6) blur(1.5px)}100%{filter:none}}
.ward-taking .sheet-portrait{animation:wardTaking 2.2s ease-in-out}
@keyframes wardTaking{0%{filter:none;transform:none}15%{filter:brightness(2.6) saturate(0);transform:scale(1.03)}30%{filter:brightness(.4) hue-rotate(70deg) saturate(2)}60%{filter:brightness(.7) hue-rotate(40deg) contrast(1.3)}100%{filter:none;transform:none}}
.ward-healing .sheet-portrait{animation:wardHeal 1.4s ease-out}
@keyframes wardHeal{0%{filter:none}40%{filter:brightness(1.6) sepia(.4) saturate(1.2)}100%{filter:none}}
.ward-unrisen{opacity:0}
.ward-rising{animation:wardRise 1.5s ease-out}
@keyframes wardRise{0%{opacity:0;transform:translateY(40px) scale(.94);filter:grayscale(1) blur(6px) brightness(.6)}50%{opacity:1;filter:grayscale(.8) blur(2px)}100%{opacity:1;transform:none;filter:none}}
.ward-crumbling{animation:wardCrumble 1.4s ease-in forwards}
@keyframes wardCrumble{0%{filter:none;transform:none;opacity:1}40%{filter:grayscale(1) sepia(.3) brightness(.8)}100%{filter:grayscale(1) blur(3px) brightness(.5);transform:translateY(30px) scaleY(.85);opacity:.15}}
.ward-casting .sheet-portrait{animation:wardCast 4.2s ease-in-out}
@keyframes wardCast{0%,100%{box-shadow:none}20%,80%{box-shadow:0 0 30px rgba(110,255,150,.75),inset 0 0 40px rgba(110,255,150,.35)}}
.ward-casting-gold .sheet-portrait{animation:wardCastG 4.2s ease-in-out}
@keyframes wardCastG{0%,100%{box-shadow:none}20%,80%{box-shadow:0 0 30px rgba(255,214,130,.8),inset 0 0 40px rgba(255,214,130,.35)}}
.ward-night{position:fixed;inset:0;z-index:28;pointer-events:none;opacity:0;transition:opacity .45s ease;background:radial-gradient(ellipse at 50% 48%,rgba(20,70,36,.4),rgba(2,10,5,.88) 65%,rgba(0,4,2,.95))}
.ward-dawn{position:fixed;inset:0;z-index:28;pointer-events:none;opacity:0;transition:opacity .5s ease;background:radial-gradient(ellipse at 50% 48%,rgba(255,226,170,.28),rgba(40,26,10,.72) 70%,rgba(14,8,2,.88))}
.ward-night.on,.ward-dawn.on{opacity:1}
.ward-veil{position:fixed;inset:0;z-index:60;pointer-events:none;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .5s ease;background:radial-gradient(ellipse at 50% 50%,rgba(10,40,20,.55),rgba(0,6,2,.82))}
.ward-veil p{margin:0;padding:0 16px;text-align:center;font:italic 500 clamp(24px,4.4vw,44px) Georgia,serif;color:#cfffd8;letter-spacing:.02em;text-shadow:0 0 20px rgba(100,255,150,.75);transform:translateY(10px);transition:transform 1.2s ease}
.ward-veil.on{opacity:1}.ward-veil.on p{transform:none}
@media (prefers-reduced-motion:reduce){.ward-shift-curran .sheet-portrait,.ward-shift-wardlow .sheet-portrait,.ward-taking .sheet-portrait,.ward-healing .sheet-portrait,.ward-rising,.ward-crumbling,.ward-casting .sheet-portrait,.ward-casting-gold .sheet-portrait,.card.ward-taken,.form-row .hold-pip.hold-new{animation:none}.ward-veil,.ward-night,.ward-dawn{display:none}.ward-unrisen{opacity:1}}
/* the switch, before the face changes: the old portrait drains and greys as the salts gather (to Curran) or flushes warm (to Wardlow) */
.ward-gathering .sheet-portrait{animation:wardGather .9s ease-in forwards}
@keyframes wardGather{0%{filter:none}100%{filter:saturate(.2) brightness(.7) hue-rotate(40deg) blur(.5px)}}
.ward-releasing .sheet-portrait{animation:wardRelease .9s ease-in forwards}
@keyframes wardRelease{0%{filter:none}100%{filter:sepia(.5) brightness(1.5) blur(.5px)}}
@media (prefers-reduced-motion:reduce){.ward-gathering .sheet-portrait,.ward-releasing .sheet-portrait{animation:none}}
/* The Family Doctor's Visit: the room dims to a warm sickroom lamplight */
.ward-lamp{position:fixed;inset:0;z-index:28;pointer-events:none;opacity:0;transition:opacity .45s ease;background:radial-gradient(ellipse at 50% 45%,rgba(90,60,25,.35),rgba(14,8,3,.82) 70%,rgba(6,3,1,.9))}
.ward-lamp.on{opacity:1}
@media (prefers-reduced-motion:reduce){.ward-lamp{display:none}}
/* The tutorial (tutorial.js): a dimmed screen with one control lit, and a card that says what to do */
#tut{position:fixed;inset:0;z-index:60;pointer-events:none}
#tut .tut-hole{position:fixed;border-radius:10px;box-shadow:0 0 0 200vmax rgba(3,8,8,.72),0 0 0 3px #e8c477,0 0 26px 6px #e8c47799;transition:left .25s,top .25s,width .25s,height .25s;animation:tutPulse 1.6s ease-in-out infinite}
#tut.tut-dim-all::before{content:'';position:fixed;inset:0;background:rgba(3,8,8,.72)}
#tut.tut-watch .tut-hole{display:none}
@keyframes tutPulse{50%{box-shadow:0 0 0 200vmax rgba(3,8,8,.72),0 0 0 3px #ffe1a0,0 0 40px 12px #e8c477bb}}
.tut-box{pointer-events:auto;position:fixed;left:50%;bottom:16px;transform:translateX(-50%);width:min(560px,calc(100vw - 32px));box-sizing:border-box;background:#0d1a17;border:1px solid #b89a5a;border-radius:10px;box-shadow:0 18px 50px rgba(0,0,0,.8);padding:16px 18px 14px;color:#efe3c4;font:16px/1.45 Georgia,serif;z-index:61}
.tut-box.tut-top{bottom:auto;top:16px}
.tut-box .tut-step{font:700 11px/1 system-ui,sans-serif;letter-spacing:.18em;color:#c9a75f;margin-bottom:6px}
.tut-box h3{margin:0 0 6px;font:600 21px/1.2 Georgia,serif;color:#f6ead0}
.tut-box .tut-text b{color:#ffe0a0}
.tut-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:12px}
.tut-actions .tut-exit{background:none;border:0;color:#a9b7b0;text-decoration:underline;font:14px Georgia,serif;cursor:pointer;padding:6px 0}
.tut-actions .tut-next{min-width:120px}
.tut-actions .tut-next[hidden]{display:none}
#tut.tut-watch .tut-box{border-style:dashed}
.tut-nudge{animation:tutNudge .35s}
@keyframes tutNudge{20%,60%{transform:translateX(calc(-50% - 7px))}40%,80%{transform:translateX(calc(-50% + 7px))}}
#tutOffer{position:fixed;inset:0;z-index:62;background:rgba(3,8,8,.72);display:grid;place-items:center}
#tutOffer .tut-box{position:static;transform:none}
.tut-start{margin-left:8px}

/* the defeat screen */
#defeatVeil{position:fixed;inset:0;z-index:95;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(3,6,8,.86);backdrop-filter:blur(3px);opacity:0;transition:opacity .8s}
#defeatVeil.on{opacity:1}
#defeatVeil .dv-card{width:min(520px,100%);max-height:100%;overflow:auto;border:1px solid #d5b77755;border-radius:14px;background:#0a1414;box-shadow:0 30px 90px #000,0 0 0 1px #000 inset}
#defeatVeil .dv-art{position:relative;aspect-ratio:4/3;overflow:hidden;border-radius:13px 13px 0 0}
#defeatVeil .dv-art img{width:100%;height:100%;object-fit:cover;object-position:40% 70%;filter:saturate(.9);animation:dvPush 14s ease-out both}
#defeatVeil .dv-art::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,20,20,0) 84%,#0a1414)}
@keyframes dvPush{from{transform:scale(1.08)}to{transform:scale(1)}}
#defeatVeil .dv-body{padding:4px 22px 22px;text-align:center}
#defeatVeil small{display:block;font-size:12px;letter-spacing:.24em;color:#c96a5e}
#defeatVeil h2{margin:8px 0 10px;font:600 clamp(24px,6vw,32px)/1.15 Georgia,serif;color:#f1e3c0}
#defeatVeil p{margin:0 0 10px;color:#d9ccb0;line-height:1.5}
#defeatVeil .dv-tally{font-size:13px;letter-spacing:.06em;color:#a99b7d}
#defeatVeil .dv-back{display:block;width:100%;margin-top:14px;padding:15px;font-size:17px}
#defeatVeil .dv-look{display:block;width:100%;margin-top:8px;background:transparent;border:0;color:#a99b7d;text-decoration:underline;cursor:pointer}
@media (prefers-reduced-motion:reduce){#defeatVeil{transition:none}#defeatVeil .dv-art img{animation:none}}

/* Save Game / Exit Game at the top of the chapter map */
.map-tools{display:flex;justify-content:center;gap:10px;max-width:980px;margin:0 auto 14px;padding:0 12px}.map-tools .map-tool{width:auto;flex:0 1 180px;margin:0;text-align:center;font:600 13px system-ui;letter-spacing:1.5px;text-transform:uppercase;padding:10px 14px}.tutorial-on .map-tools{display:none}

/* How to play: the illustrated guide opened from the select screen (howto.js) */
body.howto-open{overflow:hidden}
#howto{position:fixed;inset:0;z-index:9000;overflow-y:auto;-webkit-overflow-scrolling:touch;background:#050b0bf2;padding:max(14px,env(safe-area-inset-top)) 12px 28px}
#howto .ht-panel{max-width:560px;margin:0 auto;background:linear-gradient(180deg,#132522,#0d1a18);border:1px solid #d5b77744;border-radius:10px;padding:16px 18px 22px;color:var(--ink)}
#howto .ht-top{position:sticky;top:-14px;z-index:2;display:flex;justify-content:space-between;align-items:center;margin:-16px -18px 0;padding:12px 18px;background:#132522f0;border-bottom:1px solid #d5b77722;border-radius:10px 10px 0 0}
#howto .ht-eyebrow{font:600 11px system-ui;letter-spacing:.2em;color:var(--gold)}
#howto .ht-close{width:auto;margin:0;padding:7px 14px;font:600 12px system-ui;letter-spacing:.1em;text-transform:uppercase;background:transparent;border:1px solid #d5b77766;color:var(--gold);border-radius:20px;text-align:center}
#howto h2{font:400 34px Georgia,serif;color:#e9cf8f;margin:16px 0 4px;text-align:center}
#howto .ht-lead{text-align:center;color:var(--muted);margin:0 0 6px;font-size:15px}
#howto .ht-step{position:relative;border-top:1px solid #d5b77722;padding:18px 0 6px}
#howto .ht-num{position:absolute;top:18px;left:0;width:30px;height:30px;border-radius:50%;border:1px solid var(--gold);color:var(--gold);display:grid;place-items:center;font:700 14px system-ui}
#howto .ht-step h3{font:400 22px Georgia,serif;color:#e9cf8f;margin:2px 0 12px 42px;line-height:1.3}
#howto .ht-tips h3{margin-left:0}
#howto .ht-fig{margin:0 0 12px;border:1px solid #d5b77733;border-radius:8px;overflow:hidden;background:#071110}
#howto .ht-fig img{display:block;width:100%;height:auto}
#howto .ht-fig.ht-narrow{max-width:200px;margin-left:auto;margin-right:auto}
#howto p,#howto li{font-size:15px;line-height:1.55;margin:0 0 10px}
#howto ul{padding-left:20px;margin:0}
#howto b{color:#efe3c4}
#howto .ht-done{width:100%;margin-top:16px;text-align:center;padding:12px}