.bio-page {
  --bio-panel: rgba(12, 22, 38, .82);
  --bio-panel-solid: #0d1829;
  --bio-line: rgba(167, 188, 224, .16);
  --bio-line-strong: rgba(177, 198, 232, .28);
  --bio-soft: #b4c1d4;
  background:
    radial-gradient(820px 470px at 73% 7%, rgba(54, 174, 110, .19), transparent 70%),
    radial-gradient(680px 420px at 4% 42%, rgba(56, 77, 113, .12), transparent 72%),
    #07101f;
}
.bio-header { position:fixed; inset:0 0 auto; }
.bio-page main { overflow:hidden; }
.bio-hero { min-height:min(760px,calc(100svh - 70px)); padding:126px 0 78px; display:grid; align-items:center; position:relative; isolation:isolate; }
.bio-hero::before { content:""; position:absolute; inset:0; z-index:-2; background:linear-gradient(180deg,rgba(7,16,31,.15),rgba(7,16,31,.66) 88%,#07101f); }
.bio-orb { position:absolute; border-radius:50%; filter:blur(4px); pointer-events:none; z-index:-1; }
.bio-orb-one { width:520px; height:520px; right:-160px; top:70px; background:radial-gradient(circle,rgba(92,219,146,.18),transparent 68%); }
.bio-orb-two { width:440px; height:440px; left:-220px; bottom:-70px; background:radial-gradient(circle,rgba(92,117,159,.11),transparent 68%); }
.bio-hero-grid { display:grid; grid-template-columns:minmax(0,.88fr) minmax(500px,1.12fr); align-items:center; gap:54px; }
.eyebrow { display:inline-flex; align-items:center; gap:9px; color:#aab8ce; font-size:12px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.eyebrow-dot { width:7px; height:7px; border-radius:50%; background:#a8bad7; box-shadow:0 0 0 5px rgba(168,186,215,.08); }
.bio-hero-copy h1 { font-size:clamp(54px,5.7vw,76px); line-height:.96; letter-spacing:-.052em; margin:0 0 22px; max-width:620px; }
.bio-hero-copy h1 span { color:#aebed7; }
.bio-hero-copy > p { max-width:560px; margin:0; color:#aab8cb; font-size:17px; line-height:1.65; }
.bio-claim { margin-top:28px; width:min(100%,560px); padding:7px; border:1px solid var(--bio-line-strong); border-radius:14px; background:rgba(8,17,31,.82); display:flex; align-items:center; gap:10px; box-shadow:0 18px 55px rgba(0,0,0,.18); }
.bio-claim-prefix { flex:1; min-width:0; padding:0 12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:14px; }
.bio-claim-prefix span { color:#718198; }
.bio-claim-prefix strong { color:#e6ecf5; font-weight:700; }
.bio-claim .btn { flex:0 0 auto; }
.bio-hero-notes { margin-top:16px; display:flex; flex-wrap:wrap; gap:16px; color:#76869d; font-size:12px; }
.bio-hero-notes span { display:inline-flex; align-items:center; gap:7px; }
.bio-hero-notes span::before { content:""; width:5px; height:5px; border-radius:50%; background:#8295b5; }
.bio-showcase { min-height:470px; position:relative; display:grid; place-items:center; }
.bio-preview-shadow { display:none; }
.bio-preview-shadow-a { transform:translate(58px,-22px) rotate(4deg); }
.bio-preview-shadow-b { transform:translate(-46px,35px) rotate(-4deg); opacity:.64; }
.bio-profile-mock { position:relative; width:min(100%,640px); min-height:408px; display:grid; grid-template-columns:210px 1fr; overflow:hidden; border-radius:26px; border:1px solid rgba(126,218,164,.28); background:linear-gradient(135deg,rgba(24,46,40,.94),rgba(10,18,30,.94)); box-shadow:0 36px 100px rgba(0,0,0,.45),0 0 80px rgba(92,219,146,.12); transform:none; }
.bio-profile-mock::before { content:""; position:absolute; inset:-40% -20% auto auto; width:440px; height:320px; background:radial-gradient(circle,rgba(127,151,191,.18),transparent 70%); pointer-events:none; }
.mock-uid { position:absolute; top:14px; left:14px; z-index:3; padding:5px 9px; border-radius:999px; font-size:10px; font-weight:800; background:#0b1626; border:1px solid rgba(185,204,235,.24); }
.mock-rail { padding:48px 25px 24px; border-right:1px solid rgba(185,204,235,.14); background:rgba(7,15,27,.32); }
.mock-avatar { width:84px; height:84px; padding:0; overflow:hidden; border-radius:24px; background:#07101d; border:1px solid rgba(126,218,164,.24); box-shadow:0 15px 34px rgba(0,0,0,.28); }
.mock-avatar img { width:100%; height:100%; object-fit:contain; }
.mock-rail h2 { margin:25px 0 10px; font-size:31px; letter-spacing:-.04em; }
.mock-badges { display:flex; flex-wrap:wrap; gap:7px; }
.mock-badges span { font-size:9px; font-weight:800; padding:4px 7px; border-radius:999px; border:1px solid rgba(185,204,235,.18); color:#d6deeb; background:rgba(255,255,255,.025); }
.mock-rail p { color:#a9b6c9; font-size:12px; line-height:1.6; margin:18px 0; }
.mock-view { color:#7f8ea4; font-size:11px; }
.mock-body { padding:30px 30px 26px; position:relative; z-index:2; }
.mock-section { padding:4px 0 22px; margin-bottom:22px; border-bottom:1px solid rgba(185,204,235,.13); }
.mock-kicker { color:#7f90a9; font-size:9px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; margin-bottom:17px; }
.mock-detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px 28px; }
.mock-detail-grid div { display:grid; gap:3px; }
.mock-detail-grid small { color:#8291a7; font-size:9px; }
.mock-detail-grid strong { font-size:12px; font-weight:650; }
.mock-accent { color:#a8bad7; }
.mock-social-row { display:flex; gap:9px; }
.mock-social-row span { width:36px; height:36px; display:grid; place-items:center; border-radius:12px; border:1px solid rgba(185,204,235,.16); background:#101b2d; color:#dce4f1; }
.mock-discord { display:grid; grid-template-columns:auto 1fr auto; gap:11px; align-items:center; padding:14px 15px; border:1px solid rgba(185,204,235,.15); border-radius:15px; background:rgba(12,22,37,.76); }
.mock-online { width:8px; height:8px; border-radius:50%; background:#35c678; box-shadow:0 0 0 5px rgba(53,198,120,.08); }
.mock-discord div { display:grid; gap:2px; }
.mock-discord small { font-size:8px; letter-spacing:.1em; color:#8292a9; }
.mock-discord strong { font-size:11px; }
.mock-live { color:#7f90a7; font-size:9px; }
.bio-scroll { position:absolute; bottom:28px; left:50%; transform:translateX(-50%); display:grid; justify-items:center; gap:4px; color:#8190a6; text-decoration:none; font-size:11px; font-weight:700; }
.bio-scroll i { font-style:normal; font-size:22px; line-height:1; animation:bioBounce 2s ease-in-out infinite; }
@keyframes bioBounce { 0%,100%{transform:translateY(0)} 50%{transform:translateY(5px)} }

.bio-proof { border-top:1px solid var(--bio-line); border-bottom:1px solid var(--bio-line); background:rgba(7,14,26,.55); }
.bio-proof-grid { display:grid; grid-template-columns:repeat(4,1fr); }
.bio-proof-grid > div { padding:24px 26px; border-right:1px solid var(--bio-line); }
.bio-proof-grid > div:last-child { border-right:0; }
.bio-proof-grid strong { display:block; margin-bottom:4px; font-size:13px; }
.bio-proof-grid span { color:#8190a6; font-size:11px; line-height:1.5; }

.bio-section { padding:118px 0; position:relative; }
.bio-section-heading { max-width:760px; margin-bottom:48px; }
.bio-section-heading h2 { margin:0 0 15px; max-width:740px; }
.bio-section-heading p { margin:0; color:#a5b2c5; font-size:16px; line-height:1.75; max-width:700px; }
.bio-section-heading.compact { max-width:680px; }
.centered-heading { text-align:center; margin-left:auto; margin-right:auto; }
.centered-heading h2,.centered-heading p { margin-left:auto; margin-right:auto; }
.bio-builder-grid { display:grid; grid-template-columns:390px 1fr; gap:34px; align-items:stretch; }
.bio-step-list { display:grid; gap:10px; }
.bio-step { display:grid; grid-template-columns:36px 1fr; gap:15px; padding:20px 18px; border:1px solid transparent; border-radius:16px; transition:.2s ease; }
.bio-step > span { width:34px; height:34px; display:grid; place-items:center; border-radius:10px; border:1px solid var(--bio-line); color:#8190a6; font-size:10px; font-weight:800; }
.bio-step strong { display:block; font-size:14px; margin-bottom:5px; }
.bio-step p { margin:0; color:#8290a5; font-size:12px; line-height:1.55; }
.bio-step.is-active,.bio-step:hover { border-color:var(--bio-line); background:rgba(16,28,47,.55); }
.bio-step.is-active > span { color:#e9eef6; border-color:rgba(174,196,230,.30); background:rgba(120,145,185,.09); }
.bio-editor-demo { overflow:hidden; border:1px solid var(--bio-line-strong); border-radius:20px; background:#091221; box-shadow:0 30px 80px rgba(0,0,0,.28); }
.demo-window-top { height:43px; padding:0 14px; display:flex; align-items:center; gap:7px; background:#0d1726; border-bottom:1px solid var(--bio-line); }
.demo-window-top > span { width:8px; height:8px; border-radius:50%; background:#37465b; }
.demo-window-top strong { margin-left:9px; color:#65758d; font-size:9px; font-weight:650; }
.demo-window-body { min-height:430px; display:grid; grid-template-columns:108px 1fr; }
.demo-sidebar { border-right:1px solid var(--bio-line); background:#08111f; padding:17px 13px; }
.demo-brand { display:flex; align-items:center; gap:8px; font-size:11px; font-weight:800; margin-bottom:28px; }
.demo-brand img { width:22px; height:28px; object-fit:contain; }
.demo-sidebar i { display:block; height:30px; margin:8px 0; border-radius:8px; background:#101b2c; }
.demo-sidebar i.active { background:#17243a; border:1px solid rgba(171,194,232,.12); }
.demo-content { padding:25px; background:radial-gradient(500px 230px at 100% 0%,rgba(76,101,143,.09),transparent),#0a1423; }
.demo-title-row { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; }
.demo-title-row small { display:block; color:#6f8098; font-size:8px; letter-spacing:.13em; margin-bottom:4px; }
.demo-title-row strong { font-size:14px; }
.demo-title-row button { border:1px solid rgba(174,195,228,.2); border-radius:8px; background:#dae5f5; color:#07101f; font:inherit; font-size:9px; font-weight:800; padding:8px 10px; }
.demo-settings-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:23px; }
.demo-control { min-height:76px; border:1px solid var(--bio-line); border-radius:12px; padding:12px; background:#0d1828; }
.demo-control small { display:block; font-size:8px; color:#74849b; margin-bottom:11px; }
.demo-color-control div { display:flex; gap:7px; }
.demo-color-control span { width:24px; height:24px; border-radius:7px; background:var(--c); box-shadow:0 0 0 1px rgba(255,255,255,.14) inset; }
.demo-layouts { display:flex; gap:8px; }
.demo-layouts span { width:50px; height:29px; border:1px solid #26364c; border-radius:7px; background:linear-gradient(90deg,#111d2f 30%,#0a1422 30%); }
.demo-layouts span:last-child { background:linear-gradient(#111d2f 35%,#0a1422 35%); }
.demo-layouts span.active { border-color:#8ea4c7; box-shadow:0 0 0 2px rgba(142,164,199,.08); }
.demo-slider b { display:block; height:5px; border-radius:999px; background:#223149; overflow:hidden; }
.demo-slider b i { display:block; width:68%; height:100%; background:#8ea4c7; border-radius:inherit; }
.demo-preview-card { margin-top:12px; min-height:105px; display:grid; grid-template-columns:56px 1fr; gap:14px; align-items:center; border:1px solid var(--bio-line); border-radius:14px; padding:14px; background:linear-gradient(135deg,#152033,#0b1422); }
.demo-preview-avatar { width:52px; height:52px; padding:0; overflow:hidden; border-radius:15px; background:#0a1321; border:1px solid var(--bio-line); }
.demo-preview-avatar img { width:100%; height:100%; object-fit:contain; }
.demo-preview-card strong { font-size:12px; }
.demo-preview-card p { margin:4px 0 8px; color:#7f8fa5; font-size:9px; }
.demo-pills { display:flex; gap:5px; }.demo-pills span{width:36px;height:8px;border-radius:99px;background:#26364d}.demo-pills span:nth-child(2){width:27px}.demo-pills span:nth-child(3){width:45px}

.bio-features-section { background:linear-gradient(180deg,rgba(9,18,32,.18),rgba(9,18,32,.62)); border-top:1px solid rgba(167,188,224,.08); border-bottom:1px solid rgba(167,188,224,.08); }
.bio-feature-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.bio-feature-card { position:relative; min-height:270px; padding:25px; overflow:hidden; border:1px solid var(--bio-line); border-radius:18px; background:linear-gradient(150deg,rgba(18,31,51,.78),rgba(9,18,31,.78)); display:flex; flex-direction:column; }
.bio-feature-card.feature-wide { grid-column:span 2; display:grid; grid-template-columns:1fr 360px; gap:36px; align-items:center; min-height:250px; }
.feature-icon { width:36px; height:36px; display:grid; place-items:center; border:1px solid var(--bio-line-strong); border-radius:11px; background:#111d30; color:#bcc9db; font-weight:800; margin-bottom:28px; }
.feature-wide .feature-icon { position:absolute; top:25px; left:25px; margin:0; }
.bio-feature-card h3 { margin:0 0 8px; font-size:19px; }
.bio-feature-card p { margin:0; max-width:540px; color:#8e9db1; font-size:13px; line-height:1.65; }
.feature-wide > div:nth-child(2) { padding-top:46px; }
.mini-presence { padding:15px; border:1px solid rgba(180,200,232,.18); border-radius:15px; background:#0a1422; }
.mini-presence > div { display:flex; align-items:center; gap:7px; font-size:9px; }.mini-presence > div i{width:7px;height:7px;border-radius:50%;background:#34c77b}.mini-presence > div span{margin-left:auto;color:#66768e}.mini-presence section{display:grid;grid-template-columns:40px 1fr;gap:11px;align-items:center;margin-top:15px;padding-top:15px;border-top:1px solid var(--bio-line)}.mini-presence section>b{width:40px;height:40px;display:grid;place-items:center;border-radius:11px;background:#121f33;border:1px solid var(--bio-line)}.mini-presence section p{display:grid;gap:1px}.mini-presence section small{font-size:7px;letter-spacing:.08em}.mini-presence section strong{font-size:10px;color:#eef2f7}.mini-presence section span{font-size:8px;color:#77869b}
.mini-links { position:absolute; left:25px; bottom:25px; display:flex; gap:8px; }.mini-links span{width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--bio-line);border-radius:11px;background:#101b2c}
.mini-player { margin-top:auto; display:grid; grid-template-columns:34px 1fr auto; gap:11px; align-items:center; padding:12px; border:1px solid var(--bio-line); border-radius:13px; background:#0a1422; }.mini-player button{width:34px;height:34px;border:1px solid var(--bio-line);border-radius:10px;background:#121f32;color:#dbe4f2}.mini-player div{display:grid;gap:5px}.mini-player strong{font-size:9px}.mini-player div>span{height:3px;background:#25354b;border-radius:99px;overflow:hidden}.mini-player div>span i{display:block;width:62%;height:100%;background:#92a8cb}.mini-player small{font-size:8px;color:#78879d}
.mini-background { position:absolute; inset:auto 24px 24px; height:92px; border-radius:13px; overflow:hidden; border:1px solid var(--bio-line); background:linear-gradient(130deg,#17263d,#263650 40%,#0b1422 100%); }.mini-background::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 72% 20%,rgba(173,194,226,.28),transparent 32%)}.mini-background span{position:absolute;width:68px;height:68px;border-radius:50%;left:32px;top:12px;border:1px solid rgba(255,255,255,.12);background:rgba(7,15,26,.55);backdrop-filter:blur(8px)}.mini-background i{position:absolute;width:180px;height:46px;border-radius:13px;right:20px;top:23px;background:rgba(7,15,26,.6);border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(10px)}
.mini-badges { position:absolute; left:24px; right:24px; bottom:24px; display:flex; flex-wrap:wrap; gap:7px; }.mini-badges span{padding:7px 10px;border:1px solid var(--bio-line);border-radius:999px;background:#101b2c;font-size:9px;font-weight:750}

.layout-section { padding-bottom:132px; }
.layout-showcase-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.layout-showcase-card { border:1px solid var(--bio-line); border-radius:20px; background:rgba(11,21,36,.72); padding:16px; }
.layout-label { display:flex; justify-content:space-between; align-items:center; gap:14px; padding:4px 4px 14px; }.layout-label span{font-size:13px;font-weight:800}.layout-label small{font-size:10px;color:#77879e}
.layout-preview { height:300px; border-radius:14px; border:1px solid rgba(182,203,234,.16); background:linear-gradient(135deg,#1b2636,#0b1421); overflow:hidden; }
.layout-preview-default { display:grid; grid-template-columns:31% 1fr; }.layout-preview-default aside{padding:28px 20px;border-right:1px solid var(--bio-line);display:grid;align-content:start;justify-items:start;gap:12px}.layout-preview-default aside i{width:66px;height:66px;border-radius:20px;background:#101c2e;border:1px solid var(--bio-line)}.layout-preview-default aside strong{font-size:18px}.layout-preview-default aside span{height:7px;width:78px;border-radius:99px;background:#26354a}.layout-preview-default aside span:last-child{width:55px}.layout-preview-default main{padding:28px;display:grid;grid-template-columns:1fr 1fr;gap:11px;align-content:start}.layout-preview-default main b{height:48px;border-radius:10px;background:#101b2b;border:1px solid var(--bio-line)}.layout-preview-default main section{grid-column:span 2;height:56px;border-radius:11px;background:#101b2b;border:1px solid var(--bio-line)}
.layout-preview-centered { display:grid; justify-items:center; align-content:start; padding:30px; gap:11px; }.layout-preview-centered>i{width:74px;height:74px;border-radius:50%;background:#101c2e;border:1px solid var(--bio-line)}.layout-preview-centered>strong{font-size:20px}.layout-preview-centered>div{display:flex;gap:7px}.layout-preview-centered>div span{width:34px;height:34px;border-radius:11px;border:1px solid var(--bio-line);background:#101b2b}.layout-preview-centered>section{width:88%;height:46px;border-radius:12px;border:1px solid var(--bio-line);background:#101b2b}.layout-preview-centered>section:last-child{height:57px}

.bio-final-cta { padding:84px 0 96px; border-top:1px solid var(--bio-line); background:radial-gradient(600px 260px at 84% 0%,rgba(122,148,190,.12),transparent),rgba(5,12,23,.46); }
.bio-final-inner { display:flex; align-items:center; justify-content:space-between; gap:40px; }.bio-final-inner h2{font-size:44px;margin:12px 0 8px}.bio-final-inner p{margin:0;color:#8d9cb0}.bio-final-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.bio-footer { margin-top:0; }

@media(max-width:1050px){.bio-hero{min-height:auto}.bio-hero-grid{grid-template-columns:1fr;gap:34px}.bio-showcase{min-height:440px}.bio-profile-mock{width:min(100%,680px)}.bio-builder-grid{grid-template-columns:1fr}.bio-step-list{grid-template-columns:1fr 1fr}.bio-feature-card.feature-wide{grid-template-columns:1fr 320px}.bio-proof-grid{grid-template-columns:1fr 1fr}.bio-proof-grid>div:nth-child(2){border-right:0}.bio-proof-grid>div:nth-child(-n+2){border-bottom:1px solid var(--bio-line)}}
@media(max-width:760px){.bio-hero{padding-top:112px}.bio-showcase{min-height:auto;padding:18px 0 45px}.bio-profile-mock{grid-template-columns:1fr;min-height:0;transform:none}.mock-rail{border-right:0;border-bottom:1px solid var(--bio-line);padding:48px 22px 20px}.mock-avatar{width:72px;height:72px}.mock-body{padding:22px}.bio-scroll{display:none}.bio-step-list,.bio-feature-grid,.layout-showcase-grid{grid-template-columns:1fr}.bio-feature-card.feature-wide{grid-column:auto;grid-template-columns:1fr;gap:18px}.feature-wide>div:nth-child(2){padding-top:46px}.mini-presence{margin-top:8px}.demo-window-body{grid-template-columns:72px 1fr}.demo-sidebar{padding:14px 9px}.demo-brand span{display:none}.demo-settings-grid{grid-template-columns:1fr}.bio-final-inner{align-items:flex-start;flex-direction:column}.bio-final-actions{justify-content:flex-start}.bio-section{padding:86px 0}}
@media(max-width:520px){.bio-hero-copy h1{font-size:52px}.bio-claim{align-items:stretch;flex-direction:column}.bio-claim-prefix{padding:7px 8px}.bio-claim .btn{width:100%}.bio-proof-grid{grid-template-columns:1fr}.bio-proof-grid>div{border-right:0;border-bottom:1px solid var(--bio-line)!important}.bio-proof-grid>div:last-child{border-bottom:0!important}.bio-step-list{grid-template-columns:1fr}.demo-sidebar{display:none}.demo-window-body{grid-template-columns:1fr}.demo-content{padding:18px}.mock-detail-grid{grid-template-columns:1fr 1fr;gap:13px}.bio-feature-card{min-height:245px}.layout-preview{height:260px}.bio-final-inner h2{font-size:36px}}

/* v2.8.2 bio copy cleanup */
.bio-feature-card.feature-music p{margin-bottom:22px}.bio-final-inner h2{margin-top:0}.bio-section-heading.compact{margin-bottom:34px}


/* v2.8.3 layout fixes */
.bio-feature-card .mini-background {
  position: relative;
  inset: auto;
  width: 100%;
  margin-top: 18px;
  flex: 0 0 92px;
}

/* Toxin: dark forest surfaces and emerald accents throughout the landing page. */
.bio-page {
  --bio-panel: rgba(11, 29, 21, .84);
  --bio-panel-solid: #10251b;
  --bio-line: rgba(148, 217, 168, .17);
  --bio-line-strong: rgba(168, 238, 188, .29);
  --bio-soft: #b4d0bd;
  background: radial-gradient(820px 470px at 73% 7%, rgba(62, 182, 101, .18), transparent 70%), radial-gradient(680px 420px at 4% 42%, rgba(35, 114, 72, .12), transparent 72%), #071410;
}
.bio-hero::before { background:linear-gradient(180deg,rgba(7,20,16,.15),rgba(7,20,16,.65) 88%,#071410); }
.bio-orb-two { background:radial-gradient(circle,rgba(74,174,108,.12),transparent 68%); }
.eyebrow,.bio-hero-copy h1 span,.mock-accent { color:#a4e7b7; }
.eyebrow-dot { background:#80dca0; box-shadow:0 0 0 5px rgba(128,220,160,.10); }
.bio-hero-copy > p,.bio-section-heading p { color:#aec6b6; }
.bio-claim { background:rgba(8,25,17,.85); }
.bio-claim-prefix span,.bio-hero-notes,.bio-proof-grid span { color:#8ca997; }
.bio-hero-notes span::before { background:#83c99a; }
.bio-profile-mock { background:linear-gradient(135deg,rgba(24,54,37,.94),rgba(8,24,18,.96)); }
.bio-profile-mock::before { background:radial-gradient(circle,rgba(100,200,127,.17),transparent 70%); }
.mock-uid,.mock-social-row span,.mock-discord { background:#10261b; border-color:var(--bio-line); }
.mock-rail { border-color:var(--bio-line); background:rgba(7,25,15,.36); }
.mock-avatar,.demo-preview-avatar { background:#091b13; }
.mock-badges span { border-color:var(--bio-line); color:#d8f1df; }
.mock-section,.bio-proof { border-color:var(--bio-line); }
.mock-kicker,.mock-detail-grid small,.mock-discord small { color:#9ab8a3; }
.mock-social-row span { color:#c3efd1; }
.bio-proof { background:rgba(8,24,16,.55); }
.bio-step.is-active,.bio-step:hover { background:rgba(19,51,29,.58); }
.bio-step.is-active > span { color:#c6f4d5; border-color:var(--bio-line-strong); background:rgba(104,207,137,.11); }
.bio-editor-demo { background:#0a1c14; }
.demo-window-top,.demo-sidebar { background:#0c2017; }
.demo-window-top > span { background:#456b51; }
.demo-sidebar i,.demo-control,.demo-preview-card { background:#11271d; }
.demo-sidebar i.active { background:#1b3929; border-color:var(--bio-line); }
.demo-content { background:radial-gradient(500px 230px at 100% 0%,rgba(76,155,96,.10),transparent),#0b2118; }
.demo-title-row button { background:#c5f3d4; color:#10251b; }
.demo-layouts span { border-color:var(--bio-line); background:linear-gradient(90deg,#1a3928 30%,#0b2118 30%); }
.demo-layouts span:last-child { background:linear-gradient(#1a3928 35%,#0b2118 35%); }
.demo-layouts span.active { border-color:#8fe0a9; box-shadow:0 0 0 2px rgba(143,224,169,.09); }
.demo-slider b,.demo-pills span { background:#284b35; }
.demo-slider b i { background:#87dba0; }
.demo-preview-card { background:linear-gradient(135deg,#193c29,#0b2118); }
.bio-features-section { background:linear-gradient(180deg,rgba(9,29,17,.2),rgba(8,27,18,.72)); border-color:var(--bio-line); }
.bio-feature-card { background:linear-gradient(150deg,rgba(19,48,32,.88),rgba(9,27,18,.87)); transition:border-color .25s ease,transform .25s ease,box-shadow .25s ease; }
.bio-feature-card:hover { border-color:var(--bio-line-strong); transform:translateY(-3px); box-shadow:0 20px 45px rgba(0,0,0,.16); }
.bio-feature-card p { color:#a8c5b0; }
.feature-icon { background:#173527; color:#b2eec5; }
.feature-icon svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.mini-presence,.mini-player { background:#0d2619; border-color:var(--bio-line); }
.mini-presence section > b,.mini-player button,.mini-links span,.mini-badges span { background:#183b29; border-color:var(--bio-line); color:#c4ebce; }
.mini-presence section > b svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.mini-links span { font-size:10px; font-weight:800; }
.mini-player div > span { background:#294a35; }
.mini-player div > span i { background:#89dfa5; }
.mini-background { background:linear-gradient(130deg,#1a4930,#356d48 40%,#0c2418 100%); }
.mini-background::before { background:radial-gradient(circle at 72% 20%,rgba(185,245,196,.25),transparent 32%); }
.mini-background span,.mini-background i { background:rgba(8,30,18,.58); }
.layout-showcase-card { background:rgba(10,32,21,.75); }
.layout-preview { border-color:var(--bio-line); background:linear-gradient(135deg,#214332,#0d2318); }
.layout-preview-default aside i,.layout-preview-centered > i,.layout-preview-default main b,.layout-preview-default main section,.layout-preview-centered > div span,.layout-preview-centered > section { background:#173626; }
.layout-preview-default aside span { background:#38634a; }
.bio-final-cta { background:radial-gradient(600px 260px at 84% 0%,rgba(102,202,127,.15),transparent),rgba(7,25,15,.62); }
/* Quiet the emerald treatment: use green as an accent, not a full-panel wash. */
.bio-page {
  --bio-panel: rgba(19, 29, 23, .84);
  --bio-panel-solid: #19241c;
  --bio-line: rgba(161, 198, 170, .14);
  --bio-line-strong: rgba(167, 207, 178, .23);
  --bio-soft: #b8c9bb;
  background:radial-gradient(820px 470px at 73% 7%,rgba(82,147,99,.09),transparent 70%),radial-gradient(680px 420px at 4% 42%,rgba(71,119,80,.05),transparent 72%),#0c1211;
}
.bio-hero::before { background:linear-gradient(180deg,rgba(12,18,17,.12),rgba(12,18,17,.64) 88%,#0c1211); }
.bio-orb-one,.bio-orb-two { opacity:.45; }
.eyebrow,.bio-hero-copy h1 span,.mock-accent { color:#b4d3bd; }
.eyebrow-dot { background:#91bd9d; box-shadow:0 0 0 5px rgba(145,189,157,.07); }
.bio-hero-copy > p,.bio-section-heading p { color:#b2c0b5; }
.bio-claim { background:rgba(18,27,21,.88); }
.bio-profile-mock { background:linear-gradient(135deg,rgba(32,47,36,.96),rgba(17,26,21,.97)); border-color:var(--bio-line-strong); box-shadow:0 36px 100px rgba(0,0,0,.35),0 0 65px rgba(106,168,118,.04); }
.bio-profile-mock::before { background:radial-gradient(circle,rgba(115,174,125,.08),transparent 70%); }
.mock-uid,.mock-social-row span,.mock-discord { background:#1b2a20; }
.mock-rail { background:rgba(14,23,17,.35); }
.bio-proof { background:rgba(14,23,17,.42); }
.bio-step.is-active,.bio-step:hover { background:rgba(33,48,36,.45); }
.bio-editor-demo,.demo-window-top,.demo-sidebar { background:#151e18; }
.demo-sidebar i,.demo-control,.demo-preview-card { background:#202d23; }
.demo-sidebar i.active { background:#273a2c; }
.demo-content { background:radial-gradient(500px 230px at 100% 0%,rgba(103,147,107,.05),transparent),#17231b; }
.demo-preview-card { background:linear-gradient(135deg,#25392a,#18241b); }
.demo-title-row button { background:#c9dfcf; }
.demo-slider b i { background:#97be9f; }
.bio-features-section { background:linear-gradient(180deg,rgba(15,24,18,.24),rgba(15,24,18,.58)); }
.bio-feature-card { background:linear-gradient(150deg,rgba(28,41,32,.88),rgba(18,28,21,.89)); }
.bio-feature-card p { color:#acbbae; }
.feature-icon { background:#253b2b; color:#c3d9c7; }
.mini-presence,.mini-player { background:#1a2920; }
.mini-presence section > b,.mini-player button,.mini-links span,.mini-badges span { background:#263a2c; color:#d0dfd1; }
.mini-player div > span i { background:#9fc4a7; }
.mini-background { background:linear-gradient(130deg,#253e2d,#43624a 40%,#1b2a20 100%); }
.mini-background::before { background:radial-gradient(circle at 72% 20%,rgba(178,209,183,.13),transparent 32%); }
.layout-showcase-card { background:rgba(19,30,22,.72); }
.layout-preview { background:linear-gradient(135deg,#2a4031,#17261c); }
.layout-preview-default aside i,.layout-preview-centered > i,.layout-preview-default main b,.layout-preview-default main section,.layout-preview-centered > div span,.layout-preview-centered > section { background:#24372a; }
.bio-final-cta { background:radial-gradient(600px 260px at 84% 0%,rgba(116,160,120,.06),transparent),#142219; }
.bio-footer { background:#0e1512; }
@media (prefers-reduced-motion: reduce) { .bio-feature-card { transition:none; } .bio-feature-card:hover { transform:none; } }

/* v4.3 landing refresh: mirror the customization users actually have. */
.landing-icon-sprite { position:absolute; width:0; height:0; overflow:hidden; }
.bio-step-list { grid-template-columns:repeat(2,minmax(0,1fr)); }
.bio-feature-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.bio-feature-card.feature-wide { grid-column:span 3; }
.mock-social-row svg,
.mini-links svg { width:16px; height:16px; fill:currentColor; }
.mock-social-row .landing-link-icon,
.mini-links .landing-link-icon { fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.mini-entry {
  position:relative;
  display:grid;
  place-items:center;
  min-height:82px;
  margin-top:26px;
  border:1px solid var(--bio-line);
  border-radius:14px;
  background:radial-gradient(circle at 50% 20%,rgba(145,189,157,.12),transparent 62%),#19271e;
}
.mini-entry span { font-size:10px; font-weight:800; color:#d9e5dc; }
.mini-entry i {
  position:absolute;
  right:calc(50% - 48px);
  width:1px;
  height:13px;
  background:#a9cbb2;
  animation:landingCaret 1.1s steps(1) infinite;
}
.mini-effects {
  position:relative;
  height:82px;
  margin-top:26px;
  overflow:hidden;
  border:1px solid var(--bio-line);
  border-radius:14px;
  background:#19271e;
  perspective:380px;
}
.mini-effects i {
  position:absolute;
  inset:16px 45px;
  border:1px solid rgba(174,211,183,.25);
  border-radius:11px;
  background:linear-gradient(145deg,#2b4131,#1a281f);
  box-shadow:0 12px 28px rgba(0,0,0,.22);
  transform:rotateX(8deg) rotateY(-12deg);
}
.mini-effects span {
  position:absolute;
  left:58px;
  top:29px;
  width:52px;
  height:5px;
  border-radius:999px;
  background:#66826d;
  box-shadow:0 12px 0 #3c5141;
}
.mini-effects b {
  position:absolute;
  right:43px;
  bottom:14px;
  width:14px;
  height:14px;
  border:1px solid #bad6c1;
  border-radius:50%;
  box-shadow:0 0 0 5px rgba(174,211,183,.08);
}
@keyframes landingCaret { 0%,48% { opacity:1; } 49%,100% { opacity:0; } }

@media(max-width:1050px) {
  .bio-feature-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .bio-feature-card.feature-wide { grid-column:span 2; }
}
@media(max-width:760px) {
  .bio-step-list,
  .bio-feature-grid { grid-template-columns:1fr; }
  .bio-feature-card.feature-wide { grid-column:auto; }
}
@media (prefers-reduced-motion:reduce) { .mini-entry i { animation:none; } }
