/* D2 copy of d_view.css (no lines). Adds .sp-pill.cur for the current page and a .zoom wrapper so the view zoom never fights the ambient art drift.
   Two layer flow for D game pages (t891u). Layer 1 the scene, full bleed art with dark pills. Layer 2 the D dashboard over the same art.
   One fixed art layer for both, nothing repeats. Motion is transform and opacity only, see d_view.js. */
.bgart img{object-position:50% 50%}
.bgart .zoom{position:absolute;inset:0;transform-origin:50% 55%}
.bgart .zoom img,.bgart .zoom picture{display:block;width:100%;height:100%}
.bgart .zoom picture img{width:100%;height:100%;object-fit:cover}
.shade{position:fixed;inset:0;z-index:0;pointer-events:none;background:rgba(8,10,9,.42);opacity:0}
body.v-dash .shade{opacity:1}
body.v-scene{overflow:hidden}
body.v-scene .dash,body.v-dash .scene{display:none}
.dash{position:relative;z-index:1}
.scene{position:fixed;inset:0;z-index:2}
.sp-pill{height:44px;padding:0 18px;border-radius:999px;border:0;background:rgba(20,22,20,.62);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#EDE6D3;display:inline-flex;align-items:center;gap:8px;font:500 13.5px/1 Inter,sans-serif;text-decoration:none;transition:background .2s}
.sp-pill:hover{background:rgba(20,22,20,.8)}
.sp-pill svg{color:#C9BFA6}
.sp-pill.cur{background:rgba(237,230,211,.22);color:#FFF8E8;cursor:default}
.sp-pill.cur:hover{background:rgba(237,230,211,.22)}
.sp-pill.cur .dot{width:7px;height:7px;border-radius:50%;background:#E9B949}
.sp-pill.brand{font:700 17px/1 'Cormorant Garamond',serif;padding:0 18px}
.sp-pill.brand img{height:22px}.sp-pill.brand i{font-weight:500;color:#E9B949}
.sc-top,.sc-bot{position:absolute;left:24px;right:24px;display:flex;align-items:center;gap:10px}
.sc-top{top:20px}.sc-bot{bottom:24px}
.sc-gap{flex:1}
.sc-main{position:absolute;left:0;right:0;margin:0 auto;width:max-content;top:calc(61% - 57px);border:0;cursor:pointer;border-radius:26px;padding:18px 44px 20px;min-width:300px;background:rgba(16,18,16,.7);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#EDE6D3;display:flex;flex-direction:column;align-items:center;gap:6px;box-shadow:0 18px 50px rgba(0,0,0,.45)}
.sc-main small{font:600 11px/1 Inter,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:#E9B949}
.sc-main b{font:600 34px/1.05 Cinzel,serif;letter-spacing:.02em}
.sc-main span{font:italic 500 17px/1.2 'Cormorant Garamond',serif;color:#C9BFA6}
.sc-main:hover{background:rgba(16,18,16,.82)}
.top .back,.nav .back{cursor:pointer;color:#EDE6D3}
@media (max-width:820px){
 .sc-top{top:12px;left:10px;right:10px;gap:8px}.sc-bot{bottom:16px;left:10px;right:10px;gap:8px}
 .sp-pill{height:40px;padding:0 14px;font-size:13px}
 .sp-pill.brand{padding:0 16px;font-size:15px}.sp-pill.brand img{height:19px}
 .sc-top .sp-pill.brand+.sc-gap+.sp-pill svg{display:none}
 .sc-main{top:calc(64% - 54px);min-width:0;width:calc(100% - 64px);padding:16px 20px 18px;border-radius:22px}
 .sc-main b{font-size:28px}
 .bgart img{object-position:50% 50%}
}
@media (prefers-reduced-motion:reduce){.sp-pill,.sc-main{transition:none}}
