
.dungeons-page { --stone: #9aa4b8; --amber: #f0a64a; --amber-deep: #b86a1c; }
.dg-glyph { width: 1em; height: 1em; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.dg-core-mark { width: 1em; height: 1em; flex: none; fill: none; stroke: #b9b2a2; stroke-width: 2; }
.dg-core-mark .dg-core-glow { fill: #f0a64a; stroke: #7a4212; stroke-width: 1.2; }
.well .dg-core-mark { width: 62%; height: 62%; }

.dg-entries { display: grid; gap: .6rem; padding: 0 .8rem .6rem; }
.dg-entry { position: relative; display: grid; grid-template-columns: 5.2rem minmax(0, 1fr) auto; align-items: center; gap: 1rem; min-height: 7.2rem; padding: .85rem 1rem; overflow: hidden; border-radius: .95rem; border: 1px solid rgba(255, 255, 255, .1); background: linear-gradient(90deg, rgba(8, 13, 22, .98) 0%, rgba(8, 13, 22, .93) 40%, rgba(8, 13, 22, .5) 68%, rgba(8, 13, 22, .2) 100%), var(--art, none) right 36% / 64% auto no-repeat, #0d1522; text-align: left; color: inherit; }
.dg-entry:hover { border-color: rgba(242, 198, 106, .32); }
.dg-entry.is-selected { border-color: rgba(242, 198, 106, .6); box-shadow: inset 0 0 0 1px rgba(242, 198, 106, .2); }
.dg-entry.is-running { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--skill) 55%, transparent); }
.dg-entry-art { display: grid; place-items: center; width: 5.2rem; height: 5.2rem; border-radius: .75rem; overflow: hidden; background: radial-gradient(circle at 50% 38%, rgba(240, 166, 74, .28), #0b121d 72%); box-shadow: inset 0 .12rem .4rem rgba(0, 0, 0, .7), 0 0 0 1px rgba(255, 255, 255, .06); }
.dg-entry-portrait { width: 92%; height: 92%; object-fit: contain; filter: drop-shadow(0 .15rem .25rem rgba(0, 0, 0, .7)); }
.dg-entry-portrait.is-emblem { display: grid; place-items: center; }
.dg-entry-portrait.is-emblem .ia-emblem { width: 62%; height: 62%; opacity: .8; }
.dg-entry-copy { display: grid; gap: .3rem; justify-items: start; min-width: 0; }
.dg-entry-copy strong { font: 400 1.35rem/1.1 var(--font-display); color: var(--gold-0); }
.dg-entry-copy small { color: var(--text-2); font-size: .82rem; line-height: 1.35; }
.dg-entry-band { display: grid; justify-items: center; align-self: start; line-height: 1; gap: .15rem; }
.dg-entry-band small { font: 700 .52rem var(--font-ui); letter-spacing: .12em; text-transform: uppercase; color: var(--text-3); }
.dg-entry-band b { font: 700 1.15rem var(--font-num); color: var(--text-1); white-space: nowrap; text-shadow: 0 1px 2px #000; }
.dg-entry-band { align-self: end; padding: .2rem .45rem; border-radius: .45rem; background: rgba(8, 13, 22, .72); }

.dg-strip { position: relative; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); margin: .2rem .8rem .9rem; padding: 0; list-style: none; }
.dg-strip::before { content: ""; position: absolute; left: 8.3%; right: 8.3%; top: 1.15rem; height: 2px; border-radius: 1px; background: rgba(255, 255, 255, .12); }
.dg-st { position: relative; display: grid; justify-items: center; align-content: start; gap: .35rem; min-width: 0; text-align: center; }
.dg-st > small { max-width: 100%; color: var(--text-3); font-size: .72rem; line-height: 1.2; overflow-wrap: anywhere; }
.dg-node { position: relative; display: grid; place-items: center; width: 2.3rem; height: 2.3rem; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .16); background: #0d1522; color: var(--text-2); font: 700 .92rem var(--font-num); box-shadow: 0 0 0 .25rem #0b111b; }
.dg-node .dg-glyph, .dg-node .ia-glyph { width: 1.15rem; height: 1.15rem; }
.dg-fork { display: flex; gap: .15rem; }
.dg-fork .dg-node { width: 1.75rem; height: 2.3rem; border-radius: .9rem; font-size: .78rem; }
.dg-fork .dg-node.is-rich { color: var(--text-3); }
.dg-fork .dg-node.is-lit { border-color: rgba(242, 198, 106, .7); color: var(--gold-1); }
.dg-node.is-door { border-radius: .6rem; }
.dg-node.is-boss { width: 2.6rem; height: 2.6rem; margin-top: -.15rem; border-color: rgba(240, 166, 74, .45); color: var(--amber); }
.dg-st.is-done .dg-node:not(.dg-fork .dg-node:not(.is-lit)) { border-color: color-mix(in srgb, var(--skill) 80%, #fff 10%); background: color-mix(in srgb, var(--skill) 38%, #0d1522); color: #fff; }
.dg-st.is-done > small { color: var(--text-2); }
.dg-st.is-here .dg-node:not(.dg-fork .dg-node:not(.is-lit)) { border-color: var(--gold-1); background: rgba(242, 198, 106, .18); color: var(--gold-0); box-shadow: 0 0 0 .25rem #0b111b, 0 0 0 .38rem rgba(242, 198, 106, .28); }
.dg-st.is-here > small { color: var(--gold-1); font-weight: 600; }
.dg-st.is-next .dg-node:not(.dg-fork .dg-node:not(.is-lit)) { border-color: var(--gold-2); border-style: dashed; color: var(--gold-1); }
.dg-st.is-next > small { color: var(--gold-1); }
.dg-st.is-drift.is-open .dg-node { border-color: var(--amber); color: var(--amber); }

.dg-rooms { display: grid; gap: .45rem; padding: 0 .8rem .8rem; }
.dg-room { display: grid; grid-template-columns: 2.2rem minmax(0, 1fr); align-items: start; gap: .7rem; padding: .55rem .7rem; border-radius: .7rem; border: 1px solid rgba(255, 255, 255, .06); background: rgba(255, 255, 255, .025); }
.dg-room.is-done { opacity: .72; }
.dg-room.is-here, .dg-room.is-next { border-color: rgba(242, 198, 106, .45); background: rgba(242, 198, 106, .06); }
.dg-room-n { display: grid; place-items: center; width: 2.2rem; height: 2.2rem; border-radius: .6rem; background: rgba(0, 0, 0, .3); color: var(--gold-2); font: 700 1rem var(--font-num); }
.dg-room-n .dg-glyph, .dg-room-n .ia-glyph { width: 1.2rem; height: 1.2rem; }
.dg-room.is-hall .dg-room-n { color: var(--amber); }
.dg-room-copy { display: grid; gap: .35rem; min-width: 0; }
.dg-room-copy > b { color: var(--text-1); font: 600 .98rem/1.2 var(--font-display); }
.dg-room-copy > small, .dg-branch > small { color: var(--text-3); font-size: .78rem; line-height: 1.4; }
.dg-branch { display: grid; gap: .3rem; padding: .45rem .55rem; border-radius: .55rem; background: rgba(0, 0, 0, .22); }
.dg-branch-head { display: flex; align-items: baseline; gap: .5rem; }
.dg-branch-head b { color: var(--text-1); font: 600 .92rem var(--font-display); }
.dg-branch-head em { font: 600 .66rem var(--font-ui); font-style: normal; letter-spacing: .1em; text-transform: uppercase; color: var(--gold-3); }
.dg-branch.is-rich .dg-branch-head em { color: var(--amber); }
.dg-foes { display: flex; flex-wrap: wrap; gap: .35rem; }
.dg-foe { position: relative; display: grid; place-items: center; width: 2.6rem; height: 2.6rem; border-radius: .5rem; background: radial-gradient(circle at 50% 35%, #1c2a42, #0b121d 75%); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08); }
.dg-foe.is-elite { box-shadow: inset 0 0 0 1px rgba(242, 198, 106, .6), 0 0 .5rem rgba(242, 198, 106, .15); }
.dg-foe.is-boss { width: 3.2rem; height: 3.2rem; box-shadow: inset 0 0 0 1px rgba(240, 166, 74, .7), 0 0 .6rem rgba(240, 166, 74, .2); }
.dg-foe-art { width: 86%; height: 86%; object-fit: contain; }
.dg-foe-art.is-emblem { display: grid; place-items: center; }
.dg-foe-art.is-emblem .ia-emblem { width: 58%; height: 58%; opacity: .55; }
.dg-foe > b { position: absolute; right: -.2rem; bottom: -.25rem; min-width: 1.2rem; padding: 0 .2rem; border-radius: .35rem; background: #0a101b; box-shadow: 0 0 0 1px rgba(255, 255, 255, .14); color: var(--text-1); font: 700 .66rem/1.1rem var(--font-num); text-align: center; }
.dg-foe > b.is-over { color: #ff8a84; }
.dg-legend { margin: 0 .8rem .6rem; }
.dg-legend-row small .ia-emblem { width: .85rem; height: .85rem; vertical-align: -.12rem; margin-right: .15rem; }
.dg-legend-row .card-power { display: inline-flex; align-items: center; gap: .15rem; white-space: nowrap; }
.dg-legend-row.is-boss { border-color: rgba(240, 166, 74, .25); }

.dg-warden-body { display: grid; grid-template-columns: 7rem minmax(0, 1fr); align-items: center; gap: .9rem; padding: 0 .8rem .6rem; }
.dg-warden-art { display: grid; place-items: center; width: 7rem; height: 7rem; border-radius: .9rem; background: radial-gradient(circle at 50% 42%, rgba(240, 166, 74, .32), #0b121d 70%); box-shadow: inset 0 .12rem .5rem rgba(0, 0, 0, .7), 0 0 0 1px rgba(240, 166, 74, .25); overflow: hidden; }
.dg-warden-portrait { width: 94%; height: 94%; object-fit: contain; filter: drop-shadow(0 .2rem .3rem rgba(0, 0, 0, .75)); }
.dg-warden-portrait.is-emblem { display: grid; place-items: center; }
.dg-warden-portrait.is-emblem .ia-emblem { width: 58%; height: 58%; opacity: .7; }
.dg-warden-copy { display: grid; gap: .45rem; min-width: 0; }
.dg-vs { display: flex; flex-wrap: wrap; gap: .4rem 1.4rem; }
.dg-vs > span { display: grid; gap: .1rem; }
.dg-vs small { color: var(--text-3); font-size: .74rem; }
.dg-vs b { display: inline-flex; align-items: center; gap: .2rem; font: 400 1.45rem/1 var(--font-num); color: var(--text-1); }
.dg-vs b .ia-glyph { width: 1rem; height: 1rem; color: var(--gold-2); }
.dg-vs b.t-bad { color: #ff8a84; }
.dg-vs b.t-good { color: var(--emerald); }
.dg-warden-meta { margin: 0; color: var(--text-2); font-size: .82rem; line-height: 1.4; }
.dg-warden-warn { display: flex; gap: .4rem; margin: 0; color: #ffb38a; font-size: .8rem; line-height: 1.4; }
.dg-warden-warn .ia-glyph { width: .9rem; height: .9rem; flex: none; margin-top: .15rem; }
.dg-shield, .dg-answer { display: flex; align-items: flex-start; gap: .55rem; margin: 0 .8rem .5rem; padding: .55rem .7rem; border-radius: .6rem; font-size: .86rem; line-height: 1.45; }
.dg-shield { border: 1px solid color-mix(in srgb, var(--stone) 30%, transparent); background: color-mix(in srgb, var(--stone) 8%, rgba(0, 0, 0, .2)); color: var(--text-2); }
.dg-shield .dg-glyph { width: 1.2rem; height: 1.2rem; margin-top: .1rem; color: var(--stone); }
.dg-answer { border: 1px solid rgba(88, 214, 127, .3); background: rgba(88, 214, 127, .06); color: var(--text-1); }
.dg-answer.is-none { border-color: rgba(255, 143, 79, .35); background: rgba(255, 143, 79, .06); }
.dg-answer .ia-glyph { width: 1rem; height: 1rem; flex: none; margin-top: .15rem; color: var(--emerald); }
.dg-answer.is-none .ia-glyph { color: var(--ember); }

.dg-record-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; padding: .2rem .8rem .6rem; }
.dg-record { display: grid; gap: .2rem; padding: .55rem .65rem; border-radius: .6rem; border: 1px solid rgba(255, 255, 255, .07); background: rgba(255, 255, 255, .035); }
.dg-record small { color: var(--text-3); font-size: .72rem; letter-spacing: .02em; }
.dg-record b { color: var(--gold-1); font: 600 1.05rem var(--font-num); }

.dg-block { display: grid; gap: .45rem; padding: .6rem .7rem .65rem; border-radius: .7rem; border: 1px solid rgba(255, 255, 255, .07); background: rgba(255, 255, 255, .035); }
.dg-block-head { display: flex; align-items: baseline; justify-content: space-between; gap: .6rem; }
.dg-block-head > small.t-caps { color: var(--gold-3); }
.dg-block-note { color: var(--text-3); font-size: .74rem; text-align: right; }
.dg-about { display: grid; grid-template-columns: 2.9rem minmax(0, 1fr) auto; align-items: center; gap: .7rem; }
.dg-about-art { display: grid; place-items: center; width: 2.9rem; height: 2.9rem; border-radius: .6rem; overflow: hidden; background: radial-gradient(circle at 50% 38%, rgba(240, 166, 74, .28), #0b121d 72%); box-shadow: inset 0 .1rem .3rem rgba(0, 0, 0, .7), 0 0 0 1px rgba(255, 255, 255, .06); }
.dg-about-portrait { width: 92%; height: 92%; object-fit: contain; }
.dg-about-portrait.is-emblem { display: grid; place-items: center; }
.dg-about-portrait.is-emblem .ia-emblem { width: 62%; height: 62%; opacity: .8; }
.dg-about-copy { display: grid; gap: .1rem; min-width: 0; }
.dg-about-copy b { color: var(--text-1); font: 600 .95rem/1.25 var(--font-display); }
.dg-about-copy small { color: var(--text-3); font-size: .74rem; }
.dg-run .dg-pips { height: .6rem; }
.dg-vows { display: grid; grid-template-columns: repeat(11, minmax(0, 1fr)); gap: .22rem; }
.dg-vow { position: relative; display: grid; place-items: center; height: 2.1rem; min-width: 0; padding: 0; border-radius: .45rem; border: 1px solid rgba(255, 255, 255, .12); background: rgba(0, 0, 0, .28); color: var(--text-2); font: 700 .86rem var(--font-num); }
.dg-vow:hover:not(:disabled) { border-color: rgba(242, 198, 106, .45); color: var(--text-1); }
.dg-vow.is-cleared { border-color: color-mix(in srgb, var(--skill) 55%, transparent); color: var(--text-1); }
.dg-vow[aria-pressed="true"] { border-color: var(--gold-1); background: linear-gradient(180deg, var(--gold-1), var(--gold-3)); color: #1d1204; }
.dg-vow.is-shut { border-style: dashed; border-color: rgba(255, 255, 255, .1); background: rgba(0, 0, 0, .16); color: var(--text-4); cursor: not-allowed; }
.dg-vow.is-shut .ia-glyph { position: absolute; top: .14rem; right: .14rem; width: .56rem; height: .56rem; opacity: .75; }
.dg-vow-top { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: .65rem; }
.dg-vow-top > small.t-caps { color: var(--gold-3); }
.dg-vow-line { display: flex; align-items: baseline; justify-content: space-between; gap: .6rem; margin: 0; color: var(--text-1); font-size: .86rem; line-height: 1.4; }
.dg-vow-cores { flex: none; color: var(--text-3); font-size: .74rem; }
.dg-vow-line .tr-mod { vertical-align: .05rem; }
.dg-vow-help { margin: 0; color: var(--text-3); font-size: .76rem; line-height: 1.4; }
.dg-order { display: grid; grid-template-columns: minmax(6.5rem, 1fr) auto; align-items: center; gap: .3rem .7rem; }
.dg-order-label { display: grid; color: var(--text-1); font-size: .84rem; line-height: 1.25; }
.dg-order-count { color: var(--text-3); font: 600 .7rem var(--font-num); }
.dg-seg { justify-self: end; flex-wrap: wrap; justify-content: flex-end; }
.dg-seg button { padding: .24rem .6rem; font-size: .76rem; }
.dg-more { display: inline-flex; align-items: center; gap: .35rem; justify-self: start; padding: .1rem 0; color: var(--gold-2); font: 600 .78rem var(--font-ui); }
.dg-more:hover, .dg-more[aria-expanded="true"] { color: var(--gold-1); }
.dg-more .ia-glyph { width: .85rem; height: .85rem; }
.dg-more-set { padding: .02rem .38rem; border-radius: .35rem; background: rgba(242, 198, 106, .14); color: var(--gold-1); font: 700 .66rem/1.4 var(--font-num); }
.dg-more-rows { display: grid; gap: .45rem; padding-top: .5rem; border-top: 1px solid rgba(255, 255, 255, .06); }
.dg-order-note { margin: 0; color: var(--text-3); font-size: .72rem; }
.dg-orders.is-compact { padding: .5rem .6rem; }
.dg-orders.is-compact .dg-block-note { display: none; }
.dg-orders.is-compact .dg-order { grid-template-columns: minmax(5.5rem, 1fr) auto; }
.dg-orders.is-compact .dg-order-label { font-size: .8rem; }
.dg-orders.is-compact .dg-seg button { padding: .2rem .48rem; font-size: .72rem; }
.dg-supplies { gap: .3rem; }
.dg-supply-row { display: grid; grid-template-columns: 3.3rem 1.5rem minmax(0, 1fr) auto auto; align-items: center; gap: .5rem; min-height: 2rem; }
.dg-supply-row > small.t-caps { color: var(--gold-3); }
.dg-supply-icon { width: 1.5rem; height: 1.5rem; object-fit: contain; }
.dg-supply-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text-1); font-size: .86rem; }
.dg-supply-row > em { font-style: normal; color: var(--text-2); font-size: .78rem; white-space: nowrap; }
.dg-supply-row.is-short > em { color: var(--ember); }
.dg-supply-row > .btn { padding: .18rem .6rem; }
.dg-idle-row { display: grid; grid-template-columns: auto minmax(2.5rem, 1fr) auto; align-items: center; gap: .65rem; margin-top: .15rem; padding-top: .45rem; border-top: 1px solid rgba(255, 255, 255, .06); }
.dg-idle-verdict { display: inline-flex; align-items: baseline; gap: .35rem; color: #ff9d8a; font: 600 .84rem var(--font-ui); white-space: nowrap; }
.dg-idle-verdict .ia-glyph { width: .85rem; height: .85rem; align-self: center; }
.dg-idle-verdict small { color: var(--text-3); font-weight: 500; font-size: .74rem; }
.dg-idle-row.is-safe .dg-idle-verdict { color: var(--emerald); }
.dg-why { display: inline-flex; align-items: center; gap: .25rem; color: var(--text-3); font: 600 .74rem var(--font-ui); }
.dg-why:hover, .dg-why[aria-expanded="true"] { color: var(--gold-1); }
.dg-why .ia-glyph { width: .8rem; height: .8rem; }
.dg-why-text { margin: 0; color: var(--text-2); font-size: .8rem; line-height: 1.45; }
.dg-why-text b { color: var(--text-1); }
.dungeon-detail .stance-row { grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: .3rem .8rem; padding: 0 .1rem; }
.dg-tools .tr-views { width: 100%; }

.dg-sets { display: grid; gap: .5rem; }
.dg-set { display: grid; gap: .35rem; padding: .5rem .55rem; border-radius: .6rem; border: 1px solid rgba(255, 255, 255, .06); background: rgba(0, 0, 0, .2); }
.dg-set.is-yours { border-color: color-mix(in srgb, var(--skill) 50%, transparent); background: color-mix(in srgb, var(--skill) 7%, rgba(0, 0, 0, .2)); }
.dg-set > header { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.dg-set-name { display: inline-flex; align-items: baseline; gap: .4rem; min-width: 0; }
.dg-set-name .ia-emblem { width: 1rem; height: 1rem; align-self: center; }
.dg-set-name b { color: var(--text-1); font: 600 .92rem var(--font-display); }
.dg-set-name small { color: var(--text-3); font-size: .72rem; }
.dg-set-count { display: inline-flex; align-items: center; gap: .25rem; color: var(--text-2); font: 700 .8rem var(--font-num); }
.dg-set-count .ia-glyph { width: .95rem; height: .95rem; color: var(--emerald); }
.dg-set.is-complete .dg-set-count { color: var(--emerald); }
.dg-wells { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .3rem; }
.dg-well > img.is-stand-in { width: 64%; height: 64%; opacity: .5; filter: grayscale(1) brightness(1.4); }
.dg-well.is-missing { opacity: .5; border-style: dashed; }
.dg-well.is-missing > img:not(.is-stand-in) { filter: grayscale(.85) brightness(.75); }
.dg-well.is-missing::before { display: none; }
.dg-well.is-found { opacity: 1; }
button.dg-well.is-missing:hover { opacity: .85; }
.dg-well.is-pet > img { width: 88%; height: 88%; object-fit: contain; }
.dg-well.is-pet .ia-emblem { width: 60%; height: 60%; }
.dg-odds { margin: .1rem 0 0; }
.dg-odds .fact > div { gap: .2rem .45rem; }
.dg-odds .fact .well { width: 1.9rem; flex: none; }
.dg-pet.is-found { border-color: rgba(255, 179, 71, .35); }
.dg-exchange { display: grid; gap: .5rem; padding: .6rem .65rem; border-radius: .65rem; border: 1px solid rgba(240, 166, 74, .25); background: rgba(240, 166, 74, .05); }
.dg-cores { display: grid; grid-template-columns: 2.2rem minmax(0, 1fr); align-items: center; gap: 0 .55rem; }
.dg-cores > .well { grid-row: 1 / 3; width: 2.2rem; }
.dg-cores > span { color: var(--text-1); font-size: .9rem; }
.dg-cores > span b { color: var(--amber); font: 700 1.05rem var(--font-num); }
.dg-cores > small { color: var(--text-3); font-size: .74rem; }
.dg-exchange .mb-note { display: flex; align-items: center; gap: .35rem; }
.dg-exchange-pick { display: grid; grid-template-columns: 2.6rem minmax(0, 1fr) auto; align-items: center; gap: .55rem; padding: .4rem .5rem; border-radius: .55rem; background: rgba(0, 0, 0, .25); }
.dg-exchange-pick > .well { width: 2.6rem; }
.dg-exchange-copy { display: grid; gap: .1rem; min-width: 0; }
.dg-exchange-copy b { font: 600 .92rem var(--font-display); }
.dg-exchange-copy small { color: var(--text-3); font-size: .74rem; line-height: 1.35; }
.dg-price { display: inline-flex; align-items: baseline; gap: .2rem; color: var(--amber); font: 700 1.2rem var(--font-num); }
.dg-price::after { content: "cores"; color: var(--text-3); font: 600 .66rem var(--font-ui); letter-spacing: .06em; }
.dg-exchange .action-note { margin: 0; }

.dg-pips { display: grid; grid-template-columns: 1fr 1fr 1fr .6fr 1fr 1.25fr; gap: .22rem; height: .42rem; }
.dg-pips > i { border-radius: .2rem; background: rgba(255, 255, 255, .12); }
.dg-pips > i.is-done { background: var(--skill, var(--gold-2)); }
.dg-pips > i.is-here { background: var(--gold-1); }
.dg-pips > i.is-next { background: rgba(242, 198, 106, .45); }
.dg-pips > i.is-fork { background: linear-gradient(90deg, rgba(255, 255, 255, .12) 0 48%, transparent 48% 52%, rgba(255, 255, 255, .12) 52%); }
.dg-pips > i.is-fork.is-safe.is-done { background: linear-gradient(90deg, var(--skill, var(--gold-2)) 0 48%, transparent 48% 52%, rgba(255, 255, 255, .12) 52%); }
.dg-pips > i.is-fork.is-rich.is-done { background: linear-gradient(90deg, rgba(255, 255, 255, .12) 0 48%, transparent 48% 52%, var(--skill, var(--gold-2)) 52%); }
.dg-pips > i.is-fork.is-safe.is-here { background: linear-gradient(90deg, var(--gold-1) 0 48%, transparent 48% 52%, rgba(255, 255, 255, .12) 52%); }
.dg-pips > i.is-fork.is-rich.is-here { background: linear-gradient(90deg, rgba(255, 255, 255, .12) 0 48%, transparent 48% 52%, var(--gold-1) 52%); }
.dg-pips > i.is-drift.is-open { background: var(--amber, #f0a64a); }
.dg-pips > i.is-hall.is-here { background: var(--amber, #f0a64a); }
.hud-trial.dg-task .dg-pips { height: .42rem; }
.hud-trial.dg-task .hud-trial-meta > span:not(.dg-chip):not(.hud-trial-mods) + span:not(.dg-chip):not(.hud-trial-mods)::before { content: "·"; margin-right: .45rem; color: var(--text-4); }
.dg-chip { display: inline-flex; align-items: center; gap: .3rem; padding: .05rem .45rem; border-radius: .4rem; font: 600 .7rem/1.4 var(--font-ui); white-space: nowrap; }
.dg-chip .dg-glyph, .dg-chip .dg-core-mark { width: .85rem; height: .85rem; }
.dg-chip.is-shielded { border: 1px solid rgba(154, 164, 184, .55); background: rgba(154, 164, 184, .16); color: #dbe2ee; }
.dg-chip.is-core { border: 1px solid rgba(240, 166, 74, .6); background: rgba(240, 166, 74, .16); color: #ffd39c; }
.dg-plate { display: flex; align-items: baseline; flex-wrap: wrap; gap: .15rem .55rem; min-width: 0; padding: .35rem .6rem; border-radius: .55rem; border: 1px solid rgba(242, 198, 106, .28); background: rgba(8, 13, 22, .7); }
.dg-plate-room { color: var(--gold-3); font: 700 .68rem var(--font-ui); letter-spacing: .1em; text-transform: uppercase; }
.dg-plate > b { color: var(--gold-0); font: 400 1rem var(--font-display); }
.dg-plate .dg-chip { align-self: center; }
.dg-plate-vow { margin-left: auto; color: var(--text-2); font: 600 .74rem var(--font-ui); }

.dg-drift-icon { display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: .5rem; background: rgba(0, 0, 0, .3); color: var(--text-2); }
.dg-drift-icon .dg-glyph { width: 1.2rem; height: 1.2rem; }
.dg-drift-copy { display: grid; gap: .05rem; }
.dg-drift-copy strong { color: var(--text-1); font: 600 .92rem var(--font-display); }
.dg-drift-copy small { color: var(--text-3); font-size: .72rem; }
.world-over { position: absolute; inset: 0; z-index: 3; display: grid; place-items: center; pointer-events: none; }
.world-over[hidden] { display: none; }
.dg-door { pointer-events: auto; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: .6rem 1rem; width: min(30rem, calc(100% - 2rem)); padding: 1.1rem 1.2rem; border-radius: 1.1rem; border: 1px solid rgba(242, 198, 106, .4); background: rgba(8, 13, 22, .9); box-shadow: 0 1.2rem 3rem rgba(0, 0, 0, .55); }
.dg-door-icon { display: grid; place-items: center; width: 3.4rem; height: 3.4rem; border-radius: .9rem; background: rgba(242, 198, 106, .1); color: var(--gold-1); }
.dg-door-icon .dg-glyph { width: 2rem; height: 2rem; }
.dg-door-copy { display: grid; gap: .15rem; min-width: 0; }
.dg-door-copy small.t-caps { color: var(--gold-3); }
.dg-door-copy strong { font-size: 1.55rem; line-height: 1.1; color: var(--gold-0); }
.dg-door-copy p { margin: .15rem 0 0; color: var(--text-2); font-size: .86rem; line-height: 1.4; }
.dg-door > .btn { grid-column: 1 / -1; }

.dg-chest-list { display: grid; gap: .3rem; }
.dg-chest-row { display: grid; grid-template-columns: 2.3rem minmax(0, 1fr) auto auto; align-items: center; gap: .55rem; padding: .25rem .4rem; border-radius: .5rem; background: rgba(255, 255, 255, .03); }
.dg-chest-row > .well { width: 2.3rem; }
.dg-chest-row.is-piece { background: rgba(195, 140, 255, .08); box-shadow: inset 0 0 0 1px rgba(195, 140, 255, .25); }
.dg-chest-row.is-core { background: rgba(240, 166, 74, .06); }
.dg-chest-copy { display: grid; gap: .05rem; min-width: 0; }
.dg-chest-copy b { font-size: .88rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dg-chest-copy small { color: var(--text-3); font-size: .7rem; }
.dg-chest-n { color: var(--text-2); font: 700 .82rem var(--font-num); }
.dg-new { padding: .05rem .4rem; border-radius: .35rem; background: rgba(195, 140, 255, .2); box-shadow: inset 0 0 0 1px rgba(195, 140, 255, .5); color: #e3cdff; font: 700 .6rem/1.4 var(--font-ui); letter-spacing: .08em; text-transform: uppercase; }

.hud-pop.is-dungeon { max-height: 34rem; }
.dg-now { display: grid; gap: .55rem; }
.dg-now-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: .15rem .55rem; }
.dg-now-head small.t-caps { flex-basis: 100%; color: var(--gold-3); }
.dg-now-head strong { font: 400 1.3rem/1.1 var(--font-display); color: var(--gold-0); }
.dg-now-name { color: var(--text-2); font-size: .88rem; }
.dg-now-head .dg-chip { margin-left: auto; align-self: center; }
.dg-now .dg-strip { margin: .15rem 0 .1rem; }
.dg-now-then { margin: 0; color: var(--text-1); font-size: .9rem; line-height: 1.4; }
.dg-now-facts dt .dg-glyph { width: .85rem; height: .85rem; color: var(--gold-3); }
.dg-last { display: grid; gap: .35rem; }
.dg-last > small.t-caps { display: inline-flex; align-items: center; gap: .35rem; color: var(--gold-3); }
.dg-last > small .dg-glyph { width: .95rem; height: .95rem; color: var(--amber, #f0a64a); }
.dg-now-foot { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: .4rem; }
.hud-pop.is-dungeon .dg-now-foot { position: sticky; bottom: -.7rem; z-index: 1; margin: 0 -.7rem -.7rem; padding: .5rem .7rem .65rem; border-top: 1px solid rgba(255, 255, 255, .07); background: rgb(9, 14, 23); }

.welcome-stop.is-dungeon { border-color: rgba(240, 166, 74, .38); background: rgba(90, 52, 16, .28); }
.welcome-stop.is-dungeon > .dg-glyph { width: 1.8rem; height: 1.8rem; color: #f0a64a; }
.welcome-stop.is-dungeon { align-items: flex-start; }
.welcome-stop.is-dungeon .welcome-stop-copy { gap: .45rem; text-align: left; }
.welcome-stop.is-dungeon .welcome-stop-copy p { margin: 0; text-align: left; color: #ffe0b8; font-size: .88rem; line-height: 1.45; }
.welcome-stop.is-dungeon .btn-fix { justify-self: start; }
.highlight.is-dungeon { border-color: rgba(240, 166, 74, .38); background: linear-gradient(90deg, rgba(240, 166, 74, .12), rgba(0, 0, 0, .22) 60%); }
.highlight-mark { display: grid; place-items: center; width: 2.6rem; height: 2.6rem; border-radius: .5rem; background: rgba(0, 0, 0, .3); color: #f0a64a; }
.highlight-mark .dg-glyph { width: 1.4rem; height: 1.4rem; }
.lb-dungeon-tab .lb-dungeon-art { width: 1.6rem; height: 1.6rem; object-fit: contain; flex: none; }
.lb-dungeon-tab .lb-dungeon-art.is-emblem { display: grid; place-items: center; }
.lb-dungeon-tab .lb-dungeon-art.is-emblem .ia-emblem { width: 1.2rem; height: 1.2rem; }
.lb-vow { color: var(--gold-1); font-weight: 600; }
.lb-scopes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.lb-scopes button { justify-content: center; }

.dg-coll .log-link { margin: 0 0 .6rem; }
.dg-coll-rows { display: grid; gap: .55rem; }
.dg-coll-row { display: grid; grid-template-columns: 11rem minmax(0, 1fr); align-items: center; gap: .8rem; padding: .5rem .6rem; border-radius: .6rem; border: 1px solid rgba(255, 255, 255, .06); background: rgba(0, 0, 0, .2); }
.dg-coll-row.is-complete { border-color: rgba(88, 214, 127, .4); background: rgba(88, 214, 127, .05); }
.dg-coll-name { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "icon name check" "icon style count"; align-items: center; gap: 0 .45rem; min-width: 0; }
.dg-coll-name .ia-emblem { grid-area: icon; width: 1.4rem; height: 1.4rem; }
.dg-coll-name b { grid-area: name; color: var(--text-1); font: 600 .95rem var(--font-display); }
.dg-coll-name small { grid-area: style; color: var(--text-3); font-size: .72rem; }
.dg-coll-name > .t-num { grid-area: count; color: var(--text-2); font: 700 .78rem var(--font-num); }
.dg-coll-check { grid-area: check; display: grid; place-items: center; width: 1.3rem; height: 1.3rem; border-radius: 50%; background: rgba(88, 214, 127, .18); color: var(--emerald); }
.dg-coll-check .ia-glyph { width: .85rem; height: .85rem; }
.dg-coll-wells { display: grid; grid-template-columns: repeat(6, minmax(0, 3.2rem)); gap: .35rem; }
.dg-coll-piece { position: relative; }
.dg-coll-piece > b { position: absolute; right: -.15rem; top: -.25rem; padding: 0 .22rem; border-radius: .3rem; background: #1d1204; box-shadow: 0 0 0 1px rgba(242, 198, 106, .5); color: var(--gold-1); font: 700 .6rem/1rem var(--font-num); }
.dg-coll-pet { display: flex; align-items: center; gap: .6rem; margin-top: .6rem; padding: .45rem .6rem; border-radius: .6rem; border: 1px dashed rgba(255, 255, 255, .12); }
.dg-coll-pet.is-found { border-style: solid; border-color: rgba(255, 179, 71, .4); background: rgba(255, 179, 71, .05); }
.dg-coll-pet > .well { width: 2.8rem; flex: none; }
.dg-coll-pet > span { display: grid; gap: .1rem; }
.dg-coll-pet b { color: var(--text-2); font: 600 .95rem var(--font-display); }
.dg-coll-pet small { color: var(--text-3); font-size: .76rem; }

@media (min-width: 761px) and (min-height: 501px), (min-width: 761px) and (pointer: fine), (min-width: 761px) and (pointer: none) {
  .is-hud .stage .dg-entries, .is-hud .stage .dg-rooms, .is-hud .stage .dg-record-grid, .is-hud .stage .dg-warden-body { padding-left: 0; padding-right: .25rem; }
  .is-hud .stage .dg-strip, .is-hud .stage .dg-legend, .is-hud .stage .dg-shield, .is-hud .stage .dg-answer { margin-left: 0; margin-right: .25rem; }
  .is-hud .stage .dungeons-page .page-columns { grid-template-columns: minmax(0, 1fr) 34rem; }
  .is-hud .stage .dungeon-detail .detail-scroll { gap: .55rem; }
  .is-hud .stage .dungeon-detail .detail-action { gap: .45rem; }
  .is-hud .stage .dungeon-detail .detail-action .action-note { margin: 0; font-size: .78rem; }
  .is-hud .stage .dungeons-choose .dg-tools { margin-bottom: .2rem; }
  .is-hud .stage .dg-gives .dg-sets, .is-hud .stage .dg-gives .dg-odds { margin: 0 .25rem .6rem 0; }
  .is-hud .stage .dg-gives .dg-set { grid-template-columns: 10.5rem minmax(0, 1fr); align-items: center; gap: .4rem .9rem; padding: .55rem .7rem; }
  .is-hud .stage .dg-gives .dg-set > header { display: grid; justify-items: start; gap: .25rem; }
  .is-hud .stage .dg-gives .dg-set-name { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0 .4rem; }
  .is-hud .stage .dg-gives .dg-set-name small { grid-column: 2; }
  .is-hud .stage .dg-gives .dg-wells { grid-template-columns: repeat(6, minmax(0, 5.4rem)); justify-content: start; gap: .4rem; }
  .is-hud .stage .dg-gives .dg-odds { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .is-hud .stage .dg-cores-group .dg-exchange { margin: 0 .25rem .6rem 0; }
  .is-hud .stage .dg-entry { padding: .85rem 1rem; border-radius: 1rem; }
  .is-hud .world-over { padding-bottom: 9rem; }
  .is-hud .dg-door { background: rgba(8, 13, 22, .86); -webkit-backdrop-filter: var(--hud-blur); backdrop-filter: var(--hud-blur); }
  .is-hud.hud-solid .dg-door { -webkit-backdrop-filter: none; backdrop-filter: none; background: rgba(8, 13, 22, .92); }
}

@media (max-width: 760px), (max-height: 500px) and (pointer: coarse) {
  .dg-entries { padding: 0 .6rem .5rem; }
  .dg-entry { grid-template-columns: 3.6rem minmax(0, 1fr); gap: .7rem; }
  .dg-entry-art { width: 3.6rem; height: 3.6rem; }
  .dg-entry-band { grid-column: 2; justify-self: start; grid-auto-flow: column; gap: .3rem; align-items: baseline; }
  .dg-entry { background: linear-gradient(90deg, rgba(8, 13, 22, .96) 0%, rgba(8, 13, 22, .88) 55%, rgba(8, 13, 22, .55) 100%), var(--art, none) 38% 34% / cover no-repeat, #0d1522; }
  .dg-coll .log-link { flex-wrap: wrap; }
  .dg-coll .log-link .btn { flex: 1 1 100%; justify-content: center; }
  .dg-strip { margin: .2rem .5rem .8rem; }
  .dg-st > small { font-size: .62rem; }
  .dg-node { width: 1.9rem; height: 1.9rem; font-size: .8rem; }
  .dg-fork .dg-node { width: 1.35rem; height: 1.9rem; font-size: .66rem; }
  .dg-node.is-boss { width: 2.15rem; height: 2.15rem; }
  .dg-strip::before { top: .95rem; }
  .dg-rooms { padding: 0 .6rem .6rem; }
  .dg-room { grid-template-columns: 1.9rem minmax(0, 1fr); gap: .55rem; padding: .5rem .55rem; }
  .dg-room-n { width: 1.9rem; height: 1.9rem; }
  .dg-foe { width: 2.3rem; height: 2.3rem; }
  .dg-foe.is-boss { width: 2.8rem; height: 2.8rem; }
  .dg-legend { margin: 0 .6rem .5rem; }
  .dg-warden-body { grid-template-columns: 5.2rem minmax(0, 1fr); padding: 0 .6rem .5rem; }
  .dg-warden-art { width: 5.2rem; height: 5.2rem; }
  .dg-shield, .dg-answer { margin: 0 .6rem .45rem; }
  .dg-record-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: .2rem .6rem .5rem; }
  .dungeons-page.is-phone .dungeons-choose { padding-bottom: .4rem; }
  .dungeons-info .dg-tools { padding: 0 .6rem .4rem; }
  .dg-order.is-stopAfter, .dg-order.is-stopFind { grid-template-columns: 1fr; }
  .dg-order.is-stopAfter .dg-seg, .dg-order.is-stopFind .dg-seg { justify-self: stretch; justify-content: stretch; }
  .dg-order.is-stopAfter .dg-seg button, .dg-order.is-stopFind .dg-seg button { flex: 1 1 auto; justify-content: center; }
  .dg-vows { gap: .2rem; }
  .dg-vow { height: 2.3rem; font-size: .8rem; }
  .dg-supply-row { grid-template-columns: 3rem 1.5rem minmax(0, 1fr) auto; }
  .dg-supply-row > em { grid-column: 3; grid-row: 2; margin-top: -.3rem; }
  .dg-supply-row > .btn { grid-column: 4; grid-row: 1 / 3; }
  .dg-wells { gap: .25rem; }
  .dg-coll-row { grid-template-columns: 1fr; gap: .45rem; }
  .dg-coll-wells { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .world-bar .dg-plate { flex: 1 1 100%; order: 5; }
  .hud-pop.is-dungeon { position: fixed; left: .5rem; right: .5rem; bottom: calc(var(--nav) + .5rem); max-height: calc(100vh - var(--top) - var(--nav) - 2.5rem); z-index: 30; border-radius: 1rem; background: rgb(10, 16, 27); box-shadow: 0 -1rem 2.5rem rgba(0, 0, 0, .55); }
  .hud-pop.is-dungeon .dg-now-foot { background: rgb(10, 16, 27); }
  .dg-door { position: fixed; left: .5rem; right: .5rem; bottom: calc(var(--nav) + .5rem); z-index: 30; width: auto; grid-template-columns: auto minmax(0, 1fr); padding: .9rem 1rem; background: rgb(10, 16, 27); box-shadow: 0 -1rem 2.5rem rgba(0, 0, 0, .55); }
  .dg-door-copy strong { font-size: 1.3rem; }

  .dg-vow-top { grid-template-columns: minmax(0, 1fr); gap: .4rem; }
  .dg-vows { grid-template-columns: repeat(auto-fill, minmax(3.3rem, 1fr)); gap: .3rem; }
  .dg-vow { height: 3.3rem; font-size: .95rem; }
  .dg-vow.is-shut .ia-glyph { width: .7rem; height: .7rem; }
  .dg-seg button { min-width: 3.3rem; min-height: 3.3rem; justify-content: center; font-size: .95rem; }
  .dg-more { min-height: 3.3rem; font-size: .95rem; }
  .dg-why { position: relative; font-size: .9rem; }
  .dg-why::after { content: ""; position: absolute; left: 50%; top: 50%; translate: -50% -50%; width: max(100%, 3.3rem); height: 3.3rem; }
  .dg-st > small { display: none; }
  .dg-strip { margin-bottom: .5rem; }
  .dg-node, .dg-fork .dg-node { font-size: .95rem; }
  .dungeon-detail .stance-row { grid-template-columns: minmax(0, 1fr); }
  .dg-foe > b { min-width: 1.5rem; font-size: .9rem; line-height: 1.35rem; }
  .dg-entry-band small { font-size: .9rem; letter-spacing: .08em; }
  .dg-branch-head em, .dg-plate-room { font-size: .9rem; }
  .dg-room-copy > small, .dg-branch > small, .dg-vs small, .dg-about-copy small, .dg-vow-cores, .dg-vow-help, .dg-block-note, .dg-order-count, .dg-order-note, .dg-supply-row > em,
  .dg-idle-verdict small, .dg-record small, .dg-set-name small, .dg-cores > small, .dg-exchange-copy small, .dg-chip, .dg-more-set, .dg-price::after, .dg-legend-row small { font-size: .9rem; }
  .dg-entry-copy small, .dg-warden-meta, .dg-warden-warn, .dg-shield, .dg-answer, .dg-vow-line, .dg-order-label, .dg-supply-name, .dg-idle-verdict, .dg-why-text, .dg-set-count, .dg-orders.is-compact .dg-order-label { font-size: .95rem; }
  .dg-orders.is-compact .dg-seg button { font-size: .95rem; }
  .dg-door-copy small.t-caps { font-size: .9rem; }
  .dg-door-copy p { font-size: .95rem; }
}
@media (max-height: 500px) and (pointer: coarse) {
  .world-first :is(.dg-door, .hud-pop.is-dungeon) { left: calc(.5rem + env(safe-area-inset-left)); right: auto; width: min(34rem, calc(100% - var(--rail, 0px) - 1rem - env(safe-area-inset-left))); bottom: calc(.5rem + env(safe-area-inset-bottom)); }
  .world-first .hud-pop.is-dungeon { max-height: calc(100dvh - var(--band-b, var(--top)) - 1.5rem); }
}
