/* Blackmint v1.67 "dfx": extra animated detail for the Dark theme (data-theme-id=dark) ONLY (JS in app/darkfx.js).
   Same pattern as pinkfx/lightfx/arcfx: every rule is scoped to html[data-theme-id=dark]; decor nodes (.dfx-*) are display:none in every
   other theme. Motion needs html[data-dfx] (set by darkfx.js only when prefers-reduced-motion is off) AND the no-preference media query.
   Transform + opacity only; all decor is aria-hidden + pointer-events:none. Cards are never transformed (Minty's hop lines stay put).
   Paused while the tab is hidden (dfx-hid / bmz-hid). Lighter on phones. */
.dfx-sky,.dfx-fx,.dfx-d,.dfx-hs,.dfx-bl,.dfx-ul{display:none;pointer-events:none!important}
html[data-theme-id=dark] .dfx-rel{position:relative}
/* ---------- background: soft mint bokeh, rising leaf motes, twinkling sparkles ---------- */
html:not(#_d1):not(#_d2):not(#_d3):not(#_d4):not(#_d5)[data-theme-id=dark].dfx-on body{background:transparent!important}
html[data-theme-id=dark] .dfx-sky{display:block;position:fixed;inset:0;z-index:-1;overflow:hidden;contain:strict}
.dfx-sky i,.dfx-sky u,.dfx-sky b{position:absolute;display:block;opacity:0;will-change:transform,opacity}
.dfx-sky i{border-radius:50%}
.dfx-sky u{background-repeat:no-repeat;background-size:100% 100%}
.dfx-sky b{width:12px;height:12px;background:no-repeat center/100% 100%}
.dfx-sky i:nth-of-type(1){left:6%;top:18%;width:120px;height:120px;margin:-60px 0 0 -60px;background:radial-gradient(circle,rgba(61,220,151,0.14) 0,rgba(61,220,151,0.07) 38%,rgba(61,220,151,0) 70%);--dd:46s;--dl:-4s}
.dfx-sky i:nth-of-type(2){left:22%;top:70%;width:80px;height:80px;margin:-40px 0 0 -40px;background:radial-gradient(circle,rgba(124,240,255,0.10) 0,rgba(124,240,255,0.05) 38%,rgba(124,240,255,0) 70%);--dd:38s;--dl:-12s}
.dfx-sky i:nth-of-type(3){left:38%;top:32%;width:150px;height:150px;margin:-75px 0 0 -75px;background:radial-gradient(circle,rgba(143,240,196,0.09) 0,rgba(143,240,196,0.045) 38%,rgba(143,240,196,0) 70%);--dd:58s;--dl:-20s}
.dfx-sky i:nth-of-type(4){left:55%;top:82%;width:96px;height:96px;margin:-48px 0 0 -48px;background:radial-gradient(circle,rgba(61,220,151,0.12) 0,rgba(61,220,151,0.06) 38%,rgba(61,220,151,0) 70%);--dd:42s;--dl:-7s}
.dfx-sky i:nth-of-type(5){left:68%;top:12%;width:70px;height:70px;margin:-35px 0 0 -35px;background:radial-gradient(circle,rgba(191,255,227,0.11) 0,rgba(191,255,227,0.055) 38%,rgba(191,255,227,0) 70%);--dd:34s;--dl:-25s}
.dfx-sky i:nth-of-type(6){left:82%;top:58%;width:140px;height:140px;margin:-70px 0 0 -70px;background:radial-gradient(circle,rgba(29,107,75,0.16) 0,rgba(29,107,75,0.08) 38%,rgba(29,107,75,0) 70%);--dd:52s;--dl:-15s}
.dfx-sky i:nth-of-type(7){left:92%;top:26%;width:60px;height:60px;margin:-30px 0 0 -30px;background:radial-gradient(circle,rgba(61,220,151,0.14) 0,rgba(61,220,151,0.07) 38%,rgba(61,220,151,0) 70%);--dd:30s;--dl:-3s}
.dfx-sky i:nth-of-type(8){left:14%;top:92%;width:64px;height:64px;margin:-32px 0 0 -32px;background:radial-gradient(circle,rgba(143,240,196,0.11) 0,rgba(143,240,196,0.055) 38%,rgba(143,240,196,0) 70%);--dd:40s;--dl:-30s}
.dfx-sky i:nth-of-type(9){left:46%;top:56%;width:46px;height:46px;margin:-23px 0 0 -23px;background:radial-gradient(circle,rgba(191,255,227,0.13) 0,rgba(191,255,227,0.065) 38%,rgba(191,255,227,0) 70%);--dd:28s;--dl:-9s}
.dfx-sky i:nth-of-type(10){left:74%;top:90%;width:110px;height:110px;margin:-55px 0 0 -55px;background:radial-gradient(circle,rgba(61,220,151,0.09) 0,rgba(61,220,151,0.045) 38%,rgba(61,220,151,0) 70%);--dd:48s;--dl:-33s}
.dfx-sky i:nth-of-type(11){left:30%;top:8%;width:54px;height:54px;margin:-27px 0 0 -27px;background:radial-gradient(circle,rgba(124,240,255,0.12) 0,rgba(124,240,255,0.06) 38%,rgba(124,240,255,0) 70%);--dd:36s;--dl:-18s}
.dfx-sky i:nth-of-type(12){left:60%;top:40%;width:36px;height:36px;margin:-18px 0 0 -18px;background:radial-gradient(circle,rgba(143,240,196,0.15) 0,rgba(143,240,196,0.075) 38%,rgba(143,240,196,0) 70%);--dd:26s;--dl:-5s}
/* rising leaf motes (mint leaf SVG) */
.dfx-sky u:nth-of-type(1){left:18%;top:88%;width:14px;height:14px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2C8 8 4 12 4 16a8 8 0 0 0 16 0c0-4-4-8-8-14z' fill='%233ddc97'/%3E%3C/svg%3E");--dd:34s;--dl:-6s}
.dfx-sky u:nth-of-type(2){left:64%;top:94%;width:10px;height:10px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2C8 8 4 12 4 16a8 8 0 0 0 16 0c0-4-4-8-8-14z' fill='%238ff0c4'/%3E%3C/svg%3E");--dd:41s;--dl:-19s}
.dfx-sky u:nth-of-type(3){left:84%;top:80%;width:12px;height:12px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2C8 8 4 12 4 16a8 8 0 0 0 16 0c0-4-4-8-8-14z' fill='%23bfffe3'/%3E%3C/svg%3E");--dd:37s;--dl:-28s}
.dfx-sky u:nth-of-type(4){left:40%;top:96%;width:9px;height:9px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2C8 8 4 12 4 16a8 8 0 0 0 16 0c0-4-4-8-8-14z' fill='%237cf0ff'/%3E%3C/svg%3E");--dd:45s;--dl:-12s}
/* twinkling sparkles */
.dfx-sky b:nth-of-type(1){left:11%;top:24%;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0C13 8 16 11 24 12 16 13 13 16 12 24 11 16 8 13 0 12 8 11 11 8 12 0z' fill='%23bfffe3'/%3E%3C/svg%3E");--dd:7s;--dl:0s}
.dfx-sky b:nth-of-type(2){left:79%;top:16%;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0C13 8 16 11 24 12 16 13 13 16 12 24 11 16 8 13 0 12 8 11 11 8 12 0z' fill='%238ff0c4'/%3E%3C/svg%3E");--dd:9s;--dl:-1.8s}
.dfx-sky b:nth-of-type(3){left:61%;top:64%;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0C13 8 16 11 24 12 16 13 13 16 12 24 11 16 8 13 0 12 8 11 11 8 12 0z' fill='%23ffffff'/%3E%3C/svg%3E");--dd:8s;--dl:-3.4s}
.dfx-sky b:nth-of-type(4){left:27%;top:80%;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0C13 8 16 11 24 12 16 13 13 16 12 24 11 16 8 13 0 12 8 11 11 8 12 0z' fill='%233ddc97'/%3E%3C/svg%3E");--dd:11s;--dl:-5.1s}
.dfx-sky b:nth-of-type(5){left:91%;top:46%;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0C13 8 16 11 24 12 16 13 13 16 12 24 11 16 8 13 0 12 8 11 11 8 12 0z' fill='%23bfffe3'/%3E%3C/svg%3E");--dd:10s;--dl:-6.3s}
.dfx-sky b:nth-of-type(6){left:48%;top:12%;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0C13 8 16 11 24 12 16 13 13 16 12 24 11 16 8 13 0 12 8 11 11 8 12 0z' fill='%237cf0ff'/%3E%3C/svg%3E");--dd:9s;--dl:-2.6s}

/* ---------- click ripple ---------- */
html[data-theme-id=dark] .dfx-fx{display:block;position:fixed;inset:0;z-index:2147482980;overflow:hidden;contain:strict}
.dfx-fx i{pointer-events:none !important;position:absolute;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;opacity:0;transform:scale(.1);
 box-shadow:0 0 0 2px rgba(61,220,151,.7),0 0 14px 2px rgba(61,220,151,.4),inset 0 0 12px rgba(143,240,196,.45)}

/* ---------- cards: chase lights + holo + glint + hover glow ---------- */
html[data-theme-id=dark] .dfx-d{display:block;position:absolute;inset:0;z-index:0;overflow:hidden;border-radius:inherit}
.dfx-d b{position:absolute;display:block;opacity:0;height:2px;width:34%;border-radius:2px;will-change:transform}
.dfx-d b:nth-of-type(1){left:0;top:0;transform:translate3d(-110%,0,0);
 background:linear-gradient(90deg,transparent,#1d6b4b 25%,#3ddc97 55%,#bfffe3 80%,transparent);box-shadow:0 0 8px rgba(61,220,151,.8)}
.dfx-d b:nth-of-type(2){right:0;bottom:0;transform:translate3d(110%,0,0);
 background:linear-gradient(270deg,transparent,#8ff0c4 25%,#3ddc97 55%,#bfffe3 80%,transparent);box-shadow:0 0 8px rgba(61,220,151,.8)}
.dfx-d s{position:absolute;top:-20%;bottom:-20%;left:0;width:38%;display:block;opacity:0;transform:translate3d(-130%,0,0) skewX(-18deg);will-change:transform;
 background:linear-gradient(90deg,transparent,rgba(61,220,151,.05) 25%,rgba(124,240,255,.06) 42%,rgba(191,255,227,.09) 50%,rgba(61,220,151,.05) 75%,transparent);mix-blend-mode:screen}
.dfx-d em{position:absolute;top:5px;right:6px;width:10px;height:10px;display:block;opacity:0;background:no-repeat center/100% 100% url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0C13 8 16 11 24 12 16 13 13 16 12 24 11 16 8 13 0 12 8 11 11 8 12 0z' fill='%23bfffe3'/%3E%3C/svg%3E");filter:drop-shadow(0 0 3px #3ddc97)}
.dfx-d::after{content:"";position:absolute;inset:0;border-radius:inherit;opacity:0;transition:opacity .25s ease;
 box-shadow:inset 0 0 0 1px rgba(61,220,151,.65),inset 0 0 24px rgba(61,220,151,.12),inset 0 -10px 22px -14px rgba(124,240,255,.35)}
html[data-theme-id=dark] .dfx-rel:hover>.dfx-d::after{opacity:1}
html[data-theme-id=dark] .dfx-rel:hover>.dfx-d em{opacity:1}

/* ---------- section-title underline ---------- */
html[data-theme-id=dark] .dfx-ul{display:block;position:absolute;height:2px;border-radius:2px;opacity:.85;transform-origin:0 50%;
 background:linear-gradient(90deg,#3ddc97,#1d6b4b,#8ff0c4,#bfffe3,#3ddc97) 0 0/200% 100%;box-shadow:0 0 6px rgba(61,220,151,.5)}
html[data-theme-id=dark] #glD .dfx-ul{background-image:linear-gradient(90deg,#ff5c5c,#3ddc97,#ff8a8a,#ff5c5c)}

/* ---------- header shimmer ---------- */
html[data-theme-id=dark] .dfx-hs{display:block;position:absolute;inset:0;overflow:hidden;z-index:0}
.dfx-hs i{position:absolute;top:-20%;bottom:-20%;left:0;width:140px;display:block;opacity:0;transform:translate3d(-180px,0,0) skewX(-20deg);
 background:linear-gradient(90deg,transparent,rgba(61,220,151,.09) 30%,rgba(191,255,227,.14) 50%,rgba(124,240,255,.08) 70%,transparent)}

/* ---------- soft reveal ---------- */
html[data-theme-id=dark] .dfx-bl{display:block;position:absolute;inset:0;z-index:4;opacity:0;border-radius:inherit;
 background:linear-gradient(180deg,rgba(0,0,0,.96),rgba(0,0,0,.96)) no-repeat,linear-gradient(90deg,transparent,#3ddc97,#bfffe3,#7cf0ff,transparent) no-repeat;
 background-size:100% 100%,100% 2px;background-position:0 0,0 0}

/* ---------- buttons glow ---------- */
html:not(#_d1):not(#_d2):not(#_d3):not(#_d4):not(#_d5)[data-theme-id=dark] nav.tabs button:hover,html:not(#_d1):not(#_d2):not(#_d3):not(#_d4):not(#_d5)[data-theme-id=dark] .vh button:hover,html:not(#_d1):not(#_d2):not(#_d3):not(#_d4):not(#_d5)[data-theme-id=dark] .glass button:hover,html:not(#_d1):not(#_d2):not(#_d3):not(#_d4):not(#_d5)[data-theme-id=dark] header button:hover{filter:brightness(1.12) drop-shadow(0 0 5px rgba(61,220,151,.55))}

html[data-theme-id=dark] .dfx-cnt{font-variant-numeric:tabular-nums;text-shadow:0 0 8px rgba(61,220,151,.55)}

@media (prefers-reduced-motion:no-preference){
 html[data-theme-id=dark][data-dfx] .dfx-sky i{animation:dfxBok var(--dd,40s) ease-in-out infinite var(--dl,0s)}
 html[data-theme-id=dark][data-dfx] .dfx-sky u{animation:dfxLeaf var(--dd,36s) linear infinite var(--dl,0s)}
 html[data-theme-id=dark][data-dfx] .dfx-sky b{animation:dfxTw var(--dd,8s) ease-in-out infinite var(--dl,0s)}
 html[data-theme-id=dark][data-dfx] .dfx-fx i.go{animation:dfxRip .6s cubic-bezier(.2,.7,.3,1) both}
 html[data-theme-id=dark][data-dfx] .dfx-rel.dfx-in>.dfx-d b:nth-of-type(1){animation:dfxChase 7s cubic-bezier(.45,.05,.55,.95) infinite;animation-delay:var(--dq,0s)}
 html[data-theme-id=dark][data-dfx] .dfx-rel.dfx-in>.dfx-d b:nth-of-type(2){animation:dfxChaseR 7s cubic-bezier(.45,.05,.55,.95) infinite;animation-delay:calc(var(--dq,0s) - 3.5s)}
 html[data-theme-id=dark][data-dfx] .dfx-rel.dfx-in>.dfx-d s{animation:dfxHolo 11s ease-in-out infinite;animation-delay:var(--dh,0s)}
 html[data-theme-id=dark][data-dfx] .dfx-rel.dfx-in>.dfx-d em{animation:dfxGlint 6.5s ease-in-out infinite;animation-delay:var(--dq,0s)}
 html[data-theme-id=dark][data-dfx] .dfx-rel:hover>.dfx-d em{animation:dfxSpin 1.6s linear infinite}
 html[data-theme-id=dark][data-dfx] .dfx-ul{animation:dfxUl 6s linear infinite,dfxUlB 4.5s ease-in-out infinite}
 html[data-theme-id=dark][data-dfx] .dfx-hs i{animation:dfxShine 10s ease-in-out infinite 1.5s}
 html[data-theme-id=dark][data-dfx] .dfx-bl.go{animation:dfxRev .75s ease-out both}
 html:not(#_d1):not(#_d2):not(#_d3):not(#_d4):not(#_d5)[data-theme-id=dark][data-dfx] nav.tabs button:active,html:not(#_d1):not(#_d2):not(#_d3):not(#_d4):not(#_d5)[data-theme-id=dark][data-dfx] .vh button:active,html:not(#_d1):not(#_d2):not(#_d3):not(#_d4):not(#_d5)[data-theme-id=dark][data-dfx] .glass button:active,html:not(#_d1):not(#_d2):not(#_d3):not(#_d4):not(#_d5)[data-theme-id=dark][data-dfx] header button:active{transform:scale(.96);transition:transform .08s ease}
}
html.dfx-hid [class^=dfx-],html.dfx-hid [class^=dfx-] *,html.dfx-hid [class*=" dfx-"],html.dfx-hid [class*=" dfx-"] *,
html.bmz-hid [class^=dfx-],html.bmz-hid [class^=dfx-] *,html.bmz-hid [class*=" dfx-"],html.bmz-hid [class*=" dfx-"] *{animation-play-state:paused!important}

@media (max-width:600px),(pointer:coarse){
 .dfx-sky i:nth-of-type(n+7),.dfx-sky u:nth-of-type(n+3),.dfx-sky b:nth-of-type(n+4),.dfx-d.s s,.dfx-d em{display:none!important}
 html[data-theme-id=dark] .dfx-d b{width:46%}
}

@keyframes dfxBok{0%{opacity:0;transform:translate3d(0,40px,0) scale(.85)}20%{opacity:1}50%{opacity:.75;transform:translate3d(26px,-60px,0) scale(1.08)}80%{opacity:1}100%{opacity:0;transform:translate3d(-14px,-150px,0) scale(.9)}}
@keyframes dfxLeaf{0%{opacity:0;transform:translate3d(0,0,0) rotate(-8deg)}8%{opacity:.55}50%{transform:translate3d(18px,-45vh,0) rotate(8deg)}85%{opacity:.4}100%{opacity:0;transform:translate3d(-10px,-90vh,0) rotate(-6deg)}}
@keyframes dfxTw{0%,62%,100%{opacity:0;transform:scale(.3) rotate(0)}72%{opacity:.95;transform:scale(1) rotate(45deg)}84%{opacity:.4;transform:scale(.6) rotate(80deg)}}
@keyframes dfxRip{0%{opacity:.9;transform:scale(.1)}100%{opacity:0;transform:scale(1.4)}}
@keyframes dfxChase{0%{opacity:0;transform:translate3d(-110%,0,0)}3%{opacity:1}32%{opacity:1}36%{opacity:0;transform:translate3d(300%,0,0)}100%{opacity:0;transform:translate3d(300%,0,0)}}
@keyframes dfxChaseR{0%{opacity:0;transform:translate3d(110%,0,0)}3%{opacity:1}32%{opacity:1}36%{opacity:0;transform:translate3d(-300%,0,0)}100%{opacity:0;transform:translate3d(-300%,0,0)}}
@keyframes dfxHolo{0%{opacity:0;transform:translate3d(-130%,0,0) skewX(-18deg)}4%{opacity:1}26%{opacity:1}30%{opacity:0;transform:translate3d(330%,0,0) skewX(-18deg)}100%{opacity:0;transform:translate3d(330%,0,0) skewX(-18deg)}}
@keyframes dfxGlint{0%,70%,100%{opacity:0;transform:scale(.2) rotate(0)}80%{opacity:1;transform:scale(1) rotate(60deg)}90%{opacity:.3;transform:scale(.5) rotate(110deg)}}
@keyframes dfxSpin{from{transform:rotate(0)}to{transform:rotate(360deg)}}
@keyframes dfxUl{from{background-position:0 0}to{background-position:200% 0}}
@keyframes dfxUlB{0%,100%{opacity:.6;transform:scaleX(.55)}45%,70%{opacity:1;transform:scaleX(1)}}
@keyframes dfxShine{0%{opacity:0;transform:translate3d(-180px,0,0) skewX(-20deg)}3%{opacity:1}24%{opacity:1}27%{opacity:0;transform:translate3d(calc(100vw + 60px),0,0) skewX(-20deg)}100%{opacity:0;transform:translate3d(calc(100vw + 60px),0,0) skewX(-20deg)}}
@keyframes dfxRev{0%{opacity:1;background-position:0 0,0 0}70%{opacity:.35;background-position:0 0,0 100%}100%{opacity:0;background-position:0 0,0 100%}}
