/* Member site themes (users.theme). Loaded only when a signed-in member picked a theme.
   html[data-theme] = theme, html[data-anim=1] = animated, html[data-motion=off] = animations off. */
:root{--accent2:#c04bff;--accent-soft:#c4b8ff;--top-bg:rgba(11,13,18,.82);--bnav-bg:rgba(18,21,29,.92)}
html[data-theme=ocean]{--bg:#06121c;--s1:#0b1c2a;--s2:#11283a;--s3:#183550;--line:rgba(255,255,255,.09);--text:#e8f4fb;--muted:#8fa9bd;--accent:#22d3ee;--accent-rgb:34,211,238;--accent2:#3b82f6;--accent-soft:#a5f3fc;--top-bg:rgba(6,18,28,.85);--bnav-bg:rgba(11,28,42,.94);color-scheme:dark}
html[data-theme=emerald]{--bg:#06140f;--s1:#0b1f17;--s2:#112b21;--s3:#19392d;--line:rgba(255,255,255,.09);--text:#e9faf2;--muted:#8fb3a2;--accent:#34d399;--accent-rgb:52,211,153;--accent2:#a3e635;--accent-soft:#a7f3d0;--top-bg:rgba(6,20,15,.85);--bnav-bg:rgba(11,31,23,.94);color-scheme:dark}
html[data-theme=sunset]{--bg:#150b0d;--s1:#1f1114;--s2:#2b181c;--s3:#3a2227;--line:rgba(255,255,255,.09);--text:#fdeee8;--muted:#b9979a;--accent:#ff7a45;--accent-rgb:255,122,69;--accent2:#ff3d81;--accent-soft:#ffc2a8;--top-bg:rgba(21,11,13,.85);--bnav-bg:rgba(31,17,20,.94);color-scheme:dark}
html[data-theme=rose]{--bg:#14080f;--s1:#1e0d17;--s2:#2a1220;--s3:#3a182c;--line:rgba(255,255,255,.09);--text:#fdeaf4;--muted:#b793a7;--accent:#f43f9e;--accent-rgb:244,63,158;--accent2:#a855f7;--accent-soft:#fbb6dc;--top-bg:rgba(20,8,15,.85);--bnav-bg:rgba(30,13,23,.94);color-scheme:dark}
html[data-theme=aurora]{--bg:#070b16;--s1:#0e1527;--s2:#17213a;--s3:#222f50;--line:rgba(255,255,255,.12);--text:#eafcff;--muted:#9db4c8;--accent:#2dd4bf;--accent-rgb:45,212,191;--accent2:#8b5cf6;--accent-soft:#99f6e4;--top-bg:rgba(7,11,22,.7);--bnav-bg:rgba(14,21,39,.94);color-scheme:dark}
html[data-theme=neon]{--bg:#0a0614;--s1:#150a2a;--s2:#20103c;--s3:#301852;--line:rgba(255,43,214,.25);--text:#fdeaff;--muted:#b79ac9;--accent:#ff2bd6;--accent-rgb:255,43,214;--accent2:#00e5ff;--accent-soft:#ff9af0;--top-bg:rgba(10,6,20,.75);--bnav-bg:rgba(21,10,42,.94);color-scheme:dark}
html[data-theme=rainbow]{--bg:#0b0d14;--s1:#121624;--s2:#1b2032;--s3:#272e48;--line:rgba(255,255,255,.12);--text:#f4f6fb;--muted:#a0a8bd;--accent:#ff4f9a;--accent-rgb:255,79,154;--accent2:#7c5cff;--accent-soft:#ffb3d3;--top-bg:rgba(11,13,20,.75);--bnav-bg:rgba(18,22,36,.94);color-scheme:dark}
html[data-theme=lava]{--bg:#12080a;--s1:#1d0e10;--s2:#2b1517;--s3:#3d1f21;--line:rgba(255,140,60,.2);--text:#fff0e6;--muted:#c49a8c;--accent:#ff5a1f;--accent-rgb:255,90,31;--accent2:#ffb703;--accent-soft:#ffc9a3;--top-bg:rgba(18,8,10,.75);--bnav-bg:rgba(29,14,16,.94);color-scheme:dark}
html[data-theme=matrix]{--bg:#020a04;--s1:#04120a;--s2:#071c0e;--s3:#0b2b15;--line:rgba(0,255,102,.22);--text:#d6ffe3;--muted:#6fb88a;--accent:#00ff66;--accent-rgb:0,255,102;--accent2:#00c853;--accent-soft:#9dffc0;--top-bg:rgba(2,10,4,.78);--bnav-bg:rgba(4,18,10,.94);color-scheme:dark}
html[data-theme=sakura]{--bg:#16090f;--s1:#220e18;--s2:#321622;--s3:#4a2032;--line:rgba(255,160,200,.2);--text:#fff0f6;--muted:#c9a0b2;--accent:#ff7eb6;--accent-rgb:255,126,182;--accent2:#ffc2a1;--accent-soft:#ffc4dd;--top-bg:rgba(22,9,15,.75);--bnav-bg:rgba(34,14,24,.94);color-scheme:dark}
html[data-theme=galaxy]{--bg:#05030f;--s1:#0c081e;--s2:#170f36;--s3:#261a54;--line:rgba(170,140,255,.2);--text:#f1ecff;--muted:#a79cc9;--accent:#9b6bff;--accent-rgb:155,107,255;--accent2:#3dd6ff;--accent-soft:#d3c2ff;--top-bg:rgba(5,3,15,.75);--bnav-bg:rgba(12,8,30,.94);color-scheme:dark}

html[data-theme] .hdr{background:var(--top-bg)}
html[data-theme] .bnav{background:var(--bnav-bg)}
html[data-theme] .btn-pri{background:linear-gradient(135deg,var(--accent),var(--accent2));border-color:transparent}
html[data-theme] ::selection{background:rgba(var(--accent-rgb),.45)}
html[data-theme] .hdr::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:linear-gradient(90deg,transparent,var(--accent),var(--accent2),transparent);opacity:.8;pointer-events:none}
html[data-theme] .card{transition:filter .25s,transform .25s}
html[data-theme] .card:hover{filter:drop-shadow(0 8px 18px rgba(var(--accent-rgb),.45))}

/* ---- animated artwork behind the page ---- */
html[data-anim="1"] body::before{content:"";position:fixed;inset:-25%;z-index:-1;pointer-events:none;will-change:transform}
html[data-theme=aurora] body::before{background:
 radial-gradient(35% 40% at 25% 30%,rgba(45,212,191,.5) 0,transparent 70%),
 radial-gradient(40% 45% at 75% 25%,rgba(139,92,246,.5) 0,transparent 70%),
 radial-gradient(45% 40% at 60% 80%,rgba(236,72,153,.4) 0,transparent 70%),
 radial-gradient(30% 35% at 15% 85%,rgba(34,197,94,.35) 0,transparent 70%)}
html[data-theme=neon] body::before{inset:0;background:
 linear-gradient(rgba(255,43,214,.14) 1px,transparent 1px) 0 0/48px 48px,
 linear-gradient(90deg,rgba(0,229,255,.11) 1px,transparent 1px) 0 0/48px 48px,
 radial-gradient(60% 50% at 85% 0,rgba(255,43,214,.26),transparent 70%),
 radial-gradient(55% 50% at 0 100%,rgba(0,229,255,.22),transparent 70%)}
html[data-theme=rainbow] body::before{inset:0;opacity:.2;background:linear-gradient(120deg,#ff3d81,#ff9d2d,#ffe14d,#3ddc97,#2dc9ff,#7c5cff,#ff3d81);background-size:300% 300%}
html[data-theme=lava] body::before{inset:0;opacity:.3;background:
 radial-gradient(45% 50% at 20% 90%,rgba(255,45,85,.9),transparent 70%),
 radial-gradient(40% 45% at 80% 80%,rgba(255,183,3,.7),transparent 70%),
 linear-gradient(135deg,#2a0a0c,#ff5a1f 45%,#2a0a0c 70%,#c1121f);background-size:100% 100%,100% 100%,300% 300%}
html[data-theme=matrix] body{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
html[data-theme=matrix] body::before{inset:0;opacity:.5;background:repeating-linear-gradient(90deg,transparent 0 28px,rgba(0,255,102,.5) 28px 29px)}
html[data-theme=matrix] body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.35;background:repeating-linear-gradient(90deg,transparent 0 46px,rgba(0,255,102,.55) 46px 47px)}
html[data-theme=sakura] body::before{inset:0;background:
 radial-gradient(ellipse 7px 4px at 30% 40%,rgba(255,190,215,.95) 0 55%,transparent 62%) 0 0/211px 287px,
 radial-gradient(ellipse 6px 3px at 72% 78%,rgba(255,160,200,.85) 0 55%,transparent 62%) 0 0/211px 287px,
 radial-gradient(ellipse 9px 5px at 20% 70%,rgba(255,205,225,.9) 0 55%,transparent 62%) 0 0/263px 331px,
 radial-gradient(ellipse 7px 4px at 80% 25%,rgba(255,170,205,.8) 0 55%,transparent 62%) 0 0/263px 331px,
 radial-gradient(ellipse 5px 3px at 45% 20%,rgba(255,215,230,.8) 0 55%,transparent 62%) 0 0/317px 397px,
 radial-gradient(ellipse 8px 4px at 60% 85%,rgba(255,150,190,.75) 0 55%,transparent 62%) 0 0/317px 397px,
 radial-gradient(50% 45% at 85% 5%,rgba(255,126,182,.22),transparent 70%),
 radial-gradient(45% 45% at 5% 95%,rgba(255,194,161,.16),transparent 70%)}
html[data-theme=galaxy] body::before{inset:0;background:
 radial-gradient(1.2px 1.2px at 12% 18%,#fff 0 60%,transparent 100%) 0 0/230px 210px,
 radial-gradient(1px 1px at 63% 44%,#cfe6ff 0 60%,transparent 100%) 0 0/190px 260px,
 radial-gradient(1.6px 1.6px at 80% 72%,#fff 0 60%,transparent 100%) 0 0/310px 280px,
 radial-gradient(1px 1px at 35% 85%,#ffd9f5 0 60%,transparent 100%) 0 0/170px 150px,
 radial-gradient(55% 50% at 20% 15%,rgba(120,70,255,.36),transparent 70%),
 radial-gradient(50% 55% at 85% 85%,rgba(61,214,255,.24),transparent 70%),
 radial-gradient(40% 40% at 70% 20%,rgba(255,107,214,.18),transparent 70%)}
html[data-theme=galaxy] body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:
 radial-gradient(1.6px 1.6px at 25% 60%,#fff 0 60%,transparent 100%) 0 0/260px 240px,
 radial-gradient(1.4px 1.4px at 75% 15%,#fff 0 60%,transparent 100%) 0 0/340px 300px,
 radial-gradient(1.2px 1.2px at 50% 90%,#bde0ff 0 60%,transparent 100%) 0 0/220px 200px}
html[data-theme=neon] :is(.hdr,.bnav){border-color:rgba(255,43,214,.35)}
html[data-theme=matrix] :is(.hdr,.bnav){border-color:rgba(0,255,102,.3)}
html[data-theme=matrix] .btn-pri{color:#021a0a;background:linear-gradient(135deg,#00ff66,#00c853)}
html[data-theme=lava] .btn-pri{background:linear-gradient(135deg,#ff2d55,#ff5a1f,#ffb703)}
html[data-theme=rainbow] .hdr::after{height:2px;opacity:1;background:linear-gradient(90deg,#ff3d81,#ff9d2d,#ffe14d,#3ddc97,#2dc9ff,#7c5cff,#ff3d81);background-size:600px 100%;background-repeat:repeat-x}
html[data-theme=rainbow] .btn-pri{background-image:linear-gradient(120deg,#ff3d81,#ff9d2d,#ffe14d,#3ddc97,#2dc9ff,#7c5cff,#ff3d81);background-size:600px 100%;background-repeat:repeat-x;background-color:transparent}

/* ---- motion (only when animations are ON) ---- */
@keyframes th-aurora{0%{transform:rotate(0) scale(1)}50%{transform:rotate(180deg) scale(1.18)}100%{transform:rotate(360deg) scale(1)}}
@keyframes th-grid{to{background-position:0 48px,48px 0,0 0,0 0}}
@keyframes th-flow{0%{background-position:0% 50%}100%{background-position:100% 50%}}
@keyframes th-flowx{to{background-position:600px 0}}
@keyframes th-lava{0%{background-position:0 0,0 0,0% 50%;transform:scale(1)}50%{transform:scale(1.08)}100%{background-position:0 0,0 0,100% 50%;transform:scale(1)}}
@keyframes th-rain{to{-webkit-mask-position:0 320px;mask-position:0 320px}}
@keyframes th-rain2{to{-webkit-mask-position:0 480px;mask-position:0 480px}}
@keyframes th-petals{to{background-position:-211px 287px,-211px 287px,-263px 331px,-263px 331px,-317px 397px,-317px 397px,0 0,0 0}}
@keyframes th-stars{to{background-position:230px 210px,190px 260px,310px 280px,170px 150px,0 0,0 0,0 0}}
@keyframes th-twinkle{from{opacity:.25}to{opacity:1}}
@keyframes th-glow{0%,100%{box-shadow:0 6px 20px -6px rgba(var(--accent-rgb),.5)}50%{box-shadow:0 6px 30px 0 rgba(var(--accent-rgb),.9)}}
html[data-theme=aurora]:not([data-motion="off"]) body::before{animation:th-aurora 45s linear infinite}
html[data-theme=neon]:not([data-motion="off"]) body::before{animation:th-grid 3.5s linear infinite}
html[data-theme=rainbow]:not([data-motion="off"]) body::before{animation:th-flow 16s ease-in-out infinite alternate}
html[data-theme=rainbow]:not([data-motion="off"]) :is(.hdr::after,.btn-pri){animation:th-flowx 6s linear infinite}
html[data-theme=lava]:not([data-motion="off"]) body::before{animation:th-lava 18s ease-in-out infinite}
html[data-theme=matrix]:not([data-motion="off"]) body::before{-webkit-mask:linear-gradient(180deg,transparent,#000 55%,transparent) 0 0/100% 320px repeat-y;mask:linear-gradient(180deg,transparent,#000 55%,transparent) 0 0/100% 320px repeat-y;animation:th-rain 4.5s linear infinite}
html[data-theme=matrix]:not([data-motion="off"]) body::after{-webkit-mask:linear-gradient(180deg,transparent,#000 60%,transparent) 0 0/100% 480px repeat-y;mask:linear-gradient(180deg,transparent,#000 60%,transparent) 0 0/100% 480px repeat-y;animation:th-rain2 7s linear infinite}
html[data-theme=sakura]:not([data-motion="off"]) body::before{animation:th-petals 22s linear infinite}
html[data-theme=galaxy]:not([data-motion="off"]) body::before{animation:th-stars 120s linear infinite}
html[data-theme=galaxy]:not([data-motion="off"]) body::after{animation:th-twinkle 3.6s ease-in-out infinite alternate}
html[data-anim="1"]:not([data-motion="off"]) .btn-pri:not(:hover){animation-name:th-glow;animation-duration:3.4s;animation-iteration-count:infinite;animation-timing-function:ease-in-out}
html[data-theme=rainbow]:not([data-motion="off"]) .btn-pri{animation:th-flowx 6s linear infinite,th-glow 3.4s ease-in-out infinite}

/* ---- public theme picker (header button) ---- */
#site-thm[aria-expanded=true]{background:rgba(var(--accent-rgb),.2);color:var(--accent-soft)}
.tp-pop{position:fixed;top:calc(var(--hdr,60px) + 6px);right:10px;width:min(380px,calc(100vw - 20px));max-height:calc(100vh - var(--hdr,60px) - 90px);overflow:auto;background:var(--s1);border:1px solid var(--line);border-radius:18px;padding:14px;z-index:96;box-shadow:0 26px 60px -14px rgba(0,0,0,.7)}
.tp-h{font-weight:700;font-size:15px;margin:2px 4px 2px}.tp-sub{color:var(--muted);font-size:12.5px;margin:0 4px 4px}
.tp-g{font-size:11.5px;text-transform:uppercase;letter-spacing:.09em;color:var(--muted);font-weight:700;margin:14px 4px 8px}
.tp-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.tp-o{position:relative;display:grid;gap:7px;text-align:left;padding:8px;border-radius:14px;background:var(--s2);border:1px solid var(--line);color:var(--text);transition:transform .15s,border-color .15s}
.tp-o:hover{border-color:rgba(var(--accent-rgb),.65);transform:translateY(-1px)}
.tp-o.on{border-color:var(--accent);box-shadow:0 0 0 2px rgba(var(--accent-rgb),.38)}
.tp-o.on::after{content:"\2713";position:absolute;top:12px;right:12px;width:20px;height:20px;border-radius:50%;background:#fff;color:#111;font-size:12px;font-weight:800;display:grid;place-items:center}
.tp-sw{display:block;height:46px;border-radius:10px;border:1px solid rgba(255,255,255,.12)}
.tp-o.a .tp-sw{background-size:300% 300%;animation:th-flow 5s ease-in-out infinite alternate}
html[data-motion=off] .tp-o.a .tp-sw{animation:none}
.tp-o b{font-size:13px;font-weight:600;line-height:1.25}
.tp-mo{margin:14px 4px 0;padding-top:12px;border-top:1px solid var(--line);display:flex;align-items:center;gap:10px;cursor:pointer}
.tp-mo input{width:18px;height:18px;accent-color:var(--accent)}
.tp-note{margin:8px 4px 0;font-size:12.5px;color:var(--muted);min-height:18px}.tp-note a{color:var(--accent-soft);text-decoration:underline}
@media(prefers-reduced-motion:reduce){.tp-o.a .tp-sw{animation:none}}
