@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700;0,9..40,800;1,9..40,400&family=Playfair+Display:wght@700;800;900&display=swap');

:root{--bg-base:#070807;--bg-primary:#0c0d0c;--bg-card:#121312;--bg-elevated:#171917;--bg-input:#141614;--bg-hover:#1a1c1a;--bg-glass:rgba(12,13,12,0.82);--border:rgba(255,255,255,0.06);--border-light:rgba(255,255,255,0.10);--border-accent:rgba(74,222,128,0.2);--text-primary:#eaeee9;--text-secondary:#8a9187;--text-muted:#a8b0a4;--text-deemphasized:#545a52;--text-inverse:#0a0b0a;--green:#4ade80;--green-dark:#22c55e;--green-deep:#16a34a;--green-glow:rgba(74,222,128,0.12);--green-subtle:rgba(74,222,128,0.06);--red:#f87171;--red-subtle:rgba(248,113,113,0.08);--orange:#fbbf24;--blue:#60a5fa;--purple:#bf5af2;--purple-glow:rgba(191,90,242,0.15);--purple-subtle:rgba(191,90,242,0.08);--indica:#a78bfa;--sativa:#fbbf24;--hybrid:#4ade80;--radius:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:24px;--radius-full:9999px;--shadow-sm:0 1px 2px rgba(0,0,0,0.3);--shadow:0 4px 16px rgba(0,0,0,0.4);--shadow-lg:0 12px 48px rgba(0,0,0,0.5);--shadow-glow:0 0 30px rgba(74,222,128,0.1);--font-body:'DM Sans',sans-serif;--font-display:'Playfair Display',serif;--nav-h:60px;--max-w:1200px;--ease:cubic-bezier(0.4,0,0.2,1);--ease-spring:cubic-bezier(0.34,1.56,0.64,1);--tabbar-h:60px;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px);--safe-right:env(safe-area-inset-right,0px)}

[data-theme="light"]{color-scheme:light;--bg-base:#f6f7f4;--bg-primary:#eef0eb;--bg-card:#fff;--bg-elevated:#fff;--bg-input:#f0f2ed;--bg-hover:#e6e9e2;--bg-glass:rgba(255,255,255,0.88);--border:rgba(0,0,0,0.07);--border-light:rgba(0,0,0,0.12);--border-accent:rgba(22,163,74,0.2);--text-primary:#1a1e19;--text-secondary:#5a6156;--text-muted:#6b7468;--text-deemphasized:#9aa496;--green-glow:rgba(34,197,94,0.08);--green-subtle:rgba(34,197,94,0.04);--shadow-sm:0 1px 2px rgba(0,0,0,0.06);--shadow:0 4px 16px rgba(0,0,0,0.08);--shadow-lg:0 12px 48px rgba(0,0,0,0.12)}

/* Q-Pass B14: WCAG 2.4.1 Skip-Link */
.skip-link{position:absolute;top:-40px;left:8px;z-index:9999;background:var(--green);color:#000;padding:10px 16px;border-radius:6px;font-weight:600;text-decoration:none;transition:top .15s var(--ease)}
.skip-link:focus{top:8px;outline:2px solid var(--green);outline-offset:2px}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:var(--border) transparent;color-scheme:dark;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{font-family:var(--font-body);background:var(--bg-base);color:var(--text-primary);line-height:1.6;min-height:100vh;min-height:100dvh;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:var(--text-secondary);text-decoration:none;transition:color .3s var(--ease), text-shadow .3s var(--ease)}a:hover{color:var(--purple);text-shadow:0 0 12px var(--purple-glow)}a:active,a.active{color:var(--green);text-shadow:0 0 8px var(--green-glow)}
img{max-width:100%;height:auto;display:block}
::selection{background:var(--green);color:var(--text-inverse)}
::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border-light);border-radius:3px}

.container{max-width:var(--max-w);margin:0 auto;padding:0 20px}
.page-content{padding-top:calc(var(--nav-h) + 28px);padding-bottom:60px;min-height:calc(100vh - var(--nav-h));animation:pageIn .4s var(--ease)}
@keyframes pageIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ============================================================================
   MOBILE FOUNDATION · Welle M · Block M0 (2026-06-02)
   Breakpoint-Standard für ALLE Mobile-Arbeiten:
     ≤480px  Phone   ·   ≤768px  großes Phone/Tablet   ·   ≥1024px  Desktop
   Bestehende Krumm-Breakpoints (360/420/560/600/640/700/720/860) werden
   schrittweise hierauf migriert. Dieser Block ist rein additiv — er entfernt
   nichts, sondern macht das Grundverhalten App-tauglich. App-Feeling Layer 1.
   ========================================================================== */
/* Tap-Highlight weg, Tap-Delay (300ms) weg — fühlt sich sofort nativer an */
a,button,[role="button"],.btn,input,select,textarea,label,.nav-link,.nav-dd-item{-webkit-tap-highlight-color:transparent}
a,button,[role="button"],.btn{touch-action:manipulation}
/* Globaler Reduced-Motion-Respekt (a11y + verhindert Motion-Sickness) */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
@media(max-width:768px){
  /* iOS zoomt bei Fokus auf Felder <16px — global verhindern */
  input,select,textarea{font-size:16px}
  /* Touch-Targets: komfortable Mindesthöhe für primäre Interaktion */
  .btn{min-height:44px}
  /* Kein Gummiband-Overscroll der ganzen Seite */
  body{overscroll-behavior-y:contain}
  /* Container-Gutter an Phone angepasst (von 20px) + Safe-Area links/rechts */
  .container{padding-left:max(16px,var(--safe-left));padding-right:max(16px,var(--safe-right))}
}
@media(max-width:480px){
  .container{padding-left:max(14px,var(--safe-left));padding-right:max(14px,var(--safe-right))}
}

/* Navbar */
.navbar{position:fixed;top:0;left:0;right:0;z-index:1000;height:var(--nav-h);background:var(--bg-glass);backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);border-bottom:1px solid var(--border);display:flex;align-items:center}
.nav-inner{display:flex;align-items:center;justify-content:space-between;width:100%;max-width:var(--max-w);margin:0 auto;padding:0 20px;gap:8px}
.nav-brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:20px;letter-spacing:-0.3px;color:var(--text-primary);text-decoration:none}
.nav-brand span{background:linear-gradient(135deg,var(--green),var(--green-deep));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.brand-icon{font-size:22px;-webkit-text-fill-color:initial;filter:drop-shadow(0 0 8px rgba(74,222,128,0.3))}
.brand-text{display:inline-flex;perspective:600px}
.bl{display:inline-block;opacity:0;transform:translateY(-12px);animation:brandLetterIn .4s cubic-bezier(.175,.885,.32,1.275) forwards;animation-delay:calc(var(--i) * .06s + .1s)}
.brand-d{animation:brandD .7s cubic-bezier(.175,.885,.32,1.275) forwards;animation-delay:.2s}
.brand-b{transform-origin:left center;animation:brandB .45s cubic-bezier(.25,.1,.25,1) forwards;animation-delay:.48s}
.brand-b~.bl{animation-delay:calc(var(--i) * .06s + .62s)}
@keyframes brandLetterIn{0%{opacity:0;transform:translateY(-12px) scale(.7)}60%{opacity:1;transform:translateY(2px) scale(1.04)}100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes brandD{0%{opacity:0;transform:translateY(-12px) scale(.7)}35%{opacity:1;transform:translateY(2px) scale(1.04)}48%{transform:scale(1)}58%{transform:scale(1.04);text-shadow:0 0 12px rgba(74,222,128,0.6)}72%{transform:scale(1);text-shadow:0 0 3px rgba(74,222,128,0.1)}100%{opacity:1;transform:scale(1);text-shadow:none}}
@keyframes brandB{0%{opacity:0;transform:rotateY(-180deg)}8%{opacity:1;transform:rotateY(-165deg)}35%{transform:rotateY(-70deg)}65%{transform:rotateY(-15deg)}85%{transform:rotateY(3deg)}100%{opacity:1;transform:rotateY(0deg)}}
/* Brand animation: skip after first load */
.nav-brand.no-anim .bl,.nav-brand.no-anim .brand-d,.nav-brand.no-anim .brand-b{opacity:1;transform:none;animation:none}
.nav-links{display:flex;align-items:center;gap:2px}
.nav-link{display:flex;align-items:center;gap:6px;padding:7px 13px;border-radius:var(--radius);color:var(--text-secondary);font-weight:500;font-size:13.5px;transition:all .2s var(--ease);position:relative}
.nav-link:hover{color:var(--purple);background:var(--purple-subtle);text-shadow:0 0 10px var(--purple-glow)}
.nav-link.active{color:var(--green);background:var(--green-subtle)}
.badge-count{position:absolute;top:1px;right:1px;background:var(--red);color:#fff;font-size:9px;min-width:15px;height:15px;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;font-weight:700;border:2px solid var(--bg-base);animation:badgePop .3s var(--ease-spring)}
@keyframes badgePop{from{transform:scale(0)}to{transform:scale(1)}}
.nav-user{display:flex;align-items:center;gap:8px;text-decoration:none}
.nav-avatar{width:32px;height:32px;border-radius:var(--radius-full);object-fit:cover;border:2px solid var(--border-accent);transition:border-color .2s}
.nav-user:hover .nav-avatar{border-color:var(--green)}
.nav-xp{font-size:11px;color:var(--green);font-weight:700;letter-spacing:.5px}
/* Profile dropdown */
.nav-profile-wrap{position:relative}
.nav-profile-wrap .nav-user{border:none;background:none;cursor:pointer;padding:0}
.nav-profile-dropdown{display:none;position:absolute;top:calc(100% + 8px);right:0;background:var(--bg-solid,#1a1a1a);border:1px solid var(--border);border-radius:12px;min-width:200px;padding:6px;box-shadow:0 8px 32px rgba(0,0,0,.6);z-index:1000;animation:dropdownSlide .15s ease}
[data-theme="light"] .nav-profile-dropdown{background:#fff;box-shadow:0 8px 32px rgba(0,0,0,.15)}
@keyframes dropdownSlide{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.nav-profile-wrap.open .nav-profile-dropdown{display:block}
.nav-profile-dropdown a{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:8px;font-size:13px;color:var(--text);text-decoration:none;transition:background .15s}
.nav-profile-dropdown a:hover{background:var(--bg-hover)}
.nav-profile-dropdown a svg{color:var(--text-muted);flex-shrink:0}
.nav-actions{display:flex;align-items:center;gap:6px}
.nav-upload-btn{display:flex;align-items:center;gap:6px;padding:7px 16px;border-radius:var(--radius-full);background:var(--green);color:var(--text-inverse);font-weight:700;font-size:13px;transition:all .25s var(--ease);box-shadow:0 0 16px rgba(74,222,128,0.15);text-decoration:none}
.nav-upload-btn:hover{background:var(--green-dark);color:var(--text-inverse);transform:translateY(-1px);box-shadow:0 4px 20px rgba(74,222,128,0.25)}
/* === POST DROPDOWN (Plus-Icon 3er-Grid) === */
/* Button: radiales Neon-Gradient von Mitte nach außen + Puls-Glow */
.nav-upload-btn.nav-post-trigger{background:radial-gradient(circle at center,rgba(74,222,128,.6) 0%,rgba(74,222,128,.22) 55%,rgba(8,14,8,.75) 100%);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(74,222,128,.35)!important;box-shadow:0 0 10px rgba(74,222,128,.28);animation:post-btn-glow 2.8s ease-in-out infinite;color:#d1fae5}
.nav-upload-btn.nav-post-trigger:hover{background:radial-gradient(circle at center,rgba(74,222,128,.75) 0%,rgba(74,222,128,.35) 55%,rgba(8,14,8,.6) 100%);animation:none;box-shadow:0 0 20px rgba(74,222,128,.5);border-color:rgba(74,222,128,.6)!important}
@keyframes post-btn-glow{0%,100%{box-shadow:0 0 8px rgba(74,222,128,.25),0 0 0 0 rgba(74,222,128,.2)}50%{box-shadow:0 0 16px rgba(74,222,128,.45),0 0 0 4px rgba(74,222,128,0)}}
/* Dropdown — komplett eigenständig, KEIN nav-dropdown-wrap, KEIN :hover, nur .open-Toggle */
.nav-post-wrap{position:relative}
.nav-post-menu{display:none;position:absolute;top:calc(100% + 6px);right:0;left:auto;transform:none;width:276px;padding:10px;border:none;border-radius:12px;outline:none;box-sizing:border-box;box-shadow:0 16px 48px rgba(0,0,0,.75),0 0 0 1px rgba(74,222,128,.08),0 0 24px rgba(74,222,128,.05);background:linear-gradient(180deg,rgba(74,222,128,.05),transparent 50%) var(--bg-solid,#111411);z-index:1001;animation:dropdownSlide .15s ease}
.nav-post-wrap.open .nav-post-menu{display:block}
.nav-post-header{font-size:10px;font-weight:700;letter-spacing:1.8px;text-transform:uppercase;color:var(--text-muted);padding:0 2px 8px;border-bottom:1px solid rgba(255,255,255,.05);margin-bottom:8px}
/* Grid: 3 × 1fr in 256px innerer Breite (276-20) = (256-12)/3 = 81px/Kachel */
.nav-post-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;width:100%}
/* Kacheln: feste Höhe für gleichmäßiges Alignment */
.nav-post-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:10px 4px;height:92px;border-radius:10px;text-decoration:none;color:var(--text-primary);background:rgba(255,255,255,.04);transition:all .18s ease;border:1px solid transparent;text-align:center;min-width:0;overflow:hidden;box-sizing:border-box}
.nav-post-card:hover{background:rgba(74,222,128,.09);border-color:rgba(74,222,128,.2);color:var(--text-primary);transform:translateY(-2px)}
.nav-post-icon{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:11px;transition:all .18s ease;flex-shrink:0}
.nav-post-icon--grow{background:rgba(74,222,128,.15);color:#4ade80}
.nav-post-icon--tree{background:rgba(5,150,105,.15);color:#059669}
.nav-post-icon--cache{background:rgba(245,158,11,.15);color:#f59e0b}
.nav-post-card:hover .nav-post-icon--grow{background:rgba(74,222,128,.25);filter:drop-shadow(0 0 6px rgba(74,222,128,.5))}
.nav-post-card:hover .nav-post-icon--tree{background:rgba(5,150,105,.25);filter:drop-shadow(0 0 6px rgba(5,150,105,.5))}
.nav-post-card:hover .nav-post-icon--cache{background:rgba(245,158,11,.25);filter:drop-shadow(0 0 6px rgba(245,158,11,.5))}
.nav-post-icon--strain{background:rgba(191,90,242,.15);color:#bf5af2}
.nav-post-card:hover .nav-post-icon--strain{background:rgba(191,90,242,.25);filter:drop-shadow(0 0 6px rgba(191,90,242,.5))}
.nav-post-label{font-size:11px;font-weight:700;line-height:1.2;white-space:nowrap}
.nav-post-hint{font-size:10px;color:var(--text-muted);line-height:1.2;white-space:nowrap}
.mobile-menu-btn{display:none;background:none;border:none;color:var(--text-primary);font-size:22px;cursor:pointer;padding:6px}
.nav-mobile-langswitch{display:none} /* nur im Hamburger auf Mobile sichtbar — Block M2 */

/* === NAV DROPDOWNS === */
.nav-dropdown-wrap{position:relative}
.nav-dd-trigger{cursor:pointer;border:none;background:none;font-family:inherit}
.nav-dd-trigger svg:last-child{opacity:.5;transition:transform .2s;margin-left:-2px}
.nav-dropdown-wrap:hover .nav-dd-trigger svg:last-child,.nav-dropdown-wrap.open .nav-dd-trigger svg:last-child{transform:rotate(180deg);opacity:1}
.nav-dd-menu{display:none;position:absolute;top:calc(100% + 6px);left:50%;transform:translateX(-50%);background:var(--bg-solid,#1a1a1a);border:1px solid var(--border);border-radius:12px;min-width:200px;padding:6px;box-shadow:0 12px 40px rgba(0,0,0,.5);z-index:1001;animation:dropdownSlide .15s ease}
.nav-dd-menu::before{content:'';position:absolute;top:-10px;left:0;right:0;height:10px}
[data-theme="light"] .nav-dd-menu{background:#fff;box-shadow:0 12px 40px rgba(0,0,0,.12)}
.nav-dropdown-wrap:hover .nav-dd-menu,.nav-dropdown-wrap.open .nav-dd-menu{display:block}
.nav-dropdown-wrap.force-closed .nav-dd-menu{display:none!important}
.nav-dd-item{display:flex;align-items:center;gap:10px;padding:9px 14px;border-radius:8px;font-size:13px;color:var(--text);text-decoration:none;transition:background .15s;white-space:nowrap}
.nav-dd-item:hover{background:var(--bg-hover);color:var(--text)}
.nav-dd-item.active{color:var(--green)}
.nav-dd-item svg{color:var(--text-muted);flex-shrink:0}
.nav-dd-item.active svg{color:inherit}
.nav-dd-hint{margin-left:auto;font-size:11px;color:var(--text-muted);font-weight:400}
.nav-dd-divider{height:1px;background:var(--border);margin:4px 8px}

/* === MEGA DROPDOWN (shared) === */
.nav-mega-menu{min-width:260px!important;padding:8px 6px!important}
.nav-mega-header{font-size:12px;font-weight:800;letter-spacing:2.5px;padding:8px 14px 6px;display:flex;align-items:center;gap:8px;border-bottom:1px solid rgba(255,255,255,.06);margin-bottom:4px}
.nav-mega-menu .nav-dd-item{transition:all .2s ease}
.nav-mega-menu .nav-dd-item:hover{padding-left:18px}
.nav-mega-menu .nav-dd-item:hover svg{color:var(--green)!important}

/* Grow */
.nav-grow-trigger{font-weight:700!important;transition:all .25s ease!important}
.nav-grow-trigger.active,.nav-grow-trigger:hover{color:var(--green)!important;background:rgba(74,222,128,.08)!important;text-shadow:0 0 12px rgba(74,222,128,.3)!important;box-shadow:0 0 14px rgba(74,222,128,.1),inset 0 0 10px rgba(74,222,128,.04)!important;border-radius:8px!important}
.nav-grow-wrap:hover .nav-dd-trigger{color:var(--green)!important;text-shadow:0 0 12px rgba(74,222,128,.3)!important}
.nav-grow-wrap:hover .nav-dd-trigger svg,.nav-grow-trigger.active svg{color:var(--green)!important;filter:drop-shadow(0 0 5px rgba(74,222,128,.5))!important}
.nav-grow-menu{border-color:rgba(74,222,128,.15)!important;box-shadow:0 16px 48px rgba(0,0,0,.6),0 0 30px rgba(74,222,128,.06)!important;background:linear-gradient(180deg,rgba(74,222,128,.03),transparent 40%)var(--bg-solid,#1a1a1a)!important}
.nav-grow-menu .nav-mega-header{color:var(--green);text-shadow:0 0 16px rgba(74,222,128,.5);border-bottom-color:rgba(74,222,128,.1)}
.nav-grow-menu .nav-mega-header svg{color:var(--green)!important;filter:drop-shadow(0 0 6px rgba(74,222,128,.6))}
.nav-grow-menu .nav-dd-item:hover{background:rgba(74,222,128,.08);color:var(--green);text-shadow:0 0 10px rgba(74,222,128,.4)}
.nav-grow-menu .nav-dd-item:hover svg{color:var(--green)!important}
.nav-grow-menu .nav-dd-item.active{color:var(--green);text-shadow:0 0 8px rgba(74,222,128,.3)}.nav-grow-menu .nav-dd-item.active svg{color:var(--green)}
.nav-grow-menu .nav-dd-item:hover .nav-dd-hint{color:rgba(74,222,128,.6)}

/* Community */
.nav-community-trigger{font-weight:700!important;transition:all .25s ease!important}
.nav-community-trigger.active,.nav-community-trigger:hover{color:#60a5fa!important;background:rgba(96,165,250,.08)!important;text-shadow:0 0 12px rgba(96,165,250,.3)!important;box-shadow:0 0 14px rgba(96,165,250,.1),inset 0 0 10px rgba(96,165,250,.04)!important;border-radius:8px!important}
.nav-community-wrap:hover .nav-dd-trigger{color:#60a5fa!important;text-shadow:0 0 12px rgba(96,165,250,.3)!important}
.nav-community-wrap:hover .nav-dd-trigger svg,.nav-community-trigger.active svg{color:#60a5fa!important;filter:drop-shadow(0 0 5px rgba(96,165,250,.5))!important}
.nav-community-menu{border-color:rgba(96,165,250,.15)!important;box-shadow:0 16px 48px rgba(0,0,0,.6),0 0 30px rgba(96,165,250,.06)!important;background:linear-gradient(180deg,rgba(96,165,250,.03),transparent 40%)var(--bg-solid,#1a1a1a)!important}
.nav-community-menu .nav-mega-header{color:#60a5fa;text-shadow:0 0 16px rgba(96,165,250,.5);border-bottom-color:rgba(96,165,250,.1)}
.nav-community-menu .nav-mega-header svg{color:#60a5fa!important;filter:drop-shadow(0 0 6px rgba(96,165,250,.6))}
.nav-community-menu .nav-dd-item:hover{background:rgba(96,165,250,.08);color:#60a5fa;text-shadow:0 0 10px rgba(96,165,250,.4)}
.nav-community-menu .nav-dd-item:hover svg{color:#60a5fa!important}
.nav-community-menu .nav-dd-item.active{color:#60a5fa;text-shadow:0 0 8px rgba(96,165,250,.3)}.nav-community-menu .nav-dd-item.active svg{color:#60a5fa}
.nav-community-menu .nav-dd-item:hover .nav-dd-hint{color:rgba(96,165,250,.6)}

/* Marktplatz */
.nav-market-trigger{font-weight:700!important;transition:all .25s ease!important}
.nav-market-trigger.active,.nav-market-trigger:hover{color:#f59e0b!important;background:rgba(245,158,11,.08)!important;text-shadow:0 0 12px rgba(245,158,11,.3)!important;box-shadow:0 0 14px rgba(245,158,11,.1),inset 0 0 10px rgba(245,158,11,.04)!important;border-radius:8px!important}
.nav-market-wrap:hover .nav-dd-trigger{color:#f59e0b!important;text-shadow:0 0 12px rgba(245,158,11,.3)!important}
.nav-market-wrap:hover .nav-dd-trigger svg,.nav-market-trigger.active svg{color:#f59e0b!important;filter:drop-shadow(0 0 5px rgba(245,158,11,.5))!important}
.nav-market-menu{border-color:rgba(245,158,11,.15)!important;box-shadow:0 16px 48px rgba(0,0,0,.6),0 0 30px rgba(245,158,11,.06)!important;background:linear-gradient(180deg,rgba(245,158,11,.03),transparent 40%)var(--bg-solid,#1a1a1a)!important}
.nav-market-menu .nav-mega-header{color:#f59e0b;text-shadow:0 0 16px rgba(245,158,11,.5);border-bottom-color:rgba(245,158,11,.1)}
.nav-market-menu .nav-mega-header svg{color:#f59e0b!important;filter:drop-shadow(0 0 6px rgba(245,158,11,.6))}
.nav-market-menu .nav-dd-item:hover{background:rgba(245,158,11,.08);color:#f59e0b;text-shadow:0 0 10px rgba(245,158,11,.4)}
.nav-market-menu .nav-dd-item:hover svg{color:#f59e0b!important}
.nav-market-menu .nav-dd-item.active{color:#f59e0b;text-shadow:0 0 8px rgba(245,158,11,.3)}.nav-market-menu .nav-dd-item.active svg{color:#f59e0b}
.nav-market-menu .nav-dd-item:hover .nav-dd-hint{color:rgba(245,158,11,.6)}

/* === ARENA MEGA DROPDOWN === */
.nav-arena-trigger{font-weight:700!important;transition:all .25s ease!important}
.nav-arena-trigger.active,.nav-arena-trigger:hover{color:#a855f7!important;background:rgba(168,85,247,.1)!important;text-shadow:0 0 14px rgba(168,85,247,.5)!important;box-shadow:0 0 16px rgba(168,85,247,.15),inset 0 0 12px rgba(168,85,247,.06)!important;border-radius:8px!important}
.nav-arena-wrap:hover .nav-dd-trigger{color:#a855f7!important;text-shadow:0 0 14px rgba(168,85,247,.5)!important}
.nav-arena-wrap:hover .nav-dd-trigger svg,.nav-arena-trigger.active svg{color:#a855f7!important;filter:drop-shadow(0 0 6px rgba(168,85,247,.6))!important}
.nav-arena-menu{min-width:300px!important;border-color:rgba(168,85,247,.25)!important;box-shadow:0 16px 48px rgba(0,0,0,.6),0 0 40px rgba(168,85,247,.1),0 0 80px rgba(168,85,247,.04)!important;background:linear-gradient(180deg,rgba(168,85,247,.04),transparent 40%)var(--bg-solid,#1a1a1a)!important}
.nav-arena-menu .nav-mega-header{color:#a855f7;text-shadow:0 0 20px rgba(168,85,247,.6);border-bottom-color:rgba(168,85,247,.12)}
.nav-arena-menu .nav-mega-header svg{color:#a855f7!important;filter:drop-shadow(0 0 8px rgba(168,85,247,.7))}
.nav-arena-section-label{font-size:10px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:rgba(168,85,247,.5);padding:10px 14px 4px}
.nav-arena-quick{display:flex;gap:6px;padding:4px 10px 6px}
.nav-arena-pill{display:inline-flex;align-items:center;gap:5px;padding:5px 12px;border-radius:20px;font-size:11px;font-weight:600;color:var(--text-muted);background:var(--bg-hover);text-decoration:none;transition:all .15s}
.nav-arena-pill:hover{color:#a855f7;background:rgba(168,85,247,.1)}
.nav-arena-pill.active{color:#a855f7;background:rgba(168,85,247,.12)}
.nav-arena-menu .nav-dd-item:hover{background:rgba(168,85,247,.12);color:#a855f7;text-shadow:0 0 10px rgba(168,85,247,.4)}
.nav-arena-menu .nav-dd-item:hover svg{color:#a855f7!important}
.nav-arena-menu .nav-dd-item.active{color:#a855f7;text-shadow:0 0 8px rgba(168,85,247,.3)}.nav-arena-menu .nav-dd-item.active svg{color:#a855f7}
.nav-arena-menu .nav-dd-item:hover .nav-dd-hint{color:rgba(168,85,247,.7)}

/* Blog Nav — Turquoise/Cyan #06b6d4 */
.nav-blog-trigger{font-weight:700!important;transition:all .25s ease!important}
.nav-blog-trigger.active,.nav-blog-trigger:hover{color:#06b6d4!important;background:rgba(6,182,212,.1)!important;text-shadow:0 0 14px rgba(6,182,212,.5)!important;box-shadow:0 0 16px rgba(6,182,212,.15),inset 0 0 12px rgba(6,182,212,.06)!important;border-radius:8px!important}
.nav-blog-wrap:hover .nav-dd-trigger{color:#06b6d4!important;text-shadow:0 0 14px rgba(6,182,212,.5)!important}
.nav-blog-wrap:hover .nav-dd-trigger svg,.nav-blog-trigger.active svg{color:#06b6d4!important;filter:drop-shadow(0 0 6px rgba(6,182,212,.6))!important}
.nav-blog-menu{min-width:300px!important;border-color:rgba(6,182,212,.25)!important;box-shadow:0 16px 48px rgba(0,0,0,.6),0 0 40px rgba(6,182,212,.1),0 0 80px rgba(6,182,212,.04)!important;background:linear-gradient(180deg,rgba(6,182,212,.04),transparent 40%)var(--bg-solid,#1a1a1a)!important}
.nav-blog-menu .nav-mega-header{color:#06b6d4;text-shadow:0 0 20px rgba(6,182,212,.6);border-bottom-color:rgba(6,182,212,.12)}
.nav-blog-menu .nav-mega-header svg{color:#06b6d4!important;filter:drop-shadow(0 0 8px rgba(6,182,212,.7))}
.nav-blog-section-label{font-size:10px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:rgba(6,182,212,.5);padding:10px 14px 4px}
.nav-blog-menu .nav-dd-item:hover{background:rgba(6,182,212,.12);color:#06b6d4;text-shadow:0 0 10px rgba(6,182,212,.4)}
.nav-blog-menu .nav-dd-item:hover svg{color:#06b6d4!important}
.nav-blog-menu .nav-dd-item.active{color:#06b6d4;text-shadow:0 0 8px rgba(6,182,212,.3)}.nav-blog-menu .nav-dd-item.active svg{color:#06b6d4}
.nav-blog-menu .nav-dd-item:hover .nav-dd-hint{color:rgba(6,182,212,.7)}

/* RootsBorn Nav — Saturated Emerald #059669 */
.nav-rootsborn-trigger{font-weight:700!important;transition:all .25s ease!important}
.nav-rootsborn-trigger.active,.nav-rootsborn-trigger:hover{color:#059669!important;background:rgba(5,150,105,.12)!important;text-shadow:0 0 14px rgba(5,150,105,.6)!important;box-shadow:0 0 16px rgba(5,150,105,.18),inset 0 0 12px rgba(5,150,105,.08)!important;border-radius:8px!important}
.nav-rootsborn-wrap:hover .nav-dd-trigger svg,.nav-rootsborn-trigger.active svg{color:#059669!important;filter:drop-shadow(0 0 6px rgba(5,150,105,.7))!important}
.nav-rootsborn-menu{min-width:300px!important;border-color:rgba(5,150,105,.3)!important;box-shadow:0 16px 48px rgba(0,0,0,.6),0 0 40px rgba(5,150,105,.12),0 0 80px rgba(5,150,105,.05)!important;background:linear-gradient(180deg,rgba(5,150,105,.06),transparent 40%)var(--bg-solid,#1a1a1a)!important}
.nav-rootsborn-menu .nav-mega-header{color:#059669;text-shadow:0 0 20px rgba(5,150,105,.7);border-bottom-color:rgba(5,150,105,.15)}
.nav-rootsborn-menu .nav-mega-header svg{color:#059669!important;filter:drop-shadow(0 0 8px rgba(5,150,105,.8))}
.nav-rootsborn-section-label{font-size:10px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:rgba(5,150,105,.6);padding:10px 14px 4px}
.nav-rootsborn-menu .nav-dd-item:hover{background:rgba(5,150,105,.14);color:#059669}
.nav-rootsborn-menu .nav-dd-item:hover .nav-dd-hint{color:rgba(5,150,105,.75)}

/* ==================== BLOG SYSTEM ==================== */

/* Blog Hero */
.blog-hero{position:relative;border-radius:var(--radius-lg);overflow:hidden;min-height:400px;display:flex;align-items:flex-end;cursor:pointer;transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.blog-hero:hover{transform:translateY(-2px);box-shadow:0 12px 40px rgba(6,182,212,.15)}
.blog-hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .4s var(--ease)}
.blog-hero:hover .blog-hero-img{transform:scale(1.02)}
.blog-hero-gradient{position:absolute;inset:0;background:linear-gradient(180deg,transparent 30%,rgba(0,0,0,.85) 100%)}
.blog-hero-content{position:relative;z-index:2;padding:32px;width:100%}
.blog-hero-cat{display:inline-block;font-size:11px;font-weight:700;padding:3px 10px;border-radius:var(--radius-full);color:#fff;margin-bottom:10px;text-transform:uppercase;letter-spacing:.5px}
.blog-hero-title{font-size:26px;font-weight:800;color:#fff;line-height:1.3;margin-bottom:8px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.blog-hero-excerpt{font-size:14px;color:rgba(255,255,255,.75);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:12px}
.blog-hero-meta{display:flex;align-items:center;gap:8px;font-size:12px;color:rgba(255,255,255,.6)}
.blog-hero-meta img{width:28px;height:28px;border-radius:50%;object-fit:cover;border:2px solid rgba(255,255,255,.3)}
@media(max-width:640px){.blog-hero{min-height:250px}.blog-hero-title{font-size:20px}.blog-hero-content{padding:20px}}

/* Blog Category Filter */
.blog-cat-bar{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;margin-bottom:24px;scrollbar-width:none;-ms-overflow-style:none}
.blog-cat-bar::-webkit-scrollbar{display:none}
.blog-cat-pill{display:inline-flex;align-items:center;gap:5px;padding:6px 14px;border-radius:var(--radius-full);font-size:12px;font-weight:600;white-space:nowrap;text-decoration:none;border:1.5px solid transparent;transition:all .2s var(--ease);cursor:pointer;flex-shrink:0}
.blog-cat-pill:hover{transform:translateY(-1px)}
.blog-cat-pill.active{color:#fff!important;border-color:transparent!important}

/* Blog Grid */
.blog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:20px;margin-bottom:32px}
@media(max-width:720px){.blog-grid{grid-template-columns:1fr}}

/* Blog Card */
.blog-card{display:block;text-decoration:none;border-radius:var(--radius-md);overflow:hidden;background:var(--bg-card);border:1px solid var(--border);transition:all .25s var(--ease);cursor:pointer}
.blog-card:hover{transform:translateY(-3px);box-shadow:0 8px 32px rgba(6,182,212,.12);border-color:rgba(6,182,212,.3)}
.blog-card-image{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--bg-elevated)}
.blog-card-image img{width:100%;height:100%;object-fit:cover;transition:transform .4s var(--ease)}
.blog-card:hover .blog-card-image img{transform:scale(1.05)}
.blog-card-image .blog-hero-cat{position:absolute;top:10px;left:10px;z-index:2}
.blog-card-body{padding:16px}
.blog-card-title{font-weight:700;font-size:16px;line-height:1.4;color:var(--text-primary);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:6px}
.blog-card-excerpt{font-size:13px;color:var(--text-secondary);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:12px}
.blog-card-footer{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text-muted)}
.blog-card-footer img{width:24px;height:24px;border-radius:50%;object-fit:cover}

/* Blog Article Typography */
.blog-article{font-size:16px;line-height:1.8;color:var(--text-primary)}
.blog-article h1{font-size:28px;font-weight:800;margin:32px 0 16px;line-height:1.3}
.blog-article h2{font-size:22px;font-weight:700;margin:28px 0 12px;line-height:1.35;color:#06b6d4}
.blog-article h3{font-size:18px;font-weight:600;margin:24px 0 10px;line-height:1.4}
.blog-article h4{font-size:16px;font-weight:600;margin:20px 0 8px}
.blog-article p{margin-bottom:16px}
.blog-article a{color:#06b6d4;text-decoration:underline;text-decoration-color:rgba(6,182,212,.3);transition:text-decoration-color .2s}
.blog-article a:hover{text-decoration-color:#06b6d4}
.blog-article img{max-width:100%;height:auto;border-radius:var(--radius);margin:16px 0}
.blog-article figure{margin:20px 0}
.blog-article figure img{margin:0}
.blog-article figcaption{font-size:13px;color:var(--text-muted);text-align:center;margin-top:8px;font-style:italic}
.blog-article ul,.blog-article ol{margin:0 0 16px 24px}
.blog-article li{margin-bottom:6px}
.blog-article ul li::marker{color:#06b6d4}
.blog-article ol li::marker{color:#06b6d4;font-weight:700}
.blog-article blockquote{border-left:3px solid #06b6d4;padding:12px 20px;margin:16px 0;background:rgba(6,182,212,.05);border-radius:0 var(--radius) var(--radius) 0;font-style:italic;color:var(--text-secondary)}
.blog-article pre{background:var(--bg-primary);border:1px solid var(--border);border-radius:var(--radius);padding:16px;overflow-x:auto;margin:16px 0;font-size:14px;line-height:1.6}
.blog-article code{font-family:'JetBrains Mono',monospace;font-size:.9em;background:var(--bg-hover);padding:2px 6px;border-radius:4px}
.blog-article pre code{background:none;padding:0;font-size:14px}
.blog-article hr{border:none;border-top:1px solid var(--border);margin:32px 0}
.blog-article table{width:100%;border-collapse:collapse;margin:16px 0;font-size:14px}
.blog-article th{background:var(--bg-elevated);font-weight:600;text-align:left;padding:10px 14px;border:1px solid var(--border)}
.blog-article td{padding:10px 14px;border:1px solid var(--border)}
.blog-article tr:nth-child(even) td{background:var(--bg-primary)}

/* Blog Article Image Layouts */
.md-img{text-align:center;margin:20px 0}
.md-img img{max-width:100%;border-radius:var(--radius)}
.md-img-wide{margin-left:-5%;margin-right:-5%;text-align:center}
.md-img-wide img{width:110%;max-width:110%;border-radius:var(--radius-md)}
.md-img-left{float:left;margin:4px 20px 12px 0;max-width:45%}
.md-img-right{float:right;margin:4px 0 12px 20px;max-width:45%}
.md-img-sized img{border-radius:var(--radius)}

/* Blog Callout Boxes */
.md-callout{padding:16px 20px;border-radius:var(--radius);margin:16px 0;border-left:4px solid;font-size:14px;line-height:1.6}
.md-callout-info{background:rgba(59,130,246,.08);border-color:#3b82f6;color:var(--text-primary)}
.md-callout-tip{background:rgba(34,197,94,.08);border-color:#22c55e;color:var(--text-primary)}
.md-callout-warning{background:rgba(249,115,22,.08);border-color:#f97316;color:var(--text-primary)}

/* Blog Gallery */
.md-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;margin:20px 0}
.md-gallery img{width:100%;height:auto;border-radius:var(--radius);aspect-ratio:4/3;object-fit:cover}

/* Blog Table Wrap */
.md-table-wrap{overflow-x:auto;margin:16px 0}

/* Blog Mentions */
.md-mention{color:#06b6d4;font-weight:600;text-decoration:none}
.md-mention:hover{text-decoration:underline}

/* Markdown Editor */
.md-editor{border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden;background:var(--bg-card)}
.md-toolbar{display:flex;flex-wrap:wrap;gap:2px;padding:8px;background:var(--bg-elevated);border-bottom:1px solid var(--border)}
.md-toolbar button{background:none;border:1px solid transparent;border-radius:6px;padding:6px 8px;cursor:pointer;color:var(--text-secondary);font-size:13px;font-weight:600;transition:all .15s;display:inline-flex;align-items:center;gap:3px}
.md-toolbar button:hover{background:rgba(6,182,212,.1);color:#06b6d4;border-color:rgba(6,182,212,.2)}
.md-toolbar button.active{background:rgba(6,182,212,.15);color:#06b6d4}
.md-toolbar-sep{width:1px;background:var(--border);margin:4px 4px;align-self:stretch}
.md-toolbar-flash{animation:md-flash .3s ease}
@keyframes md-flash{0%{background:rgba(6,182,212,.3)}100%{background:none}}
.md-panes{display:flex;min-height:500px}
.md-source{flex:1;min-width:0;border:none;resize:none;padding:20px;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:14px;line-height:1.7;background:var(--bg-primary);color:var(--text-primary);outline:none;tab-size:4}
.md-source::placeholder{color:var(--text-muted)}
.md-preview{flex:1;min-width:0;padding:20px;border-left:1px solid var(--border);overflow-y:auto;max-height:80vh}
.md-editor.md-preview-active .md-source{display:none}
.md-editor.md-preview-active .md-preview{border-left:none;flex:1}
.md-editor.md-dragover{border-color:#06b6d4;box-shadow:0 0 0 3px rgba(6,182,212,.2)}
.md-btn-preview{background:rgba(6,182,212,.1)!important;color:#06b6d4!important}
@media(max-width:768px){.md-panes{flex-direction:column}.md-preview{border-left:none;border-top:1px solid var(--border)}.md-source,.md-preview{min-height:300px}}

/* Blog Comment */
.blog-comment{padding:16px 0;border-bottom:1px solid var(--border)}
.blog-comment:last-child{border-bottom:none}
.blog-comment-reply{margin-left:40px;padding-left:16px;border-left:2px solid rgba(6,182,212,.2)}

/* Blog Author Card */
.blog-author-card{display:flex;gap:16px;padding:20px;border-radius:var(--radius-md);background:var(--bg-card);border:1px solid var(--border);margin:32px 0}
.blog-author-card img{width:56px;height:56px;border-radius:50%;object-fit:cover;flex-shrink:0}

/* Blog FAB */
.blog-fab{position:fixed;bottom:24px;right:24px;width:56px;height:56px;border-radius:50%;background:#06b6d4;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px rgba(6,182,212,.4);cursor:pointer;transition:all .2s var(--ease);z-index:50;text-decoration:none;border:none}
.blog-fab:hover{transform:scale(1.1);box-shadow:0 6px 24px rgba(6,182,212,.5);background:#0891b2;color:#fff}

/* Blog Pagination */
.blog-pagination{display:flex;align-items:center;justify-content:center;gap:6px;margin:32px 0}
.blog-pagination a,.blog-pagination span{display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:36px;padding:0 10px;border-radius:var(--radius);font-size:13px;font-weight:600;text-decoration:none;transition:all .2s}
.blog-pagination a{color:var(--text-secondary);background:var(--bg-card);border:1px solid var(--border)}
.blog-pagination a:hover{border-color:rgba(6,182,212,.4);color:#06b6d4}
.blog-pagination .active{background:#06b6d4;color:#fff;border:1px solid #06b6d4}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 20px;border-radius:var(--radius);font-family:var(--font-body);font-weight:600;font-size:14px;cursor:pointer;transition:all .2s var(--ease);border:none;text-decoration:none;position:relative;overflow:hidden}
.btn-primary{background:var(--green);color:var(--text-inverse);box-shadow:var(--shadow-sm)}.btn-primary:hover{background:var(--green-dark);color:var(--text-inverse);transform:translateY(-1px);box-shadow:var(--shadow),var(--shadow-glow)}
.btn-secondary{background:var(--bg-hover);color:var(--text-primary);border:1px solid var(--border-light)}.btn-secondary:hover{border-color:rgba(191,90,242,0.3);color:var(--purple);box-shadow:0 0 12px var(--purple-glow)}
.btn-danger{background:var(--red-subtle);color:var(--red);border:1px solid transparent}.btn-danger:hover{border-color:rgba(248,113,113,0.3)}
.btn-ghost{background:transparent;color:var(--text-secondary)}.btn-ghost:hover{color:var(--purple);background:var(--purple-subtle)}
.btn-sm{padding:6px 12px;font-size:12.5px;border-radius:6px}.btn-lg{padding:14px 28px;font-size:15px;border-radius:var(--radius-md)}.btn-block{width:100%}
.btn:disabled{opacity:.35;cursor:not-allowed;transform:none!important}
.btn:active{transform:scale(0.97)}
.btn-upload-submit{background:radial-gradient(circle at center,rgba(74,222,128,.45) 0%,rgba(74,222,128,.15) 55%,rgba(8,14,8,.8) 100%);color:#d1fae5;border:1px solid rgba(74,222,128,.35)!important;box-shadow:0 0 14px rgba(74,222,128,.22);animation:upload-btn-glow 3s ease-in-out infinite;letter-spacing:.3px}
.btn-upload-submit:hover{background:radial-gradient(circle at center,rgba(74,222,128,.65) 0%,rgba(74,222,128,.28) 55%,rgba(8,14,8,.65) 100%);color:#d1fae5;animation:none;box-shadow:0 0 28px rgba(74,222,128,.45);border-color:rgba(74,222,128,.6)!important;transform:translateY(-2px)}
@keyframes upload-btn-glow{0%,100%{box-shadow:0 0 10px rgba(74,222,128,.2),0 0 0 0 rgba(74,222,128,.15)}50%{box-shadow:0 0 20px rgba(74,222,128,.38),0 0 0 4px rgba(74,222,128,0)}}

/* Cards */
.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;transition:all .3s var(--ease)}
.card:hover{border-color:var(--border-light);box-shadow:var(--shadow)}

/* Upload Grid */
.upload-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:18px}
.upload-card{display:block;position:relative;text-decoration:none;color:inherit;border-radius:var(--radius-lg);overflow:hidden;border:2px solid transparent;background:linear-gradient(var(--bg-card),var(--bg-card)) padding-box,linear-gradient(145deg,rgba(74,222,128,.55) 0%,rgba(74,222,128,.15) 45%,rgba(74,222,128,.40) 100%) border-box;box-shadow:0 2px 14px rgba(0,0,0,.3),0 0 16px rgba(74,222,128,.12),0 0 4px rgba(74,222,128,.08);transition:box-shadow .35s var(--ease),transform .35s var(--ease),background .35s var(--ease)}
.upload-card:hover{transform:translateY(-4px);background:linear-gradient(var(--bg-card),var(--bg-card)) padding-box,linear-gradient(145deg,rgba(74,222,128,.9) 0%,rgba(74,222,128,.25) 45%,rgba(74,222,128,.70) 100%) border-box;box-shadow:var(--shadow-lg),0 0 32px rgba(74,222,128,.30),0 0 80px rgba(74,222,128,.12)}
.upload-card .card-image{aspect-ratio:4/3;overflow:hidden;position:relative;background:var(--bg-base)}
.upload-card .card-image>img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.upload-card:hover .card-image>img{transform:scale(1.06)}
.upload-card .card-image::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,0.5),transparent 50%);opacity:0;transition:opacity .3s}
.upload-card:hover .card-image::after{opacity:1}
.strain-badge{position:absolute;top:10px;left:10px;padding:3px 10px;border-radius:var(--radius-full);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;z-index:2;backdrop-filter:blur(8px)}
.strain-badge.indica{background:rgba(167,139,250,0.85);color:#fff}
.strain-badge.sativa{background:rgba(251,191,36,0.88);color:#1a1a00}
.strain-badge.hybrid{background:rgba(74,222,128,0.88);color:#002200}
.strain-badge.unknown{background:rgba(80,80,80,0.85);color:#ccc}
.featured-badge{position:absolute;top:10px;right:10px;background:rgba(251,191,36,0.9);color:#1a1a00;padding:3px 8px;border-radius:var(--radius-full);font-size:9px;font-weight:800;backdrop-filter:blur(8px)}
.card-info{padding:14px 16px}
.card-title{font-weight:600;font-size:14.5px;margin-bottom:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.card-meta{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:var(--text-muted)}
.card-user{display:flex;align-items:center;gap:6px}
.card-user img{width:20px;height:20px;border-radius:var(--radius-full);object-fit:cover;border:1px solid var(--border)}
.card-stats{display:flex;align-items:center;gap:8px}
.card-stats span{display:flex;align-items:center;gap:3px;transition:color .2s}
.upload-card:hover .card-stats span{color:var(--text-secondary)}

/* Forms */
.form-group{margin-bottom:20px}
.form-label{display:block;margin-bottom:6px;font-weight:600;font-size:13px;color:var(--text-secondary);letter-spacing:.02em;text-transform:uppercase}
.form-input,.form-textarea,.form-select{width:100%;padding:11px 14px;background:var(--bg-input);border:1.5px solid var(--border);border-radius:var(--radius);color:var(--text-primary);font-family:var(--font-body);font-size:14px;transition:all .2s var(--ease)}
.form-input:focus,.form-textarea:focus,.form-select:focus{outline:none;border-color:var(--green-dark);box-shadow:0 0 0 3px var(--green-glow);background:var(--bg-elevated)}
.form-input::placeholder,.form-textarea::placeholder{color:var(--text-muted)}
.form-textarea{resize:vertical;min-height:100px;line-height:1.7}
.form-hint{font-size:11.5px;color:var(--text-muted);margin-top:5px}
.pw-wrap{position:relative}
.pw-wrap .form-input{padding-right:42px}
.pw-toggle{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;color:var(--text-muted);padding:2px;display:flex;align-items:center;line-height:1;transition:color .15s}
.pw-toggle:hover{color:var(--text-primary)}
.pw-toggle:focus{outline:none}
.pw-toggle .pw-icon-off{display:none}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
input[type="checkbox"],input[type="radio"]{-webkit-appearance:none;appearance:none;width:16px;height:16px;border:1.5px solid var(--border-light);border-radius:3px;background:var(--bg-input);cursor:pointer;position:relative;flex-shrink:0;transition:all .2s var(--ease)}
input[type="radio"]{border-radius:50%}
input[type="checkbox"]:checked,input[type="radio"]:checked{background:rgba(74,222,128,0.15);border-color:var(--green);box-shadow:0 0 8px var(--green-glow)}
input[type="checkbox"]:checked::after{content:'';position:absolute;left:4.5px;top:1.5px;width:5px;height:9px;border:solid var(--green);border-width:0 2px 2px 0;transform:rotate(45deg)}
input[type="radio"]:checked::after{content:'';position:absolute;left:3.5px;top:3.5px;width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 6px var(--green-glow)}
input[type="checkbox"]:hover,input[type="radio"]:hover{border-color:var(--green-dark);box-shadow:0 0 6px var(--green-glow)}
input[type="checkbox"]:focus-visible,input[type="radio"]:focus-visible{outline:none;box-shadow:0 0 0 3px var(--green-glow)}
.form-select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6' fill='%238a9187'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}

/* Auth */
.auth-container{max-width:400px;margin:48px auto}
.auth-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-xl);padding:40px 36px;box-shadow:var(--shadow-lg);position:relative}
.auth-card::before{content:'';position:absolute;top:-1px;left:20%;right:20%;height:2px;background:linear-gradient(90deg,transparent,var(--green),transparent);border-radius:2px}
.auth-title{font-family:var(--font-display);font-size:26px;font-weight:800;margin-bottom:4px;letter-spacing:-.02em}
.auth-subtitle{color:var(--text-muted);margin-bottom:28px;font-size:13.5px}
.auth-footer{text-align:center;margin-top:24px;font-size:13px;color:var(--text-muted)}

/* Flash */
.flash-container{position:fixed;top:calc(var(--nav-h) + 12px);right:16px;z-index:9999;display:flex;flex-direction:column;gap:8px;max-width:380px}
.flash{padding:14px 18px;border-radius:var(--radius-md);font-size:13.5px;font-weight:500;animation:flashIn .35s var(--ease-spring);box-shadow:var(--shadow-lg);backdrop-filter:blur(12px);cursor:pointer}
.flash-success{background:rgba(17,59,17,0.92);border:1px solid rgba(34,197,94,0.4);color:#4ade80}
.flash-error{background:rgba(59,17,17,0.92);border:1px solid rgba(239,68,68,0.4);color:#f87171}
.flash-info{background:rgba(17,17,51,0.92);border:1px solid rgba(59,130,246,0.4);color:#60a5fa}
@keyframes flashIn{from{transform:translateX(120%);opacity:0}to{transform:translateX(0);opacity:1}}

/* Upload Detail */
.upload-detail{display:grid;grid-template-columns:1fr 380px;gap:24px;align-items:start}
.upload-image-container{background:var(--bg-primary);border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--border);position:sticky;top:calc(var(--nav-h) + 20px)}
.upload-image-container img{width:100%;max-height:80vh;object-fit:contain}
.upload-sidebar .card{position:sticky;top:calc(var(--nav-h) + 20px)}
.upload-user-info{display:flex;align-items:center;gap:12px;padding:18px;border-bottom:1px solid var(--border)}
.upload-user-avatar{width:42px;height:42px;border-radius:var(--radius-full);object-fit:cover;border:2px solid var(--border-accent);flex-shrink:0}
.upload-user-name{font-weight:700;font-size:14px;color:var(--text-primary)}
.upload-user-level{font-size:11px;color:var(--green);font-weight:600;margin-top:2px}
.upload-actions{display:flex;gap:10px;padding:14px 18px;border-bottom:1px solid var(--border)}
.vote-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;padding:10px 8px;border-radius:var(--radius);border:1px solid var(--border);background:var(--bg-input);color:var(--text-secondary);cursor:pointer;transition:all .2s var(--ease);font-size:13px;font-weight:500;font-family:var(--font-body)}
.vote-btn:hover{border-color:var(--border-light);color:var(--text-primary);background:var(--bg-hover)}
.vote-btn.liked{background:var(--green-glow);border-color:var(--border-accent);color:var(--green)}
.vote-btn.disliked{background:var(--red-subtle);border-color:rgba(248,113,113,0.25);color:var(--red)}
.vote-btn:active{transform:scale(0.95)}
.upload-metadata{padding:20px 18px;border-bottom:1px solid var(--border)}
.upload-metadata h2{font-family:var(--font-display);font-size:22px;font-weight:800;margin-bottom:8px;letter-spacing:-.02em;line-height:1.3}
.upload-metadata .description{color:var(--text-secondary);font-size:14px;margin-bottom:14px;line-height:1.7}
.metadata-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.metadata-item{background:var(--bg-input);padding:12px 14px;border-radius:var(--radius);border:1px solid var(--border)}
.metadata-item .label{display:block;font-size:10px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.8px;font-weight:600;margin-bottom:4px}
.metadata-item .value{display:block;font-weight:700;font-size:14px}
.metadata-item .strain-badge{position:static;display:inline-block}
.upload-tags{display:flex;flex-wrap:wrap;gap:8px;padding:16px 18px;border-bottom:1px solid var(--border)}
.tag{padding:4px 12px;border-radius:var(--radius-full);background:var(--green-subtle);color:var(--green);font-size:12px;font-weight:600;border:1px solid var(--border-accent);transition:all .2s;text-decoration:none}
.tag:hover{background:var(--green-glow);color:var(--green-dark)}

/* Comments */
.comments-section{padding:18px;border-top:1px solid var(--border)}
.comments-section h3{font-size:15px;font-weight:700;margin-bottom:14px}
.comment-form{display:flex;gap:8px;margin-bottom:16px}
.comment-form input{flex:1}
.comment{display:flex;gap:10px;padding:12px 0;border-bottom:1px solid var(--border);animation:commentIn .3s var(--ease)}
@keyframes commentIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.comment:last-child{border-bottom:none}
.comment-avatar{width:30px;height:30px;border-radius:var(--radius-full);object-fit:cover;flex-shrink:0;border:1px solid var(--border)}
.comment-body{flex:1;min-width:0}
.comment-header{display:flex;align-items:center;gap:8px;margin-bottom:3px}
.comment-username{font-weight:700;font-size:12.5px}
.comment-time{font-size:10.5px;color:var(--text-muted)}
.comment-text{font-size:13.5px;color:var(--text-secondary);line-height:1.6}
.comment-actions{display:flex;gap:12px;margin-top:5px}
.comment-actions a{font-size:11px;color:var(--text-muted);font-weight:500;transition:color .2s}
.comment-actions a:hover{color:var(--green)}

/* Profile */
.profile-header{display:flex;align-items:flex-start;gap:28px;padding:32px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-xl);margin-bottom:24px;position:relative;overflow:hidden}
.profile-header::before{content:'';position:absolute;top:0;left:0;right:0;height:100px;background:linear-gradient(135deg,rgba(74,222,128,0.06),rgba(167,139,250,0.04));pointer-events:none}
.profile-avatar-large{width:96px;height:96px;border-radius:var(--radius-full);object-fit:cover;border:3px solid var(--border-accent);flex-shrink:0;position:relative;z-index:1;box-shadow:0 0 24px rgba(74,222,128,0.1)}
.profile-info{flex:1;position:relative;z-index:1}
.profile-name{font-family:var(--font-display);font-size:26px;font-weight:800;margin-bottom:2px;letter-spacing:-.02em}
.profile-bio{color:var(--text-secondary);font-size:14px;margin:8px 0;line-height:1.6}
.profile-meta{display:flex;gap:16px;font-size:12.5px;color:var(--text-muted);margin-bottom:14px}
.profile-stats{display:flex;gap:28px}
.profile-stat{text-align:center}
.profile-stat .stat-value{font-size:22px;font-weight:800;letter-spacing:-.02em}
.profile-stat .stat-label{font-size:11px;color:var(--text-muted);font-weight:500;text-transform:uppercase;letter-spacing:.5px}
.profile-actions{display:flex;gap:8px;margin-top:14px}

/* XP Bar */
.xp-bar-container{margin-top:14px}
.xp-bar-header{display:flex;justify-content:space-between;font-size:11.5px;color:var(--text-muted);margin-bottom:5px;font-weight:500}
.xp-bar{height:5px;background:var(--bg-input);border-radius:var(--radius-full);overflow:visible;border:1px solid var(--border);position:relative}
.xp-bar-fill{height:100%;background:linear-gradient(90deg,var(--green-deep),var(--green));border-radius:var(--radius-full);transition:width .8s var(--ease);position:relative;overflow:hidden}
.xp-bar-fill::after{content:'';position:absolute;left:-50%;top:0;bottom:0;width:40%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.45),transparent);animation:xpShine 2.5s ease-in-out infinite}
@keyframes xpShine{0%{left:-50%}100%{left:120%}}
.xp-bar-fill.pt-xp-fusing::after{display:none}
.xp-bar-fill.pt-xp-fusing{transition:none!important}
.pt-xp-fuse{position:absolute;width:8px;height:8px;border-radius:50%;background:radial-gradient(circle,#fff 0%,#4ade80 40%,rgba(74,222,128,0) 70%);transform:translate(-50%,-50%);z-index:10;pointer-events:none;box-shadow:0 0 8px 3px rgba(74,222,128,.8),0 0 16px 6px rgba(74,222,128,.4);animation:ptFuseGlow .15s ease-in-out infinite alternate}
@keyframes ptFuseGlow{0%{box-shadow:0 0 6px 2px rgba(74,222,128,.7),0 0 12px 4px rgba(74,222,128,.3);transform:translate(-50%,-50%) scale(.9)}100%{box-shadow:0 0 10px 4px rgba(74,222,128,.9),0 0 20px 8px rgba(74,222,128,.5);transform:translate(-50%,-50%) scale(1.1)}}
.pt-xp-fuse-done{animation:ptFuseFadeout .5s ease-out forwards}
@keyframes ptFuseFadeout{to{opacity:0;transform:translate(-50%,-50%) scale(2)}}

/* Green XP Bar (RootsBorn) */
.pt-green-xpbar .xp-bar{border-color:rgba(22,163,74,.25);box-shadow:0 0 8px rgba(34,197,94,.1),inset 0 0 4px rgba(22,163,74,.08)}
.pt-green-xpbar .xp-bar-fill{background:linear-gradient(90deg,#15803d,#16a34a,#22c55e,#4ade80)!important;box-shadow:0 0 6px rgba(34,197,94,.5),0 0 12px rgba(74,222,128,.2);clip-path:inset(-4px -30px -4px 0)}
.pt-green-xpbar .xp-bar-fill::after{background:linear-gradient(90deg,transparent,rgba(255,255,255,0.45),transparent);animation:greenXpShine 2.5s ease-in-out infinite}
@keyframes greenXpShine{0%{left:-50%;opacity:.6}100%{left:120%;opacity:.6}}
.pt-green-xpbar .xp-bar{animation:greenXpPulse 3s ease-in-out infinite}
@keyframes greenXpPulse{0%,100%{box-shadow:0 0 8px rgba(34,197,94,.1),inset 0 0 4px rgba(22,163,74,.08)}50%{box-shadow:0 0 14px rgba(34,197,94,.3),inset 0 0 6px rgba(22,163,74,.15)}}

/* Badges */
.badges-grid{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.badge-item{display:flex;align-items:center;gap:8px;padding:8px 14px;border-radius:var(--radius-full);background:var(--bg-input);border:1px solid var(--border);font-size:12px;font-weight:500;transition:all .2s;overflow:hidden}
.badge-item:hover{border-color:rgba(191,90,242,0.3);background:var(--purple-subtle);box-shadow:0 0 12px var(--purple-glow)}
.badge-item[style*="flex-direction:column"]{border-radius:16px;max-width:160px;overflow:hidden;word-break:break-word}
.badge-item[style*="flex-direction:column"] small{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.3}
.badge-icon img{border-radius:4px}

/* Leaderboard */
.leaderboard-table{width:100%;border-collapse:separate;border-spacing:0}
.leaderboard-table th{text-align:left;padding:12px 16px;font-size:10.5px;text-transform:uppercase;letter-spacing:.8px;color:var(--text-muted);border-bottom:1px solid var(--border);font-weight:700}
.leaderboard-table td{padding:14px 16px;border-bottom:1px solid var(--border);font-size:14px;transition:background .2s}
.leaderboard-table tr:hover td{background:var(--bg-hover)}
.leaderboard-rank{font-weight:800;font-size:16px;color:var(--text-muted);width:50px}
.leaderboard-rank.top-1{color:#fbbf24;text-shadow:0 0 12px rgba(251,191,36,0.3)}.leaderboard-rank.top-2{color:#cbd5e1}.leaderboard-rank.top-3{color:#cd7f32}

/* Messages */
.message-item{display:flex;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid var(--border);transition:all .2s var(--ease);color:inherit;text-decoration:none}
.message-item:hover{background:var(--bg-hover)}
.message-item.unread{border-left:3px solid var(--green);background:var(--green-subtle)}
.message-item img{width:40px;height:40px;border-radius:var(--radius-full);object-fit:cover;border:1px solid var(--border)}
.message-preview{flex:1;overflow:hidden}
.message-preview .name{font-weight:700;font-size:13.5px}
.message-preview .text{font-size:12px;color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:1px}
.message-time{font-size:11px;color:var(--text-muted)}
.conversation-header{padding:16px 18px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px;background:var(--bg-card)}
.conversation-messages{flex:1;overflow-y:auto;padding:18px;display:flex;flex-direction:column;gap:8px;scroll-behavior:smooth}
.msg-bubble{max-width:72%;padding:10px 14px;border-radius:var(--radius-lg);font-size:14px;line-height:1.5;animation:msgIn .25s var(--ease-spring)}
@keyframes msgIn{from{opacity:0;transform:scale(0.9) translateY(4px)}to{opacity:1;transform:none}}
.msg-bubble.sent{background:var(--green);color:var(--text-inverse);align-self:flex-end;border-bottom-right-radius:4px}
.msg-bubble.received{background:var(--bg-elevated);border:1px solid var(--border);align-self:flex-start;border-bottom-left-radius:4px}
.msg-time{font-size:10px;opacity:.6;margin-top:3px}
.conversation-input{display:flex;gap:8px;padding:14px 18px;background:var(--bg-card);border-top:1px solid var(--border)}

/* Notifications */
.notification-item{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--border);transition:all .2s var(--ease);color:inherit;text-decoration:none}
.notification-item:hover{background:var(--bg-hover)}
.notification-text{flex:1;font-size:13.5px}
.notification-time{font-size:11px;color:var(--text-muted)}

/* Admin */
.admin-layout{display:grid;grid-template-columns:200px 1fr;gap:20px}
.admin-sidebar{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:10px;position:sticky;top:calc(var(--nav-h) + 20px);height:fit-content;max-height:calc(100vh - var(--nav-h) - 40px);overflow-y:auto}
.admin-nav-group{display:flex;align-items:center;gap:5px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1.2px;color:var(--text-muted);padding:12px 14px 4px;margin-top:4px}
.admin-nav-group:first-child{margin-top:0;padding-top:6px}
.admin-nav-group svg{opacity:.5}
.admin-nav-link{display:flex;align-items:center;gap:8px;padding:9px 14px;border-radius:var(--radius);color:var(--text-secondary);font-size:13.5px;font-weight:500;transition:all .2s var(--ease);text-decoration:none}
.admin-nav-link:hover{background:var(--bg-hover);color:var(--text-primary)}
.admin-nav-link.active{background:var(--green-subtle);color:var(--green)}
.admin-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin-bottom:24px}
.stat-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px;transition:all .2s}
.stat-card:hover{border-color:var(--border-accent)}
.stat-card .stat-label{font-size:12px;color:var(--text-muted);font-weight:600;text-transform:uppercase;letter-spacing:.5px}
.stat-card .stat-number{font-size:30px;font-weight:800;margin-top:4px;letter-spacing:-.03em}
.stat-card .stat-icon{font-size:22px;float:right}
.admin-table{width:100%;border-collapse:separate;border-spacing:0}
.admin-table th{text-align:left;padding:10px 14px;font-size:10.5px;text-transform:uppercase;letter-spacing:.8px;color:var(--text-muted);border-bottom:2px solid var(--border);font-weight:700}
.admin-table td{padding:10px 14px;border-bottom:1px solid var(--border);font-size:13.5px}
.admin-table tr:hover td{background:var(--bg-hover)}
.status-badge{display:inline-block;padding:2px 8px;border-radius:var(--radius-full);font-size:10.5px;font-weight:700}
.status-badge.active{background:rgba(74,222,128,0.12);color:var(--green)}
.status-badge.banned{background:var(--red-subtle);color:var(--red)}
.status-badge.pending{background:rgba(251,191,36,0.12);color:var(--orange)}
.status-badge.resolved{background:rgba(96,165,250,0.12);color:var(--blue)}
.status-badge.dismissed{background:var(--bg-hover);color:var(--text-muted)}

/* Dropzone */
.dropzone{border:2px dashed var(--border-light);border-radius:var(--radius-xl);padding:56px 20px;text-align:center;cursor:pointer;transition:all .3s var(--ease);background:var(--bg-input)}
.dropzone:hover,.dropzone.dragover{border-color:var(--green);background:var(--green-subtle);box-shadow:inset 0 0 40px var(--green-glow)}
.dropzone-icon{font-size:44px;margin-bottom:10px}
.dropzone-text{color:var(--text-secondary);font-size:14px;font-weight:500}
.dropzone-or{color:var(--text-muted);margin:10px 0;font-size:12px}
.image-preview{position:relative;margin-top:16px;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--border)}
.image-preview img{width:100%;max-height:300px;object-fit:contain;background:var(--bg-primary)}
.remove-image{position:absolute;top:8px;right:8px;background:rgba(0,0,0,0.75);color:#fff;border:none;border-radius:var(--radius-full);width:32px;height:32px;cursor:pointer;font-size:14px;transition:all .2s;backdrop-filter:blur(8px)}.remove-image:hover{background:var(--red)}

/* Hero */
.hero{text-align:center;padding:80px 20px 56px;position:relative;overflow:hidden}
.hero::before{content:'';position:absolute;top:-100px;left:50%;transform:translateX(-50%);width:700px;height:700px;border-radius:50%;background:radial-gradient(circle,var(--green-glow),transparent 70%);pointer-events:none;animation:heroPulse 4s ease-in-out infinite alternate}
@keyframes heroPulse{from{transform:translateX(-50%) scale(1);opacity:.7}to{transform:translateX(-50%) scale(1.1);opacity:1}}
.hero::after{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--border-accent),transparent)}
.hero h1{font-family:var(--font-display);font-size:52px;font-weight:900;margin-bottom:14px;position:relative;letter-spacing:-.03em;line-height:1.1}
.hero p{font-size:17px;color:var(--text-secondary);max-width:480px;margin:0 auto 36px;position:relative;line-height:1.7}

/* Filter Bar */
.filter-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:24px;padding:12px 16px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg)}
.filter-group{display:flex;gap:3px}
.filter-btn{padding:6px 13px;border-radius:var(--radius-full);font-size:12.5px;font-weight:600;background:transparent;border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;transition:all .3s var(--ease);text-decoration:none}
.filter-btn:hover{border-color:rgba(191,90,242,0.3);color:var(--purple);background:var(--purple-subtle);text-shadow:0 0 8px var(--purple-glow)}
.filter-btn.active{background:radial-gradient(ellipse at center,rgba(74,222,128,0.2) 0%,rgba(74,222,128,0.06) 60%,transparent 100%);color:var(--green);border-color:rgba(74,222,128,0.5);box-shadow:0 0 20px rgba(74,222,128,0.3),0 0 8px rgba(74,222,128,0.15),inset 0 0 14px rgba(74,222,128,0.08);text-shadow:0 0 12px rgba(74,222,128,0.5);font-weight:700}
/* Sort filter buttons (explore page): orange variant */
.filter-sort-btn{color:rgba(255,130,50,.55);border-color:rgba(255,106,26,.15)}
.filter-sort-btn:hover{border-color:rgba(255,106,26,.35)!important;color:#fed7aa!important;background:rgba(255,106,26,.08)!important;text-shadow:0 0 8px rgba(255,106,26,.4)!important}
.filter-sort-btn.active{background:radial-gradient(ellipse at center,rgba(255,106,26,.22) 0%,rgba(255,106,26,.07) 60%,transparent 100%)!important;color:#fed7aa!important;border-color:rgba(255,106,26,.55)!important;box-shadow:0 0 18px rgba(255,106,26,.28),0 0 7px rgba(255,106,26,.14),inset 0 0 12px rgba(255,106,26,.07)!important;text-shadow:0 0 10px rgba(255,106,26,.5)!important;font-weight:700}
.filter-search{flex:1;min-width:180px;padding:8px 14px;border-radius:var(--radius-full);background:var(--bg-input);border:1px solid var(--border);color:var(--text-primary);font-family:var(--font-body);font-size:13px;transition:all .2s}
.filter-search:focus{outline:none;border-color:var(--green-dark);box-shadow:0 0 0 3px var(--green-glow)}
/* Forum post action bar — Runde 3 Redesign */
.forum-actions{display:flex;align-items:flex-start;gap:6px;margin-top:12px;flex-wrap:wrap}
/* Unified pill button */
.fac-btn{display:inline-flex;align-items:center;justify-content:center;gap:3px;height:26px;padding:0 9px;background:transparent;border:1px solid var(--border,rgba(255,255,255,.12));color:var(--text-muted,#888);border-radius:13px;font-size:11px;font-family:inherit;cursor:pointer;transition:border-color .15s,color .15s,box-shadow .15s;white-space:nowrap;text-decoration:none;line-height:1}
.fac-btn:hover{border-color:rgba(74,222,128,.4);color:var(--text,#eaeee9)}
.fac-btn.fac-danger{color:#ef4444}.fac-btn.fac-danger:hover{border-color:rgba(239,68,68,.4);box-shadow:0 0 5px rgba(239,68,68,.2)}
.fac-btn.fac-solved{color:#22c55e}.fac-btn.fac-solved:hover{border-color:rgba(34,197,94,.4)}
.fac-btn.fac-active{color:#22c55e;border-color:rgba(34,197,94,.4)}.fac-btn.fac-active:hover{border-color:rgba(34,197,94,.6);box-shadow:0 0 5px rgba(34,197,94,.2)}
.fac-btn.fac-move{color:#3b82f6}.fac-btn.fac-move:hover{border-color:rgba(59,130,246,.4);box-shadow:0 0 5px rgba(59,130,246,.2)}
select.fac-move{color:#3b82f6}.fac-btn.fac-move:hover,.fac-del-wrap select.fac-move:hover{border-color:rgba(59,130,246,.4)}
/* Delete dropdown */
.fac-del-wrap{position:relative;display:inline-block}
.fac-dropdown{display:none;position:fixed;z-index:9999;background:var(--card-bg,#1a1a1a);border:1px solid rgba(239,68,68,.3);border-radius:8px;padding:4px;min-width:168px;box-shadow:0 4px 16px rgba(0,0,0,.6)}
.fac-dropdown.open{display:block}
.fac-drop-item{display:flex;align-items:center;gap:6px;width:100%;padding:7px 10px;background:transparent;border:none;color:var(--text,#eaeee9);font-size:12px;font-family:inherit;cursor:pointer;border-radius:5px;text-align:left;transition:background .12s;white-space:nowrap}
.fac-drop-item:hover{background:rgba(255,255,255,.06)}
.fac-drop-danger{color:#ef4444}.fac-drop-danger:hover{background:rgba(239,68,68,.1)!important}
/* Report dropdown — green border variant */
.fac-rep-dropdown{border-color:rgba(74,222,128,.3)!important;min-width:200px}
/* Quote hint below button */
.fac-quote-wrap{display:inline-flex;flex-direction:column;align-items:flex-start}
.fac-hint{font-size:10px;color:var(--text-muted,#888);font-style:italic;margin-top:3px;line-height:1.3}
/* Orange search field (explore page) */
.filter-search-orange{border-color:rgba(255,106,26,.35);color:rgba(255,130,50,.9);background:rgba(255,106,26,.06)}
.filter-search-orange::placeholder{color:rgba(255,130,50,.45)}
.filter-search-orange:focus{border-color:rgba(255,106,26,.55)!important;box-shadow:0 0 0 3px rgba(255,106,26,.12),0 0 14px rgba(255,106,26,.15)!important}

/* Tabs */
.tabs{display:flex;gap:0;border-bottom:1px solid var(--border);margin-bottom:24px}
.tab-btn{padding:12px 20px;font-size:13.5px;font-weight:600;color:var(--text-muted);background:none;border:none;border-bottom:2px solid transparent;cursor:pointer;transition:all .3s var(--ease);text-decoration:none}
.tab-btn:hover{color:var(--purple);text-shadow:0 0 10px var(--purple-glow)}
.tab-btn.active{color:var(--green);border-bottom-color:var(--green)}

/* Language */
.lang-switch{display:flex;gap:3px;background:rgba(8,14,8,.75);border-radius:var(--radius);padding:3px;border:1px solid rgba(74,222,128,.2);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.lang-btn{padding:3px 9px;border-radius:6px;font-size:11px;font-weight:700;color:rgba(74,222,128,.5);background:transparent;transition:all .25s var(--ease);text-decoration:none;letter-spacing:.8px;border:1px solid transparent}
.lang-btn:hover{color:#d1fae5;border-color:rgba(74,222,128,.2);text-shadow:0 0 8px rgba(74,222,128,.4)}
.lang-btn.active{background:radial-gradient(circle at center,rgba(74,222,128,.55) 0%,rgba(74,222,128,.18) 55%,rgba(8,14,8,.7) 100%);color:#d1fae5;border-color:rgba(74,222,128,.35);box-shadow:0 0 10px rgba(74,222,128,.28);animation:lang-btn-glow 2.8s ease-in-out infinite}
@keyframes lang-btn-glow{0%,100%{box-shadow:0 0 8px rgba(74,222,128,.25),0 0 0 0 rgba(74,222,128,.15)}50%{box-shadow:0 0 14px rgba(74,222,128,.4),0 0 0 3px rgba(74,222,128,0)}}

/* Empty */
.empty-state{text-align:center;padding:80px 20px;color:var(--text-muted)}
.empty-state .empty-icon{font-size:56px;margin-bottom:14px;opacity:.6}
.empty-state h3{color:var(--text-secondary);margin-bottom:8px;font-weight:600}

/* Footer */
.site-footer{padding:24px 0;text-align:center;font-size:12.5px;color:var(--text-muted);border-top:1px solid var(--border)}
.site-footer a,.site-footer a:visited{color:var(--text-muted)}.site-footer a:hover{color:var(--purple)}

/* Infinite Scroll */
.scroll-loader{display:flex;align-items:center;justify-content:center;gap:10px;padding:36px;color:var(--text-muted);font-size:13px;font-weight:500}
.loader-spinner{width:22px;height:22px;border:2.5px solid var(--border);border-top-color:var(--green);border-radius:50%;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.scroll-end{text-align:center;padding:28px;color:var(--text-muted);font-size:13px;position:relative}
.scroll-end::before{content:'';position:absolute;top:50%;left:20%;right:20%;height:1px;background:linear-gradient(90deg,transparent,var(--border),transparent)}
.scroll-end span{position:relative;background:var(--bg-base);padding:0 16px}

/* Mobile Bottom Nav */
.mobile-bottom-nav{display:none;position:fixed;bottom:0;left:0;right:0;z-index:1000;background:var(--bg-glass);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border-top:1px solid var(--border);justify-content:space-around;padding:6px 0 env(safe-area-inset-bottom,8px)}
.bottom-nav-item{display:flex;flex-direction:column;align-items:center;gap:2px;font-size:10px;color:var(--text-muted);text-decoration:none;padding:4px 12px;transition:all .2s;position:relative;font-weight:500}
.bottom-nav-item span{font-size:20px;position:relative;transition:transform .2s var(--ease-spring)}
.bottom-nav-item:active span{transform:scale(0.85)}
.bottom-nav-item.active{color:var(--green)}
.bottom-nav-item.upload-btn span{background:var(--green);color:var(--text-inverse);width:44px;height:44px;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;font-size:20px;margin-top:-18px;box-shadow:0 4px 20px rgba(74,222,128,0.25);border:2px solid var(--bg-base)}
.bottom-badge{position:absolute;top:-4px;right:-8px;background:var(--red);color:#fff;font-size:8px;font-style:normal;min-width:14px;height:14px;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;font-weight:700;border:2px solid var(--bg-base)}

/* Responsive */
@media(max-width:768px){
    .mobile-bottom-nav{display:flex}
    .page-content{padding-bottom:100px;padding-top:calc(var(--nav-h) + 16px)}
    .site-footer{padding-bottom:80px}
    .nav-links{display:none;position:absolute;top:var(--nav-h);left:0;right:0;background:var(--bg-glass);backdrop-filter:blur(24px);border-bottom:1px solid var(--border);flex-direction:column;padding:12px;animation:menuSlide .25s var(--ease);max-height:80vh;overflow-y:auto}
    @keyframes menuSlide{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
    .nav-links.show{display:flex}
    .mobile-menu-btn{display:block;flex-shrink:0}
    /* Block M2: Top-Bar entschlacken — redundante Actions raus (via Bottom-Nav
       erreichbar), Hamburger garantiert sichtbar. Sichtbar bleiben: Brand,
       User-Suche, Nachrichten, Warenkorb, Hamburger. */
    .nav-mobile-hide{display:none!important}
    .nav-actions{gap:4px}
    .nav-xp{display:none} /* M2: Avatar-Dropdown bleibt (Account/Logout), Lv.-Text spart Platz */
    .nav-mobile-langswitch{display:flex;justify-content:center;gap:10px;width:100%;padding:2px 0 12px;margin-bottom:8px;border-bottom:1px solid var(--border)}
    /* Block M4 (2026-06-02): Post-"+"-Menü im Hamburger inline statt absolut
       (öffnete sonst off-screen rechts → unsichtbar). Zentriert, volle Breite,
       erweitert das Menü im Fluss. */
    .nav-post-wrap{width:100%;display:flex;flex-direction:column;align-items:center}
    .nav-post-menu{position:static;width:100%;right:auto;left:auto;top:auto;transform:none;box-shadow:none;background:transparent;padding:8px 0 0;margin-top:6px;animation:none}
    .nav-post-header{text-align:center}
    .nav-post-grid{grid-template-columns:repeat(2,1fr);max-width:320px;margin:0 auto}
    .nav-dropdown-wrap{width:100%}
    .nav-dd-trigger{width:100%;justify-content:flex-start}
    .nav-dd-menu{position:static;transform:none;box-shadow:none;border:none;min-width:0;padding:0 0 0 12px;background:transparent;animation:none}
    .nav-dropdown-wrap .nav-dd-menu{display:none}
    .nav-dropdown-wrap.open .nav-dd-menu{display:block}
    .nav-dropdown-wrap:hover .nav-dd-menu{display:none}
    .nav-dropdown-wrap.open:hover .nav-dd-menu{display:block}
    .nav-mega-menu{border:none!important;box-shadow:none!important;background:transparent!important}
    .nav-mega-header{display:none}
    .nav-mega-menu .nav-dd-item:hover{padding-left:14px!important}
    .nav-arena-quick{padding:4px 0}
    .upload-detail{grid-template-columns:1fr}
    .upload-image-container{position:static}
    .upload-sidebar .card{position:static}
    .profile-header{flex-direction:column;align-items:center;text-align:center;padding:24px}
    .profile-avatar-large{width:80px;height:80px}
    .profile-name{font-size:22px}
    .profile-stats{justify-content:center}
    .profile-meta{justify-content:center;flex-wrap:wrap}
    .admin-layout{grid-template-columns:1fr}
    /* Block M3 (2026-06-02): Admin-Nav mobil als klare einspaltige Liste.
       Vorher flex-wrap+overflow-x:auto → Items wurden rechts geclippt und waren
       unerreichbar. Jetzt volle Breite pro Link, kein H-Overflow, gut tappbar. */
    .admin-sidebar{position:static;display:block;overflow-x:visible;padding:8px}
    .admin-nav-group{padding:10px 10px 4px;margin-top:2px;font-size:9px}
    .admin-nav-link{width:100%}
    .form-row{grid-template-columns:1fr}
    .filter-bar{flex-direction:column;gap:8px}
    .hero h1{font-size:36px}
    .hero p{font-size:15px}
    .hero{padding:56px 16px 40px}
    .upload-grid{grid-template-columns:repeat(auto-fill,minmax(155px,1fr));gap:12px}
    .card-info{padding:10px 12px}
    .card-title{font-size:13px}
    .auth-container{margin:20px auto}
    .auth-card{padding:28px 24px}
    .conversation-messages{max-height:60vh}
}
@media(max-width:360px){
    .upload-grid{grid-template-columns:repeat(2,1fr);gap:8px}
    .filter-group{flex-wrap:wrap}
}

/* Lucide Icon Integration */
.nav-link svg, .nav-upload-btn svg, .nav-brand svg { vertical-align: -2px; }
.card-stats svg { vertical-align: -2px; opacity: 0.7; }
.card-stats span { display: inline-flex; align-items: center; gap: 3px; }
.vote-btn svg { vertical-align: -2px; }
.stat-icon svg { color: var(--green-primary); }
.admin-nav-link svg { vertical-align: -3px; margin-right: 2px; }
.brand-icon svg { color: var(--green-primary); }
h3 svg { vertical-align: -3px; color: var(--green-primary); }

/* === UPLOAD CTA BANNER === */
.upload-cta-banner{margin:-8px -16px 20px;padding:0 16px}
.upload-cta-inner{position:relative;background:linear-gradient(135deg,rgba(74,222,128,.06),rgba(139,92,246,.06));border:1px solid rgba(74,222,128,.15);border-radius:16px;padding:20px 24px;overflow:hidden}
.upload-cta-glow{position:absolute;top:-40px;right:-40px;width:120px;height:120px;background:radial-gradient(circle,rgba(74,222,128,.15),transparent 70%);pointer-events:none}
.upload-cta-content{display:flex;align-items:center;gap:16px;position:relative;z-index:1}
.upload-cta-icon{width:52px;height:52px;border-radius:14px;background:rgba(74,222,128,.1);display:flex;align-items:center;justify-content:center;color:var(--green);flex-shrink:0}
.upload-cta-text{flex:1;min-width:0}
.upload-cta-text h3{font-size:16px;font-weight:700;margin:0 0 2px}
.upload-cta-typing{color:var(--text-muted);font-size:13px;min-height:18px}
/* Typing cursor (only for typing effect) */
.upload-cta-typing.fx-typing::after{content:'|';animation:blink .7s infinite;color:var(--green);font-weight:300}
@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}
/* Fade-in effect */
.upload-cta-typing.fx-fadein{transition:opacity .6s ease, transform .6s ease}
.upload-cta-typing.fx-fadein.fade-out{opacity:0;transform:translateY(6px)}
.upload-cta-typing.fx-fadein.fade-in{opacity:1;transform:translateY(0)}
/* Glow effect */
.upload-cta-typing.fx-glow{transition:opacity .5s ease}
.upload-cta-typing.fx-glow.glow-active{text-shadow:0 0 8px rgba(74,222,128,.6),0 0 20px rgba(74,222,128,.3);color:var(--green)}
.upload-cta-typing.fx-glow.glow-dim{opacity:0;text-shadow:none}
/* Scramble effect */
.upload-cta-typing.fx-scramble{font-family:'Courier New',monospace;letter-spacing:.5px}
.upload-cta-btn{white-space:nowrap;flex-shrink:0;background:radial-gradient(circle at center,rgba(74,222,128,.55) 0%,rgba(74,222,128,.18) 55%,rgba(8,14,8,.75) 100%)!important;color:#d1fae5!important;border:1px solid rgba(74,222,128,.35)!important;box-shadow:0 0 12px rgba(74,222,128,.25)!important;animation:upload-btn-glow 3s ease-in-out infinite;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.upload-cta-btn:hover{background:radial-gradient(circle at center,rgba(74,222,128,.72) 0%,rgba(74,222,128,.30) 55%,rgba(8,14,8,.60) 100%)!important;color:#d1fae5!important;animation:none!important;box-shadow:0 0 24px rgba(74,222,128,.45)!important;border-color:rgba(74,222,128,.6)!important;transform:translateY(-1px)}
@media(max-width:600px){
    .upload-cta-content{flex-direction:column;text-align:center}
    .upload-cta-icon{margin:0 auto}
}

/* ================================ */
/* LANDING PAGE                     */
/* ================================ */
.landing-hero {
    text-align: center;
    padding: 60px 20px 40px;
    background: radial-gradient(ellipse at center, rgba(74,222,128,0.06) 0%, transparent 70%);
    border-radius: var(--radius-lg);
    margin-bottom: 32px;
}
.landing-logo { margin-bottom: 16px; }
.landing-logo svg { color: var(--green-primary); filter: drop-shadow(0 0 20px rgba(74,222,128,0.3)); }
.landing-hero h1 {
    font-family: var(--font-display);
    font-size: 48px;
    letter-spacing: -0.02em;
    margin-bottom: 8px;
    background: linear-gradient(135deg, #4ade80, #22c55e);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.landing-tagline { font-size: 18px; color: var(--text-muted); margin-bottom: 32px; max-width: 500px; margin-left: auto; margin-right: auto; }
.landing-stats { display: flex; flex-wrap: wrap; justify-content: center; gap: 20px 32px; margin-bottom: 32px; max-width: 700px; margin-left: auto; margin-right: auto; }
.landing-stat { display: flex; flex-direction: column; align-items: center; min-width: 80px; }
.landing-stat-icon { color: var(--green); opacity: .6; margin-bottom: 2px; }
.landing-stat-num { font-size: 24px; font-weight: 800; color: var(--green); line-height: 1.1; }
.landing-stat-label { font-size: 11px; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.04em; white-space: nowrap; }
.landing-cta { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }

/* Home stats bar (logged-in) */
.home-stats-bar{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 16px;padding:12px 16px;margin-bottom:16px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md)}
.home-stat-item{display:flex;align-items:center;gap:5px;font-size:12.5px;color:var(--text-secondary)}
.home-stat-icon{color:var(--green);opacity:.6;display:flex}
.home-stat-num{font-weight:700;color:var(--green)}
.home-stat-label{color:var(--text-muted);font-size:11px;text-transform:uppercase;letter-spacing:.03em}

/* ================================ */
/* GIVEAWAY BANNER                  */
/* ================================ */
.giveaway-banner {
    background: linear-gradient(135deg, rgba(74,222,128,0.08), rgba(250,204,21,0.06));
    border: 1px solid rgba(74,222,128,0.15);
    border-radius: var(--radius-lg);
    padding: 24px;
    margin-bottom: 32px;
    position: relative;
    overflow: hidden;
}
.giveaway-banner::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -20%;
    width: 200px;
    height: 200px;
    background: radial-gradient(circle, rgba(74,222,128,0.1), transparent 70%);
    border-radius: 50%;
    pointer-events: none;
}
.giveaway-inner { display: flex; gap: 24px; align-items: center; justify-content: space-between; flex-wrap: wrap; position: relative; z-index: 1; }
.giveaway-info { flex: 1; min-width: 280px; }
.giveaway-tag {
    display: inline-flex; align-items: center; gap: 4px;
    font-size: 11px; font-weight: 800; letter-spacing: 0.1em;
    color: #fbbf24; background: rgba(251,191,36,0.1);
    padding: 3px 10px; border-radius: 20px;
    border: 1px solid rgba(251,191,36,0.2);
    margin-bottom: 8px;
}
.giveaway-tag svg { color: #fbbf24; }
.giveaway-banner h3 { font-size: 20px; font-weight: 700; margin-bottom: 4px; }
.giveaway-desc { font-size: 14px; color: var(--text-muted); margin-bottom: 8px; }
.giveaway-prize { font-size: 14px; margin-bottom: 8px; display: flex; align-items: center; gap: 6px; }
.giveaway-prize svg { color: #fbbf24; }
.giveaway-meta { display: flex; gap: 16px; font-size: 13px; color: var(--text-muted); }
.giveaway-meta span { display: flex; align-items: center; gap: 4px; }
.giveaway-action { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.giveaway-countdown { display: flex; gap: 8px; }
.countdown-item {
    display: flex; flex-direction: column; align-items: center;
    background: rgba(0,0,0,0.3); padding: 8px 12px; border-radius: var(--radius);
    min-width: 50px; border: 1px solid rgba(255,255,255,0.06);
}
.countdown-item span { font-size: 22px; font-weight: 800; color: var(--green-primary); }
.countdown-item small { font-size: 10px; color: var(--text-muted); text-transform: uppercase; }
.giveaway-entered {
    display: flex; align-items: center; gap: 6px;
    color: var(--green-primary); font-weight: 700; font-size: 14px;
    padding: 10px 20px; background: rgba(74,222,128,0.1);
    border-radius: var(--radius); border: 1px solid rgba(74,222,128,0.2);
}

/* ================================ */
/* RAFFLE HERO BANNER               */
/* ================================ */
@keyframes raffle-shimmer {
    0% { transform: translateX(-100%); }
    100% { transform: translateX(200%); }
}
@keyframes raffle-pulse {
    0%, 100% { opacity: 0.6; }
    50% { opacity: 1; }
}
.raffle-hero {
    position: relative;
    background: linear-gradient(135deg, #1a0a2e 0%, #16082b 30%, #0d1117 70%, #0a0e14 100%);
    border: 1px solid rgba(167,139,250,0.25);
    border-radius: 16px;
    padding: 28px 32px;
    margin-bottom: 32px;
    overflow: hidden;
}
.raffle-hero-glow {
    position: absolute;
    top: -60%;
    left: -10%;
    width: 350px;
    height: 350px;
    background: radial-gradient(circle, rgba(139,92,246,0.25) 0%, rgba(139,92,246,0.08) 40%, transparent 70%);
    border-radius: 50%;
    pointer-events: none;
    animation: raffle-pulse 4s ease-in-out infinite;
}
.raffle-hero::after {
    content: '';
    position: absolute;
    bottom: -40%;
    right: -5%;
    width: 280px;
    height: 280px;
    background: radial-gradient(circle, rgba(251,146,60,0.12) 0%, transparent 65%);
    border-radius: 50%;
    pointer-events: none;
}
.raffle-hero-shimmer {
    position: absolute;
    top: 0; left: 0;
    width: 50%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(167,139,250,0.06), transparent);
    pointer-events: none;
    animation: raffle-shimmer 5s ease-in-out infinite;
}
.raffle-hero-content {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
}
.raffle-hero-left { flex: 1; min-width: 0; }
.raffle-hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: #c084fc;
    background: rgba(192,132,252,0.12);
    padding: 4px 14px;
    border-radius: 20px;
    border: 1px solid rgba(192,132,252,0.3);
    margin-bottom: 12px;
    animation: raffle-pulse 3s ease-in-out infinite;
}
.raffle-hero-badge svg { color: #c084fc; }
.raffle-hero-title {
    font-size: 24px;
    font-weight: 800;
    margin: 0 0 14px;
    background: linear-gradient(135deg, #e2d5f8 0%, #c084fc 50%, #a78bfa 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    line-height: 1.2;
}
.raffle-hero-prize {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: rgba(167,139,250,0.08);
    border: 1px solid rgba(167,139,250,0.15);
    border-radius: 12px;
    margin-bottom: 16px;
}
.raffle-hero-prize-icon {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    background: linear-gradient(135deg, rgba(139,92,246,0.3), rgba(192,132,252,0.15));
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.raffle-hero-prize-icon svg { color: #c084fc; }
.raffle-hero-prize-label {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-muted);
    margin-bottom: 2px;
}
.raffle-hero-prize-name {
    font-size: 15px;
    font-weight: 700;
    color: #f0ecf9;
}
.raffle-hero-prize-value {
    color: #c084fc;
    font-weight: 800;
}
.raffle-hero-stats {
    display: flex;
    gap: 20px;
    margin-bottom: 12px;
}
.raffle-hero-stat {
    display: flex;
    flex-direction: column;
}
.raffle-hero-stat-num {
    font-size: 18px;
    font-weight: 800;
    color: #e8e0f5;
}
.raffle-hero-stat-sep {
    color: var(--text-muted);
    font-weight: 400;
    margin: 0 1px;
}
.raffle-hero-stat-label {
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-muted);
}
.raffle-hero-bar {
    width: 100%;
    height: 5px;
    background: rgba(255,255,255,0.06);
    border-radius: 3px;
    overflow: hidden;
}
.raffle-hero-bar-fill {
    height: 100%;
    background: linear-gradient(90deg, #8b5cf6, #c084fc, #e879f9);
    border-radius: 3px;
    transition: width 0.6s ease;
    box-shadow: 0 0 8px rgba(139,92,246,0.4);
}
/* Right side: timer + CTA */
.raffle-hero-right {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    flex-shrink: 0;
}
.raffle-hero-timer-label {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--text-muted);
}
.raffle-hero-timer {
    display: flex;
    align-items: center;
    gap: 4px;
}
.raffle-hero-timer-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    background: rgba(139,92,246,0.12);
    border: 1px solid rgba(139,92,246,0.25);
    padding: 8px 10px 6px;
    border-radius: 10px;
    min-width: 52px;
}
.raffle-hero-timer-box span {
    font-size: 24px;
    font-weight: 900;
    color: #c084fc;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}
.raffle-hero-timer-box small {
    font-size: 9px;
    font-weight: 600;
    text-transform: uppercase;
    color: rgba(192,132,252,0.5);
    margin-top: 2px;
}
.raffle-hero-timer-sep {
    font-size: 20px;
    font-weight: 800;
    color: rgba(139,92,246,0.35);
    line-height: 1;
    padding-bottom: 12px;
}
.raffle-hero-cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 28px;
    font-size: 14px;
    font-weight: 800;
    color: #fff;
    background: linear-gradient(135deg, #8b5cf6, #7c3aed);
    border: none;
    border-radius: 12px;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.2s;
    box-shadow: 0 4px 20px rgba(139,92,246,0.35), inset 0 1px 0 rgba(255,255,255,0.1);
    width: 100%;
    justify-content: center;
}
.raffle-hero-cta:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 28px rgba(139,92,246,0.5), inset 0 1px 0 rgba(255,255,255,0.15);
    color: #fff;
}
.raffle-hero-cta svg { color: #fff; }
@media (max-width: 700px) {
    .raffle-hero { padding: 20px; }
    .raffle-hero-content { flex-direction: column; gap: 20px; }
    .raffle-hero-right { width: 100%; }
    .raffle-hero-title { font-size: 20px; }
    .raffle-hero-stats { gap: 14px; }
}

/* ================================ */
/* PLANT OF THE WEEK                */
/* ================================ */
.potw-section { margin-bottom: 32px; }
.section-title { display: flex; align-items: center; gap: 8px; margin-bottom: 16px; font-size: 18px; }
.section-title svg { color: var(--green-primary); }
.potw-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.potw-card {
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    overflow: hidden;
    position: relative;
    transition: transform 0.2s, border-color 0.2s;
}
.potw-card:hover { transform: translateY(-2px); }
.potw-gold { border-color: rgba(251,191,36,0.4); box-shadow: 0 0 20px rgba(251,191,36,0.1); }
.potw-silver { border-color: rgba(192,192,192,0.3); }
.potw-bronze { border-color: rgba(205,127,50,0.3); }
.potw-image { position: relative; display: block; background: var(--bg-base); }
.potw-image img { width: 100%; aspect-ratio: 3/4; object-fit: cover; display: block; }
.potw-rank {
    position: absolute; top: 10px; right: 10px; z-index: 2;
    width: 32px; height: 32px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-weight: 800; font-size: 14px;
    background: rgba(0,0,0,0.7); backdrop-filter: blur(8px);
    border: 2px solid rgba(255,255,255,0.1);
}
.potw-gold .potw-rank { background: rgba(251,191,36,0.9); color: #000; border-color: #fbbf24; }
.potw-silver .potw-rank { background: rgba(192,192,192,0.9); color: #000; border-color: #c0c0c0; }
.potw-bronze .potw-rank { background: rgba(205,127,50,0.9); color: #000; border-color: #cd7f32; }
.potw-info { padding: 12px 14px; }
.potw-title { font-weight: 700; font-size: 14px; margin-bottom: 6px; }
.potw-user { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--text-muted); margin-bottom: 6px; }
.potw-user img { width: 18px; height: 18px; border-radius: 50%; object-fit: cover; }
.potw-stats { display: flex; gap: 12px; font-size: 12px; color: var(--text-muted); }
.potw-stats span { display: inline-flex; align-items: center; gap: 3px; }
.potw-stats svg { opacity: 0.6; }

/* Welcome Hero (logged-in) */
.welcome-hero{position:relative;overflow:hidden;margin-bottom:24px;padding:32px 24px 20px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);text-align:center;min-height:120px}
.welcome-glow{position:absolute;inset:0;opacity:0;pointer-events:none;background:radial-gradient(ellipse at 50% 40%,rgba(74,222,128,.12) 0%,transparent 70%);z-index:0}
.welcome-particles{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.welcome-particles .wp{position:absolute;opacity:0;font-size:10px;font-weight:800;color:rgba(200,168,92,.7);text-shadow:0 0 6px rgba(200,168,92,.4);user-select:none}
.welcome-hero-content{position:relative;z-index:1}
.welcome-greeting{font-size:14px;color:var(--text-muted);margin-bottom:2px}
.welcome-wb{font-weight:400}
.welcome-username{font-size:28px;font-weight:800;display:block;margin-top:2px;background:linear-gradient(135deg,#4ade80,#22c55e,#86efac,#4ade80);background-size:300% 300%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.welcome-level{font-size:12.5px;color:var(--text-muted);letter-spacing:.5px;margin-top:4px;display:flex;align-items:center;justify-content:center;gap:4px;opacity:0;transform:translateY(8px)}
.welcome-stats-bar{margin-top:16px;border:none;background:transparent;padding:10px 0 0}

/* Welcome Animation (~5s total, only on first visit per session) */
.welcome-animate .welcome-glow{animation:wGlow 3.5s ease forwards}
.welcome-animate .welcome-wb{opacity:0;animation:wFadeSlide .7s .2s ease forwards}
.welcome-animate .welcome-username{opacity:0;animation:wNameReveal 1.4s .5s cubic-bezier(.16,1,.3,1) forwards,wNameShimmer 3s 1.9s ease-in-out infinite}
.welcome-animate .welcome-level{animation:wFadeSlide .7s 1.6s ease forwards}
.welcome-animate #welcomeXpFill{transition:width 1.5s 2s cubic-bezier(.25,.46,.45,.94)}
.welcome-animate .welcome-stats-bar{opacity:0;animation:wFadeSlide .7s 2.8s ease forwards}

/* Static state (no animation) */
.welcome-hero:not(.welcome-animate) .welcome-level{opacity:1;transform:none}
.welcome-hero:not(.welcome-animate) .welcome-username{opacity:1}

@keyframes wGlow{0%{opacity:0}20%{opacity:1}60%{opacity:.8}100%{opacity:.4}}
@keyframes wFadeSlide{0%{opacity:0;transform:translateY(8px)}100%{opacity:1;transform:translateY(0)}}
@keyframes wNameReveal{0%{opacity:0;letter-spacing:14px;filter:brightness(2) drop-shadow(0 0 24px rgba(74,222,128,.8))}25%{opacity:1;filter:brightness(1.6) drop-shadow(0 0 30px rgba(74,222,128,.7))}55%{letter-spacing:0;filter:brightness(1.15) drop-shadow(0 0 12px rgba(74,222,128,.3))}80%{letter-spacing:-.01em}100%{opacity:1;letter-spacing:-.02em;filter:brightness(1) drop-shadow(0 0 0 transparent)}}
@keyframes wNameShimmer{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
@keyframes wXpRise{0%{opacity:0;transform:translateY(0) scale(.6)}10%{opacity:.8;transform:scale(.9)}50%{opacity:.5}100%{opacity:0;transform:translateY(-120px) scale(.5)}}

@media (max-width: 640px) {
    .welcome-username{font-size:22px}
    .landing-hero h1 { font-size: 32px; }
    .landing-stats { gap: 14px 20px; }
    .landing-stat { min-width: 70px; }
    .landing-stat-num { font-size: 20px; }
    .giveaway-inner { flex-direction: column; text-align: center; }
    .giveaway-meta { justify-content: center; }
    .potw-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 420px) {
    .potw-grid { grid-template-columns: 1fr; }
}

/* Back button */
.back-btn:hover{color:var(--purple)!important;text-shadow:0 0 10px var(--purple-glow)}
.back-btn:active{color:var(--green)!important}

/* Floating Back Button — appears on scroll, fixed bottom-left */
.floating-back{position:fixed;bottom:24px;left:24px;z-index:90;display:flex;align-items:center;gap:6px;padding:10px 16px;border-radius:var(--radius-full);background:var(--bg-glass);backdrop-filter:blur(12px);border:1px solid var(--border-light);color:var(--text-secondary);font-size:13px;font-weight:500;text-decoration:none;box-shadow:var(--shadow);opacity:0;transform:translateY(20px);transition:opacity .3s,transform .3s,background .2s,color .2s;pointer-events:none;cursor:pointer}
.floating-back.visible{opacity:1;transform:translateY(0);pointer-events:auto}
.floating-back:hover{background:var(--bg-elevated);color:var(--text-primary);border-color:var(--border-accent);box-shadow:var(--shadow-lg),var(--shadow-glow)}
.floating-back svg{flex-shrink:0}

/* Floating Action Bar — for editors/long forms, fixed bottom-right */
.floating-actions{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);z-index:90;display:flex;gap:8px;padding:10px 20px;border-radius:var(--radius-full);background:var(--bg-glass);backdrop-filter:blur(12px);border:1px solid var(--border-light);box-shadow:var(--shadow-lg);opacity:0;transition:opacity .3s,transform .3s;pointer-events:none}
.floating-actions.visible{opacity:1;transform:translateX(-50%) translateY(0);pointer-events:auto}
.floating-actions .btn{font-size:12px;padding:8px 16px;border-radius:var(--radius)}
.floating-actions .btn-draft{background:var(--bg-hover);color:var(--text-secondary);border:1px solid var(--border)}
.floating-actions .btn-draft:hover{background:var(--bg-elevated);color:var(--orange);border-color:rgba(251,191,36,.3)}
.floating-actions .btn-publish{background:var(--green-dark);color:#fff;border:none}
.floating-actions .btn-publish:hover{background:var(--green);box-shadow:0 0 16px rgba(34,197,94,.3)}

/* Emoji picker */
.emoji-picker-btn{background:none;border:none;font-size:20px;cursor:pointer;padding:4px 8px;border-radius:var(--radius);transition:all .2s}
.emoji-picker-btn:hover{background:var(--purple-subtle)}
.emoji-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:2px;padding:8px;background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-md);position:absolute;bottom:100%;left:0;z-index:100;box-shadow:var(--shadow-lg);max-height:200px;overflow-y:auto;min-width:280px}
.emoji-grid button{background:none;border:none;font-size:20px;padding:6px;cursor:pointer;border-radius:4px;transition:background .15s}
.emoji-grid button:hover{background:var(--purple-subtle)}

/* Follower modal */
.follower-modal{position:fixed;inset:0;z-index:2000;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,0.7);backdrop-filter:blur(8px)}
.follower-modal.show{display:flex}
.follower-list{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-xl);width:90%;max-width:400px;max-height:70vh;overflow-y:auto;padding:24px}
.follower-list h3{margin-bottom:16px;font-size:18px}
.follower-item{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--border)}
.follower-item:last-child{border-bottom:none}
.follower-item img{width:36px;height:36px;border-radius:50%;object-fit:cover}
.follower-item a{color:var(--text-primary);font-weight:600;font-size:14px}
.follower-item a:hover{color:var(--purple)}

/* Forum */
.mention{color:var(--green);font-weight:600;text-decoration:none}
.mention:hover{text-decoration:underline}
select{background-color:var(--bg-input,#141614);color:var(--text-primary,#eaeee9);color-scheme:dark}
select option{background:#141614;color:#eaeee9}
select:focus{border-color:var(--green);outline:none}

/* Bookmark button */
.bookmark-btn{transition:all .2s}
.bookmark-btn.bookmarked{color:#4ade80 !important;border-color:rgba(74,222,128,.45) !important;box-shadow:0 0 8px rgba(74,222,128,.2)}
.bookmark-btn.bookmarked svg{fill:#4ade80}
.bookmark-btn:hover{border-color:rgba(74,222,128,.45) !important}
/* Thread header badges — neon-glow (replaces solid green) */
.thread-badge{display:inline-flex;align-items:center;gap:4px;font-size:11px;padding:2px 8px;border-radius:4px;font-weight:600}
.thread-badge-neon{background:transparent;border:1px solid rgba(74,222,128,.4);color:#4ade80;box-shadow:0 0 8px rgba(74,222,128,.18)}

/* Lightbox */
#lightbox-overlay{animation:fadeIn .2s ease}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
#lightbox-img{animation:zoomIn .2s ease}
@keyframes zoomIn{from{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}

/* Forum poll */
.poll-option-label:hover{border-color:var(--green) !important}

/* Online dot pulse */
@keyframes pulse-online{0%,100%{opacity:1}50%{opacity:.6}}
.online-dot{position:absolute;bottom:2px;right:2px;width:12px;height:12px;background:#22c55e;border-radius:50%;border:2px solid var(--card-bg);animation:pulse-online 2s ease-in-out infinite}

/* === Nav Dropdown Enhancements === */
.nav-dd-item{margin:2px 0}
.nav-dd-item.active{background:rgba(74,222,128,0.12);font-weight:600}
.nav-dd-hint{opacity:0.6;transition:opacity .15s}
.nav-dd-item:hover .nav-dd-hint{opacity:1}

/* === Lord of Weed — Shared Visual Polish === */

/* Glassmorphism */
.glass-card {
    background: rgba(20, 30, 25, 0.6);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(74, 222, 128, 0.1);
    border-radius: 16px;
}

/* Hover Lift */
.hover-lift { transition: transform .2s, box-shadow .2s; }
.hover-lift:hover { transform: translateY(-4px); box-shadow: 0 8px 30px rgba(0,0,0,0.2); }

/* Glow Text */
.glow-text { text-shadow: 0 0 10px currentColor; }
.glow-text-green { text-shadow: 0 0 10px rgba(74,222,128,0.5), 0 0 20px rgba(74,222,128,0.2); }

/* Shimmer Background */
.shimmer {
    position: relative;
    overflow: hidden;
}
.shimmer::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 50%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.05), transparent);
    animation: utilShimmer 3s linear infinite;
}
@keyframes utilShimmer { 0% { left: -100%; } 100% { left: 200%; } }

/* Pulse Dot */
.pulse-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #4ade80;
    display: inline-block;
    animation: utilPulse 2s ease-in-out infinite;
}
@keyframes utilPulse { 0%,100% { opacity:1; box-shadow:0 0 4px #4ade80; } 50% { opacity:0.5; box-shadow:0 0 8px #4ade80; } }

/* Staggered Fade-In (general purpose) */
.stagger-in { opacity: 0; animation: utilFadeUp 0.4s ease forwards; }
@keyframes utilFadeUp { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:none; } }

/* Skeleton Loading */
.skeleton {
    background: linear-gradient(90deg, rgba(255,255,255,0.03) 25%, rgba(255,255,255,0.06) 50%, rgba(255,255,255,0.03) 75%);
    background-size: 200% 100%;
    animation: utilSkeleton 1.5s ease infinite;
    border-radius: 8px;
}
@keyframes utilSkeleton { 0% { background-position:200% 0; } 100% { background-position:-200% 0; } }

/* Neon Border */
.neon-border-green { border: 1px solid rgba(74,222,128,0.2); box-shadow: 0 0 8px rgba(74,222,128,0.06), inset 0 0 8px rgba(74,222,128,0.02); }
.neon-border-gold { border: 1px solid rgba(245,158,11,0.2); box-shadow: 0 0 8px rgba(245,158,11,0.06); }
.neon-border-red { border: 1px solid rgba(239,68,68,0.2); box-shadow: 0 0 8px rgba(239,68,68,0.06); }
.neon-border-purple { border: 1px solid rgba(191,90,242,0.25); box-shadow: 0 0 8px var(--purple-glow), inset 0 0 8px rgba(191,90,242,0.02); }

/* Forum Panels — lila Rahmen + Glow, subtiler Background für Abgrenzung von inneren Feldern */
.forum-panel { border: 1px solid rgba(191,90,242,0.35); box-shadow: 0 0 14px var(--purple-glow); border-radius: 10px; padding: 14px 16px; background: rgba(191,90,242,0.05); }

/* Upload Button Neon Purple */
.btn-upload-neon-purple { background: radial-gradient(circle at center,rgba(191,90,242,.45) 0%,rgba(191,90,242,.15) 55%,rgba(7,8,7,.8) 100%); color:#e9d5ff; border:1px solid rgba(191,90,242,.4)!important; box-shadow:0 0 14px rgba(191,90,242,.2); animation:neon-purple-btn-glow 3s ease-in-out infinite; letter-spacing:.3px; }
.btn-upload-neon-purple:hover { background:radial-gradient(circle at center,rgba(191,90,242,.65) 0%,rgba(191,90,242,.28) 55%,rgba(7,8,7,.65) 100%); color:#f3e8ff; animation:none; box-shadow:0 0 28px rgba(191,90,242,.45); border-color:rgba(191,90,242,.7)!important; transform:translateY(-2px); }
@keyframes neon-purple-btn-glow { 0%,100%{box-shadow:0 0 10px rgba(191,90,242,.18),0 0 0 0 rgba(191,90,242,.12)} 50%{box-shadow:0 0 20px rgba(191,90,242,.35),0 0 0 4px rgba(191,90,242,0)} }

/* Inline Field Error */
.field-error { display:none; color:var(--red); font-size:12px; margin-top:4px; align-items:center; gap:4px; }
.field-error.visible { display:flex; }

/* ================================================================
   PROFILE THEMES — 8 Cannabis-inspired profile styles
   ================================================================ */
.profile-page{--pt-primary:#4ade80;--pt-secondary:#22c55e;--pt-glow:rgba(74,222,128,0.15);--pt-ring:rgba(74,222,128,0.4);--pt-tab:#4ade80;--pt-banner:linear-gradient(135deg,#061a0f 0%,#0a2818 40%,#051209 100%)}
[data-pt="purple-haze"]{--pt-primary:#a855f7;--pt-secondary:#7c3aed;--pt-glow:rgba(168,85,247,0.15);--pt-ring:rgba(168,85,247,0.4);--pt-tab:#a855f7;--pt-banner:linear-gradient(135deg,#1a0a2e 0%,#2d1650 50%,#0f0520 100%)}
[data-pt="golden-leaf"]{--pt-primary:#f59e0b;--pt-secondary:#d97706;--pt-glow:rgba(245,158,11,0.15);--pt-ring:rgba(245,158,11,0.4);--pt-tab:#f59e0b;--pt-banner:linear-gradient(135deg,#1a1000 0%,#2d1d08 50%,#120c02 100%)}
[data-pt="blueberry"]{--pt-primary:#3b82f6;--pt-secondary:#2563eb;--pt-glow:rgba(59,130,246,0.15);--pt-ring:rgba(59,130,246,0.4);--pt-tab:#3b82f6;--pt-banner:linear-gradient(135deg,#040a1a 0%,#0a1830 50%,#030812 100%)}
[data-pt="sativa-sunrise"]{--pt-primary:#f97316;--pt-secondary:#ea580c;--pt-glow:rgba(249,115,22,0.15);--pt-ring:rgba(249,115,22,0.4);--pt-tab:#f97316;--pt-banner:linear-gradient(135deg,#1a0c02 0%,#2d1a08 40%,#1a1200 100%)}
[data-pt="northern-lights"]{--pt-primary:#2dd4bf;--pt-secondary:#a855f7;--pt-glow:rgba(45,212,191,0.12);--pt-ring:rgba(45,212,191,0.4);--pt-tab:#2dd4bf;--pt-banner:linear-gradient(135deg,#020d1a 0%,#0a1520 40%,#050820 100%)}
[data-pt="white-widow"]{--pt-primary:#e2e8f0;--pt-secondary:#94a3b8;--pt-glow:rgba(226,232,240,0.10);--pt-ring:rgba(226,232,240,0.3);--pt-tab:#cbd5e1;--pt-banner:linear-gradient(135deg,#101418 0%,#181e24 50%,#0c1014 100%)}
[data-pt="diesel"]{--pt-primary:#ef4444;--pt-secondary:#dc2626;--pt-glow:rgba(239,68,68,0.15);--pt-ring:rgba(239,68,68,0.4);--pt-tab:#ef4444;--pt-banner:linear-gradient(135deg,#1a0808 0%,#200a0a 50%,#120404 100%)}
[data-pt="budborn"]{--pt-primary:#56e830;--pt-secondary:#2db80e;--pt-glow:rgba(86,232,48,0.18);--pt-ring:rgba(86,232,48,0.5);--pt-tab:#56e830;--pt-banner:linear-gradient(135deg,#020e04 0%,#0a3318 40%,#041a08 100%)}
[data-pt="budborn"] .pt-avatar-wrap::before{background:conic-gradient(from 0deg,rgba(86,232,48,.9),rgba(45,212,100,.7),rgba(30,180,60,.8),rgba(120,255,80,.6),rgba(86,232,48,.9));animation:ptRingRotate 5s linear infinite;opacity:1}

/* Banner */
.pt-banner{position:relative;height:200px;border-radius:var(--radius-xl) var(--radius-xl) 0 0;background:var(--pt-banner);overflow:hidden}
.pt-banner-img{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.5;will-change:transform}
.pt-banner-anim{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.pt-banner-glow{position:absolute;width:300px;height:300px;border-radius:50%;top:-100px;left:50%;transform:translateX(-50%);background:radial-gradient(circle,var(--pt-glow),transparent 70%);animation:ptGlow 4s ease-in-out infinite alternate;pointer-events:none}
@keyframes ptGlow{0%{opacity:.4;transform:translateX(-50%) scale(1)}100%{opacity:.8;transform:translateX(-50%) scale(1.1)}}

/* Avatar overlap */
.pt-avatar-wrap{position:relative;margin-top:-55px;display:inline-block;z-index:2}
.pt-avatar{width:110px;height:110px;border-radius:50%;object-fit:cover;border:4px solid var(--bg-card);box-shadow:0 0 0 3px var(--pt-primary),0 0 20px var(--pt-glow);transition:box-shadow .3s}
.pt-avatar-ring{animation:none;box-shadow:none;border:4px solid var(--bg-card)}
.pt-avatar-wrap::before{content:'';position:absolute;inset:-5px;border-radius:50%;background:conic-gradient(from 0deg,var(--pt-primary),var(--pt-secondary),var(--pt-primary),transparent,var(--pt-primary));z-index:-1;animation:ptRingRotate 4s linear infinite;-webkit-mask:radial-gradient(closest-side,transparent calc(100% - 6px),#000 calc(100% - 5px),#000 calc(100% - 1px),transparent 100%);mask:radial-gradient(closest-side,transparent calc(100% - 6px),#000 calc(100% - 5px),#000 calc(100% - 1px),transparent 100%);opacity:.8}
@keyframes ptRingRotate{to{transform:rotate(360deg)}}
.pt-online-dot{position:absolute;bottom:6px;right:6px;width:16px;height:16px;background:#22c55e;border-radius:50%;border:3px solid var(--bg-card)}

/* Profile card body */
.pt-card{background:var(--bg-card);border:1px solid var(--border);border-top:none;border-radius:0 0 var(--radius-xl) var(--radius-xl);padding:0 32px 32px}
.pt-name{font-size:24px;font-weight:800;letter-spacing:-.02em;margin:12px 0 2px}
.pt-role{display:inline-flex;align-items:center;gap:3px;padding:2px 10px;border-radius:var(--radius-full);font-size:12px;font-weight:700;vertical-align:middle;margin-left:4px}
/* ── Quick Info Chips ── */
.pt-quickinfo{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:8px 0 12px}
.pt-chip{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:var(--radius-full);background:var(--bg-input);border:1px solid var(--border);font-size:11.5px;color:var(--text-muted);white-space:nowrap}
.pt-chip small{opacity:.6;font-size:10px}
.pt-chip--online{color:#22c55e;border-color:rgba(34,197,94,.25);background:rgba(34,197,94,.08)}
.pt-chip--karma{border-color:rgba(168,85,247,.2);background:rgba(168,85,247,.06)}
.pt-chip-divider{width:1px;height:16px;background:var(--border);margin:0 2px;flex-shrink:0}

/* ── Bio Box ── */
.pt-bio-box{margin:10px 0;padding:10px 14px;border-radius:var(--radius-lg);background:color-mix(in srgb,var(--pt-primary) 4%,var(--bg-input));border-left:3px solid color-mix(in srgb,var(--pt-primary) 30%,transparent)}
.pt-bio{color:var(--text-secondary);font-size:14px;margin:0;line-height:1.6;max-width:500px}

/* ── Grow Identity ── */
.pt-grow-identity{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:8px 0}

/* ── Stat Tiles Grid ── */
.pt-stat-tiles{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 12px;user-select:none}
.pt-tile{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:72px;padding:10px 12px 8px;border-radius:var(--radius);background:var(--bg-input);border:1px solid var(--border);cursor:pointer;transition:all .2s;text-decoration:none;color:inherit;position:relative}
.pt-tile:hover{border-color:var(--pt-primary);background:var(--bg-input);background:color-mix(in srgb,var(--pt-primary) 8%,var(--bg-input));transform:translateY(-2px);box-shadow:0 0 10px rgba(74,222,128,.15),0 4px 12px rgba(0,0,0,.12);box-shadow:0 0 10px color-mix(in srgb,var(--pt-primary) 25%,transparent),0 4px 12px rgba(0,0,0,.12)}
.pt-tile:hover .pt-tile-icon{color:var(--pt-primary);background:color-mix(in srgb,var(--pt-primary) 12%,transparent)}
.pt-tile-icon{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;margin-bottom:2px}
.pt-tile-icon.pt-tile--uploads{background:rgba(59,130,246,.12);color:#3b82f6}
.pt-tile-icon.pt-tile--followers{background:rgba(168,85,247,.12);color:#a855f7}
.pt-tile-icon.pt-tile--following{background:rgba(45,212,191,.12);color:#2dd4bf}
.pt-tile-icon.pt-tile--forum{background:rgba(251,191,36,.12);color:#fbbf24}
.pt-tile-icon.pt-tile--blog{background:rgba(6,182,212,.12);color:#06b6d4}
.pt-tile-icon.pt-tile--green{background:rgba(22,163,74,.12);color:#16a34a}
.pt-tile-val{font-size:20px;font-weight:800;letter-spacing:-.02em;color:var(--text-primary);line-height:1.1}
.pt-tile-lbl{font-size:9.5px;color:var(--text-muted);font-weight:600;text-transform:uppercase;letter-spacing:.4px}
.pt-tile-sub{display:flex;gap:6px;font-size:10px;color:#16a34a;margin-top:2px}
.pt-tile-sub span{display:flex;align-items:center;gap:2px}
.pt-tile--roots{border-color:rgba(22,163,74,.2);background:rgba(22,163,74,.04)}
.pt-tile--roots:hover{border-color:rgba(22,163,74,.5);background:rgba(22,163,74,.08);box-shadow:0 0 10px rgba(22,163,74,.2),0 4px 12px rgba(0,0,0,.12);transform:translateY(-2px)}

/* ── XP Section ── */
.pt-xp-section{max-width:340px;margin:8px 0 14px;display:flex;flex-direction:column;gap:6px}

/* ── Badges Section ── */
.pt-badges-section{margin:14px 0 4px}
.pt-badges-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;font-size:13px;font-weight:600;color:var(--text-secondary)}
.pt-badges-header small{font-weight:400;color:var(--text-muted);margin-left:4px}
.pt-badges-header a{color:var(--green);font-size:11px;text-decoration:none;font-weight:500}

/* (legacy .pt-meta kept for backward compat) */
.pt-meta{display:flex;gap:16px;font-size:12.5px;color:var(--text-muted);margin:8px 0 16px;flex-wrap:wrap}

/* Stats row (legacy) */
.pt-stats{display:flex;gap:24px;margin:16px 0}
.pt-stat{text-align:center;min-width:60px}
.pt-stat-val{font-size:24px;font-weight:800;letter-spacing:-.02em;color:var(--text-primary)}
.pt-stat-lbl{font-size:10px;color:var(--text-muted);font-weight:600;text-transform:uppercase;letter-spacing:.5px}
.pt-stat[data-click]{cursor:pointer;transition:color .2s}.pt-stat[data-click]:hover .pt-stat-val{color:var(--pt-primary)}

/* Badge showcase */
.pt-badges{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}
.pt-badge{display:flex;align-items:center;gap:8px;padding:8px 14px;border-radius:var(--radius-full);background:var(--bg-input);border:1px solid var(--border);font-size:12px;font-weight:500;opacity:0;cursor:pointer;perspective:600px;transform-style:preserve-3d;will-change:transform;transition:border-color .2s,background .2s,box-shadow .2s,transform .1s ease-out}
.pt-badge.is-visible{opacity:1}

/* Badge fly-in animations */
@keyframes ptFlyLeft{0%{opacity:0;transform:translateX(-40px);filter:drop-shadow(-8px 0 12px var(--pt-glow))}60%{opacity:1;transform:translateX(4px)}100%{opacity:1;transform:translateX(0);filter:none}}
@keyframes ptShimmer{0%{opacity:0;clip-path:inset(0 100% 0 0);filter:brightness(1.5)}50%{opacity:1;clip-path:inset(0 20% 0 0)}100%{opacity:1;clip-path:inset(0);filter:brightness(1)}}
@keyframes ptDrop{0%{opacity:0;transform:translateY(-30px) scale(.8)}50%{opacity:1;transform:translateY(6px) scale(1.05)}70%{transform:translateY(-3px) scale(.98)}100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes ptFlip{0%{opacity:0;transform:perspective(400px) rotateY(-180deg)}40%{opacity:1;transform:perspective(400px) rotateY(-20deg)}70%{transform:perspective(400px) rotateY(10deg)}100%{opacity:1;transform:perspective(400px) rotateY(0)}}
@keyframes ptBurst{0%{opacity:0;transform:scale(0);filter:brightness(3)}30%{opacity:1;transform:scale(1.15);filter:brightness(1.8)}60%{transform:scale(.95);filter:brightness(1.1)}100%{opacity:1;transform:scale(1);filter:brightness(1)}}
@keyframes ptRainbow{0%{opacity:0;transform:scale(.7);box-shadow:0 0 0 3px rgba(74,222,128,.6)}25%{opacity:1;transform:scale(1.05);box-shadow:0 0 0 3px rgba(45,212,191,.6)}50%{box-shadow:0 0 0 3px rgba(168,85,247,.6)}75%{box-shadow:0 0 0 2px rgba(236,72,153,.4)}100%{opacity:1;transform:scale(1);box-shadow:none}}
@keyframes ptFrost{0%{opacity:0;transform:scale(.9);box-shadow:inset 0 0 20px rgba(255,255,255,.8)}30%{opacity:1;transform:scale(1.02)}100%{opacity:1;transform:scale(1);box-shadow:none}}
@keyframes ptSlam{0%{opacity:0;transform:translateY(40px) scale(1.2)}40%{opacity:1;transform:translateY(-4px) scale(.98)}55%{transform:translateY(2px) scale(1.01)}100%{opacity:1;transform:translateY(0) scale(1)}}

/* Theme-specific badge animation assignments */
[data-pt="og-kush"] .pt-badge.is-visible,[data-pt] .pt-badge.is-visible{animation:ptFlyLeft .5s cubic-bezier(.16,1,.3,1) both}
[data-pt="purple-haze"] .pt-badge.is-visible{animation:ptShimmer .6s ease both}
[data-pt="golden-leaf"] .pt-badge.is-visible{animation:ptDrop .55s cubic-bezier(.34,1.56,.64,1) both}
[data-pt="blueberry"] .pt-badge.is-visible{animation:ptFlip .6s ease both}
[data-pt="sativa-sunrise"] .pt-badge.is-visible{animation:ptBurst .5s ease both}
[data-pt="northern-lights"] .pt-badge.is-visible{animation:ptRainbow .8s ease both}
[data-pt="white-widow"] .pt-badge.is-visible{animation:ptFrost .5s ease both}
[data-pt="diesel"] .pt-badge.is-visible{animation:ptSlam .4s ease both}
[data-pt="budborn"] .pt-badge.is-visible{animation:ptSprout .7s cubic-bezier(.34,1.56,.64,1) both}
@keyframes ptSprout{0%{opacity:0;transform:scale(0) rotate(-90deg);filter:drop-shadow(0 0 12px rgba(86,232,48,.8))}40%{opacity:1;transform:scale(1.15) rotate(5deg);filter:drop-shadow(0 0 8px rgba(86,232,48,.5))}70%{transform:scale(.97) rotate(-2deg)}100%{opacity:1;transform:scale(1) rotate(0);filter:none}}

/* Themed tab bar */
.pt-tabs{margin-top:24px}
.pt-tabs .tab-btn.active{color:var(--pt-primary);border-bottom:2px solid var(--pt-tab);box-shadow:0 2px 10px var(--pt-glow)}

/* Actions */
.pt-actions{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap;padding-left:2px}

/* Ambient particle animations */
.pt-particle{position:absolute;pointer-events:none;will-change:transform,opacity}
@keyframes ptRise{0%{transform:translateY(0) translateX(0);opacity:0}10%{opacity:.5}50%{transform:translateY(-100px) translateX(15px);opacity:.4}100%{transform:translateY(-210px) translateX(-5px);opacity:0}}
@keyframes ptFall{0%{transform:translateY(-20px) translateX(0) rotate(0deg);opacity:0}10%{opacity:.5}50%{transform:translateY(100px) translateX(25px) rotate(180deg);opacity:.4}100%{transform:translateY(220px) translateX(-10px) rotate(360deg);opacity:0}}
@keyframes ptDriftDown{0%{transform:translateY(-10px);opacity:0}15%{opacity:.3}50%{transform:translateY(100px) translateX(15px);opacity:.25}100%{transform:translateY(210px);opacity:0}}
@keyframes ptFloat{0%{transform:translate(0,0) scale(1);opacity:.06}25%{transform:translate(30px,-20px) scale(1.1);opacity:.1}50%{transform:translate(-20px,-40px) scale(.95);opacity:.08}75%{transform:translate(40px,-15px) scale(1.05);opacity:.12}100%{transform:translate(0,0) scale(1);opacity:.06}}
@keyframes ptTwinkle{0%,100%{opacity:.1;transform:scale(.8)}50%{opacity:.6;transform:scale(1.2)}}
@keyframes ptScan{0%{top:-2px;opacity:.15}100%{top:100%;opacity:.03}}
@keyframes ptAuroraDrift{0%{background-position:100% 0;opacity:.5}50%{background-position:0% 0;opacity:.8}100%{background-position:100% 0;opacity:.5}}

/* Northern Lights color-cycling ring */
[data-pt="northern-lights"] .pt-avatar-wrap::before{background:conic-gradient(from 0deg,rgba(45,212,191,.8),rgba(168,85,247,.8),rgba(236,72,153,.8),rgba(96,165,250,.8),rgba(45,212,191,.8));animation:ptRingRotate 6s linear infinite;opacity:1}

/* Theme preview cards (edit-profile) */
.pt-preview-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:12px 0}
.pt-preview{border-radius:10px;overflow:hidden;cursor:pointer;border:2px solid var(--border);transition:all .2s;position:relative}
.pt-preview:hover{border-color:rgba(255,255,255,.2);transform:translateY(-2px)}
.pt-preview.selected{border-color:var(--green-primary);box-shadow:0 0 16px rgba(74,222,128,.3)}
.pt-preview-bar{height:50px}
.pt-preview-name{padding:6px 8px;font-size:11px;font-weight:600;text-align:center;background:var(--bg-card)}
.pt-preview-dot{width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:4px;vertical-align:middle}
.pt-preview-desc{padding:0 8px 6px;font-size:10px;color:var(--text-muted);text-align:center;line-height:1.3}

/* Animated gradient banner shift */
@keyframes ptBannerShift{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}

/* Glow cursor */
.pt-glow-cursor{position:absolute;width:180px;height:180px;border-radius:50%;pointer-events:none;z-index:3;opacity:0;transition:opacity .3s;transform:translate(-50%,-50%);background:radial-gradient(circle,var(--pt-glow),transparent 70%);filter:blur(20px);mix-blend-mode:screen}

/* Entrance animations */
@keyframes ptEnterBanner{0%{opacity:0;transform:scaleY(0.7);transform-origin:top}100%{opacity:1;transform:scaleY(1)}}
@keyframes ptEnterAvatar{0%{opacity:0;transform:scale(0) translateY(30px)}60%{opacity:1;transform:scale(1.1) translateY(-5px)}100%{opacity:1;transform:scale(1) translateY(0)}}
@keyframes ptEnterFade{0%{opacity:0;transform:translateY(16px)}100%{opacity:1;transform:translateY(0)}}
@keyframes ptEnterStats{0%{opacity:0;transform:translateY(16px) scaleX(0.9)}100%{opacity:1;transform:translateY(0) scaleX(1)}}
@keyframes ptEnterChar{0%{opacity:0;transform:translateY(20px) rotateX(-90deg)}60%{opacity:1;transform:translateY(-3px) rotateX(5deg)}100%{opacity:1;transform:translateY(0) rotateX(0)}}
@keyframes ptEnterRole{0%{opacity:0;transform:scale(0.5) translateX(-10px)}60%{opacity:1;transform:scale(1.1) translateX(2px)}100%{opacity:1;transform:scale(1) translateX(0)}}
@keyframes ptEnterFlip{0%{opacity:0;transform:rotateY(-180deg) scale(0.7)}60%{opacity:1;transform:rotateY(10deg) scale(1.05)}100%{opacity:1;transform:rotateY(0) scale(1)}}
.pt-enter-banner{animation:ptEnterBanner .5s cubic-bezier(.22,1,.36,1) both}
.pt-enter-avatar{animation:ptEnterAvatar .65s cubic-bezier(.34,1.56,.64,1) both}
.pt-enter-fade{animation:ptEnterFade .45s cubic-bezier(.22,1,.36,1) both}
.pt-enter-stats{animation:ptEnterStats .5s cubic-bezier(.22,1,.36,1) both}
.pt-enter-char{display:inline-block;animation:ptEnterChar .5s cubic-bezier(.34,1.56,.64,1) both}
.pt-enter-role{animation:ptEnterRole .4s cubic-bezier(.34,1.56,.64,1) both}
.pt-enter-flip{animation:ptEnterFlip .6s cubic-bezier(.34,1.56,.64,1) both}

/* Badge hover tooltip */
.pt-badge{position:relative}
.pt-badge-tip{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);background:var(--bg-elevated,#1a1a1a);border:1px solid var(--border);color:var(--text-primary);padding:8px 12px;border-radius:8px;font-size:11px;white-space:nowrap;z-index:10;pointer-events:none;box-shadow:0 8px 24px rgba(0,0,0,.4),0 0 12px var(--pt-glow);animation:ptTipIn .2s ease both}
.pt-badge-tip::after{content:'';position:absolute;top:100%;left:50%;transform:translateX(-50%);border:5px solid transparent;border-top-color:var(--border)}
.pt-badge-tip-name{font-weight:600;color:var(--pt-primary)}
@keyframes ptTipIn{0%{opacity:0;transform:translateX(-50%) translateY(4px) scale(.95)}100%{opacity:1;transform:translateX(-50%) translateY(0) scale(1)}}

/* Canvas + WebGL overlays */
.pt-canvas,.pt-webgl{border-radius:var(--radius-xl) var(--radius-xl) 0 0}

/* Achievement Celebration Overlay */
.pt-celebrate-overlay{position:fixed;inset:0;z-index:10000;background:rgba(0,0,0,0);display:flex;align-items:center;justify-content:center;opacity:0;transition:all .4s ease}
.pt-celebrate-overlay.active{opacity:1;background:rgba(0,0,0,.75);backdrop-filter:blur(8px)}
.pt-celebrate-overlay.closing{opacity:0;transform:scale(1.05)}
.pt-celebrate-content{position:relative;text-align:center;z-index:10002;transform:scale(.5);transition:transform .5s cubic-bezier(.34,1.56,.64,1)}
.pt-celebrate-overlay.active .pt-celebrate-content{transform:scale(1)}
.pt-celebrate-icon{font-size:72px;animation:ptCelebBounce 0.6s cubic-bezier(.34,1.56,.64,1) both;margin-bottom:12px}
.pt-celebrate-title{font-size:24px;font-weight:800;color:var(--pt-primary,#4ade80);text-shadow:0 0 30px var(--pt-glow);animation:ptCelebFade .5s .3s both}
.pt-celebrate-badge{font-size:16px;color:var(--text-secondary);margin-top:8px;animation:ptCelebFade .5s .5s both}
.pt-celebrate-ring{position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;border:3px solid var(--pt-primary,#4ade80);transform:translate(-50%,-50%);animation:ptCelebRing .8s .2s ease-out both;pointer-events:none}
@keyframes ptCelebBounce{0%{transform:scale(0) rotate(-20deg)}60%{transform:scale(1.2) rotate(5deg)}100%{transform:scale(1) rotate(0)}}
@keyframes ptCelebFade{0%{opacity:0;transform:translateY(10px)}100%{opacity:1;transform:none}}
@keyframes ptCelebRing{0%{width:0;height:0;opacity:1}100%{width:300px;height:300px;opacity:0}}

/* Bio typing cursor */
.pt-bio-cursor::after{content:'|';color:var(--pt-primary);animation:ptBioBlink .6s step-end infinite;margin-left:1px;font-weight:300}
@keyframes ptBioBlink{0%,100%{opacity:1}50%{opacity:0}}

/* Online signal bars animation */
.pt-signal-bars{vertical-align:middle;margin-bottom:1px}
.pt-bar{opacity:.3;animation:ptSignalPulse 1.5s ease-in-out infinite}
.pt-bar-1{animation-delay:0s}
.pt-bar-2{animation-delay:.2s}
.pt-bar-3{animation-delay:.4s}
@keyframes ptSignalPulse{0%,100%{opacity:.3}50%{opacity:1}}

/* Custom Status */
.pt-custom-status{font-size:12px;color:var(--text-muted);font-style:italic;margin:-2px 0 4px;padding:2px 0}

/* Grow Info (experience + fav strain) */
.pt-grow-info{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:6px 0}
.pt-grow-exp{font-size:12px;padding:3px 10px;border-radius:var(--radius-full);background:color-mix(in srgb,var(--pt-primary) 12%,var(--bg));border:1px solid color-mix(in srgb,var(--pt-primary) 25%,transparent);color:var(--pt-primary);font-weight:600}
.pt-fav-strain{font-size:12px;padding:3px 10px;border-radius:var(--radius-full);background:rgba(74,222,128,.08);border:1px solid rgba(74,222,128,.2);color:#4ade80}

/* Grow Methods */
.pt-methods{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0}
.pt-method-tag{font-size:11px;padding:3px 10px;border-radius:var(--radius-full);background:var(--bg-input);border:1px solid var(--border);color:var(--text-secondary);transition:all .2s}
.pt-method-tag:hover{border-color:var(--pt-primary);color:var(--pt-primary)}

/* Skills */
.pt-skills{display:flex;flex-wrap:wrap;gap:5px;margin:4px 0}
.pt-skill-tag{font-size:11px;padding:3px 10px;border-radius:var(--radius-full);background:var(--bg-input);border:1px solid var(--border);color:var(--text-secondary);letter-spacing:.02em;transition:all .2s}
.pt-skill-tag:hover{border-color:var(--pt-primary);color:var(--pt-primary)}

/* Social Links */
.pt-socials{display:flex;gap:8px;margin:4px 0}
.pt-social-link{display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:var(--bg-input);border:1px solid var(--border);text-decoration:none;font-size:14px;transition:all .2s}
.pt-social-link:hover{border-color:var(--pt-primary);transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.2)}

/* Login streak flame */
.pt-streak{display:inline-flex;align-items:center;gap:2px;font-size:14px;vertical-align:middle;margin-left:6px;cursor:default}
.pt-streak-flame{display:inline-flex;width:18px;height:22px;filter:drop-shadow(0 0 4px rgba(249,115,22,.5))}
.pt-streak-flame svg{width:100%;height:100%}
.pt-streak-flame .flame-outer{fill:#f97316;animation:ptFlameOuter .6s ease-in-out infinite alternate}
.pt-streak-flame .flame-inner{fill:#fbbf24;animation:ptFlameInner .5s ease-in-out infinite alternate .1s}
.pt-streak-flame .flame-core{fill:#fef3c7;animation:ptFlameCore .4s ease-in-out infinite alternate .15s}
.pt-streak-num{font-size:13px;font-weight:700;color:#f97316;text-shadow:0 0 8px rgba(249,115,22,.4)}
.pt-streak[data-tier="2"] .pt-streak-flame{width:22px;height:26px;filter:drop-shadow(0 0 6px rgba(249,115,22,.6))}
.pt-streak[data-tier="2"] .pt-streak-num{font-size:14px}
.pt-streak[data-tier="3"] .pt-streak-flame{width:26px;height:30px;filter:drop-shadow(0 0 10px rgba(239,68,68,.6))}
.pt-streak[data-tier="3"] .pt-streak-flame .flame-outer{fill:#ef4444}
.pt-streak[data-tier="3"] .pt-streak-flame .flame-inner{fill:#f97316}
.pt-streak[data-tier="3"] .pt-streak-flame .flame-core{fill:#fbbf24}
.pt-streak[data-tier="3"] .pt-streak-num{font-size:16px;color:#ef4444;text-shadow:0 0 12px rgba(239,68,68,.5)}
@keyframes ptFlameOuter{0%{d:path('M12 2c0 0-7 6-7 11a7 7 0 0014 0c0-5-7-11-7-11z')}100%{d:path('M12 2c0 0-8 5.5-8 11.5a8 7.5 0 0016 0c0-6-8-11.5-8-11.5z')}}
@keyframes ptFlameInner{0%{transform:scaleX(1) translateY(0)}100%{transform:scaleX(.85) translateY(-1px)}}
@keyframes ptFlameCore{0%{transform:scaleX(1) scaleY(1)}100%{transform:scaleX(.8) scaleY(.85)}}

/* Currently growing status pill */
/* Grow-Lab Banner */
.pt-growlab{display:flex;align-items:center;position:relative;overflow:hidden;margin:20px 0 -8px;padding:10px 16px;background:linear-gradient(135deg,rgba(74,222,128,.06),rgba(34,197,94,.03));border:1px solid rgba(74,222,128,.15);border-radius:var(--radius-lg);text-decoration:none;color:var(--text-primary);transition:all .3s var(--ease)}
.pt-growlab:hover{border-color:rgba(74,222,128,.35);background:linear-gradient(135deg,rgba(74,222,128,.10),rgba(34,197,94,.06));box-shadow:0 4px 20px rgba(74,222,128,.1)}
.pt-growlab-dna{position:absolute;right:0;top:0;bottom:0;width:60%;pointer-events:none;opacity:.4;mask-image:linear-gradient(to right,transparent 0%,black 30%);-webkit-mask-image:linear-gradient(to right,transparent 0%,black 30%)}
.pt-growlab-dna canvas{width:100%;height:100%;display:block}
.pt-growlab-content{display:flex;align-items:center;gap:10px;width:100%;position:relative;z-index:2;flex-wrap:wrap;text-shadow:0 1px 3px rgba(0,0,0,.6)}
.pt-growlab-icon{display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:rgba(74,222,128,.12);color:#4ade80;flex-shrink:0;animation:ptGrowPulse 2.5s ease-in-out infinite}
@keyframes ptGrowPulse{0%,100%{box-shadow:0 0 0 0 rgba(74,222,128,.2)}50%{box-shadow:0 0 0 6px rgba(74,222,128,0)}}
.pt-growlab-phases{display:flex;gap:4px;align-items:center;flex-shrink:0}
.pt-growlab-dot{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.1);transition:all .3s}
.pt-growlab-dot.active{background:#4ade80}
.pt-growlab-dot.current{background:#4ade80;box-shadow:0 0 6px rgba(74,222,128,.6);animation:ptDotPulse 1.5s ease-in-out infinite}
@keyframes ptDotPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.3)}}
.pt-growlab-title{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.pt-growlab-phenos{font-size:11px;color:var(--text-muted);display:flex;align-items:center;gap:3px;flex-shrink:0;padding:2px 8px;background:rgba(74,222,128,.08);border-radius:var(--radius-full)}
.pt-growlab-cta{margin-left:auto;font-size:11px;font-weight:600;color:#4ade80;display:flex;align-items:center;gap:4px;white-space:nowrap;flex-shrink:0;opacity:.7;transition:all .2s}
.pt-growlab:hover .pt-growlab-cta{opacity:1;gap:6px}
@media(max-width:600px){.pt-growlab-cta{display:none}.pt-growlab-title{font-size:12px}}

/* Profile completeness ring */
.pt-completeness{position:absolute;bottom:-14px;right:-16px;width:42px;height:42px;z-index:3;cursor:pointer;transition:transform .2s}
.pt-completeness:hover{transform:scale(1.15)}
.pt-completeness-ring{width:100%;height:100%;filter:drop-shadow(0 1px 3px rgba(0,0,0,.7))}
.pt-completeness-fill{transition:stroke-dashoffset 1.2s cubic-bezier(.22,1,.36,1)}
.pt-completeness-pct{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:800;color:#fff;text-shadow:0 0 4px rgba(0,0,0,.9),0 0 8px rgba(0,0,0,.6)}
.pt-completeness-tip{position:absolute;bottom:calc(100% + 8px);right:0;background:var(--bg-elevated,#1a1a1a);border:1px solid var(--border);color:var(--text-primary);padding:8px 12px;border-radius:8px;font-size:11px;white-space:nowrap;pointer-events:none;opacity:0;transform:translateY(4px);transition:opacity .2s,transform .2s;z-index:10;box-shadow:0 4px 12px rgba(0,0,0,.3)}
.pt-completeness:hover .pt-completeness-tip{opacity:1;transform:translateY(0)}
.pt-completeness-tip-items{list-style:none;margin:4px 0 0;padding:0;font-size:10px;display:flex;flex-direction:column;gap:2px}
.pt-completeness-tip-items li::before{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:4px;vertical-align:middle}
.pt-completeness-tip-items li.done::before{background:#4ade80}
.pt-completeness-tip-items li.missing::before{background:rgba(255,255,255,.2)}

/* Activity heatmap */
.pt-heatmap{margin:16px 0;padding:12px;background:var(--bg-input);border-radius:var(--radius-lg);border:1px solid var(--border);overflow-x:auto}
.pt-heatmap-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.pt-heatmap-grid{display:grid;grid-template-rows:repeat(7,1fr);grid-auto-flow:column;grid-auto-columns:12px;gap:2px;min-width:max-content}
.pt-hm-months{display:grid;grid-template-rows:1fr;grid-auto-flow:column;grid-auto-columns:12px;gap:2px;min-width:max-content;margin-bottom:4px}
.pt-hm-month{font-size:9px;color:var(--text-muted);white-space:nowrap;grid-row:1}
.pt-hm-cell{width:10px;height:10px;border-radius:2px;background:rgba(74,222,128,.08);outline:1px solid rgba(255,255,255,.04);cursor:default}
.pt-hm-cell[data-level="1"]{background:rgba(74,222,128,.25)}
.pt-hm-cell[data-level="2"]{background:rgba(74,222,128,.45)}
.pt-hm-cell[data-level="3"]{background:rgba(74,222,128,.70)}
.pt-hm-cell[data-level="4"]{background:#4ade80}
.pt-hm-cell.pt-hm-future{background:rgba(74,222,128,.03);outline-color:rgba(255,255,255,.02)}
.pt-hm-cell.pt-hm-outside{visibility:hidden}
.pt-heatmap-legend{display:flex;align-items:center;gap:3px;margin-top:8px;justify-content:flex-end}
.pt-heatmap-legend span[class^="pt-hm-l"]{width:10px;height:10px;border-radius:2px;display:inline-block}
.pt-hm-l0{background:rgba(74,222,128,.08)}
.pt-hm-l1{background:rgba(74,222,128,.25)}
.pt-hm-l2{background:rgba(74,222,128,.45)}
.pt-hm-l3{background:rgba(74,222,128,.70)}
.pt-hm-l4{background:#4ade80}
.pt-hm-tip{position:fixed;background:var(--bg-elevated,#1a1a1a);border:1px solid var(--border);color:var(--text-primary);padding:4px 8px;border-radius:6px;font-size:11px;pointer-events:none;z-index:100;white-space:nowrap;box-shadow:0 4px 12px rgba(0,0,0,.3)}
.pt-hm-cell:not(.pt-hm-future):not(.pt-hm-outside){cursor:pointer;transition:outline-color .15s,transform .15s}
.pt-hm-cell:not(.pt-hm-future):not(.pt-hm-outside):hover{outline-color:var(--pt-primary,#4ade80)!important;transform:scale(1.4);z-index:2;position:relative}
.pt-hm-cell.pt-hm-selected{outline:2px solid var(--pt-primary,#4ade80)!important;transform:scale(1.3);z-index:2;position:relative}

/* Activity quickfilter */
.pt-act-filter-btn{background:var(--bg-input);border:1px solid var(--border);color:var(--text-muted);padding:4px 10px;border-radius:var(--radius-full,16px);font-size:11px;cursor:pointer;display:inline-flex;align-items:center;gap:4px;transition:all .2s;white-space:nowrap}
.pt-act-filter-btn:hover{border-color:var(--pt-primary,#4ade80);color:var(--text-primary)}
.pt-act-filter-btn.active{background:color-mix(in srgb,var(--pt-primary,#4ade80) 15%,transparent);border-color:var(--pt-primary,#4ade80);color:var(--pt-primary,#4ade80);font-weight:600}
.pt-act-date-tag{display:inline-flex;align-items:center;gap:4px;background:color-mix(in srgb,var(--pt-primary,#4ade80) 12%,transparent);border:1px solid var(--pt-primary,#4ade80);color:var(--pt-primary,#4ade80);padding:4px 10px;border-radius:var(--radius-full,16px);font-size:11px;font-weight:600;animation:ptDateTagIn .3s ease-out both}
@keyframes ptDateTagIn{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}

/* Activity scrollable feed */
.pt-act-scroll{scrollbar-width:thin;scrollbar-color:var(--border) transparent}
.pt-act-scroll::-webkit-scrollbar{width:4px}
.pt-act-scroll::-webkit-scrollbar-track{background:transparent}
.pt-act-scroll::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}
.pt-act-scroll::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}
.pt-act-row:hover{background:rgba(255,255,255,.03)}

/* Level-up toast */
.pt-levelup-toast{position:fixed;top:20px;right:20px;z-index:9999;background:var(--bg-card);border:1px solid var(--pt-primary,#4ade80);border-radius:var(--radius-lg);padding:14px 20px;display:flex;align-items:center;gap:10px;font-weight:700;font-size:15px;color:var(--text-primary);box-shadow:0 8px 32px rgba(0,0,0,.4),0 0 20px var(--pt-glow);transform:translateX(120%);transition:transform .5s cubic-bezier(.34,1.56,.64,1),opacity .3s;overflow:visible}
.pt-levelup-toast.show{transform:translateX(0)}
.pt-levelup-toast.hide{transform:translateX(120%);opacity:0}
.pt-levelup-icon{font-size:24px;animation:ptCelebBounce .6s cubic-bezier(.34,1.56,.64,1) both}
.pt-levelup-particle{position:absolute;width:6px;height:4px;background:var(--c);border-radius:1px;top:50%;left:50%;pointer-events:none;animation:ptLevelupBurst .8s ease-out both}
@keyframes ptLevelupBurst{0%{transform:translate(0,0) rotate(0deg);opacity:1}100%{transform:translate(var(--px),var(--py)) rotate(360deg);opacity:0}}

/* Badge achievement toast */
.pt-badge-toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%) translateY(120%);z-index:9998;background:var(--bg-card);border:1px solid var(--pt-primary,#4ade80);border-radius:var(--radius-full);padding:10px 20px;display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-primary);box-shadow:0 8px 32px rgba(0,0,0,.4),0 0 16px var(--pt-glow);transition:transform .5s cubic-bezier(.34,1.56,.64,1),opacity .3s;white-space:nowrap}
.pt-badge-toast.show{transform:translateX(-50%) translateY(0)}
.pt-badge-toast.hide{transform:translateX(-50%) translateY(120%);opacity:0}

/* Mobile responsive */
@media(max-width:768px){
    .pt-banner{height:140px}
    .pt-avatar-wrap{margin-top:-40px}
    .pt-avatar{width:80px;height:80px}
    .pt-avatar-wrap::before{inset:-4px}
    .pt-card{padding:0 16px 24px}
    .pt-name{font-size:20px}
    .pt-stats{gap:16px}
    .pt-stat-val{font-size:20px}
    .pt-meta{gap:10px}
    .pt-stat-tiles{gap:6px}
    .pt-tile{min-width:64px;padding:8px 10px 6px}
    .pt-tile-val{font-size:17px}
    .pt-tile-icon{width:24px;height:24px}
    .pt-quickinfo{gap:5px}
    .pt-chip{font-size:10.5px;padding:2px 8px}
    .pt-xp-section{max-width:100%}
    .pt-preview-grid{grid-template-columns:repeat(2,1fr)}
    .pt-completeness{width:34px;height:34px;bottom:-10px;right:-12px}
    .pt-completeness-pct{font-size:7px}
    .pt-heatmap-grid{grid-auto-columns:10px}
    .pt-hm-cell{width:8px;height:8px}
    .pt-badge-toast{left:16px;right:16px;transform:translateX(0) translateY(120%);white-space:normal;font-size:12px}
    .pt-badge-toast.show{transform:translateX(0) translateY(0)}
    .pt-badge-toast.hide{transform:translateX(0) translateY(120%)}
    .pt-levelup-toast{right:16px;left:16px;transform:translateY(-120%)}
    .pt-levelup-toast.show{transform:translateY(0)}
    .pt-levelup-toast.hide{transform:translateY(-120%)}
}

/* ── Global Scroll Reveal Animations ── */
.scroll-reveal{opacity:0;transform:translateY(30px);transition:opacity 0.6s ease,transform 0.6s ease}
.scroll-reveal.revealed{opacity:1;transform:translateY(0)}
.scroll-reveal-left{opacity:0;transform:translateX(-30px);transition:opacity 0.6s ease,transform 0.6s ease}
.scroll-reveal-left.revealed{opacity:1;transform:translateX(0)}
.scroll-reveal-right{opacity:0;transform:translateX(30px);transition:opacity 0.6s ease,transform 0.6s ease}
.scroll-reveal-right.revealed{opacity:1;transform:translateX(0)}
.scroll-reveal-delay-1{transition-delay:0.1s}
.scroll-reveal-delay-2{transition-delay:0.2s}
.scroll-reveal-delay-3{transition-delay:0.3s}
.scroll-reveal-delay-4{transition-delay:0.4s}
@media(prefers-reduced-motion:reduce){.scroll-reveal,.scroll-reveal-left,.scroll-reveal-right{opacity:1;transform:none;transition:none}}

/* ── Profile Follow Button Top (Glassmorphism V3) ── */
.profile-follow-top{display:inline-flex;align-items:center;gap:5px;padding:5px 14px;border-radius:10px;font-size:11.5px;font-weight:700;cursor:pointer;border:1px solid rgba(255,106,26,.35);color:#ff7a2e;background:rgba(255,106,26,.05);backdrop-filter:blur(8px);box-shadow:0 2px 12px rgba(255,106,26,.12),0 0 1px rgba(255,106,26,.3);transition:all .3s ease;text-transform:uppercase;letter-spacing:1px;position:relative;overflow:hidden;user-select:none;margin-left:16px}
.profile-follow-top::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,106,26,.08),transparent 60%);border-radius:inherit}
.profile-follow-top:hover{background:rgba(255,106,26,.12);box-shadow:0 2px 20px rgba(255,106,26,.3),0 0 2px rgba(255,106,26,.5);border-color:rgba(255,106,26,.6);transform:translateY(-1px)}
.profile-follow-top.active{color:#fff;background:radial-gradient(ellipse at center,rgba(255,106,26,.15) 0%,rgba(255,106,26,.45) 70%,rgba(255,106,26,.7) 100%);border-color:rgba(255,106,26,.9);box-shadow:0 0 16px rgba(255,106,26,.5),0 0 4px rgba(255,106,26,.6),inset 0 0 12px rgba(255,106,26,.2)}
.profile-follow-top.active::before{background:linear-gradient(135deg,rgba(255,255,255,.1),transparent 50%)}
.profile-follow-top.active:hover{box-shadow:0 0 24px rgba(255,106,26,.65),0 0 6px rgba(255,106,26,.7),inset 0 0 16px rgba(255,106,26,.3)}

/* ── Welle 3.5 — Thread-Row (2026-04-15) ── */
/* J: Hover neon border + glow */
.thread-row-card{position:relative;display:flex;gap:12px;align-items:flex-start;padding:12px 16px;transition:border-color .2s,box-shadow .2s;border:1px solid var(--border,#2a2a2a);cursor:pointer}
.thread-row-card:hover{border-color:rgba(74,222,128,.4);box-shadow:0 0 14px rgba(74,222,128,.10),inset 0 0 40px rgba(74,222,128,.025)}
/* A: Unread dot */
.thr-unread{width:8px;height:8px;border-radius:50%;background:transparent;flex-shrink:0;margin-top:7px}
.thr-unread--active{background:var(--green,#4ade80);box-shadow:0 0 6px rgba(74,222,128,.6)}
/* A: Cover thumbnail / avatar fallback */
.thr-thumb{flex-shrink:0;width:72px;height:72px;border-radius:8px;overflow:hidden;background:var(--bg,#0f1010)}
.thr-thumb-img{width:100%;height:100%;object-fit:cover;display:block}
/* Body */
.thr-body{flex:1;min-width:0}
.thr-title-row{display:flex;flex-wrap:wrap;align-items:center;gap:5px;margin-bottom:5px}
/* I: Prefix chip */
.thr-prefix-chip{font-size:10px;font-weight:700;padding:2px 7px;border-radius:4px;border:1px solid;letter-spacing:.3px;white-space:nowrap}
/* H/G: Status badges */
.thr-badge{font-size:11px;padding:1px 6px;border-radius:4px;font-weight:600;white-space:nowrap}
.thr-badge--pin{background:rgba(74,222,128,.12);color:#4ade80}
.thr-badge--lock{background:rgba(148,163,184,.10);color:var(--text-muted,#888);display:inline-flex;align-items:center;gap:2px}
.thr-badge--solved{background:rgba(34,197,94,.15);color:#22c55e}
.thr-badge--hot{background:rgba(249,115,22,.15);color:#f97316}
/* Title link */
.thr-title-link{font-size:15px;font-weight:500;color:var(--text,#e0e0e0);text-decoration:none;word-break:break-word}
.thr-title-link:hover{color:var(--green,#4ade80)}
.thr-title-link--unread{font-weight:700}
/* B: Excerpt */
.thr-excerpt{font-size:12px;color:var(--text-muted,#888);margin-bottom:5px;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word;line-height:1.5}
/* Meta row */
.thr-meta{font-size:12px;color:var(--text-muted,#888)}
.thr-meta a{color:var(--green,#4ade80)}
/* Stats column (right) — horizontal row layout */
.thr-stats{flex-shrink:0;display:flex;flex-direction:row;align-items:center;flex-wrap:wrap;gap:6px 10px;font-size:12px;color:var(--text-muted,#888);justify-content:flex-end;min-width:90px}
.thr-stats>span{display:inline-flex;align-items:center;gap:3px}
/* Stat pills (reply, views, attachments) */
.thr-stat-pill{display:inline-flex;align-items:center;gap:3px;height:24px;padding:0 8px;background:transparent;border:1px solid var(--border,rgba(255,255,255,.12));color:var(--text-muted,#888);border-radius:12px;font-size:11px;cursor:default;white-space:nowrap}
.thr-stat-pill:hover{border-color:rgba(74,222,128,.3);color:var(--text,#eaeee9)}
/* Reply pill: keeps its green active variant */
.thr-stat-pill.thr-reply-pill--active{background:rgba(74,222,128,.12);border-color:rgba(74,222,128,.35);color:#4ade80;font-weight:700}
/* Legacy aliases (keep for compat) */
.thr-reply-pill{display:inline-flex;align-items:center;gap:3px;padding:2px 7px;border-radius:10px;background:var(--bg,#111);font-size:12px}
.thr-reply-pill--active{background:rgba(74,222,128,.12);color:#4ade80;font-weight:700}
/* E: Attachment badge */
.thr-attach-badge{font-size:11px;color:var(--text-muted,#888)}
/* D: Last poster — full-width second line */
.thr-last-reply{display:flex;align-items:center;gap:5px;flex-basis:100%;justify-content:flex-end}
.thr-last-avatar{width:18px;height:18px;border-radius:50%;object-fit:cover;flex-shrink:0}
.thr-last-meta{font-size:10px;color:var(--text-muted,#888);text-align:right;line-height:1.4}
.thr-last-name{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:82px}
/* Responsive */
@media(max-width:600px){.thr-thumb{width:48px;height:48px;border-radius:6px}.thr-stats{min-width:56px;gap:4px 8px}.thr-excerpt{display:none}.thr-last-reply{display:none}}
/* Card-Link overlay (Welle 3.5 Zusatz) */
.thr-row-link{position:absolute;inset:0;z-index:0;border-radius:inherit}
.thread-row-card .thr-title-link,
.thread-row-card .thr-meta a,
.thread-row-card .thr-last-poster-link{position:relative;z-index:1}
.thr-last-poster-link{display:flex;align-items:center;gap:5px;text-decoration:none}
.thr-last-poster-link:hover .thr-last-name{color:var(--green,#4ade80)}

/* --- Credits Welle II — 2026-04-15 --- */
.credits-table{width:100%;border-collapse:collapse;font-size:13px}
.credits-table th{text-align:left;padding:8px 16px;font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);border-bottom:1px solid var(--border);white-space:nowrap}
.credits-table td{padding:10px 16px;border-bottom:1px solid var(--border);vertical-align:middle}
.credits-table tbody tr:last-child td{border-bottom:none}
.credits-table tbody tr:hover{background:rgba(255,255,255,.025)}
.credits-version-chip{display:inline-block;font-size:10px;font-weight:700;padding:2px 7px;border-radius:4px;background:rgba(74,222,128,.1);color:#4ade80;border:1px solid rgba(74,222,128,.25);font-family:monospace;letter-spacing:.2px}
.credits-license-chip{display:inline-block;font-size:10px;padding:2px 7px;border-radius:4px;background:rgba(255,255,255,.06);color:var(--text-muted);letter-spacing:.3px;white-space:nowrap}
@media(max-width:640px){.credits-table th:nth-child(4),.credits-table td:nth-child(4){display:none}.credits-table th:nth-child(5),.credits-table td:nth-child(5){display:none}}

/* --- Forum Text-Color Presets (Item B — 2026-04-15) --- */
.tc-red{color:#ef4444}.tc-orange{color:#fb923c}.tc-yellow{color:#facc15}.tc-green{color:#4ade80}.tc-cyan{color:#22d3ee}.tc-blue{color:#60a5fa}.tc-purple{color:#c084fc}.tc-pink{color:#f472b6}

/* --- Prefix-Dropdown — 2026-04-16 --- */
.forum-prefix-select{width:100%;padding:10px 12px;border-radius:8px;border:1px solid var(--border-light);background:var(--bg-card);color:var(--text-primary);font-size:14px;transition:border-color .2s,box-shadow .2s}
.forum-prefix-select:focus{outline:none;border-color:rgba(74,222,128,.6);box-shadow:0 0 0 3px rgba(74,222,128,.12)}

/* --- Preview-Pane I.7 — 2026-04-16 --- */
.fmt-editor-wrap{display:flex;flex-direction:row;gap:10px;align-items:flex-start;width:100%}
.fmt-editor-wrap>textarea{flex:1;min-width:0}
.fmt-preview-pane{display:none;flex:1;min-width:0;min-height:160px;max-height:480px;overflow-y:auto;border:1px solid var(--border);border-radius:8px;padding:12px 14px;background:var(--bg-card,#121312);color:var(--text-primary,#eaeee9);font-size:14px;line-height:1.7;word-break:break-word}
.fmt-preview-pane.visible{display:block}
/* Preview typography — mirrors .forum-md-content from forum-thread.php inline styles */
.fmt-preview-pane p{margin:0 0 .6em}.fmt-preview-pane p:last-child{margin-bottom:0}
.fmt-preview-pane strong{font-weight:700}.fmt-preview-pane em{font-style:italic}
.fmt-preview-pane del{text-decoration:line-through;opacity:.7}
.fmt-preview-pane code{background:rgba(255,255,255,.07);padding:1px 5px;border-radius:4px;font-family:monospace;font-size:.88em}
.fmt-preview-pane pre{background:rgba(255,255,255,.05);border:1px solid var(--border);border-radius:8px;padding:10px 14px;overflow-x:auto;margin:.6em 0}
.fmt-preview-pane pre code{background:none;padding:0;font-size:.85em}
.fmt-preview-pane blockquote{border-left:3px solid var(--border);margin:.4em 0;padding:6px 12px;background:var(--bg,#070807);border-radius:0 6px 6px 0;color:var(--text-muted,#545a52);font-size:.93em}
.fmt-preview-pane ul,.fmt-preview-pane ol{margin:.4em 0 .4em 1.5em;padding:0}.fmt-preview-pane li{margin:.15em 0}
.fmt-preview-pane a{color:var(--green,#4ade80)}
.fmt-preview-pane .spoiler{background:rgba(255,255,255,.08);border-radius:4px;padding:2px 6px;cursor:pointer;color:transparent;transition:color .2s;user-select:none}
.fmt-preview-pane .spoiler:hover,.fmt-preview-pane .spoiler.revealed{color:inherit}
/* Preview-toggle button — active state */
.ftb-preview-on{border-color:rgba(74,222,128,.6)!important;box-shadow:0 0 6px rgba(74,222,128,.4)!important;color:var(--green,#4ade80)!important}
/* Mobile: stack vertically */
@media(max-width:768px){.fmt-editor-wrap{flex-direction:column}.fmt-editor-wrap>textarea{width:100%!important;flex:none}.fmt-preview-pane{width:100%;max-height:320px}}
.fmt-ta-hint{font-size:11px;color:var(--text-muted,#888);font-style:italic;margin-top:4px}

/* === CoC Modal (Code of Conduct acceptance � AJAX accept via api/coc-accept) === */
.coc-modal-overlay{position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.78);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:20px;animation:cocModalFadeIn .2s ease}
.coc-modal-overlay.show{display:flex}
.coc-modal-card{position:relative;background:var(--bg-card,#14120f);border:1px solid rgba(74,222,128,.35);border-radius:var(--radius-xl,16px);width:100%;max-width:480px;max-height:90vh;overflow-y:auto;padding:32px 28px 24px;box-shadow:0 20px 60px rgba(0,0,0,.6),0 0 30px rgba(74,222,128,.15);animation:cocModalSlideIn .3s cubic-bezier(.16,1,.3,1)}
.coc-modal-close{position:absolute;top:12px;right:12px;width:32px;height:32px;border-radius:50%;background:transparent;border:1px solid var(--border);color:var(--text-muted);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:all .15s}
.coc-modal-close:hover{color:#ef4444;border-color:rgba(239,68,68,.5);background:rgba(239,68,68,.08)}
.coc-modal-icon{display:flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,rgba(34,197,94,.2),rgba(34,197,94,.05));border:2px solid rgba(74,222,128,.4);color:var(--green);margin:0 auto 16px;animation:cocModalShield .5s cubic-bezier(.16,1,.3,1) .1s both}
.coc-modal-title{font-size:20px;font-weight:700;text-align:center;margin:0 0 10px;color:var(--text-primary)}
.coc-modal-title:focus{outline:none}
.coc-modal-desc{font-size:13.5px;line-height:1.55;color:var(--text-secondary);text-align:center;margin:0 0 14px}
.coc-modal-link{text-align:center;margin:0 0 18px;font-size:13px}
.coc-modal-link a{display:inline-flex;align-items:center;gap:6px;color:#4ade80;text-decoration:none;font-weight:600;padding:6px 12px;border:1px solid rgba(74,222,128,.3);border-radius:14px;transition:all .15s}
.coc-modal-link a:hover{border-color:rgba(74,222,128,.6);box-shadow:0 0 12px rgba(74,222,128,.25)}
.coc-modal-check{display:flex;align-items:flex-start;gap:10px;cursor:pointer;padding:12px 14px;background:var(--bg-input,rgba(255,255,255,.03));border:1px solid var(--border);border-radius:10px;margin-bottom:18px;transition:border-color .15s}
.coc-modal-check:hover{border-color:rgba(74,222,128,.4)}
.coc-modal-check input{margin-top:2px;flex-shrink:0;accent-color:#22c55e}
.coc-modal-check span{font-size:13px;color:var(--text-primary);line-height:1.45}
.coc-modal-actions{display:flex;gap:10px;flex-wrap:wrap}
.coc-modal-btn-later{flex:1;min-width:120px;padding:10px 18px;background:transparent;color:var(--text-muted);border:1px solid var(--border);border-radius:20px;font-size:13px;font-weight:600;cursor:pointer;transition:all .15s}
.coc-modal-btn-later:hover{color:var(--text-primary);border-color:var(--text-muted)}
.coc-modal-btn-accept{flex:2;min-width:140px;padding:10px 20px;background:transparent;color:#4ade80;border:1px solid rgba(74,222,128,.5);border-radius:20px;font-size:13px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px;transition:all .2s;box-shadow:0 0 10px rgba(74,222,128,.2),inset 0 0 6px rgba(74,222,128,.08)}
.coc-modal-btn-accept:not(:disabled):hover{color:#bbf7d0;border-color:rgba(74,222,128,.8);box-shadow:0 0 20px rgba(74,222,128,.45),0 0 38px rgba(74,222,128,.22),inset 0 0 10px rgba(74,222,128,.15);transform:translateY(-1px)}
.coc-modal-btn-accept:disabled{opacity:.4;cursor:not-allowed;box-shadow:none;color:var(--text-muted);border-color:var(--border)}
.coc-modal-btn-accept.is-loading{opacity:.7;cursor:wait}
.coc-modal-error{margin:12px 0 0;padding:10px 14px;background:rgba(239,68,68,.08);border:1px solid rgba(239,68,68,.3);border-radius:8px;color:#f87171;font-size:12.5px;text-align:center}
@keyframes cocModalFadeIn{from{opacity:0}to{opacity:1}}
@keyframes cocModalSlideIn{from{opacity:0;transform:translateY(20px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes cocModalShield{from{opacity:0;transform:scale(.5) rotate(-8deg)}60%{transform:scale(1.08) rotate(2deg)}to{opacity:1;transform:scale(1) rotate(0)}}
@media(max-width:480px){.coc-modal-card{padding:24px 20px 20px}.coc-modal-actions{flex-direction:column}.coc-modal-btn-later,.coc-modal-btn-accept{width:100%;flex:none}}
/* CoC Modal: M5 — class-based hide (replaces HTML hidden attr; aria-live elements stay in tree) */
.coc-modal-overlay.is-hidden{display:none}
.coc-modal-error.is-hidden{display:none}
/* Username-Change Badge */
@keyframes uc-warn-pulse{0%,100%{box-shadow:0 0 6px rgba(239,68,68,.4)}50%{box-shadow:0 0 16px rgba(239,68,68,.8)}}
.uc-badge-warn{animation:uc-warn-pulse 2s ease-in-out infinite}
@media (prefers-reduced-motion: reduce) {
    .uc-badge-warn{animation:none}
}
/* ── Broadcast Popup (broadcast-variant modifier) ── */
.coc-modal-overlay.broadcast-variant{z-index:10002}
.broadcast-card{border-top:3px solid rgba(74,222,128,.6)}
.broadcast-icon{background:rgba(74,222,128,.1);border-color:rgba(74,222,128,.3);animation:broadcastIconPop .5s cubic-bezier(.34,1.56,.64,1)}
@keyframes broadcastIconPop{from{opacity:0;transform:scale(.4)}60%{transform:scale(1.15)}to{opacity:1;transform:scale(1)}}
.broadcast-ack-btn{background:linear-gradient(135deg,rgba(74,222,128,.18),rgba(74,222,128,.08));border:1px solid rgba(74,222,128,.45);color:#4ade80;box-shadow:0 0 16px rgba(74,222,128,.3)}
.broadcast-ack-btn:not(:disabled):hover{box-shadow:0 0 28px rgba(74,222,128,.5);transform:translateY(-1px)}
.broadcast-ack-btn:disabled{opacity:.45;cursor:not-allowed}
/* ── Broadcast Composer: 2-col layout ── */
.broadcast-composer-grid{display:grid;grid-template-columns:360px 1fr;gap:24px;align-items:start}
.broadcast-preview-pane{position:sticky;top:80px;background:var(--card-bg);border:1px solid var(--border);border-radius:12px;padding:20px;min-height:200px}
.broadcast-preview-pane h4{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);margin:0 0 12px}
.broadcast-preview-sim{background:rgba(0,0,0,.35);border:1px solid rgba(74,222,128,.25);border-radius:8px;padding:16px;font-size:13px;line-height:1.5}
.broadcast-preview-sim h5{font-size:15px;margin:0 0 8px;color:#f0fdf4}
.broadcast-preview-sim p{margin:0;color:var(--text-muted);white-space:pre-line}
@media(max-width:860px){.broadcast-composer-grid{grid-template-columns:1fr}}
/* ── Broadcast: prio radio badges ── */
.prio-radio-wrap{display:flex;flex-wrap:wrap;gap:8px}
.prio-radio-wrap label{display:flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid var(--border);border-radius:20px;cursor:pointer;font-size:12px;transition:all .2s}
.prio-radio-wrap label:has(input:checked){border-color:rgba(74,222,128,.5);background:rgba(74,222,128,.08);color:#4ade80}
.prio-radio-wrap label.prio-high_dismissable:has(input:checked){border-color:rgba(251,191,36,.5);background:rgba(251,191,36,.08);color:#fbbf24}
.prio-radio-wrap label.prio-high_ack:has(input:checked){border-color:rgba(249,115,22,.5);background:rgba(249,115,22,.08);color:#f97316}
.prio-radio-wrap label.prio-high_checkbox:has(input:checked){border-color:rgba(239,68,68,.5);background:rgba(239,68,68,.08);color:#ef4444}
/* ── Broadcast: recipient chips ── */
.recipient-chips{display:flex;flex-wrap:wrap;gap:6px;min-height:32px;padding:6px;border:1px solid var(--border);border-radius:8px;cursor:text}
.recipient-chip{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;background:rgba(74,222,128,.1);border:1px solid rgba(74,222,128,.3);border-radius:12px;font-size:12px;color:#4ade80}
.recipient-chip button{background:none;border:none;cursor:pointer;color:#4ade80;padding:0;line-height:1;opacity:.7}
.recipient-chip button:hover{opacity:1}
/* ── Broadcast: multi-select user table ── */
.bulk-action-bar{position:sticky;top:0;z-index:100;background:rgba(10,26,10,.95);backdrop-filter:blur(8px);border:1px solid rgba(74,222,128,.3);border-radius:8px;padding:10px 16px;display:flex;align-items:center;gap:12px;margin-bottom:12px;box-shadow:0 0 16px rgba(74,222,128,.15)}
.bulk-action-bar.is-hidden{display:none}
/* ── Broadcast history: status pills ── */
.bcast-status-sent{color:#4ade80;font-size:11px}.bcast-status-draft{color:#fbbf24;font-size:11px}.bcast-status-cancelled{color:#6b7280;font-size:11px}
/* ── Broadcast: undo toast ── */
.broadcast-undo-toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#1a2e1a;border:1px solid rgba(74,222,128,.4);border-radius:10px;padding:12px 20px;display:flex;align-items:center;gap:12px;z-index:10100;box-shadow:0 4px 20px rgba(0,0,0,.5);animation:toastSlideUp .3s ease}
@keyframes toastSlideUp{from{opacity:0;transform:translateX(-50%) translateY(12px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
.broadcast-undo-toast.is-hidden{display:none}
@media (prefers-reduced-motion: reduce) {
    .uc-badge-warn{animation:none}
}
/* ── Broadcast User Grid Picker ─────────────────────────────────────── */
.broadcast-grid-header {
    position: sticky;
    top: 0;
    background: var(--card-bg, var(--bg));
    z-index: 5;
    padding: 0 0 10px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-bottom: 4px;
}
.broadcast-grid-search-wrap { display: flex; align-items: center; }
.broadcast-grid-master {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    cursor: pointer;
    white-space: nowrap;
}
.broadcast-grid-counter {
    font-size: 12px;
    color: var(--text-muted);
    margin-left: auto;
}
.broadcast-user-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 10px;
    max-height: 480px;
    overflow-y: auto;
    padding: 2px 2px 8px;
}
.broadcast-user-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 12px 8px;
    border: 1px solid var(--border);
    border-radius: 8px;
    cursor: pointer;
    transition: border-color .15s, box-shadow .15s, background .15s;
    text-align: center;
    position: relative;
    outline: none;
}
.broadcast-user-card:hover {
    border-color: rgba(74,222,128,.4);
    background: rgba(74,222,128,.04);
}
.broadcast-user-card:focus-visible {
    box-shadow: 0 0 0 2px var(--green);
}
.broadcast-user-card.selected {
    border-color: var(--green);
    box-shadow: 0 0 10px rgba(74,222,128,.35);
    background: rgba(74,222,128,.07);
}
.broadcast-user-card .buc-checkbox {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 15px;
    height: 15px;
    cursor: pointer;
    accent-color: var(--green);
}
.buc-avatar { width: 40px; height: 40px; flex-shrink: 0; }
.buc-avatar img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
}
.buc-avatar-placeholder {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: rgba(74,222,128,.15);
    color: var(--green);
    font-size: 16px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}
.buc-info {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    min-width: 0;
}
.buc-name {
    font-size: 12px;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 130px;
}
.buc-badge {
    font-size: 10px;
    font-weight: 600;
    padding: 1px 6px;
    border-radius: 4px;
}
.buc-badge.role-admin {
    background: rgba(239,68,68,.15);
    color: #ef4444;
    border: 1px solid rgba(239,68,68,.3);
}
.buc-badge.role-mod {
    background: rgba(249,115,22,.12);
    color: #fb923c;
    border: 1px solid rgba(249,115,22,.3);
}
.buc-badge.role-user {
    background: rgba(74,222,128,.1);
    color: var(--green);
    border: 1px solid rgba(74,222,128,.2);
}
/* Responsive */
@media (max-width: 860px) {
    .broadcast-user-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media (max-width: 560px) {
    .broadcast-user-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 380px) {
    .broadcast-user-grid {
        grid-template-columns: 1fr;
    }
}

/* === Broadcast Feature Flag Toggle Banner === */
.bcast-feature-banner{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 18px;border-radius:10px;margin-bottom:18px;border:1px solid;transition:all .3s}
.bcast-feature-on{background:rgba(74,222,128,.07);border-color:rgba(74,222,128,.3)}
.bcast-feature-off{background:rgba(248,113,113,.07);border-color:rgba(248,113,113,.25)}
.bcast-feature-info{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.bcast-feature-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0;transition:background .3s}
.bcast-feature-on .bcast-feature-dot{background:#4ade80;box-shadow:0 0 6px rgba(74,222,128,.6)}
.bcast-feature-off .bcast-feature-dot{background:#f87171;box-shadow:0 0 6px rgba(248,113,113,.4)}
.bcast-feature-info strong{font-size:14px}
.bcast-feature-on .bcast-feature-info strong{color:#4ade80}
.bcast-feature-off .bcast-feature-info strong{color:#f87171}
.bcast-feature-hint{font-size:12px;color:var(--text-muted)}
.bcast-feature-toggle-btn{padding:7px 18px;border-radius:7px;border:1px solid;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s;white-space:nowrap;min-height:36px}
.bcast-feature-toggle-btn.is-on{background:transparent;color:#f87171;border-color:rgba(248,113,113,.4)}
.bcast-feature-toggle-btn.is-on:hover{background:rgba(248,113,113,.1);border-color:rgba(248,113,113,.7)}
.bcast-feature-toggle-btn.is-off{background:transparent;color:#4ade80;border-color:rgba(74,222,128,.4);box-shadow:0 0 10px rgba(74,222,128,.15)}
.bcast-feature-toggle-btn.is-off:hover{background:rgba(74,222,128,.1);border-color:rgba(74,222,128,.7);box-shadow:0 0 16px rgba(74,222,128,.3)}
.bcast-feature-toggle-btn:disabled{opacity:.5;cursor:not-allowed}
@media(max-width:600px){.bcast-feature-banner{flex-direction:column;align-items:flex-start}.bcast-feature-toggle-btn{width:100%}}