/* UI additions owned by the survivors module; legacy theme stays intact. */
#class-screen { overflow:auto; padding:24px; }
#class-cards { max-width:1120px; gap:12px; margin:18px auto; }
.class-card { width:240px; min-height:220px; font:inherit; color:var(--parchment); text-align:center; cursor:pointer; }
.class-card small { display:block; color:#b5a68e; font-size:11px; line-height:1.4; margin-top:12px; }
.ss-title-actions { margin-top:14px; display:flex; justify-content:center; gap:12px; }
#ss-start { margin-top:20px; font-size:18px; padding:12px 28px; }
#hud-frame-img { display:none!important; }
#hud-bottom,#hud-bottom.noframe { width:min(100vw,860px); left:50%; transform:translateX(-50%); height:104px; display:flex; justify-content:space-between; align-items:end; background:linear-gradient(transparent,#161110 40%,#0a0709); border:0; }
#hud-bottom .orb { width:72px; height:72px; position:relative; left:auto!important; right:auto!important; bottom:0; margin:12px; }
#hud-bottom .orb-label { font-size:12px; }
#skill-bar { position:static; transform:none; padding:0 0 20px; gap:7px; }
#skill-bar .ss-slot { width:50px; height:50px; cursor:default; border-radius:6px; }
#skill-bar .ss-slot.empty { font-size:10px; color:#c4b296; }
#skill-bar .class-slot { border-color:#997faf; }
#skill-bar .common-slot { border-color:#927346; }
.ss-rank { position:absolute; bottom:0; right:3px; font-size:11px; color:#f2dfb4; z-index:2; }
#ss-build-ribbon { position:absolute; bottom:106px; left:50%; transform:translateX(-50%); display:flex; gap:14px; align-items:center; background:#171118dd; padding:6px 12px; border:1px solid #62503c; border-radius:6px; pointer-events:auto; white-space:nowrap; font-size:12px; }
#ss-passives { display:flex; gap:5px; min-width:0; }
.ss-passive { display:inline-flex; position:relative; }
.ss-passive img { width:24px; height:24px; }
.ss-passive small { position:absolute; right:0; bottom:-2px; color:#f2dfb4; font-size:9px; }
#ss-talents-button { padding:4px 9px; font-size:12px; }
#ss-talent-count { color:#edc971; }
.ss-card { font:inherit; text-align:center; color:var(--parchment); min-height:250px; }
.ss-card small { font-size:10px; line-height:1.4; color:#b4a187; margin-top:8px; }
#talents-overlay { overflow-y:auto; justify-content:flex-start; padding:25px; background:rgba(12,9,13,.96); }
.ss-talent-panel { width:min(1100px,100%); margin:auto; text-align:center; }
.ss-talent-panel h2,#evolution-overlay h2 { color:#edc971; font-family:'Cinzel',serif; font-size:28px; }
#ss-talent-summary { margin:12px 0 20px; color:#c8b69d; font-size:13px; }
#ss-talent-tree { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; text-align:left; }
.ss-talent-branch h3 { color:#d8b668; font-size:18px; }
.ss-branch-skills { color:#b7a48d; font-size:11px; min-height:38px; margin-top:8px; }
.ss-talent { position:relative; width:100%; display:flex; flex-direction:column; gap:5px; text-align:left; padding:12px; margin-bottom:12px; border:1px solid #776049; border-radius:6px; background:#241c25; color:#e5d3b5; cursor:pointer; font:inherit; }
.ss-talent:not(:last-child)::after { content:'↓'; position:absolute; bottom:-15px; left:50%; color:#806d52; }
.ss-talent small { color:#b59f83; font-size:10px; }
.ss-talent b { color:#efd09a; font-size:14px; }
.ss-talent span { font-size:12px; line-height:1.45; }
.ss-talent:disabled { opacity:.5; cursor:default; }
.ss-talent.owned { opacity:1; border-color:#739c6d; background:#202c24; }
.ss-talent.capstone { border-width:2px; }
.ss-talent:not(:disabled):hover { border-color:#edc971; box-shadow:0 0 12px #b483372d; }
#ss-talents-close { margin:20px 0; }
#evolution-overlay { overflow:auto; padding:25px; }
#evolution-overlay>p { color:#c5b195; margin:15px; }
#ss-evolution-cards { display:flex; flex-wrap:wrap; justify-content:center; gap:20px; }
#levelup-overlay { overflow:auto; padding:25px; }
#levelup-overlay h2 { font-size:25px; }
.ss-card:focus-visible,.ss-talent:focus-visible,.class-card:focus-visible { outline:3px solid #f3c45c; outline-offset:3px; }
@media(max-width:700px) {
 #ss-talent-tree { grid-template-columns:1fr; }
 #hud-bottom .orb { width:46px; height:46px; margin:5px; }
 #skill-bar { gap:3px; }
 #skill-bar .ss-slot { width:40px; height:40px; }
 #skill-bar .ss-slot img { width:29px; height:29px; }
 #ss-build-ribbon { gap:7px; padding:5px; font-size:10px; }
 #ss-passives img { width:18px; height:18px; }
 .class-card { width:190px; }
}
/* Achievement notices stay away from the player and the combat centre. */
#achv-popup { top:86px; bottom:auto; left:auto; right:14px; width:280px; max-width:calc(100vw - 28px); padding:10px 14px; text-align:left; transform:translateY(-10px); pointer-events:none; }
#achv-popup.show { transform:translateY(0); }
#achv-popup .achv-title { font-size:9px; letter-spacing:1px; margin-bottom:4px; }
#achv-popup .achv-name { font-size:15px; }
#achv-popup .achv-desc { font-size:11px; margin-top:4px; }

.ss-heat-control { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:8px; margin-top:14px; }
.ss-heat-control input { width:78px; padding:6px; background:#211922; color:#f2d39e; border:1px solid #84623f; font:inherit; }
.ss-heat-control small { width:100%; font-size:11px; color:#bca68b; }

.ss-heat-control { max-width:620px; margin:14px auto; }
.ss-heat-control select { padding:6px; background:#211922; color:#f2d39e; border:1px solid #84623f; font:inherit; }
#ss-contracts { width:100%; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.ss-contract { display:flex; align-items:center; justify-content:space-between; text-align:left; gap:10px; padding:8px; background:#211922; }
.ss-contract small { display:block; }
.ss-contract select:disabled { opacity:.4; }
#title-screen { overflow-y:auto; }
@media(max-width:600px){ #ss-contracts { grid-template-columns:1fr; } }

.ss-class-choice { border:2px solid #a18bc6; background:linear-gradient(#302339,#171119); }
.ss-standard-choice { border:2px solid #b99a5f; background:linear-gradient(#30291e,#171119); }
.ss-class-choice .lvl-ind { color:#d2b5f5; }
.ss-standard-choice .lvl-ind { color:#f2d397; }
.ss-ultimate-choice { box-shadow:0 0 20px #e8b85055; }
#knowledge-overlay { overflow:auto; justify-content:flex-start; background:#100d13f5; padding:24px; }
.ss-library-panel { width:min(1100px,100%); margin:auto; }
.ss-library-panel h2 { color:#edc971; }
.ss-library-panel>p { color:#c5b195; margin:12px 0; }
.ss-library-section { margin:24px 0; text-align:left; }
.ss-library-section h3 { color:#d8b668; margin-bottom:10px; }
.ss-library-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(185px,1fr)); gap:10px; }
.ss-library-entry { display:flex; flex-direction:column; align-items:center; gap:8px; padding:16px; border:1px solid #68583d; border-radius:6px; background:#241c25; text-align:center; }
.ss-library-entry img { width:40px; height:40px; }
.ss-library-entry p { font-size:12px; line-height:1.5; }
.ss-library-entry small { color:#b8ac96; }
.ss-library-entry.seen { filter:grayscale(1); opacity:.6; }
.ss-library-entry.acquired { border-color:#799269; }
.ss-unknown { font-size:36px; color:#807789; }
#ss-library-close { position:sticky; bottom:0; margin:16px auto; display:block; }

.ss-library-entry { color:#e5d3b5; }
#ss-act-progress { width:100%; padding:8px; background:#171118; font-size:12px; }
#ss-act-progress>div { display:flex; flex-wrap:wrap; justify-content:center; gap:6px; margin-top:8px; }
.ss-act-badge { border:1px solid #65584b; padding:6px; color:#a99881; }
.ss-act-badge.complete { color:#c9dfaf; border-color:#789161; }
.ss-class-progress { color:#d2bf7f!important; }
#ss-stats-overlay { overflow:auto; padding:24px; background:#100b12f2; }
.ss-stats-panel { width:min(600px,100%); margin:auto; text-align:center; }
.ss-stats-panel h2 { color:#edc971; font-size:26px; }
#ss-stats-note { color:#bba98e; line-height:1.5; margin:16px 0; font-size:13px; }
#ss-stats-values { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:20px; }
#ss-stats-values>div { padding:12px; background:#271e29; border:1px solid #58443c; display:flex; flex-direction:column; gap:7px; font-size:13px; }
#ss-stats-values b { color:#e8c99b; }
#ss-stats-button { padding:4px 7px; font-size:11px; }
@media(max-width:700px){ #ss-build-ribbon { max-width:calc(100vw - 16px); flex-wrap:wrap; justify-content:center; white-space:normal; } }
.ss-stats-panel { color:#dbcdbb; }

/* Hero selection precedes the class-specific act and heat setup. */
#ss-run-setup { overflow-y:auto; padding:24px; justify-content:flex-start; background:#100c13f5; }
.ss-setup-panel { width:min(700px,100%); margin:auto; color:#ddcfba; }
.ss-step { text-align:center; color:#a3937b; font-size:12px; letter-spacing:2px; margin-bottom:18px; }
.ss-setup-hero { display:flex; align-items:center; gap:18px; margin:0 0 22px; padding-bottom:18px; border-bottom:1px solid #63503c; }
#ss-setup-portrait { width:72px; height:72px; object-fit:contain; image-rendering:pixelated; }
#ss-setup-name { color:#edc971; font-size:30px; }
#ss-setup-profile { font-size:13px; line-height:1.5; color:#c2af96; margin-top:8px; }
.ss-setup-panel .ss-heat-control { max-width:none; margin:0; }
.ss-setup-panel #ss-act-progress { padding:12px; text-align:center; margin-bottom:14px; }
.ss-setup-panel #ss-heat-desc { display:block; width:100%; text-align:center; font-size:13px; margin:14px 0; line-height:1.5; }
.ss-setup-actions { display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; margin-top:24px; }
#ss-launch { font-size:16px; }

.ss-slot.mana-starved { border-color:#6eb9ef!important; filter:saturate(.25); }
.ss-slot.mana-starved::after { content:'Mana'; position:absolute; top:0; left:0; right:0; font-size:9px; color:#a8dbfa; background:#17243be0; text-align:center; }

.ss-hotkey { position:absolute; top:1px; left:2px; z-index:3; background:#17111ddd; color:#f4deac; font:bold 10px sans-serif; padding:2px; }
.ss-slot[role="button"] { cursor:pointer!important; }
.ss-slot.aura-enabled { border-color:#a0d681!important; box-shadow:0 0 10px #93cb6466; }

/* Supplied gothic frame: all positions are relative to its 680 × 91 visible bounds. */
#hud-bottom,#hud-bottom.noframe { width:min(100vw,1100px); height:auto; aspect-ratio:680 / 91; display:block; background:none; border:0; container-type:inline-size; }
#hud-frame-img { display:block!important; position:absolute; left:0; bottom:0; transform:none; width:100%; height:100%; max-width:none; object-fit:fill; z-index:3; }
#hud-bottom .orb { position:absolute; width:11.18%; height:auto; aspect-ratio:1; bottom:9.9%; margin:0; border:0; box-shadow:none; background:radial-gradient(circle at 45% 30%,#211a20,#080609 75%); }
#hud-bottom .orb.hp { left:11.91%!important; right:auto!important; }
#hud-bottom .orb.mp { left:77.79%!important; right:auto!important; }
#hud-bottom .orb-fill { z-index:1; background-attachment:local; }
#hud-bottom .hp .orb-fill { background:radial-gradient(ellipse at 35% 15%,#ff7269,#b3151f 45%,#4b050b 95%); }
#hud-bottom .mp .orb-fill { background:radial-gradient(ellipse at 35% 15%,#70b7ff,#154dc1 45%,#071746 95%); }
#hud-bottom .orb-label { z-index:5; font-size:clamp(9px,1.7cqw,17px); text-shadow:0 1px 3px #000,0 0 5px #000; }
#skill-bar { position:absolute; left:26%; bottom:6%; width:49%; height:46%; transform:none; padding:0; display:flex; justify-content:center; align-items:center; gap:1.5%; z-index:5; }
#skill-bar .ss-slot { width:14.8%; height:auto; aspect-ratio:1; flex:none; border-radius:2px; border-width:1px; background:#100d10dc; }
#skill-bar .ss-slot img { width:75%; height:75%; }
#skill-bar .ss-slot.empty { font-size:clamp(7px,1.3cqw,12px); }
#skill-bar .ss-hotkey { font-size:clamp(7px,1.1cqw,10px); padding:0 1px; }
#skill-bar .ss-rank { font-size:clamp(8px,1.3cqw,12px); }
#ss-build-ribbon { bottom:calc(min(100vw,1100px) * .13382353 + 8px); max-width:calc(100vw - 20px); }
#xp-bar { bottom:calc(min(100vw,1100px) * .13382353 + 2px); }
#ss-build-ribbon { width:max-content; }
#hud-bottom,#hud-bottom.noframe { background:linear-gradient(transparent,rgba(8,6,9,.65) 70%,#080609); }

#ss-bind-overlay { background:#0f0b13f2; padding:24px; overflow:auto; }
.ss-binding-panel { width:min(480px,100%); margin:auto; padding:28px; border:1px solid #8b6e49; background:#251c25; text-align:center; color:#d7c5a9; }
.ss-binding-panel h2 { color:#edc971; font-size:24px; }
#ss-bind-icon { width:64px; height:64px; margin:18px; image-rendering:pixelated; }
.ss-binding-panel h3 { color:#ebd9bc; margin-bottom:16px; }
.ss-binding-panel small { display:block; font-size:12px; line-height:1.5; margin:14px 0; }
#ss-bind-error { min-height:36px; color:#ef9b91; font-size:13px; }

.ss-aim-control { display:flex; align-items:center; justify-content:center; gap:7px; font-size:12px; color:#d9c7a6; cursor:pointer; pointer-events:auto; }
.ss-aim-control input { accent-color:#cda860; cursor:pointer; }
#ss-setup-options>.ss-aim-control { margin-top:18px; }
/* Small engraved command rail above the existing HUD. */
#ss-hud-controls{position:absolute;z-index:7;left:50%;bottom:calc(min(100vw,1100px) * .13382353 + 7px);transform:translateX(-50%);display:flex;align-items:center;gap:5px;padding:4px 7px;pointer-events:auto;border:1px solid #78613d;border-radius:3px;background:linear-gradient(#30271eea,#110e0cef);box-shadow:inset 0 1px #b4985a44,0 3px 10px #0009}
#ss-hud-controls::before,#ss-hud-controls::after{content:'';width:3px;height:3px;background:#9b814e;transform:rotate(45deg);margin:0 2px}
#ss-hud-controls .ss-hud-control{appearance:none;position:relative;display:flex;align-items:center;justify-content:center;flex:none;width:34px;height:34px;padding:0;margin:0;border:1px solid #665239;border-radius:2px;background:linear-gradient(#312a21,#17130f);box-shadow:inset 0 1px #a78e5730;color:#cbb27c;cursor:pointer;pointer-events:auto;font-family:'Cinzel',serif;transition:background .15s,border-color .15s,color .15s}
#ss-hud-controls .ss-hud-control svg{width:20px;height:20px;filter:drop-shadow(0 1px 1px #000);margin-top:-3px}
#ss-hud-controls .ss-hud-control:hover,#ss-hud-controls .ss-hud-control:focus-visible,#ss-hud-controls .ss-hud-control:focus-within{outline:none;background:linear-gradient(#4a3b28,#211b13);border-color:#d8b775;color:#f1dbab;box-shadow:0 0 0 1px #d8b77555}
#ss-hud-controls .ss-hud-control:active{transform:translateY(1px)}
.ss-control-key{position:absolute;bottom:1px;right:3px;color:#a59069;font:7px/1.1 'Cinzel',serif;pointer-events:none}
.ss-control-badge{position:absolute;top:-5px;right:-5px;min-width:14px;height:14px;padding:1px 3px;border:1px solid #e6c06d;border-radius:8px;background:#75471e;color:#fff1c6;font:9px/11px system-ui;text-align:center;box-shadow:0 1px 4px #000}
#ss-hud-controls input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
#ss-hud-controls .ss-hud-control:has(input:checked){color:#a6d6b2;border-color:#739b75;background:linear-gradient(#2c3f2c,#142017);box-shadow:inset 0 0 9px #83c49322}
#ss-hud-controls .ss-hud-control:has(input)::before{content:'';position:absolute;bottom:3px;right:4px;width:4px;height:4px;border-radius:50%;background:#61594a}
#ss-hud-controls .ss-hud-control:has(input:checked)::before{background:#a8dfad;box-shadow:0 0 5px #a8dfad99}
#ss-hud-controls .ss-hud-control::after{content:attr(data-tooltip);position:absolute;bottom:calc(100% + 10px);left:50%;transform:translateX(-50%) translateY(3px);padding:6px 9px;color:#eadaba;background:#17120ff5;border:1px solid #8f7349;border-radius:2px;box-shadow:0 3px 9px #0009;font:11px/1.4 system-ui;white-space:nowrap;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .12s,transform .12s}
#ss-hud-controls .ss-hud-control:hover::after,#ss-hud-controls .ss-hud-control:focus-visible::after,#ss-hud-controls .ss-hud-control:focus-within::after{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
#ss-build-ribbon{bottom:calc(min(100vw,1100px) * .13382353 + 57px);padding:2px 8px;gap:9px;background:transparent;border:0;box-shadow:none;border-radius:0;font:10px/1.4 'Cinzel',serif;color:#bdab86;text-shadow:0 1px 3px #000;pointer-events:none;max-width:calc(100vw - 20px);white-space:normal;flex-wrap:wrap;justify-content:center}
#ss-passives{pointer-events:auto}#ss-run-level{opacity:.85}#btn-settings{display:none}#build-badge{display:none}
@media(max-width:700px){#ss-hud-controls{gap:5px;padding:4px 6px}#ss-hud-controls .ss-hud-control{width:38px;height:38px}#ss-build-ribbon{bottom:calc(min(100vw,1100px) * .13382353 + 61px);font-size:9px;gap:5px}#ss-hud-controls .ss-hud-control::after{font-size:10px}}
/* Align XP to the visible span of the six centered spell slots. */
#hud-bottom{--ss-spell-top:calc(29% + 3.626cqw)}
#hud-bottom #xp-bar{left:26.9065%;right:auto;width:47.187%;height:4px;bottom:calc(var(--ss-spell-top) + 1px);z-index:6;border-color:#80663a;box-shadow:0 0 0 1px #100c08;pointer-events:none}
#hud-bottom #ss-hud-controls{bottom:calc(var(--ss-spell-top) + 7px);gap:3px;padding:2px 4px;border-radius:2px;box-shadow:inset 0 1px #b4985a33,0 1px 4px #0008}
#hud-bottom #ss-hud-controls::before,#hud-bottom #ss-hud-controls::after{display:none}
#hud-bottom #ss-hud-controls .ss-hud-control{width:23px;height:23px}
#hud-bottom #ss-hud-controls .ss-hud-control svg{width:15px;height:15px;margin-top:0}
#hud-bottom #ss-hud-controls .ss-control-key{display:none}
#hud-bottom #ss-hud-controls .ss-control-badge{top:-4px;right:-4px;min-width:12px;height:12px;font-size:8px;line-height:9px;padding:1px 2px}
#hud-bottom #ss-hud-controls .ss-hud-control:has(input)::before{width:3px;height:3px;bottom:2px;right:2px}
#hud-bottom #ss-build-ribbon{bottom:calc(var(--ss-spell-top) + 39px);z-index:6;max-width:85%;font-size:9px;padding:0 4px;gap:5px}
@media(max-width:700px){#hud-bottom #ss-hud-controls .ss-hud-control{width:23px;height:23px}#hud-bottom #ss-build-ribbon{font-size:8px}}
#ss-pylon-buffs{position:absolute;z-index:8;left:26.9065%;bottom:calc(var(--ss-spell-top) + 10px);transform:none;display:flex;align-items:center;justify-content:flex-start;gap:4px;max-width:90%;pointer-events:none}
.ss-pylon-buff{display:inline-flex;align-items:center;gap:4px;min-width:43px;padding:2px 5px;border:1px solid color-mix(in srgb,var(--buff-color) 60%,#211b15);background:linear-gradient(#211a17ed,#0e0b0bed);box-shadow:inset 0 1px #ffffff16,0 1px 5px #000a;color:#f1e2c4;font:700 10px/1.2 system-ui;text-shadow:0 1px #000}
.ss-pylon-buff b{color:var(--buff-color);font:900 13px/1 monospace;text-shadow:0 0 5px var(--buff-color)}
@media(max-width:700px){#ss-pylon-buffs{bottom:32px;gap:2px}.ss-pylon-buff{min-width:0;padding:2px 4px;font-size:9px}}
#ss-boss-timer{position:absolute;z-index:6;top:74px;left:50%;transform:translateX(-50%);padding:5px 12px;border:1px solid #8e6443;border-radius:2px;background:#17100de8;color:#e5c08b;font:12px/1.3 'Cinzel',serif;text-align:center;white-space:nowrap;box-shadow:0 2px 8px #0008}
#ss-boss-timer.urgent{color:#ffaaa0;border-color:#bd6051;background:#2e100fea}

/* Inventory drag feedback stays in the arsenal palette. */
.eq-cell[draggable=true],.eq-slot[draggable=true]{cursor:grab}
.eq-cell[draggable=true]:active,.eq-slot[draggable=true]:active{cursor:grabbing}
.eq-dragging{opacity:.45}
.eq-drop-target{outline:2px solid #bfa77b;outline-offset:-2px;background-color:#3b3020!important}
.eq-slot img,.eq-cell img{pointer-events:none}

/* The crypt gates respond to the selected heat while retaining terrain previews. */
#ss-run-setup{--heat:0;background:radial-gradient(ellipse at 50% 60%,rgba(112,20,12,calc(var(--heat)*.45)),transparent 70%),#100e12f5}
.ss-setup-panel{width:min(960px,100%)}
.ss-portal-heading{width:100%;text-align:center;color:#c2af90;font-size:17px;margin:8px 0}
.ss-act-portals{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));width:100%;gap:8px}
.ss-act-portal{position:relative;border:1px solid transparent;background:transparent;color:#b7aa94;padding:5px 2px 12px;cursor:pointer;font:inherit;transition:background .2s,border-color .2s}
.ss-act-portal:hover,.ss-act-portal:focus-visible{border-color:#87765c;outline:1px solid #b39c75;background:#29241c}
.ss-act-portal.selected{border-color:#a68b5b;background:linear-gradient(transparent,#332719);box-shadow:0 0 20px rgba(169,39,17,calc(var(--heat)*.6))}
.ss-gargoyle{display:block;position:relative;width:100%;aspect-ratio:1;filter:drop-shadow(0 5px 5px #000)}
.ss-gargoyle img{position:absolute;inset:0;width:100%;height:100%;z-index:2;filter:sepia(calc(var(--heat)*.7)) drop-shadow(0 0 calc(var(--heat)*8px) #c3311e)}
.ss-portal-landscape{position:absolute;left:25%;top:50%;width:50%;height:36%;background-size:cover;background-position:center;filter:brightness(.85)}
.ss-portal-embers{position:absolute;inset:0;z-index:3;pointer-events:none;opacity:var(--heat);background:radial-gradient(ellipse at 31% 40%,#ff542b 0 2%,transparent 6%),radial-gradient(ellipse at 69% 40%,#ff542b 0 2%,transparent 6%),radial-gradient(ellipse at 50% 70%,transparent 10%,#b3221255 29%,transparent 44%);mix-blend-mode:screen}
.ss-portal-title{display:block;font-size:13px;color:#d0ba91}.ss-act-portal small{font-size:10px;line-height:1.3;display:block;margin:4px 0;color:#9d9485}.ss-portal-record{font-size:10px;color:#9c967c}
.ss-infernal .ss-act-portal.selected{border-color:#d65b3b;background:linear-gradient(#3b161055,#651b16aa)}
.ss-infernal .ss-portal-title,.ss-infernal #ss-heat-value{color:#f39b75}
.ss-heat-dial{width:100%;margin-top:18px;padding:18px 22px;border:1px solid #67513a;background:linear-gradient(110deg,#211d17,#321a14);box-sizing:border-box}
.ss-heat-dial label{display:flex;justify-content:space-between;color:#ceb893}.ss-heat-dial output{color:#e2b07b;font-weight:bold}
.ss-heat-control input[type=range]{width:100%;padding:0;margin:14px 0 8px;accent-color:#bc6344;cursor:pointer;height:22px;background:transparent;border:0}
.ss-heat-control input[type=range]:disabled{opacity:.35;cursor:not-allowed}
.ss-heat-scale{display:flex;justify-content:space-between;font-size:11px;color:#a99679}
.ss-pacts{width:100%;border-top:1px solid #5d4934;padding-top:12px}.ss-pacts summary{cursor:pointer;color:#bba586;margin-bottom:12px;text-align:center}
.ss-contract{display:grid;grid-template-columns:1fr 110px 30px;background:#211a16;border:1px solid #42372c;font-size:12px}.ss-contract small{color:#9e917e;font-size:10px}.ss-contract output{font-size:11px;color:#ccab7d}
#ss-act-progress{display:none}
@media(max-width:760px){.ss-act-portals{grid-template-columns:repeat(3,minmax(0,1fr))}.ss-gargoyle{max-width:150px;margin:auto}.ss-contract{grid-template-columns:1fr 90px 25px}}
@media(prefers-reduced-motion:reduce){.ss-act-portal{transition:none}}

/* One crypt guardian, act navigation below, heat driven exclusively by pacts. */
.ss-setup-panel{width:min(880px,100%)}
.ss-gate-layout{display:grid;grid-template-columns:minmax(250px,.85fr) minmax(300px,1.15fr);gap:32px;width:100%;align-items:center}
.ss-single-gate{text-align:center}
.ss-single-gate .ss-gargoyle{width:min(300px,100%);margin:auto}
.ss-act-navigation{display:grid;grid-template-columns:44px 1fr 44px;align-items:center;gap:10px;margin-top:8px}
.ss-act-navigation h3{font-size:18px;color:#d0ba91;margin:0}.ss-act-navigation p{font-size:12px;color:#a8987e;margin:6px 0}.ss-act-navigation small{font-size:11px;color:#9e947c}
.ss-gate-arrow{height:48px;border:1px solid #766249;clip-path:polygon(18% 0,82% 0,100% 50%,82% 100%,18% 100%,0 50%);background:linear-gradient(#393229,#151411);color:#d1b98c;font:bold 36px/1 serif;cursor:pointer;box-shadow:inset 0 0 8px #000}
.ss-gate-arrow:hover,.ss-gate-arrow:focus-visible{background:#514030;color:#f2d598;outline:2px solid #c9aa75}
.ss-heat-total{display:block;margin:20px auto 0;padding:10px;color:#cfab7e;border-top:1px solid #6d4e36;border-bottom:1px solid #6d4e36;font-size:15px}
.ss-individual-pacts h3{font-size:18px;color:#c2af90;margin:0;text-align:center}
.ss-individual-pacts #ss-heat-desc{font-size:11px;margin:10px 0 16px;color:#a69781}
.ss-individual-pacts #ss-contracts{grid-template-columns:1fr;gap:7px}
.ss-individual-pacts .ss-contract{grid-template-columns:minmax(130px,1fr) 110px 25px;padding:10px}
.ss-infernal .ss-single-gate .ss-gargoyle{filter:drop-shadow(0 0 22px #d3271e88)}
.ss-infernal .ss-heat-total{border-color:#bb4a31;color:#f29b7a;background:#60160f44}
@media(max-width:650px){.ss-gate-layout{grid-template-columns:1fr;gap:24px}.ss-single-gate .ss-gargoyle{width:220px}.ss-individual-pacts .ss-contract{grid-template-columns:1fr 100px 25px}}

/* Seven escalating heat tiers, using carved details over the stone guardian. */
.ss-inferno-detail{position:absolute;inset:0;z-index:4;pointer-events:none;opacity:0;transition:opacity .3s;filter:drop-shadow(0 0 3px #ef481d)}
.ss-detail-cracks{background:url('../assets/ui/gargoyle-cracks.svg') center/contain no-repeat}
.ss-detail-runes{background:url('../assets/ui/gargoyle-runes.svg') center/contain no-repeat}
.ss-detail-horns{background:url('../assets/ui/gargoyle-horns.svg') center/contain no-repeat}
.ss-detail-flames{background:url('../assets/ui/gargoyle-flames.svg') center/contain no-repeat}
.ss-detail-crown{background:url('../assets/ui/gargoyle-crown.svg') center/contain no-repeat}
.ss-detail-sigil{background:url('../assets/ui/gargoyle-sigil.svg') center/contain no-repeat;z-index:1}
[data-heat-tier='1'] .ss-detail-cracks,[data-heat-tier='2'] .ss-detail-cracks,[data-heat-tier='3'] .ss-detail-cracks,[data-heat-tier='4'] .ss-detail-cracks,[data-heat-tier='5'] .ss-detail-cracks,[data-heat-tier='6'] .ss-detail-cracks{opacity:1}
[data-heat-tier='2'] .ss-detail-runes,[data-heat-tier='3'] .ss-detail-runes,[data-heat-tier='4'] .ss-detail-runes,[data-heat-tier='5'] .ss-detail-runes,[data-heat-tier='6'] .ss-detail-runes{opacity:1}
[data-heat-tier='3'] .ss-detail-horns,[data-heat-tier='4'] .ss-detail-horns,[data-heat-tier='5'] .ss-detail-horns,[data-heat-tier='6'] .ss-detail-horns{opacity:1}
[data-heat-tier='4'] .ss-detail-flames,[data-heat-tier='5'] .ss-detail-flames,[data-heat-tier='6'] .ss-detail-flames{opacity:1}
[data-heat-tier='5'] .ss-detail-crown,[data-heat-tier='6'] .ss-detail-crown{opacity:1}
[data-heat-tier='6'] .ss-detail-sigil{opacity:1}
[data-heat-tier='6'] .ss-gargoyle img{filter:sepia(.85) saturate(2) drop-shadow(0 0 14px #fa3d19)}
@media(prefers-reduced-motion:reduce){.ss-inferno-detail{transition:none}}

/* One category language for campaign, online and the knowledge library. */
.ss-card,.ss-library-entry { --ss-category-color:#b99a78; }
.ss-card.ss-class-choice,.ss-card.ss-standard-choice { border-color:var(--ss-category-color); background:linear-gradient(#292328,#171119); }
.ss-category { display:block; color:var(--ss-category-color,#b99a78); font-size:12px; font-weight:700; letter-spacing:.35px; margin:0 0 10px; }
.ss-upgrade-values { display:block; line-height:1.6; margin-top:12px; color:#e9dfce; }
.ss-library-entry .ss-category { margin-top:8px; }

body.ss-mobile #ss-pylon-buffs{left:calc(150px + env(safe-area-inset-left));bottom:18px;max-width:calc(100% - 260px);flex-wrap:wrap}
#so-rift-merchant{max-height:55vh;overflow:auto;width:min(650px,90vw)}

.ss-summon-timer{position:absolute;inset:0;display:grid;place-items:center;z-index:3;font:bold 17px Georgia,serif;color:#fff2cb;text-shadow:0 1px 3px #000,1px 0 3px #000;pointer-events:none}
