/* The Depths, concept A "The Descent" (Mark, 11.11.2026). Art: /v2/art/depths-descent/ (Astra, keyed). */
html.gv-v2.dd-on #panelDungeon .dnx>:not(#ddView){display:none!important}
html.gv-v2.dd-on #panelDungeon .gv-depth-fx{display:none!important}

/* ── The panel: one dark colour taken from the top edge of the paintings, so header and painting meet without a seam */
html.gv-v2.dd-tab #panelDungeon{--dd-ink:#180b1b;background:var(--dd-ink)!important;display:flex!important;flex-direction:column;overflow:hidden}
/* Zones and Relic: the pit, darkened, behind their own content */
html.gv-v2.dd-tab:not(.dd-on) #panelDungeon{background:linear-gradient(#180b1bd9,#0e0814f0),url('/v2/art/depths-descent/bg-pit.webp') center 30%/cover no-repeat!important}
html.gv-v2.dd-tab #panelDungeon .gv-depth-zone-banner,html.gv-v2.dd-tab #panelDungeon .gv-depth-relic-info{background:#120b18d9!important;border:1px solid #6b5536!important;border-image:none!important;border-radius:8px;box-shadow:0 18px 50px #0009}
html.gv-v2.dd-tab #panelDungeon .gv-depth-relic-figure .gv-depth-fx{display:none!important}

/* ── Header as in the concept: title between gold rules, the count under it, tabs centred on one gold line */
html.gv-v2.dd-tab #panelDungeon .gv-depth-header{position:relative;z-index:3;flex:0 0 auto;display:flex!important;flex-direction:column;align-items:center;justify-content:flex-start;gap:0;height:auto!important;min-height:0!important;margin:0!important;padding:12px 16px 0!important;background:linear-gradient(#0d0610,var(--dd-ink))!important;border:0!important;box-shadow:none!important}
html.gv-v2.dd-tab #panelDungeon .gv-depth-header:after{content:"";position:absolute;left:4%;right:4%;bottom:0;height:1px;background:linear-gradient(90deg,transparent,#8a6a3f 18%,#c9a05a 50%,#8a6a3f 82%,transparent)}
html.gv-v2.dd-tab #panelDungeon .dng-title{display:flex!important;align-items:center;justify-content:center;gap:clamp(12px,2vw,26px);width:100%;margin:0!important;padding:0!important;font:700 clamp(28px,3vw,44px)/1.05 var(--font-display,Georgia,serif)!important;color:#f3cf86!important;letter-spacing:.01em;text-align:center;text-shadow:0 2px 0 #3a2208,0 0 18px #c9873a55;background:none!important;-webkit-text-fill-color:currentColor}
html.gv-v2.dd-tab #panelDungeon .dng-title:before,html.gv-v2.dd-tab #panelDungeon .dng-title:after{content:"";flex:0 1 clamp(40px,22vw,340px);height:9px;background:radial-gradient(circle,#ffe2a0 0 2px,transparent 2.5px) right center/9px 9px no-repeat,linear-gradient(90deg,transparent,#c9a05a) left center/calc(100% - 12px) 1px no-repeat}
html.gv-v2.dd-tab #panelDungeon .dng-title:after{transform:scaleX(-1)}
html.gv-v2.dd-tab #panelDungeon .dd-count{margin:2px 0 0;font:600 clamp(14px,1.25vw,18px)/1.2 Georgia,serif;color:#e7d6bd;letter-spacing:.02em;text-shadow:0 1px 3px #000}
html.gv-v2.dd-tab #panelDungeon .dd-count:empty{display:none}
html.gv-v2.dd-tab #panelDungeon .dng-subtabs{display:flex!important;justify-content:center;gap:clamp(4px,3vw,64px);margin:6px 0 0!important;padding:0!important;background:none!important;border:0!important;box-shadow:none!important;border-radius:0!important;width:auto!important;position:static!important}
html.gv-v2.dd-tab #panelDungeon .dng-subtab{position:relative;display:flex!important;align-items:center;min-width:0;padding:6px clamp(10px,1.6vw,26px) 10px!important;border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;color:#b8a68e!important;font:600 clamp(15px,1.45vw,21px)/1 var(--font-display,Georgia,serif)!important;cursor:pointer;transition:color .15s}
html.gv-v2.dd-tab #panelDungeon .dng-subtab:hover{color:#f4e8d5!important}
html.gv-v2.dd-tab #panelDungeon .dng-subtab.active{color:#ffe2a0!important}
html.gv-v2.dd-tab #panelDungeon .dng-subtab.active:after{content:"";position:absolute;left:8%;right:8%;bottom:-1px;height:2px;background:linear-gradient(90deg,transparent,#ffd98a 20%,#ffe2a0 50%,#ffd98a 80%,transparent);box-shadow:0 0 8px #ffc14d88;z-index:1}
html.gv-v2.dd-tab #panelDungeon .dng-subtab{flex:0 0 auto!important;width:auto!important;text-transform:none!important;letter-spacing:.01em!important}
html.gv-v2.dd-tab #panelDungeon .dng-subtab:before,html.gv-v2.dd-tab #panelDungeon .dng-subtabs:before,html.gv-v2.dd-tab #panelDungeon .dng-subtabs:after{display:none!important}
html.gv-v2.dd-tab #panelDungeon .dng-subtab-ico{display:none!important}
html.gv-v2.dd-tab #panelDungeon .dng-subtab-lbl{white-space:nowrap;font:inherit!important;color:inherit!important;text-transform:none!important;letter-spacing:inherit!important}
html.gv-v2.dd-tab #panelDungeon .gv-depth-pause{position:absolute!important;right:14px;top:12px;margin:0!important;opacity:.75}

/* ── The scene fills everything under the header and is cropped like a photo (cover): no edges, no frame.
   Doors and niches are placed in % of the painting, so they stay on its arches at any window size. */
html.gv-v2.dd-on #panelDungeon .dnx{position:relative!important;flex:1 1 0!important;min-height:0!important;height:auto!important;overflow:hidden!important;margin:0!important;padding:0!important;background:none!important}
#ddView{position:absolute;inset:0;overflow:hidden;color:#f4e8d5;container-type:size;container-name:dd}
#ddView button{font-family:inherit}
/* Cropped at most 8% in height; on a very wide window the sides show the same painting, blurred, behind a soft edge */
.dd-home,.dd-inside{--dd-h:max(100cqh,min(66.667cqw,108cqh));position:absolute;z-index:1;left:50%;top:50%;height:var(--dd-h);width:calc(var(--dd-h)*1.5);transform:translate(-50%,-50%);background:none}
/* the painting, widened to 3:1 (wide-depths-art.py): its middle half is exactly this stage, the sides go dark */
.dd-home:before,.dd-inside:before{content:"";position:absolute;top:0;bottom:0;left:-50%;width:200%;z-index:-1;pointer-events:none;background:center/100% 100% no-repeat}
.dd-home:before{background-image:url('/v2/art/depths-descent/bg-shaft-wide.webp')}
.dd-inside:before{background-image:url('/v2/art/depths-descent/bg-pit-wide.webp')}
.dd-home{--dd-h:max(100cqh,min(66.667cqw,122cqh))}
#ddView:after{content:"";position:absolute;inset:-40px;z-index:0;pointer-events:none;background:center/cover no-repeat;filter:blur(22px) brightness(.85)}
html.dd-home-on #ddView:after{background-image:url('/v2/art/depths-descent/bg-shaft-wide.webp')}
html.dd-inside-on #ddView:after{background-image:url('/v2/art/depths-descent/bg-pit-wide.webp')}
/* the painting's own top tone fades up into the header */
#ddView:before{content:"";position:absolute;left:0;right:0;top:0;height:min(70px,12cqh);z-index:3;pointer-events:none;background:linear-gradient(var(--dd-ink),transparent)}
.dd-home:after,.dd-inside:after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 45%,transparent 60%,#0b061066 100%)}

/* Home: the shaft */
.dd-gate{position:absolute;z-index:2}
.dd-door{all:unset;position:absolute;cursor:pointer;display:block;transition:filter .2s,transform .2s}
.dd-door img{display:block;width:100%;height:auto;filter:drop-shadow(0 10px 18px #000c)}
.dd-gate.open .dd-door:hover{filter:brightness(1.12) drop-shadow(0 0 22px #ffc14d88)}
.dd-gate.locked .dd-door{cursor:default;filter:brightness(.85)}
.dd-gate.t-abyss.locked .dd-door{filter:brightness(.8) drop-shadow(0 0 18px #ff3a2a55)}
.dd-gate-text{position:absolute;display:flex;flex-direction:column;align-items:flex-start;gap:.5em;text-shadow:0 2px 6px #000,0 0 2px #000}
.dd-gate-text h3{margin:0;white-space:nowrap;font:700 clamp(20px,2.4cqw,38px)/1.05 var(--font-display,Georgia,serif);color:#ffe2a0}
.dd-gate-text h3 small{font-size:.6em;color:#f4e8d5;margin-left:.4em}
.dd-gate.locked .dd-gate-text h3{color:#e7d6bd}
.dd-gate-text p{margin:0;max-width:20em;font:italic clamp(13px,1.3cqw,18px)/1.3 Georgia,serif;color:#d9c9b4}
.dd-enter{white-space:nowrap;min-width:clamp(150px,15cqw,230px);min-height:clamp(40px,4cqw,56px);padding:4px 30px;border:0;background:url('/v2/art/create-screen/begin-button.webp') center/100% 100% no-repeat;color:#2d1804;font:700 clamp(14px,1.45cqw,20px)/1 var(--font-display,Georgia,serif);cursor:pointer;transition:filter .18s,transform .12s}
.dd-enter:hover{filter:brightness(1.12) drop-shadow(0 0 12px #ffc14daa)}
.dd-enter:active{transform:scale(.98)}
/* arches of bg-shaft (x, y, width as % of the painting) */
.dd-g0 .dd-door{left:6.4%;top:17.6%;width:17%}
.dd-g1 .dd-door{left:34.4%;top:41.2%;width:17%}
.dd-g2 .dd-door{left:56.6%;top:61.2%;width:17%}
.dd-g0 .dd-gate-text{left:25%;top:23%;width:30%}
.dd-g1 .dd-gate-text{left:53.5%;top:46%;width:30%}
.dd-g2 .dd-gate-text{left:75.5%;top:66%;width:23%}
.dd-gate,.dd-g0,.dd-g1,.dd-g2{inset:0;pointer-events:none}
.dd-gate .dd-door,.dd-gate .dd-gate-text{pointer-events:auto}

/* Inside: the pit */
.dd-tiers{position:absolute;left:0;right:0;top:9%;height:52%;z-index:2}
.dd-tier{position:absolute;left:50%;display:flex;justify-content:space-between;transform:translateX(-50%)}
/* four galleries of bg-pit, the furthest one smallest */
.dd-tier0{top:0;width:50%}
.dd-tier1{top:22%;width:56%}
.dd-tier2{top:44%;width:62%}
.dd-tier3{top:66%;width:84%}
/* the nearest gallery opens in the middle, where the current monster stands (as in the concept): nothing hides behind it */
.dd-tier3{display:grid;grid-template-columns:repeat(4,8.2%) 1fr repeat(4,8.2%);column-gap:1.6%;align-items:end}
.dd-tier3 .dd-niche:nth-child(5){grid-column:6}
.dd-niche{all:unset;box-sizing:border-box;position:relative;width:5.4%;aspect-ratio:180/215;cursor:pointer;transition:transform .15s,filter .15s}
.dd-tier0 .dd-niche{width:10.8%}.dd-tier1 .dd-niche{width:10.5%}.dd-tier2 .dd-niche{width:10.3%}.dd-tier3 .dd-niche{width:100%}
.dd-niche-art{position:absolute;inset:0;background:url('/v2/art/depths-descent/niche.webp') center/100% 100% no-repeat}
.dd-niche.next .dd-niche-art{background-image:url('/v2/art/depths-descent/niche-glow.webp')}
.dd-mon{position:absolute;left:17%;right:17%;bottom:9%;width:66%;height:62%;object-fit:contain;object-position:50% 100%;z-index:1}
.dd-niche.locked .dd-mon{filter:brightness(.28) saturate(.2)}
.dd-niche.done .dd-mon{filter:grayscale(1) brightness(.55)}
.dd-niche.done .dd-niche-art{filter:brightness(.7) saturate(.6)}
.dd-n{position:absolute;left:50%;top:-1.35em;transform:translateX(-50%);font:700 clamp(10px,.95cqw,14px) var(--font-display,Georgia,serif);color:#e7d6bd;text-shadow:0 1px 3px #000}
.dd-niche.next .dd-n{color:#ffe2a0}
.dd-crown{position:absolute;left:50%;top:-2.6em;width:clamp(14px,1.5cqw,24px);transform:translateX(-50%);z-index:2}
.dd-lock{position:absolute;right:6%;bottom:6%;width:clamp(10px,1.05cqw,16px);z-index:2;opacity:.9}
.dd-niche:hover{transform:translateY(-2px);filter:brightness(1.15)}
.dd-niche.sel{filter:drop-shadow(0 0 6px #ffe2a0) drop-shadow(0 0 14px #ffc14d99)}
.dd-niche:focus-visible{outline:2px solid #ffe2a0;outline-offset:3px}

.dd-stage{position:absolute;inset:0;z-index:2;pointer-events:none}
.dd-hero-mon{position:absolute;left:50%;bottom:31%;height:25%;width:auto;max-width:17%;object-fit:contain;transform:translateX(-50%);filter:drop-shadow(0 16px 20px #000c);animation:ddBreathe 4.5s ease-in-out infinite;transform-origin:50% 100%}
@keyframes ddBreathe{0%,100%{transform:translateX(-50%) scale(1)}50%{transform:translateX(-50%) scale(1.012,1.022)}}
.dd-info{position:absolute;left:25%;right:25%;top:69.5%;display:flex;flex-direction:column;align-items:center;text-align:center;gap:2px;pointer-events:auto;text-shadow:0 2px 8px #000,0 0 3px #000}
.dd-where{font-size:clamp(11px,1cqw,14px);color:#d9c9b4}
.dd-where b{color:#f3cf86;font-weight:700}
.dd-badge{font-size:clamp(11px,1cqw,13px);color:#ffcf7a;letter-spacing:.04em}
.dd-info h3{margin:0;font:700 clamp(22px,2.6cqw,38px)/1.05 var(--font-display,Georgia,serif);color:#ffe2a0}
.dd-pos{margin:0;font-size:clamp(12px,1.1cqw,15px);color:#e7d6bd}
.dd-clock{margin:2px 0 0;font:italic clamp(12px,1.1cqw,15px) Georgia,serif;color:#d9c9b4}
.dd-clock b{font-style:normal;color:#ffd98a}.dd-clock.ready b{color:#8fe6a5}
.dd-fight{margin-top:6px;min-width:clamp(220px,21cqw,320px);min-height:clamp(46px,4.4cqw,62px);padding:4px 36px;border:0;background:url('/v2/art/create-screen/begin-button.webp') center/100% 100% no-repeat;color:#2d1804;font:700 clamp(17px,1.8cqw,25px)/1 var(--font-display,Georgia,serif);cursor:pointer;transition:filter .18s,transform .12s}
.dd-fight:hover:not(:disabled){filter:brightness(1.12) drop-shadow(0 0 14px #ffc14daa)}
.dd-fight:disabled{filter:saturate(.35) brightness(.8);cursor:default}
.dd-links{display:flex;gap:18px;margin-top:4px}
.dd-link{border:0;background:none;color:#ead8bd;font:600 clamp(12px,1.05cqw,14px) var(--font-body,sans-serif);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.dd-lore{display:none}
@media(prefers-reduced-motion:reduce){.dd-hero-mon{animation:none}}
/* Low windows (laptops): the fight text beside the landing, not under it */
@container dd (max-height:600px) and (min-width:700px){
 .dd-info{left:auto;right:3%;width:31%;top:auto;bottom:8%}
 .dd-clock{white-space:nowrap}
 .dd-badge,.dd-pos{display:none}
 .dd-info h3{font-size:clamp(20px,2.3cqw,30px)}
 .dd-fight{min-width:0;width:auto;padding:4px 34px;white-space:nowrap;font-size:clamp(15px,1.6cqw,20px)}
 .dd-links{flex-wrap:wrap;justify-content:center;gap:4px 14px}
}

/* ── Phones: one column that scrolls, the painting behind it */
@media(max-width:900px){
 html.gv-v2.dd-on #panelDungeon{overflow:visible}
 html.gv-v2.dd-on #panelDungeon .dnx{overflow:visible!important;flex:0 0 auto!important}
 html.gv-v2.dd-tab #panelDungeon .dng-title:before,html.gv-v2.dd-tab #panelDungeon .dng-title:after{flex-basis:clamp(24px,12vw,90px)}
 html.gv-v2.dd-tab #panelDungeon .dng-subtab{padding:6px 10px 10px!important;font-size:15px!important}
 html.gv-v2.dd-tab #panelDungeon .gv-depth-pause{top:8px;right:8px}
 #ddView{position:relative;inset:auto;overflow:visible;container-type:inline-size}
 #ddView:before{display:none}
 .dd-home,.dd-inside{position:relative;left:auto;top:auto;transform:none;width:100%;height:auto;padding:16px 12px 22px;display:flex;flex-direction:column;gap:16px;background-size:cover;background-position:20% 40%;box-sizing:border-box}
 .dd-home{background:linear-gradient(var(--dd-ink),#0e0814aa 18%,#0e0814aa 82%,#0b0510),url('/v2/art/depths-descent/bg-shaft.webp') 18% 40%/cover no-repeat}
 .dd-inside{background:linear-gradient(var(--dd-ink),transparent 14%),url('/v2/art/depths-descent/landing-phone.webp') 50% 0/100% auto no-repeat,#100615}
 .dd-home:after,.dd-inside:after,.dd-home:before,.dd-inside:before{display:none}
 .dd-gate{position:relative;inset:auto;display:grid;grid-template-columns:38% 1fr;align-items:center;gap:12px;pointer-events:auto}
 .dd-door,.dd-gate-text{position:static!important;width:auto!important}
 .dd-gate-text h3{font-size:22px}.dd-gate-text p{font-size:13px}
 .dd-enter{white-space:normal;min-width:0;max-width:100%;min-height:42px;padding:6px 22px;font-size:15px;line-height:1.1}
 .dd-gate-text h3{white-space:normal}
 .dd-stage{position:relative;inset:auto;order:1;display:flex;flex-direction:column;align-items:center}
 .dd-hero-mon{position:relative;left:auto;bottom:auto;height:auto;width:auto;max-width:48%;max-height:24vh;transform:none;animation:none;margin-top:3vh}
 .dd-info{position:relative;left:auto;right:auto;top:auto;margin-top:6px}
 .dd-info h3{font-size:24px}.dd-pos,.dd-clock{font-size:13px}
 .dd-fight{min-width:220px;min-height:50px;font-size:19px}
 .dd-tiers{position:relative;inset:auto;height:auto;order:2;display:flex;flex-direction:column-reverse;gap:22px;padding-top:14px}
 .dd-tier{position:relative;left:auto;top:auto;width:100%!important;transform:none;justify-content:space-between}
 .dd-tier .dd-niche{width:10.6%!important}
 .dd-tier3{display:flex;column-gap:0}
 .dd-n{font-size:10px;top:-1.3em}.dd-crown{width:14px;top:-2.4em}.dd-lock{width:10px}
}

/* ── Fight preview window (Mark, 11.11.2026): the same dark pit, the monster on the rock landing, gold type,
   the Depths fight button. Only the look changes; every button is still the game's own. */
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal{border-image:none!important;border:1px solid #6b5536!important;border-radius:12px!important;padding:0!important;overflow-x:hidden!important;overflow-y:auto!important;max-height:calc(100dvh - 24px)!important;background:linear-gradient(#170b1cf5,#0e0712fa),url('/v2/art/depths-descent/bg-pit.webp') center/cover!important;box-shadow:0 0 0 1px #000,0 30px 80px #000d,inset 0 1px 0 #c9a05a33!important}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal:before,html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal:after{display:none!important}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .gvp-close{top:14px!important;right:14px!important;z-index:5}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .dng-boss-modal,html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal #dngBossInfoCard{background:none!important;border:0!important;box-shadow:none!important;padding:0!important;margin:0!important}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .gv-depth-inspect{gap:0!important;background:none!important;border:0!important;border-radius:0!important;padding:0!important;align-items:stretch}
/* left: the monster standing on the landing */
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .gv-depth-inspect-art{position:relative;border:0!important;border-radius:0!important;box-shadow:inset -1px 0 0 #6b553666!important;background:radial-gradient(ellipse at 50% 78%,#ffb34a2e,transparent 55%),linear-gradient(transparent 70%,#0e0712cc),url('/v2/art/depths-descent/landing-phone.webp') center top/125% auto no-repeat,#100615!important}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .gv-depth-inspect-art .gv-depth-fx{display:none!important}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .gv-depth-fullbody{position:absolute!important;left:50%!important;right:auto!important;top:auto!important;bottom:39%!important;height:56%!important;width:auto!important;max-width:92%!important;object-fit:contain!important;transform:none!important;translate:-50% 0;margin:0!important;filter:drop-shadow(0 14px 10px #000d)!important;animation:ddBreathe2 4.5s ease-in-out infinite;transform-origin:50% 100%}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .gv-depth-inspect-art:after{content:"";position:absolute;left:50%;bottom:37.5%;width:46%;height:5%;translate:-50% 0;border-radius:50%;background:radial-gradient(#000b,transparent 70%);pointer-events:none}
@keyframes ddBreathe2{0%,100%{scale:1}50%{scale:1.01 1.02}}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .gv-depth-inspect-caption{display:none!important}
/* right: the words */
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .gv-depth-inspect-info{background:none!important;border:0!important;padding:26px 28px 22px!important;gap:10px}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .dng-boss-floor{color:#c9a96e!important;font:600 12px/1.3 var(--font-body,sans-serif)!important;letter-spacing:.14em!important;text-transform:uppercase;text-align:center;border:0!important;padding:0 30px!important;margin:0!important}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .dng-boss-name{font:700 clamp(26px,2.6vw,36px)/1.05 var(--font-display,Georgia,serif)!important;color:#f3cf86!important;text-align:center;text-shadow:0 2px 0 #3a2208,0 0 18px #c9873a44;margin:2px 0 0!important;-webkit-text-fill-color:currentColor;background:none!important}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .gv-codex-modal-lore{font:italic 15px/1.45 Georgia,serif!important;color:#d9c9b4!important;text-align:center;margin:0!important;padding:0 0 12px!important;border:0!important;background:linear-gradient(90deg,transparent,#8a6a3f,transparent) bottom/100% 1px no-repeat!important}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .dng-boss-meta{color:#e7d6bd!important;font:600 14px var(--font-body,sans-serif)!important;text-align:center;background:none!important;border:0!important}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .dng-boss-eq{background:none!important;border:0!important;padding:0!important;gap:10px!important;justify-content:center!important;width:100%!important;margin:0 auto!important}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .dng-boss-eq-slot{background:radial-gradient(circle at 50% 40%,#2a1a30,#120a16)!important;border:1px solid #6b5536!important;border-radius:8px!important;box-shadow:inset 0 0 12px #000a!important}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .dng-boss-eq-slot:hover,html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .dng-boss-eq-slot:focus{border-color:#c9a05a!important}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .dng-power-compare{background:#0b0610b3!important;border:1px solid #4a3a2a!important;border-radius:8px!important;color:#e7d6bd!important}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .dng-power-compare strong{color:#ffe2a0}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .dng-power-bar{background:#2a1f2c!important;border:0!important}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .dng-odds{background:none!important;border:0!important;padding:0 2px!important}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .dng-odds-lbl{color:#bfae96!important}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .dng-odds-note,html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .dngb-omens-t{color:#a8977f!important;font-style:italic}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal details summary{color:#d9c9b4!important;cursor:pointer}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal details summary:hover{color:#ffe2a0!important}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .gv-depth-actions{background:none!important;border:0!important;box-shadow:none!important;padding:14px 0 0!important;margin:auto 0 0!important;width:100%!important;box-sizing:border-box;position:static!important;display:flex;flex-direction:column;align-items:center;gap:10px}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .dng-challenge-btn{width:min(100%,340px)!important;min-height:58px!important;padding:4px 36px!important;border:0!important;border-radius:0!important;background:url('/v2/art/create-screen/begin-button.webp') center/100% 100% no-repeat!important;box-shadow:none!important;color:#2d1804!important;font:700 22px/1 var(--font-display,Georgia,serif)!important;letter-spacing:.04em!important;text-shadow:0 1px 0 #ffe9b088!important;cursor:pointer;transition:filter .18s,transform .12s}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .dng-challenge-btn:hover:not(:disabled){filter:brightness(1.12) drop-shadow(0 0 14px #ffc14daa)}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .dng-challenge-btn:disabled{filter:saturate(.35) brightness(.8)}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .dng-omen-fight-btn{width:min(100%,340px)!important;min-height:44px!important;border:1px solid #8a6a3f!important;border-radius:999px!important;background:linear-gradient(#2a1636,#1a0d22)!important;box-shadow:inset 0 1px 0 #c9a05a33!important;color:#ffe2a0!important;font:600 15px var(--font-body,sans-serif)!important;display:flex;align-items:center;justify-content:center;gap:6px}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .dng-omen-fight-btn:hover{border-color:#ffe2a0!important;background:linear-gradient(#3a1f4a,#22112c)!important}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .dngb-omens-t{text-align:center;font-size:12px!important;max-width:100%!important;width:auto!important;white-space:normal!important;box-sizing:border-box}
html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .dng-challenge-btn,html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .dng-omen-fight-btn{box-sizing:border-box!important;max-width:100%!important}
@media(prefers-reduced-motion:reduce){html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .gv-depth-fullbody{animation:none}}
@media(max-width:700px){html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .gv-depth-inspect-art{background-size:cover!important;background-position:center 55%!important;min-height:220px}html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .gv-depth-fullbody{bottom:10%!important;height:84%!important}html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .gv-depth-inspect-art:after{bottom:8%}html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .gv-depth-inspect-info{padding:18px 16px 16px!important}html.gv-v2.dd-tab body #modalCard.gv-depth-modal.gv-depth-modal .dng-boss-name{font-size:26px!important}}

/* ── Behind the nav rail and before the painting loads (Mark, 11.11.2026: "tlo za menu jest wyciete", the council
   chamber flashing when Zones opens): the whole content area takes the Depths colours while the tab is open. */
html.gv-v2.dd-tab #mainContent{background:radial-gradient(ellipse at 50% 30%,#1e0e21,#0b0510 75%)!important}
html.gv-v2.dd-tab.dd-home-on #mainContent{background:#0b0510!important}
html.gv-v2.dd-tab.dd-inside-on #mainContent{background:#100615!important}
html.gv-v2.dd-tab:not(.dd-on) #mainContent{background:linear-gradient(#180b1be6,#0b0510f2),url('/v2/art/depths-descent/bg-pit.webp') center 30%/cover no-repeat,#0b0510!important}
html.gv-v2.dd-tab:not(.dd-on) #panelDungeon{background:none!important}
html.gv-v2.dd-tab:not(.dd-on) #panelDungeon :is(.gv-depth-zones,.gv-depth-relic,.dnx):before{display:none!important}
html.gv-v2.dd-tab #tabBar{background:linear-gradient(#0b051000,#0b0510b8 40%,#0b0510)!important}

/* ── Zones and Relic: the same dark glass and thin gold line as the fight window, not the old wooden frames */
html.gv-v2.dd-tab body #panelDungeon :is(.gv-journey-footer,.gv-depth-relic-info,.dnx-zpick,.dnx-zone,.gv-depth-zone-banner){border:1px solid #6b5536!important;border-image:none!important;border-radius:10px!important;background:linear-gradient(#170b1ce6,#0e0712eb)!important;box-shadow:0 18px 50px #0009,inset 0 1px 0 #c9a05a26!important}
html.gv-v2.dd-tab body #panelDungeon .gv-depth-zones .dnx-ztile{border:1px solid #4a3a2a!important;border-image:none!important;border-radius:10px!important;background:radial-gradient(circle at 50% 30%,#2a1a30,#120a16)!important;box-shadow:inset 0 0 14px #000a!important}
html.gv-v2.dd-tab body #panelDungeon .gv-depth-zones .dnx-ztile:is(:hover,.active,.selected){border-color:#c9a05a!important}
html.gv-v2.dd-tab body #panelDungeon .gv-depth-zone-banner :is(h2,h3),html.gv-v2.dd-tab body #panelDungeon .gv-depth-relic-info :is(h2,h3){font-family:var(--font-display,Georgia,serif)!important;color:#f3cf86!important}
html.gv-v2.dd-tab body #panelDungeon .gv-depth-zone-banner p{color:#d9c9b4!important;font:15px/1.5 Georgia,serif!important}
html.gv-v2.dd-tab body #panelDungeon .dnx-help{border:1px solid #8a6a3f!important;border-radius:999px!important;background:linear-gradient(#2a1636,#1a0d22)!important;color:#ffe2a0!important;font:600 14px var(--font-body,sans-serif)!important;padding:8px 18px!important;box-shadow:none!important}
html.gv-v2.dd-tab body #panelDungeon .dnx-help:hover{border-color:#ffe2a0!important}

/* ── "How the Depths work": the fight window's look, wide enough to read in a few lines */
html.gv-v2 body #modalCard.gvp-surface.gvp-surface:has(.dnx-guide){width:min(680px,94vw)!important;max-width:min(680px,94vw)!important;max-height:calc(100dvh - 24px)!important;overflow-y:auto!important;border:1px solid #6b5536!important;border-image:none!important;border-radius:12px!important;padding:0!important;background:linear-gradient(#170b1cf7,#0e0712fb),url('/v2/art/depths-descent/bg-pit.webp') center/cover!important;box-shadow:0 0 0 1px #000,0 30px 80px #000d,inset 0 1px 0 #c9a05a33!important}
html.gv-v2 body #modalCard.gvp-surface.gvp-surface:has(.dnx-guide):before,html.gv-v2 body #modalCard.gvp-surface.gvp-surface:has(.dnx-guide):after{display:none!important}
html.gv-v2 body #modalCard.gvp-surface:has(.dnx-guide) .gvp-close{top:14px!important;right:14px!important}
html.gv-v2 body #modalCard.gvp-surface:has(.dnx-guide) .dnx-guide{padding:26px clamp(18px,4vw,40px) 24px!important;background:none!important;border:0!important;max-width:none!important;width:auto!important;margin:0!important;box-sizing:border-box}
html.gv-v2 body #modalCard.gvp-surface:has(.dnx-guide) .dnx-guide h3{margin:0 0 16px!important;padding:0 34px 14px!important;text-align:center;font:700 clamp(24px,3vw,32px)/1.1 var(--font-display,Georgia,serif)!important;color:#f3cf86!important;text-transform:none!important;letter-spacing:.01em!important;text-shadow:0 2px 0 #3a2208,0 0 18px #c9873a44;background:linear-gradient(90deg,transparent,#8a6a3f,transparent) bottom/100% 1px no-repeat!important}
html.gv-v2 body #modalCard.gvp-surface:has(.dnx-guide) .dnx-guide p{margin:0 0 12px!important;font:15.5px/1.55 Georgia,serif!important;color:#e3d5bf!important}
html.gv-v2 body #modalCard.gvp-surface:has(.dnx-guide) .dnx-guide p.hi{color:#ffe2a0!important;padding:8px 0 8px 14px!important;border-left:2px solid #c9a05a!important;background:linear-gradient(90deg,#c9a05a14,transparent)!important}
html.gv-v2 body #modalCard.gvp-surface:has(.dnx-guide) .dnx-guide p.warn{color:#ffc27a!important;padding:8px 0 8px 14px!important;border-left:2px solid #e08a3a!important;background:linear-gradient(90deg,#e08a3a14,transparent)!important}
html.gv-v2 body #modalCard.gvp-surface:has(.dnx-guide) .modal-actions{display:flex;justify-content:center;margin-top:16px!important;background:none!important;border:0!important}
html.gv-v2 body #modalCard.gvp-surface:has(.dnx-guide) .modal-actions .btn-primary{min-width:200px!important;min-height:52px!important;padding:4px 40px!important;border:0!important;border-radius:0!important;background:url('/v2/art/create-screen/begin-button.webp') center/100% 100% no-repeat!important;box-shadow:none!important;color:#2d1804!important;font:700 19px/1 var(--font-display,Georgia,serif)!important;letter-spacing:.04em!important;cursor:pointer}
html.gv-v2 body #modalCard.gvp-surface:has(.dnx-guide) .modal-actions .btn-primary:hover{filter:brightness(1.12) drop-shadow(0 0 12px #ffc14daa)}

/* ── Under the nav rail (Mark, 11.11.2026, screenshot at 1872 wide: "na dole jest nadal wciecie w grafice za paskiem
   menu"): the scene stopped at the rail's top edge and a flat colour showed behind it. The view now paints 150 px further
   down (clip-path, not overflow, so the wide stage still cannot spill over the hero column), the sharp painting fades
   out at its foot and the same blurred painting carries on under the rail. Stage geometry is unchanged. */
/* overflow-x:clip (not hidden/visible): the wide stage must not widen the page, or a sideways scrollbar appears (Mark, 11.11). */
html.gv-v2.dd-on #panelDungeon .dnx{overflow:visible!important;overflow-x:clip!important;clip-path:inset(0 0 -150px 0)}
html.gv-v2.dd-on #panelDungeon #ddView{overflow:visible;overflow-x:clip;clip-path:inset(0 0 -150px 0)}
html.gv-v2.dd-on #ddView:after{bottom:-190px}
html.gv-v2.dd-on :is(.dd-home,.dd-inside):before{-webkit-mask-image:linear-gradient(#000 0,#000 90%,transparent);mask-image:linear-gradient(#000 0,#000 90%,transparent)}
