/* Base Reset */
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
 :root{
  --bg:#0f0f12; --text:#eaeaea; --muted:#b6bcc6; --card:#17181d; --accent:#6cc0ff;
  --radius:16px; --shadow:0 10px 30px rgba(0,0,0,.25);
  --gap:3.75rem; --ring:0 0 0 2px rgba(255,255,255,.08) inset, 0 12px 30px rgba(0,0,0,.25);
  --btn-bg:var(--accent); --btn-text:#071319; --btn-bg-hover:#fff;
  --dashboard-panel: rgba(38, 40, 50, 0.94);
  --dashboard-panel-hover: rgba(50, 52, 64, 0.98);
  --dashboard-panel-border: rgba(255, 255, 255, 0.1);
}
body{
  background:
    radial-gradient(ellipse 110% 70% at 12% 8%, rgba(200, 50, 70, 0.14), transparent 58%),
    radial-gradient(ellipse 100% 60% at 88% 18%, rgba(160, 36, 52, 0.12), transparent 55%),
    var(--bg);
  color:var(--text);
  font:16px/1.6 system-ui, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
}
.wrapper{max-width:1140px;margin:0 auto;padding:20px}
.header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:12px 14px 18px;
  margin:0 0 20px;
  border-radius:14px;
  background:linear-gradient(180deg, rgba(34, 14, 20, 0.98) 0%, rgba(14, 7, 10, 1) 100%);
  border-bottom:3px solid rgb(197, 60, 79);
  box-shadow:inset 0 -1px 0 rgba(255, 140, 155, 0.32), 0 8px 24px rgba(0, 0, 0, 0.28);
}
.brand{display:flex;align-items:center;gap:12px;font-weight:800;letter-spacing:.3px;font-size:clamp(20px,2.2vw,28px)}
.logo-img{width:36px;height:36px;border-radius:10px;object-fit:cover;box-shadow:0 8px 20px rgba(0,0,0,0.35);}
.brand, .brand.logo {color: var(--accent); text-decoration: none;}
.profile-card{position:relative; display:grid; gap:14px;}
.profile-meta h3{margin:0 0 6px;}
.profile-meta p{margin:0 0 10px;}
.profile-meta .badges{display:flex;flex-wrap:wrap;gap:8px;}
.ego-bubble{
  position:absolute; top:12px; right:12px;
  background:#fff;
  color:#111;
  padding:10px 12px;
  border-radius:18px 18px 6px 18px;
  box-shadow:0 12px 28px rgba(0,0,0,0.28);
  max-width:220px;
  font-weight:700;
  font-size:14px;
}

/* ============================================================
   TEN HANDMADE BLOG THEMES — drop AFTER your base CSS.
   Usage: wrap a blog with <div class="theme-shell theme-aurora-skies">…</div>
   ============================================================ */

/* shared helpers */
.theme-shell{position:relative; overflow:hidden;}
.theme-shell::before{content:""; position:absolute; inset:-2px; z-index:-1; pointer-events:none; opacity:.35;}
.theme-shell .pill,.theme-shell .chip{border-color:var(--blog-border); color:var(--blog-text)}
.theme-shell .blog-links,.theme-shell .blog-description{background:var(--blog-panel);border-color:var(--blog-border)}
.theme-shell .link-card{background:var(--blog-card); box-shadow:var(--blog-card-shadow)}

/* tiny icon base */
.t-icon{--s:22px; width:var(--s); height:var(--s); display:inline-block}

/* ---------- 1) Aurora Skies ---------- */
.theme-aurora-skies{
  --blog-bg: #0a0f19;
  --blog-text:#e8f6ff;
  --blog-muted:#a9c4d6;
  --blog-panel: rgba(255,255,255,.08);
  --blog-border: rgba(136,203,255,.38);
  --blog-card: rgba(255,255,255,.09);
  --blog-card-shadow: 0 28px 56px rgba(0,0,0,.6), 0 0 0 1px rgba(136,203,255,.18), inset 0 1px 0 rgba(255,255,255,.1);
}
.theme-aurora-skies::before{
  background:
    radial-gradient(1400px 320px at 50% -8%, rgba(116,213,255,.24), transparent 62%),
    conic-gradient(from 0deg at 50% 120%, rgba(0,255,199,.2), rgba(183,121,255,.18), rgba(0,171,255,.2), rgba(0,255,199,.2));
  animation: auroraFloat 18s ease-in-out infinite alternate;
  filter: blur(20px) saturate(125%);
}
@keyframes auroraFloat{0%{transform:translateY(-10px) rotate(0deg)}100%{transform:translateY(10px) rotate(1.5deg)}}
.theme-aurora-skies .t-icon.aurora-star{
  background:
    radial-gradient(circle at 50% 50%, #c7f1ff 0 26%, transparent 27%),
    conic-gradient(from 0deg,#9ef 0 26%, transparent 26% 50%, #9ef 50% 76%, transparent 76% 100%);
  -webkit-mask: radial-gradient(circle,#000 62%, transparent 63%);
          mask: radial-gradient(circle,#000 62%, transparent 63%);
  filter: drop-shadow(0 0 4px rgba(199, 241, 255, 0.6));
}

/* ---------- 2) Clockwork Harbor ---------- */
.theme-clockwork-harbor{
  --blog-bg: #0b1013;
  --blog-text:#f2efe7;
  --blog-muted:#bfc7cc;
  --blog-panel: rgba(226,199,126,.12);
  --blog-border: rgba(205,165,74,.42);
  --blog-card: rgba(255,255,255,.09);
  --blog-card-shadow: 0 30px 62px rgba(8,7,4,.7), 0 0 0 1px rgba(205,165,74,.22), inset 0 1px 0 rgba(255,255,255,.08);
}
.theme-clockwork-harbor::before{
  background:
    radial-gradient(600px 100px at 20% -4%, rgba(16,71,116,.28), transparent 62%),
    repeating-radial-gradient(circle at 70% 20%, rgba(152,119,55,.16) 0 7px, transparent 7px 24px),
    repeating-linear-gradient( 90deg, rgba(80,100,120,.13) 0 2px, transparent 2px 16px);
  filter: blur(1px);
}
.theme-clockwork-harbor .t-icon.gear{
  background:
    conic-gradient(#caa35a 0 11%, transparent 11% 21%, #caa35a 21% 32%, transparent 32% 42%, #caa35a 42% 53%, transparent 53% 63%, #caa35a 63% 74%, transparent 74% 84%, #caa35a 84% 95%, transparent 95% 100%),
    radial-gradient(circle at 50% 50%, #1b2a36 0 36%, transparent 37%);
  border-radius:50%;
  box-shadow: inset 0 0 0 2px #b6893f, 0 2px 8px rgba(202, 163, 90, 0.3);
}

/* ---------- 3) Desert Mirage ---------- */
.theme-desert-mirage{
  --blog-bg:#1a120c;
  --blog-text:#fff7ea;
  --blog-muted:#e6d3b4;
  --blog-panel: rgba(255,235,205,.1);
  --blog-border: rgba(255,203,134,.4);
  --blog-card: rgba(255,245,224,.11);
  --blog-card-shadow: 0 30px 58px rgba(60,35,10,.65), 0 0 0 1px rgba(255,203,134,.22), inset 0 1px 0 rgba(255,255,255,.12);
}
.theme-desert-mirage::before{
  background:
    radial-gradient(1400px 360px at 50% -12%, rgba(255,188,102,.22), transparent 62%),
    repeating-linear-gradient( to bottom, rgba(255,196,128,.09) 0 9px, transparent 9px 20px);
  animation: shimmer 8s linear infinite;
  filter: blur(7px);
}
@keyframes shimmer{to{transform:translateY(14px)}}
.theme-desert-mirage .t-icon.cactus{
  background:
    radial-gradient(11px 15px at 50% 70%, #58a66b 0 62%, transparent 63%),
    radial-gradient(7px 19px at 30% 40%, #58a66b 0 62%, transparent 63%),
    radial-gradient(7px 19px at 70% 40%, #58a66b 0 62%, transparent 63%);
  filter: drop-shadow(0 2px 4px rgba(88, 166, 107, 0.3));
}

/* ---------- 4) Glacier Drift ---------- */
.theme-glacier-drift{
  --blog-bg:#081015;
  --blog-text:#e9f7ff;
  --blog-muted:#b8d1dc;
  --blog-panel: rgba(185,230,255,.1);
  --blog-border: rgba(160,220,255,.4);
  --blog-card: rgba(230,250,255,.09);
  --blog-card-shadow: 0 32px 64px rgba(0,20,30,.65), 0 0 0 1px rgba(160,220,255,.2), inset 0 1px 0 rgba(255,255,255,.1);
}
.theme-glacier-drift::before{
  background:
    conic-gradient(from 200deg at 20% -12%, rgba(180,240,255,.2), transparent 42%),
    repeating-linear-gradient( 135deg, rgba(200,245,255,.13) 0 13px, transparent 13px 28px);
  filter: blur(11px);
}
.theme-glacier-drift .t-icon.snow{
  background:
    conic-gradient(#dff 0 11%, transparent 11% 22%, #dff 22% 33%, transparent 33% 44%, #dff 44% 55%, transparent 55% 66%, #dff 66% 77%, transparent 77% 88%, #dff 88% 100%);
  -webkit-mask: radial-gradient(circle, #000 0 30%, transparent 31%);
          mask: radial-gradient(circle, #000 0 30%, transparent 31%);
  border-radius:50%;
  filter: drop-shadow(0 0 3px rgba(221, 255, 255, 0.5));
}

/* ---------- 5) Sakura Bloom ---------- */
.theme-sakura-bloom{
  --blog-bg:#140d14;
  --blog-text:#ffeef5;
  --blog-muted:#f3c9d9;
  --blog-panel: rgba(255,182,206,.12);
  --blog-border: rgba(255,168,197,.4);
  --blog-card: rgba(255,208,226,.1);
  --blog-card-shadow: 0 28px 56px rgba(40,0,35,.6), 0 0 0 1px rgba(255,168,197,.22), inset 0 1px 0 rgba(255,255,255,.1);
}
.theme-sakura-bloom::before{
  background:
    radial-gradient(1000px 280px at 60% -10%, rgba(255,145,185,.24), transparent 62%),
    radial-gradient(1300px 380px at 20% -2%, rgba(255,105,165,.14), transparent 62%),
    radial-gradient(9px 13px at 10% 30%, rgba(255,170,200,.88) 0 42%, transparent 43%),
    radial-gradient(9px 13px at 20% 25%, rgba(255,170,200,.82) 0 42%, transparent 43%),
    radial-gradient(9px 13px at 30% 35%, rgba(255,170,200,.78) 0 42%, transparent 43%);
  animation: petals 14s linear infinite;
  filter: blur(0.5px);
}
@keyframes petals{to{transform:translateY(26px)}}
.theme-sakura-bloom .t-icon.blossom{
  background:
    radial-gradient(circle at 50% 10%, #ffd1e0 0 32%, transparent 33%),
    radial-gradient(circle at 10% 60%, #ffd1e0 0 32%, transparent 33%),
    radial-gradient(circle at 90% 60%, #ffd1e0 0 32%, transparent 33%),
    radial-gradient(circle at 50% 85%, #ffd1e0 0 32%, transparent 33%),
    radial-gradient(circle at 50% 50%, #ffb6cf 0 24%, transparent 25%);
  filter: drop-shadow(0 2px 6px rgba(255, 182, 207, 0.4));
}

/* ---------- 6) Vaporwave Arcade ---------- */
.theme-vaporwave-arcade{
  --blog-bg:#10091a;
  --blog-text:#f6f2ff;
  --blog-muted:#d7c8ff;
  --blog-panel: rgba(255,255,255,.09);
  --blog-border: rgba(255,102,204,.48);
  --blog-card: rgba(255,255,255,.1);
  --blog-card-shadow: 0 36px 72px rgba(0,0,0,.7), 0 0 0 1px rgba(255,102,204,.28), inset 0 1px 0 rgba(255,255,255,.12);
}
.theme-vaporwave-arcade::before{
  background:
    radial-gradient(450px 140px at 50% 8%, rgba(255,110,180,.38), transparent 62%),
    repeating-linear-gradient( to top, rgba(255,0,170,.2) 0 2px, transparent 2px 16px),
    repeating-linear-gradient( to right, rgba(0,200,255,.2) 0 2px, transparent 2px 16px);
  transform: perspective(800px) rotateX(55deg) translateY(40%);
  transform-origin:bottom center;
  filter: blur(0.5px);
}
.theme-vaporwave-arcade .t-icon.neon{
  background:
    radial-gradient(circle, #0ff 0 32%, transparent 33%),
    conic-gradient(from 0deg, #f0f 0 26%, transparent 26% 50%, #f0f 50% 76%, transparent 76% 100%);
  filter: drop-shadow(0 0 8px #f0f) drop-shadow(0 0 8px #0ff) drop-shadow(0 0 4px rgba(255, 255, 255, 0.3));
}

/* ---------- 7) Velvet Gothic ---------- */
.theme-velvet-gothic{
  --blog-bg:#0c0810;
  --blog-text:#f7f0ff;
  --blog-muted:#d2c5e6;
  --blog-panel: rgba(88,0,126,.18);
  --blog-border: rgba(210,160,80,.5);
  --blog-card: rgba(70,0,106,.22);
  --blog-card-shadow: 0 34px 68px rgba(15,0,25,.75), 0 0 0 1px rgba(210,160,80,.25), inset 0 1px 0 rgba(255,255,255,.08);
}
.theme-velvet-gothic::before{
  background:
    radial-gradient(1500px 450px at 50% -12%, rgba(120,30,180,.28), transparent 62%),
    conic-gradient(from 0deg at 0% 0%, rgba(235,195,120,.24) 0 8deg, transparent 8deg),
    conic-gradient(from 180deg at 100% 100%, rgba(235,195,120,.24) 0 8deg, transparent 8deg);
  filter: blur(1px);
}
.theme-velvet-gothic .t-icon.fleur{
  background:
    radial-gradient(circle at 50% 10%, #dcb36e 0 32%, transparent 33%),
    radial-gradient(circle at 10% 70%, #dcb36e 0 32%, transparent 33%),
    radial-gradient(circle at 90% 70%, #dcb36e 0 32%, transparent 33%),
    radial-gradient(circle at 50% 60%, #dcb36e 0 24%, transparent 25%);
  filter: drop-shadow(0 2px 6px rgba(220, 179, 110, 0.4));
}

/* ---------- 8) Nebula Dreams ---------- */
.theme-nebula-dreams{
  --blog-bg:#090b12;
  --blog-text:#f1f6ff;
  --blog-muted:#c6d3ee;
  --blog-panel: rgba(255,255,255,.09);
  --blog-border: rgba(150,190,255,.42);
  --blog-card: rgba(255,255,255,.1);
  --blog-card-shadow: 0 32px 64px rgba(0,0,0,.7), 0 0 0 1px rgba(150,190,255,.22), inset 0 1px 0 rgba(255,255,255,.1);
}
.theme-nebula-dreams::before{
  background:
    radial-gradient(900px 260px at 20% -2%, rgba(175,120,255,.28), transparent 62%),
    radial-gradient(1100px 300px at 80% 12%, rgba(90,200,255,.22), transparent 62%),
    radial-gradient(1.5px 1.5px at 12% 24%, rgba(255,255,255,0.9) 0 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 35% 12%, rgba(255,255,255,0.85) 0 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 62% 30%, rgba(255,255,255,0.9) 0 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 82% 18%, rgba(255,255,255,0.85) 0 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 70% 44%, rgba(255,255,255,0.9) 0 50%, transparent 51%);
  animation: nebFloat 20s ease-in-out infinite alternate;
  filter: blur(0.3px);
}
@keyframes nebFloat{0%{transform:translateY(-8px)}100%{transform:translateY(8px)}}
.theme-nebula-dreams .t-icon.star{
  background: radial-gradient(circle, #fff 0 30%, transparent 31%), conic-gradient(#fff 0 11%, transparent 11% 22%, #fff 22% 33%, transparent 33% 44%, #fff 44% 55%, transparent 55% 66%, #fff 66% 77%, transparent 77% 88%, #fff 88% 100%);
  border-radius:50%;
  filter: drop-shadow(0 0 4px rgba(255, 255, 255, 0.6));
}

/* ---------- 9) Jungle Temple ---------- */
.theme-jungle-temple{
  --blog-bg:#0b110c;
  --blog-text:#f1ffee;
  --blog-muted:#c5e0c9;
  --blog-panel: rgba(185,255,205,.1);
  --blog-border: rgba(115,195,145,.42);
  --blog-card: rgba(255,255,255,.09);
  --blog-card-shadow: 0 30px 60px rgba(3,20,8,.65), 0 0 0 1px rgba(115,195,145,.22), inset 0 1px 0 rgba(255,255,255,.1);
}
.theme-jungle-temple::before{
  background:
    repeating-linear-gradient( 45deg, rgba(90,120,90,.13) 0 20px, transparent 20px 40px),
    repeating-linear-gradient(-45deg, rgba(90,120,90,.13) 0 20px, transparent 20px 40px),
    radial-gradient(700px 180px at 70% -6%, rgba(110,190,140,.2), transparent 62%);
  filter: blur(0.5px);
}
.theme-jungle-temple .t-icon.leaf{
  border-radius:60% 15% 60% 15%/80% 20% 80% 20%;
  background: linear-gradient(180deg, #48a870, #2f7a51);
  filter: drop-shadow(0 2px 6px rgba(72, 168, 112, 0.3));
}

/* ---------- 10) Paper & Ink ---------- */
.theme-paper-ink{
  --blog-bg:#0e0f11;
  --blog-text:#111;
  --blog-muted:#555;
  --blog-panel:#fff8e9;
  --blog-border:#e8d8bd;
  --blog-card:#fffaf0;
  --blog-card-shadow: 0 24px 48px rgba(0,0,0,.4), 0 0 0 1px rgba(232, 216, 189, 0.4), inset 0 1px 0 rgba(255,255,255,.6);
}
.theme-paper-ink::before{
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect filter='url(%23n)' width='100%25' height='100%25' opacity='.06'/%3E%3C/svg%3E");
  opacity:.55; mix-blend-mode:multiply;
}
.theme-paper-ink .blog-description,
.theme-paper-ink .blog-links,
.theme-paper-ink .link-card{ color:#111 }
.theme-paper-ink .link-card .url{ color:#444 }
.theme-paper-ink .t-icon.ink{
  background:
    radial-gradient(62% 62% at 50% 50%, #111 0 72%, transparent 73%),
    radial-gradient(42% 42% at 20% 20%, #111 0 42%, transparent 43%),
    radial-gradient(37% 37% at 70% 30%, #111 0 42%, transparent 43%);
  border-radius:50%;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2));
}
.theme-art{position:relative;width:48px;height:48px;flex:0 0 48px;filter:drop-shadow(0 4px 12px rgba(0,0,0,.25))}
.controls{display:flex;gap:10px;align-items:center}
.ghost{
  background: var(--dashboard-panel);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  padding: 10px 12px;
  border-radius: 12px;
  color: var(--text);
  text-decoration: none;
  border: 1px solid var(--dashboard-panel-border);
}
.badge{
  --b:var(--accent);
  display:inline-flex;align-items:center;gap:8px;
  font-size:.85rem;padding:6px 12px;border-radius:999px;
  border:1px solid color-mix(in oklab, var(--b) 70%, #000 30%);
  background:linear-gradient(135deg, color-mix(in oklab, var(--b) 22%, #000 78%), color-mix(in oklab, var(--b) 12%, #000 88%));
  box-shadow: 0 8px 16px rgba(0,0,0,0.28), inset 0 1px 0 rgba(255,255,255,0.06);
  color: var(--text);
  font-weight: 600;
}
/* Unified Card Layout */
.main-content{
  margin-top: 24px;
  position: relative;
  z-index: 2;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
  padding: 0 16px;
}

.unified-card{
  background:
    radial-gradient(circle at 15% 10%, rgba(255,255,255,0.06), transparent 40%),
    radial-gradient(circle at 85% 20%, rgba(255,255,255,0.05), transparent 38%),
    color-mix(in srgb, var(--card) 88%, transparent);
  border-radius: 20px;
  padding: 0;
  border: 1px solid rgba(255,255,255,0.22);
  box-shadow:
    0 28px 56px rgba(0,0,0,0.5),
    0 0 0 1px rgba(255,255,255,0.08),
    inset 0 1px 0 rgba(255,255,255,0.12);
  backdrop-filter: blur(12px) saturate(112%);
  transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease;
  overflow: hidden;
  width: 100%;
  box-sizing: border-box;
}

.unified-card:hover{
  transform: translateY(-3px);
  border-color: rgba(255,255,255,0.3);
  box-shadow:
    0 36px 64px rgba(0,0,0,0.55),
    0 0 0 1px rgba(255,255,255,0.12),
    inset 0 1px 0 rgba(255,255,255,0.14);
}

/* Profile Section */
.profile-section{
  padding: 24px 20px 20px;
  text-align: center;
  border-bottom: 1px solid rgba(255,255,255,0.1);
  background:
    radial-gradient(circle at 50% 0%, rgba(255,255,255,0.02), transparent 60%);
}

.hero-image-wrapper{
  position: relative;
  margin: 0 auto 16px;
  max-width: 200px;
  display: inline-block;
}

.hero-image-wrapper .hero-image{
  width: 100%;
  max-width: 200px;
  max-height: 200px;
  border-radius: 14px;
  box-shadow: 0 12px 32px rgba(0,0,0,0.5);
  object-fit: cover;
  border: 2px solid rgba(255,255,255,0.12);
  display: block;
}

.ego-bubble{
  position: absolute;
  top: -6px;
  right: -6px;
  background: #fff;
  color: #111;
  padding: 10px 12px;
  border-radius: 18px 18px 6px 18px;
  box-shadow: 0 12px 28px rgba(0,0,0,0.28);
  max-width: 220px;
  font-weight: 700;
  font-size: 14px;
  z-index: 10;
}

.hero-image-caption{
  margin-top: 12px;
  color: var(--muted);
  font-size: 0.9rem;
}

.profile-header{
  position: relative;
}

.profile-name{
  font-size: clamp(24px, 3.5vw, 30px);
  font-weight: 800;
  margin: 0 0 6px 0;
  color: var(--text);
  letter-spacing: -0.5px;
}

.profile-tagline{
  color: var(--muted);
  font-size: 0.85rem;
  margin: 0 0 12px 0;
}

.personalities-display{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  margin-top: 12px;
}

.personality-chip-display{
  --c: #ff5ad5;
  position: relative;
  border: 1px solid color-mix(in srgb, var(--c) 70%, rgba(255,255,255,.10));
  background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  color: var(--text);
  border-radius: 999px;
  padding: 8px 12px 8px 8px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  box-shadow: 0 0 0 1px rgba(0,0,0,.35) inset, 0 8px 18px rgba(0,0,0,.30);
}

.personality-chip-display .personality-icon{
  width: 24px;
  height: 24px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  background: radial-gradient(10px 10px at 30% 30%, rgba(255,255,255,.35), transparent 60%),
              linear-gradient(145deg, color-mix(in srgb, var(--c) 92%, #000 8%), color-mix(in srgb, var(--c) 70%, #000 30%));
  box-shadow: 0 0 0 1px rgba(255,255,255,.14) inset, 0 8px 18px rgba(0,0,0,.35);
  flex-shrink: 0;
}

.personality-chip-display .personality-icon svg{
  width: 16px;
  height: 16px;
  color: #fff;
}

.personality-chip-display .personality-label{
  font-size: 13px;
  letter-spacing: .2px;
  white-space: nowrap;
  font-weight: 500;
}

.personality-chip-display::after{
  content: attr(data-personality);
  position: absolute;
  left: 50%;
  bottom: calc(100% + 10px);
  transform: translate(-50%, 6px);
  opacity: 0;
  pointer-events: none;
  white-space: nowrap;
  font-size: 11px;
  color: #d6dbe6;
  background: rgba(17,19,26,.92);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 10px;
  padding: 6px 8px;
  box-shadow: 0 12px 26px rgba(0,0,0,.45);
  transition: opacity .14s ease, transform .14s ease;
  backdrop-filter: blur(6px);
  z-index: 100;
}

.personality-chip-display::before{
  content: "";
  position: absolute;
  left: 50%;
  bottom: calc(100% + 4px);
  transform: translateX(-50%);
  width: 8px;
  height: 8px;
  background: rgba(17,19,26,.92);
  border-left: 1px solid rgba(255,255,255,.10);
  border-bottom: 1px solid rgba(255,255,255,.10);
  rotate: 45deg;
  opacity: 0;
  transition: opacity .14s ease;
  z-index: 100;
}

.personality-chip-display:hover::after,
.personality-chip-display:hover::before{
  opacity: 1;
  transform: translate(-50%, 0);
}

/* About Section */
.about-section{
  padding: 16px 24px;
  border-bottom: 1px solid rgba(255,255,255,0.1);
  width: 100%;
  box-sizing: border-box;
}

.section-title{
  font-size: 1.15rem;
  font-weight: 700;
  margin: 0 0 8px 0;
  color: var(--text);
  letter-spacing: -0.3px;
}

.links-section .section-title{
  margin: 0 0 10px 0;
}

.description-content{
  color: var(--text);
  line-height: 1.5;
  font-size: 0.875rem;
  word-wrap: break-word;
  overflow-wrap: break-word;
  word-break: break-word;
  white-space: pre-wrap;
  width: 100%;
  max-width: 100%;
  overflow: visible;
  box-sizing: border-box;
  margin: 0;
}

.description-content p{
  margin: 0;
  word-wrap: break-word;
  overflow-wrap: break-word;
  word-break: break-word;
  max-width: 100%;
  overflow: visible;
  line-height: 1.5;
}

/* Links Section */
.links-section{
  padding: 16px 24px 20px;
  width: 100%;
  box-sizing: border-box;
}

.links-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px;
  margin-top: 12px;
}

.link-card{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 12px;
  background:
    radial-gradient(circle at 20% 20%, rgba(255,255,255,0.08), transparent 45%),
    color-mix(in srgb, var(--card) 78%, transparent);
  color: var(--text);
  text-decoration: none;
  border: 1px solid rgba(255,255,255,0.2);
  box-shadow: 
    0 14px 32px rgba(0,0,0,0.45), 
    inset 0 1px 0 rgba(255,255,255,0.1);
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.link-card:hover{
  transform: translateY(-2px);
  border-color: rgba(255,255,255,0.3);
  box-shadow: 
    0 18px 40px rgba(0,0,0,0.52), 
    inset 0 1px 0 rgba(255,255,255,0.12);
}

.link-card .label{
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 0.95rem;
  text-shadow: 0 2px 6px rgba(0,0,0,0.3);
  flex: 1;
}

.link-card .link-icon{
  width: 32px;
  height: 32px;
  object-fit: contain;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.2);
  flex-shrink: 0;
}

.link-card .url{
  display: none;
}

.no-links{
  text-align: center;
  padding: 24px;
  color: var(--muted);
  font-style: italic;
}

.muted{color:var(--muted);} 
.small{font-size:13px;}

/* Responsive */
@media (max-width: 900px){
  .main-content{
    max-width: 100%;
  }
  .unified-card{
    border-radius: 16px;
  }
  .profile-section,
  .about-section,
  .links-section{
    padding: 24px 20px;
  }
  .links-grid{
    grid-template-columns: 1fr;
  }
}

/* Handmade icons */
.icon-flower{--petal:#ff7db6;position:relative;width:22px;height:22px;border-radius:50%;background:
 radial-gradient(circle at 50% 0%, var(--petal) 40%, transparent 41%) 50% 0/100% 50% no-repeat,
 radial-gradient(circle at 100% 50%, var(--petal) 40%, transparent 41%) 100% 50%/50% 100% no-repeat,
 radial-gradient(circle at 50% 100%, var(--petal) 40%, transparent 41%) 50% 100%/100% 50% no-repeat,
 radial-gradient(circle at 0% 50%, var(--petal) 40%, transparent 41%) 0% 50%/50% 100% no-repeat,
 radial-gradient(circle at 50% 50%, #ffd45c 0 40%, #0000 41%);filter:drop-shadow(0 2px 2px rgba(0,0,0,.25));}
.icon-candy{position:relative;width:18px;height:26px;border-radius:10px 10px 2px 2px;background: repeating-linear-gradient(45deg,#fff 0 6px,#c9132c 6px 12px);clip-path: path("M 9,0 C 3,0 0,3 0,9 v11 h18 v-11 c0-6-3-9-9-9 z");box-shadow: inset 0 -1px 0 rgba(0,0,0,.2);}
.icon-skull{position:relative;width:22px;height:22px;border-radius:50%;background: radial-gradient(circle at 30% 40%, #0000 20%, #0008 21% 28%, #0000 29%) ,radial-gradient(circle at 70% 40%, #0000 20%, #0008 21% 28%, #0000 29%), #f4f4f4;box-shadow: inset 0 -6px 0 #e6e6e6;}
.icon-skull::before,.icon-skull::after{content:"";position:absolute;inset:auto;top:14px;left:1px;right:1px;height:3px;background:#f4f4f4;border-radius:2px;transform-origin:center;box-shadow:0 0 0 1px #e6e6e6 inset;}
.icon-skull::before{transform:rotate(20deg)} .icon-skull::after{transform:rotate(-20deg)}
.icon-palm{position:relative;width:22px;height:22px;}
.icon-palm::before{content:"";position:absolute;left:9px;bottom:2px;width:4px;height:16px;border-radius:2px;background: linear-gradient(#7a4d2a,#3e2515);}
.icon-palm::after{content:"";position:absolute;left:2px;top:2px;right:2px;height:10px;background:
    conic-gradient(from -40deg at 50% 100%, #1fd87a 0 25%, #0000 0) ,
    conic-gradient(from -10deg at 50% 100%, #19c16b 0 25%, #0000 0) ,
    conic-gradient(from 20deg at 50% 100%, #11a95f 0 25%, #0000 0);filter:drop-shadow(0 2px 0 rgba(0,0,0,.2));}
.icon-chip{position:relative;width:20px;height:20px;border-radius:4px;background:#00ffc6;box-shadow:0 0 0 2px #012d2a inset,0 0 12px rgba(0,255,198,.6);}
.icon-chip::before,.icon-chip::after{content:"";position:absolute;inset:-4px auto auto -4px;width:4px;height:4px;background:#00ffc6;border-radius:1px;box-shadow:0 24px 0 #00ffc6, 24px 0 0 #00ffc6, 24px 24px 0 #00ffc6,48px 0 0 #00ffc6, 0 48px 0 #00ffc6, 48px 48px 0 #00ffc6;}
.icon-chip::after{inset:auto -4px -4px auto}
.icon-heart,.icon-spade{position:relative;width:18px;height:18px}
.icon-heart{background:
    radial-gradient(circle at 30% 35%, #f2487e 55%, #0000 56%) ,
    radial-gradient(circle at 70% 35%, #f2487e 55%, #0000 56%) ,
    conic-gradient(from 0deg at 50% 70%, #f2487e 0 180deg, #0000 0);
  clip-path: polygon(50% 88%, 0 36%, 25% 0, 50% 20%, 75% 0, 100% 36%);}
.icon-spade{background:
    radial-gradient(circle at 30% 55%, #222 55%, #0000 56%) ,
    radial-gradient(circle at 70% 55%, #222 55%, #0000 56%) ,
    conic-gradient(from 180deg at 50% 40%, #222 0 180deg, #0000 0);
  clip-path: polygon(50% 0, 0 55%, 35% 55%, 35% 75%, 65% 75%, 65% 55%, 100% 55%);}

/* Particles */
.particles{
  position:fixed;
  inset:0;
  padding:80px 80px 70px 80px; /* Reduced padding for wider spread */
  box-sizing:border-box;
  pointer-events:none;
  overflow:hidden;
  z-index:10;
}
@media (max-width: 1024px){
  .particles{padding:60px 60px 60px 60px;}
}
@media (max-width: 720px){
  .particles{padding:45px 40px 45px 40px;}
}
.p{
  position:absolute;
  top:0; left:0;
  display:block;
  will-change:transform,opacity;
  opacity:.9;
  transform: translate3d(var(--x, 0px), var(--startY, -140px), 0) rotate(0deg);
  animation: fallY var(--dur) linear var(--delay) 1 both;
  filter:drop-shadow(0 4px 10px rgba(0,0,0,0.4));
  object-fit: contain;
}
.p-fallback{
  position:absolute;
  top:0; left:0;
  display:block;
  will-change:transform,opacity;
  opacity:.9;
  transform: translate3d(var(--x, 0px), var(--startY, -140px), 0) rotate(0deg);
  animation: fallY var(--dur) linear var(--delay) 1 both;
  filter:drop-shadow(0 4px 10px rgba(0,0,0,0.4));
}
@keyframes fallY{
  from{
    transform:translate3d(var(--x), var(--startY, -100%), 0) rotate(0deg);
  }
  to{
    transform:translate3d(calc(var(--x) + var(--dx,0px)), var(--endY, 200%), 0) rotate(var(--rotation, 360deg));
  }
}
.p.leaf{width:40px;height:56px;border-radius:12px 28px 12px 28px;background:#8be27b;transform:rotate(15deg)}
.p.snow{width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 0 12px #fff8}
.p.playing-card{width:40px;height:40px;background:#f2487e;transform:rotate(45deg)}
.p.bubble{width:32px;height:32px;border:2px solid #fff8;border-radius:50%;background:radial-gradient(circle at 30% 30%, #fff8 0 35%, #0000 36%)}
.p.byte{width:24px;height:24px;background:#00ffc6;box-shadow:0 0 12px #00ffc6a0}
.p.glow{width:24px;height:24px;opacity:.4; filter:blur(1.2px) drop-shadow(0 0 10px rgba(255,255,255,0.4));}
.p.cog{width:30px;height:30px;border-radius:50%;background:conic-gradient(#caa35a 0 15%,#0000 15% 30%,#caa35a 30% 45%,#0000 45% 60%,#caa35a 60% 75%,#0000 75% 90%,#caa35a 90% 100%);box-shadow:inset 0 0 0 2px #b88b3c;}
.p.sand{width:20px;height:20px;border-radius:50%;background:#f2c487;}
.p.petal{width:24px;height:20px;border-radius:14px 14px 20px 20px;background:#ffb6cf;}
.p.pixel{width:16px;height:16px;border-radius:6px;background:#00f1ff;box-shadow:0 0 10px #00f1ff90;}
.p.ember{width:20px;height:20px;border-radius:50%;background:radial-gradient(circle,#ffd071 0 50%,#ff5a7a 51% 80%,#0000 81%);filter:drop-shadow(0 0 8px #ff7b8a80);}
.p.star{width:24px;height:24px;border-radius:50%;background:radial-gradient(circle,#fff 0 28%,transparent 29%), conic-gradient(#fff 0 10%, transparent 10% 20%, #fff 20% 30%, transparent 30% 40%, #fff 40% 50%, transparent 50% 60%, #fff 60% 70%, transparent 70% 80%, #fff 80% 90%, transparent 90% 100%);}
.p.paper{width:20px;height:20px;border-radius:50%;background:#111;}
@keyframes riseY{from{transform:translate(var(--x), 110%)} to{transform:translate(calc(var(--x) + var(--dx,0px)), -10%)}}
@keyframes pop{from{transform:scale(.92);opacity:.6} to{transform:scale(1);opacity:1}}

/* Theme Presets - Remastered for Solid, Polished Look */
body[data-theme="nature"]{
  --bg: linear-gradient(180deg, #0c1a0c 0%, #0b140b 25%, #0f1f0f 100%);
  --card:#112012; --text:#eaf7e8; --muted:#b8d8b0; --accent:#7fe676;
  --btn-text:#062006;
  background:
    radial-gradient(1400px 320px at 10% -120%, rgba(21, 53, 21, 0.6), transparent 65%),
    radial-gradient(1200px 300px at 90% -110%, rgba(14, 42, 14, 0.55), transparent 65%),
    var(--bg);
}
body[data-theme="nature"] .theme-art{
  background:
    radial-gradient(circle at 50% 50%, #ffd45c 0 22%, transparent 23%),
    radial-gradient(circle at 50% 5%,  #ff7db6 0 30%, transparent 31%),
    radial-gradient(circle at 95% 50%, #ff7db6 0 30%, transparent 31%),
    radial-gradient(circle at 50% 95%, #ff7db6 0 30%, transparent 31%),
    radial-gradient(circle at 5% 50%,  #ff7db6 0 30%, transparent 31%);
  border-radius:12px;
  filter: drop-shadow(0 4px 12px rgba(127, 230, 118, 0.2));
}
.vines{display:none}
body[data-theme="nature"] .vines{
  display:block; position:fixed; inset:auto 0 0 0; height:52px; z-index:1;
  background:
    repeating-linear-gradient(90deg, rgba(26, 63, 26, 0.8) 0 30px, rgba(33, 77, 33, 0.85) 30px 60px) ,
    radial-gradient(10px 24px at 18px -8px, rgba(59, 200, 111, 0.6) 0 70%, transparent 71%) 0 0/60px 100% repeat-x;
  opacity:.55; filter:blur(0.5px);
}

body[data-theme="christmas"]{
  --bg: #0d0f12; --card:#10151b; --text:#f7f7f7; --muted:#d4e0e6; --accent:#ff355e;
  --btn-text:#1a0008;
  background: #0d0f12;
  position: relative;
  overflow-x: hidden;
}
body[data-theme="christmas"] .theme-art{
  background: repeating-linear-gradient(45deg, #fff 0 9px, #c9132c 9px 18px);
  clip-path: path("M 24,4 C 12,4 8,8 8,16 v20 h32 v-20 c0-8-4-12-16-12 z");
  border-radius:10px;
  filter: drop-shadow(0 4px 12px rgba(255, 53, 94, 0.25));
}
body[data-theme="christmas"] .badge{--b:#2ed27a}

body[data-theme="wonderland"]{
  --bg: linear-gradient(180deg, #f9f0ff 0%, #f6fbff 40%, #f9f0ff 100%);
  --card:rgba(255, 255, 255, 0.92); --text:#31323a; --muted:#6f7180; --accent:#f2487e;
  --btn-text:#361525;
  background:
    radial-gradient(1000px 300px at 50% -100px, rgba(242, 72, 126, 0.08), transparent 60%),
    var(--bg);
}
body[data-theme="wonderland"] .theme-art{
  background:
    radial-gradient(circle at 35% 35%, #f2487e 0 42%, transparent 43%),
    radial-gradient(circle at 65% 35%, #f2487e 0 42%, transparent 43%),
    conic-gradient(from 0deg at 50% 70%, #f2487e 0 180deg, transparent 0);
  clip-path: polygon(50% 88%, 0 36%, 25% 0, 50% 20%, 75% 0, 100% 36%);
  filter: drop-shadow(0 4px 12px rgba(242, 72, 126, 0.2));
}
.checker{display:none}
body[data-theme="wonderland"] .checker{
  display:block;position:fixed;inset:0;pointer-events:none;opacity:.05;z-index:1;
  background: conic-gradient(transparent 90deg, rgba(0, 0, 0, 0.03) 0) 0 0/42px 42px;
}

body[data-theme="pirates"]{
  --bg: #0b1020; --card:#111827; --text:#e9ecf3; --muted:#b9c2d6; --accent:#ffcf6b;
  --btn-text:#302306;
  background:
    radial-gradient(1400px 260px at 50% -100px, rgba(15, 26, 51, 0.95), transparent 70%),
    radial-gradient(800px 180px at 20% -60px, rgba(255, 207, 107, 0.08), transparent 65%),
    #0b1020;
}
body[data-theme="pirates"] .theme-art{
  background:
    radial-gradient(circle at 30% 40%, transparent 0 20%, rgba(0, 0, 0, 0.15) 21% 30%, transparent 31%),
    radial-gradient(circle at 70% 40%, transparent 0 20%, rgba(0, 0, 0, 0.15) 21% 30%, transparent 31%),
    #f4f4f4;
  border-radius:50%;
  box-shadow: inset 0 -8px 0 #e6e6e6, 0 0 0 2px #0b1020, 0 4px 12px rgba(0, 0, 0, 0.3);
}
.waves{display:none}
body[data-theme="pirates"] .waves{
  display:block; position:fixed; left:0; right:0; bottom:0; height:95px; z-index:1; opacity:.75;
  background:
    radial-gradient(65px 20px at 32px 12px, rgba(23, 58, 102, 0.9) 0 75%, transparent 76%) 0 0/125px 45px repeat-x,
    radial-gradient(65px 20px at 93px 28px, rgba(20, 80, 153, 0.85) 0 75%, transparent 76%) 0 0/125px 45px repeat-x,
    linear-gradient(180deg, rgba(14, 39, 71, 0.95), rgba(10, 26, 48, 0.98));
  animation:waveMove 8s linear infinite;
}
@keyframes waveMove{from{background-position:0 0,0 0,0 0} to{background-position:-125px 0,125px 0,0 0}}
body[data-theme="pirates"] .badge{--b:#ffcf6b}

body[data-theme="paradise"]{
  --bg: linear-gradient(180deg, #0e2d37 0%, #1a6b7d 35%, #fac570 100%);
  --card:rgba(14, 34, 48, 0.85); --text:#eff9ff; --muted:#cbe5f0; --accent:#ffd86b;
  --btn-text:#362b00;
}
body[data-theme="paradise"] .theme-art{
  background:
    radial-gradient(circle at 50% 50%, #ffd86b 0 42%, transparent 43%),
    conic-gradient(from -50deg at 50% 60%, #25dba1 0 26%, transparent 27%),
    conic-gradient(from -10deg at 50% 60%, #18c58e 0 26%, transparent 27%),
    conic-gradient(from 30deg at 50% 60%, #0ea879 0 26%, transparent 27%);
  border-radius:12px;
  filter: drop-shadow(0 4px 12px rgba(255, 216, 107, 0.25));
}
.sun{display:none}
body[data-theme="paradise"] .sun{
  display:block; position:fixed; top:6vh; left:10vw; width:125px; height:125px; z-index:-1;
  background:radial-gradient(circle at 50% 50%, #ffd86b 0 38%, #ffc65b 39% 58%, transparent 59%);
  filter:blur(0.3px) drop-shadow(0 12px 35px rgba(255, 216, 107, 0.5));
}

body[data-theme="cyber"]{
  --bg: #04060b; --card:#0a0e17; --text:#e6fbff; --muted:#a9d4d8; --accent:#00ffc6;
  --btn-text:#001a15;
  background:
    radial-gradient(1400px 280px at 50% -100px, rgba(7, 16, 30, 0.98), transparent 70%),
    radial-gradient(600px 160px at 20% -60px, rgba(0, 255, 198, 0.1), transparent 65%),
    #04060b;
}
.neon-grid{display:none}
body[data-theme="cyber"] .neon-grid{
  display:block; position:fixed; inset:0; z-index:1; pointer-events:none; opacity:.16;
  background:
    repeating-linear-gradient(90deg, rgba(0, 255, 198, 0.4) 0 2px, transparent 2px 42px),
    repeating-linear-gradient(0deg, rgba(0, 255, 198, 0.4) 0 2px, transparent 2px 42px);
  animation:gridPulse 4s ease-in-out infinite;
}
@keyframes gridPulse{0%, 100%{opacity:.16} 50%{opacity:.32}}
.scanlines{display:none}
body[data-theme="cyber"] .scanlines{
  display:block; position:fixed; inset:0; z-index:1; pointer-events:none; opacity:.1;
  background: repeating-linear-gradient(180deg, rgba(255, 255, 255, 0.03) 0 1px, transparent 1px 4px);
}
body[data-theme="cyber"] .badge{--b:#00ffc6}

/* New themes v2 - Remastered */
body[data-theme="aurora-skies"]{
  --bg:#0a0f19; --card:#0f1421; --text:#e8f6ff; --muted:#a9c4d6; --accent:#7ee2ff; --btn-text:#07131a;
  background:
    radial-gradient(1200px 300px at 50% -100px, rgba(116, 213, 255, 0.18), transparent 65%),
    radial-gradient(800px 200px at 20% -60px, rgba(0, 255, 199, 0.12), transparent 60%),
    #0a0f19;
}
body[data-theme="clockwork-harbor"]{
  --bg:#0b1013; --card:#11161a; --text:#f2efe7; --muted:#c9d0d3; --accent:#caa35a; --btn-text:#1b1405;
  background:
    radial-gradient(1000px 250px at 50% -80px, rgba(16, 71, 116, 0.22), transparent 65%),
    repeating-linear-gradient(90deg, rgba(152, 119, 55, 0.12) 0 2px, transparent 2px 16px),
    #0b1013;
}
body[data-theme="desert-mirage"]{
  --bg:#1a120c; --card:#17100b; --text:#fff7ea; --muted:#ead6b9; --accent:#f7b26f; --btn-text:#2f1a06;
  background:
    radial-gradient(1200px 320px at 50% -120px, rgba(255, 188, 102, 0.24), transparent 60%),
    repeating-linear-gradient(180deg, rgba(255, 196, 128, 0.1) 0 10px, transparent 10px 20px),
    #1a120c;
}
body[data-theme="glacier-drift"]{
  --bg:#081015; --card:#0b131a; --text:#e9f7ff; --muted:#b8d1dc; --accent:#9fe6ff; --btn-text:#041018;
  background:
    conic-gradient(from 200deg at 20% -10%, rgba(180, 240, 255, 0.22), transparent 40%),
    repeating-linear-gradient(135deg, rgba(200, 245, 255, 0.14) 0 14px, transparent 14px 28px),
    #081015;
}
body[data-theme="sakura-bloom"]{
  --bg:#140d14; --card:#1a121a; --text:#ffeef5; --muted:#f3c9d9; --accent:#ff9dc3; --btn-text:#2d0c1d;
  background:
    radial-gradient(1000px 280px at 60% -100px, rgba(255, 145, 185, 0.26), transparent 60%),
    radial-gradient(1200px 320px at 20% -80px, rgba(255, 105, 165, 0.18), transparent 60%),
    #140d14;
}
body[data-theme="vaporwave-arcade"]{
  --bg:#10091a; --card:#130e22; --text:#f6f2ff; --muted:#d7c8ff; --accent:#ff7bd8; --btn-text:#1a0a29;
  background:
    radial-gradient(600px 140px at 50% -60px, rgba(255, 110, 180, 0.38), transparent 60%),
    repeating-linear-gradient(90deg, rgba(255, 0, 170, 0.2) 0 2px, transparent 2px 16px),
    repeating-linear-gradient(0deg, rgba(0, 200, 255, 0.2) 0 2px, transparent 2px 16px),
    #10091a;
}
body[data-theme="velvet-gothic"]{
  --bg:#0c0810; --card:#120918; --text:#f7f0ff; --muted:#d2c5e6; --accent:#dcb36e; --btn-text:#2a1b04;
  background:
    radial-gradient(1400px 400px at 50% -120px, rgba(120, 30, 180, 0.28), transparent 60%),
    conic-gradient(from 0deg at 0% 0%, rgba(235, 195, 120, 0.26) 0 8deg, transparent 8deg),
    conic-gradient(from 180deg at 100% 100%, rgba(235, 195, 120, 0.26) 0 8deg, transparent 8deg),
    #0c0810;
}
body[data-theme="nebula-dreams"]{
  --bg:#090b12; --card:#0e1220; --text:#f1f6ff; --muted:#c6d3ee; --accent:#9fd5ff; --btn-text:#0c1622;
  background:
    radial-gradient(900px 260px at 20% -80px, rgba(175, 120, 255, 0.28), transparent 60%),
    radial-gradient(1100px 300px at 80% -100px, rgba(90, 200, 255, 0.24), transparent 60%),
    #090b12;
}
body[data-theme="jungle-temple"]{
  --bg:#0b110c; --card:#0f1711; --text:#f1ffee; --muted:#c5e0c9; --accent:#7fe676; --btn-text:#0a1d0f;
  background:
    repeating-linear-gradient(45deg, rgba(90, 120, 90, 0.14) 0 20px, transparent 20px 40px),
    repeating-linear-gradient(-45deg, rgba(90, 120, 90, 0.14) 0 20px, transparent 20px 40px),
    radial-gradient(700px 180px at 70% -80px, rgba(110, 190, 140, 0.22), transparent 60%),
    #0b110c;
}
body[data-theme="paper-ink"]{
  --bg:#0f1113; --card:#fff8e9; --text:#121212; --muted:#555; --accent:#111; --btn-text:#0f1113;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect filter='url(%23n)' width='100%25' height='100%25' opacity='.04'/%3E%3C/svg%3E"),
    #0f1113;
}

/* Footer for blog pages */
.blog-footer{
  margin-top: 32px;
  padding: 18px 0 32px;
  text-align: center;
  color: var(--blog-muted, #b6bcc6);
  border-top: 1px solid rgba(255,255,255,0.08);
}
.blog-footer .logo-img{
  width: 28px;
  height: 28px;
  object-fit: cover;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.35);
}
.blog-footer-brand{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--blog-text, #eaeaea);
  font-weight: 700;
}
.blog-footer a{
  color: var(--blog-text, #eaeaea);
  text-decoration: none;
  margin: 0 8px;
  opacity: 0.85;
  font-weight: 600;
}
.blog-footer a:hover{opacity:1;}

/* Minor helpers */
:focus-visible{outline:2px dashed var(--accent); outline-offset:2px; border-radius:6px}
.ghost:hover{
  background: var(--dashboard-panel-hover);
  border-color: rgba(255, 255, 255, 0.14);
  color: var(--text);
}
@media (max-width: 900px){.layout{grid-template-columns:1fr}}

@media (max-aspect-ratio: 9/16){
  body[data-theme="paradise"] .sun{
    top:8vh;
    left:50%;
    transform:translateX(-50%);
    width:100px;
    height:100px;
  }
}