:root{
    --bg-deep:#12142A;
    --bg-panel:#1C1F3D;
    --bg-panel-2:#242850;
    --ink:#E8E7F2;
    --ink-dim:#9A9CC0;
    --primary:#8C9EFF;
    --primary-light:#B4C0FF;
    --primary-dim:#5A66A8;
    --primary-ink:#12142A;
    --rose:#D98BA6;
    --friend-accent:#68C7B8;
    --line:#31355c;
    --radius:18px;
    --serif: "Fraunces", "Iowan Old Style", Georgia, serif;
    --sans: "Inter", -apple-system, "Segoe UI", sans-serif;
    --glow-primary: 0 8px 28px -6px rgba(140,158,255,0.35);
    --glow-soft: 0 4px 20px -4px rgba(0,0,0,0.4);
  }
  @import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600&family=Inter:ital,wght@0,400;0,500;0,600;0,700;1,600&display=swap');

  *{box-sizing:border-box;}
  body{
    margin:0;
    background:
      radial-gradient(ellipse 900px 600px at 20% 0%, rgba(140,158,255,0.10), transparent 60%),
      radial-gradient(ellipse 700px 500px at 85% 15%, rgba(217,139,166,0.08), transparent 55%),
      #060714;
    font-family:var(--sans);color:var(--ink);
    display:flex;justify-content:center;padding:40px 16px;min-height:100vh;
  }
  .phone{
    width:390px;max-width:100%;
    background:
      radial-gradient(ellipse 500px 400px at 15% -5%, rgba(140,158,255,0.09), transparent 60%),
      radial-gradient(ellipse 400px 350px at 100% 100%, rgba(217,139,166,0.07), transparent 55%),
      var(--bg-deep);
    border-radius:40px;
    border:8px solid #05060c;overflow:hidden;
    box-shadow:0 40px 80px rgba(0,0,0,0.5), 0 0 0 1px rgba(140,158,255,0.06), inset 0 1px 0 rgba(255,255,255,0.03);
    position:relative;height:min(820px, calc(100vh - 60px));display:flex;flex-direction:column;
  }
  /* On an actual phone screen, the desktop-preview "phone mockup" framing
     (border, rounded corners, drop shadow) is redundant — it just shows up
     as a smaller frame-within-a-frame instead of filling the real screen
     the way an installed app would. This strips that framing specifically
     on small viewports, while leaving the desktop preview look untouched. */
  @media (max-width: 480px){
    body{padding:0;min-height:100dvh;}
    /* box-shadow / border-color need !important: every theme sets its own
       html[data-theme="x"] .phone { box-shadow; border-color } at higher
       specificity, so without it the mockup drop shadow still bleeds at the
       screen edges on a real phone. */
    .phone{width:100%;height:100vh;height:100dvh;border-radius:0;border:none;box-shadow:none !important;border-color:transparent !important;}
  }

  /* Luminous Velvet — a livelier house style with cinematic depth. */
  body:before,body:after{content:'';position:fixed;pointer-events:none;border-radius:50%;filter:blur(70px);opacity:.22;animation:ambientOrbit 16s ease-in-out infinite alternate}
  body:before{width:340px;height:340px;left:-100px;top:12%;background:#9a73ff}
  body:after{width:300px;height:300px;right:-80px;bottom:4%;background:#e778bd;animation-delay:-7s}
  @keyframes ambientOrbit{to{transform:translate3d(44px,-28px,0) scale(1.16);opacity:.34}}
  .phone:before{content:'';position:absolute;inset:0;pointer-events:none;z-index:0;background:linear-gradient(115deg,transparent 20%,rgba(255,255,255,.025) 45%,transparent 67%);background-size:240% 100%;animation:velvetSheen 10s ease-in-out infinite}
  @keyframes velvetSheen{0%,35%{background-position:180% 0}75%,100%{background-position:-80% 0}}
  .screen,.statusbar,.navbar{z-index:1}
  .screen.active{animation:screenReveal .5s cubic-bezier(.16,1,.3,1) both}
  @keyframes screenReveal{from{opacity:0;transform:translateY(9px) scale(.992);filter:blur(5px)}to{opacity:1;transform:none;filter:none}}
  .card{transition:transform .28s cubic-bezier(.16,1,.3,1),border-color .28s,box-shadow .28s;background:linear-gradient(145deg,rgba(47,44,92,.78),rgba(23,24,54,.82))}
  .card:hover{transform:translateY(-3px);border-color:rgba(188,164,255,.34);box-shadow:0 18px 36px rgba(3,3,15,.28),0 0 28px rgba(147,112,255,.09),inset 0 1px rgba(255,255,255,.08)}
  .inline-brand-logo{display:block;position:relative;overflow:hidden;width:48px;height:48px;border-radius:15px;margin:2px 0 18px;box-shadow:0 12px 28px rgba(117,82,255,.28);animation:fadeInUp .6s cubic-bezier(.16,1,.3,1) forwards,brandFloat 4.5s ease-in-out .8s infinite}
  .inline-brand-logo img,.splash-heart-logo img{position:absolute;width:120%;height:120%;max-width:none;left:-6%;top:-10%;object-fit:fill}
  @keyframes brandFloat{50%{transform:translateY(-4px) rotate(1.5deg);box-shadow:0 18px 34px rgba(206,103,215,.28)}}

  /* New cinematic splash — image motion is intentionally slow and subtle. */
  #splash{padding:0;background:#070816;isolation:isolate;justify-content:flex-end;align-items:flex-start}
  .cinematic-splash-art{position:absolute;inset:-3%;z-index:-5;overflow:hidden;background:#070816 url('/HereWhen_Splash_Poster_HD.jpg?v=instant-v1') 52% center/cover no-repeat;animation:splashArtIn 1.1s cubic-bezier(.16,1,.3,1) both}
  .cinematic-splash-art video{width:100%;height:100%;object-fit:cover;object-position:48% center;filter:saturate(.9) contrast(1.06) brightness(.72);transform:scaleX(-1) scale(1.035)}
  .cinematic-vignette{position:absolute;inset:0;z-index:-3;background:linear-gradient(180deg,rgba(5,6,18,.12) 0%,rgba(6,7,20,.06) 35%,rgba(7,8,23,.8) 78%,#090a1d 100%),linear-gradient(90deg,rgba(7,8,22,.52),transparent 48%)}
  .cinematic-vignette:after{content:'';position:absolute;inset:0;background:radial-gradient(circle at 63% 43%,rgba(177,142,255,.13),transparent 33%);animation:portraitGlow 4.8s ease-in-out infinite}
  .cinematic-light{position:absolute;z-index:-2;border-radius:50%;filter:blur(38px);mix-blend-mode:screen;opacity:.34}
  .light-one{width:170px;height:170px;background:#7e70ff;left:-55px;bottom:19%;animation:lightDrift 6s ease-in-out infinite alternate}
  .light-two{width:135px;height:135px;background:#ec75bc;right:-48px;top:12%;animation:lightDrift 7.5s ease-in-out -2s infinite alternate-reverse}
  .splash-heart-logo{position:relative;display:block;overflow:hidden;width:58px;height:58px;border-radius:18px;z-index:2;margin:0 auto 14px;opacity:0;animation:logoCinematicIn .75s cubic-bezier(.16,1,.3,1) .15s forwards,logoAlive 3.8s ease-in-out 1s infinite;box-shadow:0 16px 42px rgba(139,91,255,.38)}
  .launch-copy{position:relative;top:auto;left:auto;text-align:center;padding:0 28px 68px;width:100%;z-index:2}
  .launch-name{font-family:var(--sans);font-size:42px;font-weight:700;letter-spacing:-.055em;text-shadow:0 6px 28px rgba(0,0,0,.4)}
  .launch-tagline{font-family:var(--sans);font-size:15px;color:rgba(242,239,255,.86);margin-top:9px;letter-spacing:.01em}
  .launch-copy:after{content:'Tap to continue';display:block;margin-top:24px;font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:rgba(232,225,255,.52);opacity:0;animation:launchWords .55s ease 1.25s forwards}
  .splash-dust{position:absolute;inset:0;z-index:-1;pointer-events:none}.splash-dust i{position:absolute;width:3px;height:3px;border-radius:50%;background:#e9dcff;box-shadow:0 0 12px #b79cff;opacity:0;animation:dustRise 5s linear infinite}.splash-dust i:nth-child(1){left:14%;bottom:21%;animation-delay:.2s}.splash-dust i:nth-child(2){left:36%;bottom:12%;animation-delay:1.5s}.splash-dust i:nth-child(3){left:71%;bottom:18%;animation-delay:2.6s}.splash-dust i:nth-child(4){left:86%;bottom:9%;animation-delay:3.3s}.splash-dust i:nth-child(5){left:58%;bottom:7%;animation-delay:4.1s}
  @keyframes splashArtIn{from{opacity:0;filter:blur(16px);transform:scale(1.06)}to{opacity:1;filter:none;transform:none}}
  @keyframes cinematicDrift{to{transform:scale(1.14) translate3d(-1.7%,1%,0)}}
  @keyframes portraitGlow{50%{opacity:.35;transform:scale(1.12)}}
  @keyframes lightDrift{to{transform:translate3d(38px,-24px,0) scale(1.2);opacity:.52}}
  @keyframes logoCinematicIn{from{opacity:0;transform:translateY(-16px) scale(.78) rotate(-9deg);filter:blur(5px)}to{opacity:1;transform:none;filter:none}}
  @keyframes logoAlive{50%{transform:translateY(-3px) rotate(1deg);box-shadow:0 20px 48px rgba(214,105,215,.42)}}
  @keyframes dustRise{0%{opacity:0;transform:translateY(0) scale(.5)}20%{opacity:.7}80%{opacity:.18}100%{opacity:0;transform:translate(15px,-155px) scale(1.25)}}
  @media (prefers-reduced-motion:reduce){.cinematic-light,.splash-heart-logo,.splash-dust i,body:before,body:after,.phone:before{animation:none}.cinematic-splash-art video{display:none}.cinematic-splash-art{background:#070816 url('/HereWhen_Splash_Poster_HD.jpg?v=instant-v1') 52% center/cover no-repeat;transform:none}.splash-heart-logo{opacity:1}.screen.active{animation:none}}
  .statusbar{height:44px;display:flex;align-items:center;justify-content:space-between;padding:0 24px;font-size:12px;color:var(--ink-dim);flex-shrink:0;}
  .statusbar .me-avatar{width:20px;height:20px;border-radius:50%;overflow:hidden;border:1px solid var(--line);}
  .statusbar-sos{display:flex;flex-direction:column;align-items:center;gap:1px;background:none;border:none;cursor:pointer;color:var(--ink-dim);padding:2px 4px;}
  .statusbar-sos-icon{font-size:16px;line-height:1;}
  .statusbar-sos-label{font-size:7.5px;line-height:1;white-space:nowrap;color:var(--ink-dim);}
  .statusbar .me-avatar canvas{width:100%;height:100%;display:block;}
  .screen{position:relative;flex:1;padding:18px 22px 100px;overflow-y:auto;display:none;}
  .screen.active{display:flex;flex-direction:column;}
  .screen.active.scrollable{display:block;}

  .eyebrow{font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:var(--primary);font-weight:600;margin-bottom:8px;}
  h1{font-family:var(--serif);font-weight:500;font-size:28px;line-height:1.15;margin:0 0 10px;}
  p.lead{color:var(--ink-dim);font-size:14px;line-height:1.55;margin:0 0 20px;}

  .presence{width:64px;height:64px;border-radius:50%;background:radial-gradient(circle at 35% 30%, #C7D0FF, var(--primary) 55%, var(--primary-dim) 100%);box-shadow:0 0 0 0 rgba(140,158,255,0.45);animation:pulse 2.6s ease-in-out infinite, breathe 4.2s ease-in-out infinite;flex-shrink:0;}
  .presence.small{width:40px;height:40px;}
  .presence.rose{background:radial-gradient(circle at 35% 30%, #F7D2E0, var(--rose) 55%, #9c5e75 100%);}
  .presence.friend{background:radial-gradient(circle at 35% 30%, #D8F3EC, var(--friend-accent) 55%, #3d8a7c 100%);}
  @keyframes pulse{0%{box-shadow:0 0 0 0 rgba(140,158,255,0.4);}70%{box-shadow:0 0 0 14px rgba(140,158,255,0);}100%{box-shadow:0 0 0 0 rgba(140,158,255,0);}}
  /* A slow, subtle scale "breath" layered on top of the existing ring pulse
     — makes the orb feel quietly alive rather than mechanically ticking. */
  @keyframes breathe{0%,100%{transform:scale(1);filter:brightness(1);}50%{transform:scale(1.05);filter:brightness(1.08);}}

  /* Staggered entrance — each element fades up on its own delay (set inline
     per-element) so the landing screen arrives as a sequence, not all at once. */
  .fade-in-up{opacity:0;animation:fadeInUp 0.6s cubic-bezier(0.16,1,0.3,1) forwards;}
  @keyframes fadeInUp{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:translateY(0);}}

  /* Ambient drifting particles — soft warm lights, echoing the "presence"
     idea (someone quietly there) rather than generic decoration. Each has
     its own size/color/duration/delay so they never move in sync. Sits
     behind the screen's actual content via DOM order (see HTML), not
     z-index — no positioning gymnastics needed. */
  .ambient-particles{position:absolute;inset:0;overflow:hidden;pointer-events:none;}
  .particle{position:absolute;border-radius:50%;filter:blur(1px);opacity:0.5;}
  .particle.p1{width:6px;height:6px;left:12%;top:18%;background:radial-gradient(circle,#C7D0FF,transparent 70%);animation:drift1 11s ease-in-out infinite;}
  .particle.p2{width:4px;height:4px;left:78%;top:12%;background:radial-gradient(circle,#F7D2E0,transparent 70%);animation:drift2 9s ease-in-out infinite 0.6s;}
  .particle.p3{width:8px;height:8px;left:85%;top:55%;background:radial-gradient(circle,#8C9EFF,transparent 70%);animation:drift3 14s ease-in-out infinite 1.2s;}
  .particle.p4{width:5px;height:5px;left:8%;top:62%;background:radial-gradient(circle,#D8F3EC,transparent 70%);animation:drift1 12.5s ease-in-out infinite 2s;}
  .particle.p5{width:3px;height:3px;left:45%;top:8%;background:radial-gradient(circle,#C7D0FF,transparent 70%);animation:drift2 8s ease-in-out infinite 0.3s;}
  .particle.p6{width:7px;height:7px;left:60%;top:70%;background:radial-gradient(circle,#F7D2E0,transparent 70%);animation:drift3 13s ease-in-out infinite 1.8s;}
  @keyframes drift1{0%,100%{transform:translate(0,0);opacity:0.35;}50%{transform:translate(10px,-18px);opacity:0.7;}}
  @keyframes drift2{0%,100%{transform:translate(0,0);opacity:0.3;}50%{transform:translate(-14px,14px);opacity:0.65;}}
  @keyframes drift3{0%,100%{transform:translate(0,0);opacity:0.4;}50%{transform:translate(-8px,-16px);opacity:0.75;}}

  /* Animated loading ticker for gif/song search — a scanning shimmer bar
     instead of a static "Searching…" line. */
  .search-ticker-wrap{padding:14px 4px;}
  .search-ticker-bar{height:3px;width:100%;border-radius:4px;background:linear-gradient(90deg, transparent, var(--primary) 45%, var(--rose) 55%, transparent);background-size:220% 100%;animation:tickerScan 1.3s linear infinite;margin-bottom:10px;}
  @keyframes tickerScan{0%{background-position:220% 0;}100%{background-position:-40% 0;}}
  .search-ticker-label{font-size:12.5px;color:var(--ink-dim);text-align:center;}
  .ticker-dots span{animation:tickerDot 1.4s infinite;opacity:0;}
  .ticker-dots span:nth-child(2){animation-delay:0.2s;}
  .ticker-dots span:nth-child(3){animation-delay:0.4s;}
  @keyframes tickerDot{0%,60%,100%{opacity:0;}30%{opacity:1;}}

  /* Splash / launch screen */
  #splash{align-items:center;justify-content:center;position:relative;overflow:hidden;}
  .launch-aurora{position:absolute;width:360px;height:360px;border-radius:50%;background:conic-gradient(from 120deg,rgba(217,139,166,.1),rgba(140,158,255,.34),rgba(94,105,161,.16),rgba(217,139,166,.1));filter:blur(40px);animation:launchSpin 8s linear infinite,launchBloom .75s cubic-bezier(.16,1,.3,1) both;}
  .launch-core-wrap{position:relative;width:190px;height:210px;perspective:700px;display:flex;align-items:center;justify-content:center;}
  .finalist-logo{width:110px;height:92px;overflow:visible;}
  .logo-fig{transform-style:preserve-3d;transform-origin:center;}
  .logo-fig-l{animation:logoApproachL 2.2s cubic-bezier(.2,.8,.2,1) both;}
  .logo-fig-r{animation:logoApproachR 2.2s cubic-bezier(.2,.8,.2,1) both;}
  @keyframes logoApproachL{0%{transform:translateX(-70px) translateZ(-40px) rotateY(35deg);opacity:0;}70%{transform:translateX(4px) translateZ(0) rotateY(8deg);opacity:1;}100%{transform:translateX(0) translateZ(0) rotateY(14deg);}}
  @keyframes logoApproachR{0%{transform:translateX(70px) translateZ(-40px) rotateY(-35deg);opacity:0;}70%{transform:translateX(-4px) translateZ(0) rotateY(-8deg);opacity:1;}100%{transform:translateX(0) translateZ(0) rotateY(-14deg);}}
  .logo-spark{animation:logoSparkPop .5s cubic-bezier(.34,1.56,.64,1) 1.85s both;}
  @keyframes logoSparkPop{0%{transform:scale(0);opacity:0;}100%{transform:scale(1);opacity:1;}}
  .launch-copy{position:absolute;top:calc(50% + 112px);text-align:center;}
  .launch-name{font-family:var(--serif);font-size:28px;letter-spacing:.02em;opacity:0;color:var(--ink);animation:launchWords .45s ease .55s forwards;}
  .launch-tagline{margin-top:10px;font-family:var(--serif);font-size:15px;color:var(--ink);}
  .launch-tagline .tagline-1{opacity:0;display:inline-block;animation:launchWords .45s ease .8s forwards;}
  .launch-tagline .tagline-2{opacity:0;display:inline-block;animation:launchWords .45s ease 1s forwards;}
  .launch-subline{margin-top:12px;font-size:11px;letter-spacing:.04em;color:var(--ink-dim);max-width:320px;margin-left:auto;margin-right:auto;line-height:1.6;}
  .launch-subline .subline-someone{opacity:0;font-style:italic;font-weight:600;font-size:13px;color:var(--primary);animation:launchWords .8s ease 4.3s forwards;}
  .launch-subline .subline-line2{margin-top:2px;}
  .launch-subline .subline-mid{opacity:0;display:inline-block;animation:launchWords .8s ease 5.1s forwards;}
  .launch-subline .subline-you{opacity:0;display:inline-block;font-style:italic;font-weight:600;color:var(--rose);animation:launchWords .8s ease 6.0s forwards;}
  @keyframes launchSpin{to{transform:rotate(360deg)}}
  @keyframes launchBloom{from{opacity:0;transform:scale(.25)}to{opacity:1;transform:scale(1)}}
  @keyframes launchWords{from{opacity:0;transform:translateY(14px);filter:blur(7px)}to{opacity:1;transform:none;filter:blur(0)}}
  .launch-avatar{position:relative;width:148px;height:190px;animation:avatarArrive .72s cubic-bezier(.2,.8,.2,1) both,avatarBreathe 3.2s ease-in-out .8s infinite;filter:drop-shadow(0 22px 24px rgba(4,3,14,.5))}.launch-avatar .body{position:absolute;left:34px;bottom:0;width:80px;height:92px;border-radius:42px 42px 18px 18px;background:linear-gradient(145deg,#8c9eff,#4b4f8f);box-shadow:inset 10px 0 22px rgba(255,255,255,.13)}.launch-avatar .neck{position:absolute;left:63px;top:91px;width:23px;height:22px;background:#e8b89f;border-radius:8px}.launch-avatar .head{position:absolute;left:42px;top:30px;width:66px;height:76px;border-radius:48% 48% 45% 45%;background:linear-gradient(145deg,#f7d6c3,#dca286);overflow:hidden;box-shadow:inset -8px -8px 18px rgba(111,49,43,.12)}.launch-avatar .head:before{content:'';position:absolute;z-index:3;left:-7px;right:-7px;top:-8px;height:38px;background:linear-gradient(150deg,#3a294f,#151222 72%);border-radius:55% 50% 42% 28%;clip-path:polygon(0 0,100% 0,100% 52%,82% 37%,70% 76%,57% 42%,43% 78%,27% 43%,10% 67%,0 54%);animation:fringeWave 1.9s ease-in-out infinite}.launch-avatar .hair{position:absolute;left:21px;top:15px;width:110px;height:110px;border-radius:48% 52% 42% 44%;background:linear-gradient(150deg,#3a294f,#111020 70%);transform-origin:70% 14%;animation:hairWave 1.9s ease-in-out infinite;clip-path:polygon(4% 0,100% 0,95% 84%,77% 63%,67% 100%,55% 57%,44% 92%,32% 56%,15% 83%,0 34%)}.launch-avatar .face{position:absolute;inset:0;z-index:2}.launch-avatar .eye{position:absolute;top:38px;width:7px;height:7px;border-radius:50%;background:#352338;animation:avatarBlink 3.5s infinite}.launch-avatar .eye.l{left:17px}.launch-avatar .eye.r{right:17px}.launch-avatar .smile{position:absolute;left:27px;top:53px;width:14px;height:7px;border-bottom:2px solid #9c5360;border-radius:0 0 12px 12px}.launch-avatar .spark{position:absolute;color:#ffe29a;animation:splashSpark 1.8s ease-in-out infinite}.launch-avatar .s1{left:6px;top:64px}.launch-avatar .s2{right:0;top:35px;animation-delay:.6s}.launch-avatar .s3{right:20px;bottom:28px;animation-delay:1.1s}
  @keyframes avatarArrive{from{opacity:0;transform:translateY(28px) scale(.88)}to{opacity:1;transform:none}}@keyframes avatarBreathe{50%{transform:translateY(-4px) rotate(.35deg)}}@keyframes hairWave{0%,100%{transform:rotate(-1.5deg) skewX(0)}50%{transform:rotate(2.5deg) skewX(-3deg)}}@keyframes fringeWave{0%,100%{transform:skewX(0)}50%{transform:skewX(-4deg) translateX(1px)}}@keyframes avatarBlink{0%,45%,49%,100%{transform:scaleY(1)}47%{transform:scaleY(.12)}}@keyframes splashSpark{0%,100%{opacity:.25;transform:scale(.7) rotate(0)}50%{opacity:1;transform:scale(1.15) rotate(80deg)}}
  .category-group{margin:22px 2px 10px;display:flex;align-items:center;gap:9px;color:var(--ink-dim);font-size:10px;font-weight:800;letter-spacing:.16em;text-transform:uppercase}.category-group:after{content:'';height:1px;flex:1;background:linear-gradient(90deg,var(--line),transparent)}.category-symbol{display:grid;place-items:center;font-size:29px;background:radial-gradient(circle at 35% 28%,rgba(255,255,255,.2),rgba(140,158,255,.08) 50%,rgba(10,9,28,.25))}.category-symbol span{position:static;filter:drop-shadow(0 7px 10px rgba(0,0,0,.25));animation:symbolFloat 3s ease-in-out infinite}.category-symbol.heart span{animation:symbolPulse 1.8s ease-in-out infinite}.category-symbol.compass span{animation:symbolTurn 5s ease-in-out infinite}.category-symbol.table span{animation:symbolPrism 3.4s ease-in-out infinite}@keyframes symbolFloat{50%{transform:translateY(-5px) rotate(3deg)}}@keyframes symbolPulse{20%{transform:scale(1.16)}40%{transform:scale(1)}}@keyframes symbolTurn{50%{transform:rotate(26deg) scale(1.08)}}@keyframes symbolPrism{50%{filter:drop-shadow(0 0 13px #ffe29a);transform:rotateY(180deg)}}
  .teddy-category{display:grid;place-items:center;overflow:hidden;background:#070711;isolation:isolate}.teddy-category video{width:100%;height:100%;object-fit:contain;display:block}.cat-card:hover .teddy-category,.cat-card.selected .teddy-category{border-color:rgba(184,166,255,.55);box-shadow:inset 0 1px rgba(255,255,255,.1),0 0 18px rgba(132,107,255,.16)}
  .discovery-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}.discovery-card{min-height:126px;border:1px solid var(--line);border-radius:20px;padding:15px;text-align:left;background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.025));color:var(--ink);position:relative;overflow:hidden}.discovery-card:before{content:'';position:absolute;width:75px;height:75px;border-radius:50%;right:-20px;top:-24px;background:var(--lane-glow,rgba(140,158,255,.24));filter:blur(4px);animation:laneGlow 3.4s ease-in-out infinite}.discovery-card b{display:block;font:600 16px var(--serif);position:relative}.discovery-card small{display:block;color:var(--ink-dim);margin-top:5px;line-height:1.35;position:relative}.discovery-card .lane-mark{display:block;font-size:25px;margin-bottom:16px;position:relative;animation:symbolFloat 3s ease-in-out infinite}@keyframes laneGlow{50%{transform:scale(1.25);opacity:.65}}.coming-soon-banner{margin-top:16px;border:1px solid rgba(255,226,154,.28);border-radius:20px;padding:16px;background:linear-gradient(135deg,rgba(255,226,154,.09),rgba(140,158,255,.08));display:flex;gap:12px;align-items:center}.coming-soon-banner .soon-orb{width:46px;height:46px;flex:0 0 46px;border-radius:15px;display:grid;place-items:center;background:rgba(255,255,255,.08);font-size:23px;animation:symbolFloat 3s ease-in-out infinite}.coming-soon-banner b{display:block;font-family:var(--serif)}.coming-soon-banner small{display:block;color:var(--ink-dim);margin-top:3px;line-height:1.35}

  .btn{
    display:inline-flex;align-items:center;justify-content:center;gap:8px;
    background:linear-gradient(155deg, var(--primary-light), var(--primary));
    color:var(--primary-ink);border:none;font-family:var(--sans);font-weight:600;font-size:14.5px;
    padding:14px 20px;border-radius:100px;cursor:pointer;width:100%;
    box-shadow:var(--glow-primary), inset 0 1px 0 rgba(255,255,255,0.35);
    transition:filter .15s, transform .15s, box-shadow .15s;
    animation:btnBreathe 3.6s ease-in-out infinite;
  }
  @keyframes btnBreathe{0%,100%{box-shadow:var(--glow-primary), inset 0 1px 0 rgba(255,255,255,0.35);}50%{box-shadow:0 10px 30px -4px rgba(140,158,255,0.5), inset 0 1px 0 rgba(255,255,255,0.4);}}
  .btn:hover{transform:translateY(-1px);box-shadow:0 10px 26px -6px rgba(140,158,255,0.45), inset 0 1px 0 rgba(255,255,255,0.4);filter:brightness(1.05);animation-play-state:paused;}
  .btn:active{transform:translateY(0) scale(0.97);}
  .btn:disabled{opacity:0.4;cursor:not-allowed;animation:none;}
  .btn.ghost{background:rgba(140,158,255,0.06);color:var(--ink);border:1px solid var(--line);box-shadow:none;backdrop-filter:blur(8px);animation:none;}
  .btn.ghost:hover{background:rgba(140,158,255,0.1);box-shadow:none;}

  .card{
    background:linear-gradient(155deg, rgba(36,40,80,0.9), rgba(28,31,61,0.75));
    backdrop-filter:blur(12px);
    border:1px solid rgba(140,158,255,0.14);
    border-radius:var(--radius);padding:18px;margin-bottom:14px;
    box-shadow:var(--glow-soft), inset 0 1px 0 rgba(255,255,255,0.04);
  }
  .cat-card{position:relative;display:flex;align-items:center;gap:14px;cursor:pointer;transition:border-color .15s, background .15s, transform .15s, box-shadow .15s;}
  .browse-cta-row{display:flex;gap:12px;margin-top:6px;}
  .browse-cta-btn{flex:1;display:flex;flex-direction:column;align-items:center;gap:8px;padding:20px 12px;border-radius:20px;border:1px solid var(--line);background:var(--bg-panel);cursor:pointer;transition:transform .15s, border-color .15s;}
  .browse-cta-btn:hover{transform:translateY(-2px);border-color:var(--primary);}
  .browse-cta-icon{font-size:28px;}
  .browse-cta-text{font-family:var(--serif);font-size:14px;text-align:center;line-height:1.3;color:var(--ink);}
  .cat-portrait-preview{display:flex;align-items:center;gap:10px;margin:8px 0 4px;}
  .cat-portrait-preview img{width:44px;height:44px;border-radius:50%;object-fit:cover;object-position:center top;box-shadow:0 0 0 2px var(--primary);}
  .cat-portrait-preview span{font-size:12.5px;color:var(--ink-dim);}
  .cat-card:hover{border-color:var(--primary-dim);transform:translateY(-2px);box-shadow:0 6px 16px rgba(0,0,0,0.25);}
  .cat-card.selected{border-color:var(--primary); background:linear-gradient(155deg, rgba(140,158,255,0.16), rgba(36,40,80,0.85));box-shadow:var(--glow-primary), inset 0 1px 0 rgba(255,255,255,0.06);animation:cardSelectPop 0.4s cubic-bezier(0.34,1.56,0.64,1);}
  .cat-card h3{margin:0 0 4px;font-family:var(--serif);font-weight:500;font-size:17px;}
  .cat-card p{margin:0;color:var(--ink-dim);font-size:13px;line-height:1.4;}
  @keyframes cardSelectPop{0%{transform:scale(1);}40%{transform:scale(0.97);}100%{transform:scale(1);}}
  .select-check{position:absolute;top:12px;right:12px;width:22px;height:22px;border-radius:50%;background:var(--primary);color:var(--primary-ink);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;opacity:0;transform:scale(0);transition:opacity 0.2s, transform 0.2s;}
  .cat-card.selected .select-check{opacity:1;transform:scale(1);transition:opacity 0.25s cubic-bezier(0.34,1.56,0.64,1) 0.1s, transform 0.25s cubic-bezier(0.34,1.56,0.64,1) 0.1s;}
  .cat-card .tag{display:inline-block;margin-top:6px;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-dim);border:1px solid var(--line);border-radius:100px;padding:2px 8px;}
  .cat-card .cat-kicker{display:block;margin-bottom:3px;color:var(--primary);font-size:9px;letter-spacing:.15em;text-transform:uppercase;}
  .cat-card:nth-of-type(3) .cat-kicker{color:var(--rose);}
  .cat-card:nth-of-type(4) .cat-kicker{color:var(--primary-light,var(--primary));}

  /* Small animated emblem for the landing card, and per-category "scene"
     illustrations replacing the old plain color dot — a quieter, more
     specific visual than a generic glowing circle for each. */
  .conversation-emblem{width:68px;height:68px;border-radius:22px;display:grid;place-items:center;flex-shrink:0;background:linear-gradient(145deg,rgba(255,255,255,.12),rgba(255,255,255,.035));border:1px solid var(--line);box-shadow:inset 0 1px rgba(255,255,255,.1),0 12px 28px rgba(0,0,0,.18);position:relative;overflow:hidden;}
  .conversation-emblem::before{content:'\201C';font-family:var(--serif);font-size:62px;line-height:1;color:var(--primary);transform:translateY(8px);}
  .conversation-emblem::after{content:'✦';position:absolute;right:9px;top:8px;font-size:10px;color:var(--friend-accent);animation:emblemTwinkle 2.8s ease-in-out infinite;}
  @keyframes emblemTwinkle{50%{transform:rotate(90deg) scale(1.35);filter:brightness(1.4)}}
  .connection-scene{width:76px;height:76px;border-radius:23px;flex:0 0 76px;position:relative;overflow:hidden;background:linear-gradient(145deg,rgba(255,255,255,.11),rgba(255,255,255,.025));border:1px solid var(--line);box-shadow:inset 0 1px rgba(255,255,255,.12),0 12px 28px rgba(0,0,0,.18);}
  /* Simple emoji-icon variant for categories that don't have a bespoke
     animated scene — same box, no custom keyframes needed. */
  .connection-scene.cat-emoji-scene{display:flex;align-items:center;justify-content:center;font-size:32px;}
  /* Per-category dragon gesture-loop videos — same 76x76 box as the scenes
     above, cropped to fill it (object-fit:cover) and clipped to the
     rounded corners by .connection-scene's own overflow:hidden. Backgrounds
     on these clips are solid dark navy, not transparent (H.264/mp4 has no
     alpha channel) — that's expected, not a missing asset, and reads fine
     as a self-contained icon tile against the card. Paused-at-first-frame
     is the resting state; see selectCat()/DOMContentLoaded wiring in the
     script for play/pause behavior. */
  .connection-scene.dragon-scene{background:#0b0c1a;}
  .dragon-icon{width:100%;height:100%;object-fit:cover;display:block;}
  .category-disclaimer{margin:12px 0;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.05);border:1px solid var(--line);font-size:12px;line-height:1.5;color:var(--ink-dim);}
  .connection-scene span{position:absolute;display:block;}

  /* Friend: an actual typing-then-reply cycle, not just floating bars */
  .friend-scene .typing{display:flex;gap:3px;left:13px;top:15px;opacity:0;animation:friendTyping 4.5s ease-in-out infinite;}
  .friend-scene .typing i{width:5px;height:5px;border-radius:50%;background:var(--friend-accent);display:block;font-style:normal;animation:typingBounce 1s ease-in-out infinite;}
  .friend-scene .typing i:nth-child(2){animation-delay:.15s;}
  .friend-scene .typing i:nth-child(3){animation-delay:.3s;}
  .friend-scene .one{height:16px;width:36px;border-radius:9px 9px 9px 3px;background:var(--friend-accent);left:10px;top:14px;opacity:0;animation:friendBubbleA 4.5s ease-in-out infinite;}
  .friend-scene .two{height:14px;width:27px;border-radius:9px 9px 3px 9px;background:rgba(255,255,255,.75);right:10px;top:42px;opacity:0;animation:friendBubbleB 4.5s ease-in-out infinite;}
  @keyframes friendTyping{0%,28%{opacity:1;}38%,100%{opacity:0;}}
  @keyframes friendBubbleA{0%,30%{opacity:0;transform:scale(.85);}40%,62%{opacity:1;transform:scale(1);}70%,100%{opacity:0;transform:scale(.92);}}
  @keyframes friendBubbleB{0%,64%{opacity:0;transform:scale(.85);}72%,100%{opacity:1;transform:scale(1);}}

  /* Girlfriend: an actual beating heart with drifting sparkles around it */
  .girlfriend-scene .heart{width:32px;height:32px;left:22px;top:20px;background:linear-gradient(145deg,#ffc2d6,#a683ff);animation:heartBeat 1.8s ease-in-out infinite;clip-path:path('M16 29C16 29 2 20 2 10.5C2 5 6 2 10.5 2C13 2 15 3.5 16 6C17 3.5 19 2 21.5 2C26 2 30 5 30 10.5C30 20 16 29 16 29Z');}
  .girlfriend-scene .spark{width:3px;height:3px;border-radius:50%;background:#fff;opacity:0;}
  .girlfriend-scene .spark.s1{left:16px;top:14px;animation:sparkDrift 2.6s ease-in-out infinite;}
  .girlfriend-scene .spark.s2{right:14px;top:20px;animation:sparkDrift 2.6s ease-in-out infinite .9s;}
  .girlfriend-scene .spark.s3{left:36px;top:52px;animation:sparkDrift 2.6s ease-in-out infinite 1.7s;}
  @keyframes heartBeat{0%,100%{transform:scale(1);}15%{transform:scale(1.12);}30%{transform:scale(1);}45%{transform:scale(1.08);}60%{transform:scale(1);}}
  @keyframes sparkDrift{0%{opacity:0;transform:translateY(0) scale(.6);}30%{opacity:1;}100%{opacity:0;transform:translateY(-16px) scale(1);}}

  /* Boyfriend: a steady flame that flickers gently but never goes out —
     "grounded warmth" made literal, replacing the earlier abstract pulse-line */
  .boyfriend-scene .bolt-glow{width:46px;height:46px;left:15px;top:15px;border-radius:50%;background:radial-gradient(circle,rgba(255,224,102,.4),transparent 70%);animation:boltGlow 2.6s ease-in-out infinite;}
  .boyfriend-scene .bolt{width:26px;height:38px;left:25px;top:19px;background:linear-gradient(160deg,#fff9db,#ffe066 45%,#f5b800 85%);clip-path:polygon(58% 0%, 22% 52%, 46% 52%, 32% 100%, 78% 42%, 50% 42%);animation:boltFlash 2.6s ease-in-out infinite;box-shadow:0 0 16px rgba(255,224,102,.7);}
  @keyframes boltGlow{0%,100%{opacity:.55;}5%,55%{opacity:1;}10%,60%{opacity:.55;}}
  @keyframes boltFlash{0%,100%{opacity:.85;transform:scale(1);filter:brightness(1);}5%{opacity:1;transform:scale(1.1);filter:brightness(1.5);}10%{opacity:.9;transform:scale(1);filter:brightness(1);}55%{opacity:1;transform:scale(1.06);filter:brightness(1.3);}60%{opacity:.9;transform:scale(1);filter:brightness(1);}}
  
  

  .adult-gate{display:none;background:var(--bg-panel-2);border:1px solid var(--primary-dim);border-radius:14px;padding:14px;margin:12px 0;font-size:13px;color:var(--ink-dim);}
  .adult-gate.show{display:block;}
  .adult-gate label{display:flex;gap:10px;align-items:flex-start;cursor:pointer;}
  .adult-gate input{margin-top:2px;}
  .criteria-card{background:linear-gradient(135deg,rgba(140,158,255,.12),rgba(255,255,255,.025));border:1px solid rgba(140,158,255,.22);border-radius:16px;padding:14px;margin:14px 0 18px;}
  .criteria-card .field{margin:0 0 14px;}
  .criteria-card .field:last-child{margin-bottom:0;}
  .criteria-note{font-size:11.5px;line-height:1.45;color:var(--ink-dim);margin-top:10px;}

  .field{margin-bottom:18px;}
  .field label{display:block;font-size:12.5px;color:var(--ink-dim);margin-bottom:8px;font-weight:600;letter-spacing:.02em;}
  .password-wrap{position:relative;}
  .password-wrap input{padding-right:52px!important;}
  .password-toggle{position:absolute;right:7px;top:50%;translate:0 -50%;width:38px;height:38px;display:grid;place-items:center;border:0;border-radius:12px;background:transparent;color:var(--ink-dim);cursor:pointer;transition:color .2s,background .2s,transform .2s;z-index:2;}
  .password-toggle:hover,.password-toggle:focus-visible{color:var(--primary);background:color-mix(in srgb,var(--primary) 12%,transparent);outline:none;}
  .password-toggle:active{transform:scale(.9)}
  .password-toggle svg{position:absolute;width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:opacity .18s,transform .22s;}
  .password-toggle .eye-open{opacity:1;transform:scale(1)}.password-toggle .eye-closed{opacity:0;transform:scale(.72)}
  .password-toggle.shown .eye-open{opacity:0;transform:scale(.72)}.password-toggle.shown .eye-closed{opacity:1;transform:scale(1)}

  .chip-row{display:flex;flex-wrap:wrap;gap:8px;}
  .chip{padding:8px 14px;border-radius:100px;border:1px solid var(--line);background:rgba(28,31,61,0.6);backdrop-filter:blur(6px);color:var(--ink-dim);font-size:13px;cursor:pointer;transition:all .15s;}
  .chip:hover{border-color:var(--primary-dim);transform:translateY(-1px);}
  .chip.on{background:linear-gradient(155deg, var(--primary-light), var(--primary));border-color:var(--primary);color:var(--primary-ink);font-weight:600;box-shadow:0 4px 14px -3px rgba(140,158,255,0.4);}
  input[type=text], input[type=password], input[type=email], input[type=date]{
    width:100%;background:rgba(28,31,61,0.7);backdrop-filter:blur(8px);
    border:1px solid var(--line);border-radius:12px;padding:12px 14px;
    color:var(--ink);font-size:14px;font-family:var(--sans);
    transition:border-color .15s, box-shadow .15s;
    color-scheme:dark; /* keeps the native date-picker calendar UI dark-themed too, not a white popup */
  }
  input[type=text]:focus, input[type=password]:focus, input[type=email]:focus, input[type=date]:focus{
    outline:none;border-color:var(--primary);
    box-shadow:0 0 0 3px rgba(140,158,255,0.18);
  }
  input[type=text]::placeholder, input[type=password]::placeholder, input[type=email]::placeholder{color:#4d5182;}
  .empty-hint{font-size:12.5px;color:#585c8f;font-style:italic;margin-top:6px;}

  .avatar-wrap{display:flex;flex-direction:column;align-items:center;gap:10px;background:var(--bg-panel);border:1px solid var(--line);border-radius:var(--radius);padding:20px;margin-bottom:18px;}
  #avatarCanvas{width:128px;height:128px;border-radius:50%;background:#0e1030;box-shadow:0 0 0 4px var(--bg-panel-2);}
  .avatar-caption{font-size:12px;color:var(--ink-dim);text-align:center;}
  .pfp-toggle{display:flex;align-items:center;gap:8px;margin-top:6px;font-size:12.5px;color:var(--ink-dim);cursor:pointer;user-select:none;}
  .pfp-toggle .box{width:18px;height:18px;border-radius:5px;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;background:var(--bg-panel-2);flex-shrink:0;}
  .pfp-toggle .box.on{background:var(--primary);border-color:var(--primary);color:var(--primary-ink);font-weight:700;font-size:12px;}
  .pfp-confirm{font-size:12px;color:var(--primary);margin-top:4px;display:none;}
  .pfp-confirm.show{display:block;}
  /* vertical portrait story: one person at a time, no dating-app swipe */
  .portrait-reel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:10px 0 12px;}
  .portrait-counter{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-dim);}
  .reel-nav{display:flex;gap:7px;}
  .reel-nav button{width:36px;height:36px;border-radius:12px;border:1px solid var(--line);background:var(--bg-panel);color:var(--ink);font-size:16px;cursor:pointer;transition:.2s;}
  .reel-nav button:hover{transform:translateY(-2px);border-color:var(--primary);}
  #portraitRow{display:flex;flex-direction:row;gap:14px;height:400px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:0 3px 8px;scrollbar-width:none;overscroll-behavior:contain;}
  #portraitRow::-webkit-scrollbar{display:none;}
  .portrait-story{position:relative;min-width:270px;width:270px;height:100%;scroll-snap-align:center;scroll-snap-stop:always;border-radius:24px;overflow:hidden;border:1px solid rgba(255,255,255,.11);background:var(--bg-panel);box-shadow:0 18px 46px rgba(0,0,0,.34);flex:none;transition:transform .35s,border-color .35s,box-shadow .35s;}
  .portrait-story .portrait-chip{width:100%;height:100%;border:0;border-radius:0;object-fit:cover;object-position:center top;box-shadow:none;filter:saturate(.96);animation:portraitReveal .58s cubic-bezier(.16,1,.3,1) forwards;}
  @keyframes portraitReveal{from{opacity:0;transform:scale(1.04);}to{opacity:1;transform:scale(1);}}
  .portrait-story::after{content:'';position:absolute;inset:42% 0 0;background:linear-gradient(transparent,rgba(3,7,13,.18) 20%,rgba(3,7,13,.93));pointer-events:none;}
  .portrait-story-meta{position:absolute;left:16px;right:16px;bottom:15px;z-index:2;display:flex;flex-direction:column;align-items:flex-start;gap:10px;}
  .portrait-story-copy{color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.45);max-width:100%;}
  .portrait-story-copy b{display:block;font-family:var(--serif);font-size:23px;font-weight:500;line-height:1;}
  .portrait-story-copy em{display:block;margin-top:5px;font-size:12px;font-weight:700;font-style:normal;color:#fff;}
  .portrait-story-copy small{display:block;margin:3px 0 6px;font-size:10.5px;line-height:1.35;opacity:.84;}
  .portrait-story-copy span{display:block;font-size:9px;letter-spacing:.1em;text-transform:uppercase;opacity:.68;}
  .choose-portrait{border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.14);backdrop-filter:blur(14px);color:#fff;border-radius:14px;padding:10px 12px;font-weight:650;font-size:11.5px;cursor:pointer;white-space:nowrap;transition:.25s;width:100%;}
  .choose-portrait:hover{background:#fff;color:#18202a;transform:translateY(-2px);}
  .portrait-story.on{border-color:var(--primary);box-shadow:0 0 0 3px rgba(140,158,255,.26),0 22px 55px rgba(0,0,0,.46);}
  .portrait-story.on .choose-portrait{background:var(--primary);border-color:var(--primary);color:var(--primary-ink);}
  .swipe-cue{display:flex;align-items:center;justify-content:center;gap:7px;margin:10px 0 0;color:var(--ink-dim);font-size:11px;}
  .swipe-cue .swipe-arrow{animation:swipeCue 1.7s ease-in-out infinite;}
  @keyframes swipeCue{50%{transform:translateX(5px);}}
  html[data-theme="pearl"] .portrait-story::after{background:linear-gradient(transparent,rgba(44,30,25,.12) 20%,rgba(39,25,20,.89));}

  /* chat screen — flex column so input bar pins to bottom of screen content */
  #chat{padding-bottom:calc(18px + env(safe-area-inset-bottom));}
  .chat-head-avatar{width:40px;height:40px;border-radius:50%;overflow:hidden;flex-shrink:0;}
  .chat-head-avatar canvas{width:100%;height:100%;display:block;}
  .chat-hero{position:relative;height:250px;flex-shrink:0;margin:-4px -4px 14px;border-radius:26px 26px 0 0;overflow:hidden;background:var(--bg-panel);}
  .chat-hero-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top;display:none;}
  .chat-hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,8,20,.92) 0%,rgba(8,8,20,.65) 32%,rgba(8,8,20,.15) 58%,rgba(8,8,20,.05) 100%);}
  .chat-hero-icon-btn{position:absolute;top:16px;width:40px;height:40px;border-radius:50%;border:none;background:rgba(20,20,35,.55);backdrop-filter:blur(8px);color:#fff;font-size:16px;display:flex;align-items:center;justify-content:center;cursor:pointer;gap:4px;z-index:2;}
  .chat-hero-icon-btn.call-btn{width:auto;height:28px;padding:0 10px;font-size:11px;font-weight:600;border-radius:8px;}
  .chat-hero-text{position:absolute;left:20px;right:46%;bottom:14px;z-index:2;}
  .chat-hero-greeting{color:rgba(255,255,255,.75);font-size:10.5px;margin-bottom:1px;}
  .chat-hero-name{margin:0 0 2px;font-family:var(--serif);font-size:19px;font-weight:500;color:#fff;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .chat-hero-tagline{color:rgba(255,255,255,.85);font-size:11px;margin-bottom:5px;line-height:1.3;}
  .chat-hero-disclosure{display:inline-block;font-size:8.5px;color:rgba(255,255,255,.65);background:rgba(255,255,255,.1);backdrop-filter:blur(6px);padding:3px 9px;border-radius:100px;}
  .sos-pill{border:none;cursor:pointer;font-family:var(--sans);}
  .sos-pill strong{color:#ff9eb0;font-weight:700;}
  .toggle-row{display:flex;align-items:center;justify-content:space-between;gap:12px;}
  .toggle-switch{position:relative;width:44px;height:26px;flex-shrink:0;border-radius:100px;border:none;background:var(--bg-panel-2);cursor:pointer;transition:background .2s;padding:0;}
  .toggle-switch::after{content:'';position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:transform .2s cubic-bezier(.34,1.56,.64,1);box-shadow:0 2px 6px rgba(0,0,0,.25);}
  .toggle-switch.on{background:var(--primary);}
  .toggle-switch.on::after{transform:translateX(18px);}
  .disclosure{text-align:center;font-size:8.5px;color:#4a4e70;margin:0 0 12px;letter-spacing:.02em;flex-shrink:0;}
  .my-status-strip{display:flex;align-items:center;gap:8px;padding:8px 12px;margin:0 0 12px;border-radius:12px;background:var(--bg-panel);border:1px solid var(--line);cursor:pointer;flex-shrink:0;transition:background .15s, border-color .15s;}
  .my-status-strip:hover{background:var(--bg-panel-2);border-color:var(--primary-dim);}
  .my-status-strip span:first-child{font-size:16px;}
  .my-status-strip .empty-hint{margin:0;padding:0;}
  #myStatusText{font-size:12.5px;color:var(--ink-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .mood-chip{font-size:18px;padding:6px 10px;}
  .mood-chip.on{background:linear-gradient(155deg, var(--primary-light), var(--primary));box-shadow:0 4px 14px -3px rgba(140,158,255,0.4);}
  #chatMessages{flex:1;overflow-y:auto;display:flex;flex-direction:column;min-height:0;margin-bottom:10px;}
  /* The outer .screen already gives every screen overflow-y:auto by default,
     but the chat screen has its own dedicated inner scroll region
     (#chatMessages above) — two nested auto-scroll containers is a real
     anti-pattern that let scrolling drag the whole screen down far enough
     to reveal the attach/game panels underneath, which were never meant
     to be reachable that way. */
  #chat{overflow-y:hidden;}
  .chat-suggestions{display:flex;gap:8px;overflow-x:auto;padding-bottom:10px;flex-shrink:0;-webkit-overflow-scrolling:touch;}
  .chat-suggestions::-webkit-scrollbar{display:none;}
  .chat-suggestion-chip{flex-shrink:0;white-space:nowrap;background:var(--bg-panel);border:1px solid var(--line);color:var(--ink-dim);font-size:12.5px;padding:8px 14px;border-radius:100px;cursor:pointer;}
  .bubble{max-width:78%;padding:11px 15px;border-radius:16px;font-size:14px;line-height:1.45;margin-bottom:10px;white-space:pre-wrap;animation:bubbleInLeft 0.32s cubic-bezier(0.34,1.56,0.64,1) backwards;}
  .bubble.them{background:var(--bg-panel);border-bottom-left-radius:4px;}
  .bubble.me{background:var(--primary-dim);color:#fff;margin-left:auto;border-bottom-right-radius:4px;animation-name:bubbleInRight;}
  .bubble.crisis{background:#3a2340;border:1px solid var(--rose);}
  .crisis-actions{display:flex;flex-direction:column;gap:8px;margin-top:12px;}
  .crisis-action-btn{display:flex;align-items:center;justify-content:center;gap:8px;background:var(--rose);color:#2b0a1c;font-weight:700;text-decoration:none;border-radius:100px;padding:12px 16px;font-size:14px;transition:transform .15s, filter .15s;}
  .crisis-action-btn:hover{transform:translateY(-1px);filter:brightness(1.08);}
  .crisis-action-btn:active{transform:translateY(0) scale(0.97);}
  .sos-intro-banner{display:flex;align-items:flex-start;gap:8px;background:rgba(217,60,86,.12);border:1px solid rgba(217,60,86,.3);border-radius:14px;padding:10px 12px;margin-bottom:10px;font-size:12px;line-height:1.4;color:var(--ink-dim);}
  .sos-intro-icon{flex-shrink:0;font-size:14px;}
  .sos-intro-text{flex:1;}
  .sos-intro-text b{color:var(--ink);}
  .sos-intro-dismiss{flex-shrink:0;background:none;border:none;color:var(--ink-dim);font-size:14px;cursor:pointer;padding:0 2px;}
  .bubble.milestone{align-self:center;margin:6px auto;max-width:fit-content;background:linear-gradient(135deg,rgba(140,158,255,.18),rgba(217,139,166,.14));border:1px solid rgba(140,158,255,.3);font-size:12.5px;color:var(--ink);text-align:center;animation-name:bubbleInPop;}
  .bubble.persona-label{display:flex;align-items:center;gap:6px;padding:6px 12px 6px 6px;}
  .persona-label-avatar{width:22px;height:22px;border-radius:50%;object-fit:cover;flex-shrink:0;display:block;}
  @keyframes bubbleInLeft{from{opacity:0;transform:translateX(-10px) scale(0.9);}to{opacity:1;transform:translateX(0) scale(1);}}
  @keyframes bubbleInRight{from{opacity:0;transform:translateX(10px) scale(0.9);}to{opacity:1;transform:translateX(0) scale(1);}}
  @keyframes bubbleInPop{from{opacity:0;transform:scale(0.85);}to{opacity:1;transform:scale(1);}}
  .bubble.typing{color:var(--ink-dim);font-style:italic;}
  /* Real bouncing dots instead of static "..." */
  .bubble.typing-dots{display:flex;gap:4px;align-items:center;padding:14px 16px;}
  .bubble.typing-dots span{width:6px;height:6px;border-radius:50%;background:var(--ink-dim);animation:typingBounce 1.2s ease-in-out infinite;}
  .bubble.typing-dots span:nth-child(2){animation-delay:0.15s;}
  .bubble.typing-dots span:nth-child(3){animation-delay:0.3s;}
  @keyframes typingBounce{0%,60%,100%{transform:translateY(0);opacity:0.5;}30%{transform:translateY(-4px);opacity:1;}}
  .bubble.sticker{background:none;font-size:44px;padding:2px 6px;line-height:1;}
  .bubble.gif{background:none;padding:0;overflow:hidden;border-radius:14px;}

  /* Message reactions — long-press any bubble to react, WhatsApp-style */
  .bubble{position:relative;}
  .reaction-badge{position:absolute;bottom:-10px;right:8px;background:var(--bg-panel-2);border:1px solid var(--line);border-radius:100px;padding:2px 6px;font-size:13px;box-shadow:0 2px 6px rgba(0,0,0,.25);animation:reactionBadgePop 0.3s cubic-bezier(0.34,1.56,0.64,1);cursor:pointer;}
  .bubble.me .reaction-badge{right:auto;left:8px;}
  @keyframes reactionBadgePop{0%{transform:scale(0);}100%{transform:scale(1);}}
  .reaction-picker{position:fixed;display:flex;gap:4px;background:var(--bg-panel-2);border:1px solid var(--line);border-radius:100px;padding:8px;box-shadow:0 12px 30px rgba(0,0,0,.4);z-index:60;opacity:0;transform:scale(0.85);transition:opacity .15s, transform .15s;pointer-events:none;}
  .reaction-picker.open{opacity:1;transform:scale(1);pointer-events:auto;}
  .reaction-picker button{width:34px;height:34px;border-radius:50%;border:none;background:none;font-size:19px;cursor:pointer;transition:transform .15s;}
  .reaction-picker button:hover{transform:scale(1.3);}
  .reaction-picker-backdrop{position:fixed;inset:0;z-index:59;display:none;}

  /* ---------------- Beta feedback modal ---------------- */
  .feedback-modal-backdrop{position:fixed;inset:0;background:rgba(4,5,15,.82);backdrop-filter:blur(6px);z-index:80;display:none;}
  .feedback-modal-backdrop.open{display:block;}
  .confirm-modal-backdrop{position:fixed;inset:0;background:rgba(4,5,15,.82);backdrop-filter:blur(6px);z-index:90;display:none;}
  .confirm-modal-backdrop.open{display:block;}
  .confirm-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:min(320px,88vw);background:var(--bg-panel-2);border:1px solid var(--line);border-radius:20px;padding:26px 22px;z-index:91;display:none;text-align:center;}
  .confirm-modal.open{display:block;}
  .confirm-modal p{font-size:14px;color:var(--ink);line-height:1.5;margin-bottom:20px;}
  .confirm-modal-actions{display:flex;gap:10px;}
  .confirm-modal-actions button{flex:1;padding:11px;border-radius:100px;font-size:13.5px;font-weight:600;border:none;cursor:pointer;}
  .confirm-modal-actions .confirm-yes{background:var(--rose);color:#2a1018;}
  .confirm-modal-actions .confirm-no{background:var(--bg-panel);color:var(--ink);border:1px solid var(--line);}
  .confirm-modal.survey-modal{width:min(340px,90vw);text-align:left;}
  .survey-modal label.survey-question{display:block;font-size:13px;color:var(--ink);margin:12px 0 6px;font-weight:600;}
  .survey-modal textarea{width:100%;min-height:56px;border-radius:12px;border:1px solid var(--line);background:var(--bg-panel);color:var(--ink);font-family:var(--sans);font-size:13.5px;padding:9px 11px;resize:vertical;}
  .roster-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:14px;}
  .roster-card{background:var(--bg-panel-2);border:1px solid var(--line);border-radius:16px;overflow:hidden;cursor:pointer;text-align:center;transition:.15s;}
  .roster-card:hover{border-color:var(--primary);}
  .roster-card img{width:100%;aspect-ratio:1;object-fit:cover;display:block;background:var(--bg-panel);}
  .roster-card .roster-card-body{padding:8px 8px 10px;}
  .roster-card .roster-card-name{font-size:13px;font-weight:700;color:var(--ink);}
  .roster-card .roster-card-tag{display:block;font-size:10.5px;color:var(--ink-dim);margin-top:2px;line-height:1.3;}
  .professional-profile-card{text-align:left;background:linear-gradient(180deg,var(--bg-panel-2),rgba(8,10,19,.98));}
  .professional-profile-card img{aspect-ratio:4/5;object-position:center 22%;}
  .professional-profile-card .roster-card-body{min-height:118px;padding:10px 11px 12px;}
  .professional-profile-card .roster-card-name{font-size:16px;line-height:1.05;letter-spacing:-.01em;}
  .professional-profile-card .roster-card-age{font-size:10px;color:var(--ink-dim);margin-top:4px;}
  .professional-profile-card .roster-card-title{font-size:11px;font-weight:750;color:var(--primary);margin-top:6px;padding-bottom:6px;border-bottom:2px solid color-mix(in srgb,var(--primary) 72%,transparent);line-height:1.2;}
  .professional-profile-card .roster-card-bio{font-size:10.5px;color:var(--ink);opacity:.88;margin-top:7px;line-height:1.35;}\n  .anime-buddy-profile-card .roster-card-title{color:#d8a7ff;border-bottom-color:rgba(216,167,255,.62);}\n  .anime-buddy-profile-card img{object-position:center 20%;}
  .profile-zoom{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:95;display:none;max-width:90vw;max-height:80vh;}
  .profile-zoom.open{display:block;}
  .profile-zoom img{width:100%;height:100%;max-width:90vw;max-height:80vh;object-fit:contain;border-radius:20px;box-shadow:0 20px 60px rgba(0,0,0,.5);}
  .profile-zoom-close{position:absolute;top:-16px;right:-16px;width:36px;height:36px;border-radius:50%;background:var(--bg-panel-2);border:1px solid var(--line);color:var(--ink);font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;}
  #profileZoomBackdrop.open{display:block;z-index:94;}
  .feedback-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%) scale(0.94);width:min(340px,90vw);max-height:85vh;overflow-y:auto;background:var(--bg-panel-2);border:1px solid var(--line);border-radius:24px;padding:32px 26px;z-index:81;display:none;opacity:0;transition:opacity .2s, transform .2s;text-align:center;}
  .feedback-modal.open{display:block;opacity:1;transform:translate(-50%,-50%) scale(1);}
  .feedback-modal-mark{width:56px;height:44px;margin:0 auto 14px;}
  .feedback-modal-mark svg{width:100%;height:100%;filter:drop-shadow(0 0 12px rgba(140,158,255,.4));}
  .feedback-modal h3{font-family:var(--serif);font-weight:400;font-size:20px;margin-bottom:10px;color:var(--ink);}
  .feedback-modal-lead{font-size:13px;color:var(--ink-dim);margin-bottom:18px;line-height:1.55;}
  .feedback-modal textarea{width:100%;min-height:110px;background:var(--bg-panel);border:1px solid var(--line);border-radius:14px;padding:12px 14px;color:var(--ink);font-size:14px;font-family:var(--sans);outline:none;resize:vertical;margin-bottom:14px;}
  .feedback-modal textarea:focus{border-color:var(--primary);}
  #feedbackModalError{color:var(--rose);font-size:12.5px;margin-top:10px;min-height:16px;}
  .feedback-modal-thanks-icon{font-size:34px;margin-bottom:10px;}
  .feedback-coupon-card{background:linear-gradient(155deg,rgba(140,158,255,.14),rgba(217,139,166,.08));border:1px solid var(--line);border-radius:18px;padding:22px 18px;margin-top:18px;}
  .feedback-coupon-label{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--primary);margin-bottom:10px;}
  .feedback-coupon-code{font-family:var(--serif);font-size:26px;letter-spacing:.03em;color:var(--ink);margin-bottom:10px;cursor:pointer;user-select:all;}
  .feedback-coupon-detail{font-size:12.5px;color:var(--ink-dim);}
  .feedback-copy-hint{font-size:11px;color:var(--ink-dim);margin-top:12px;}
  .feedback-copy-hint.copied{color:#a8e8c4;}
  .feedback-modal-close-note{font-size:12.5px;color:var(--ink-dim);margin-top:20px;}
  .reaction-picker-backdrop.open{display:block;}

  /* Spontaneous voice note — its own distinct bubble, tap-to-play */
  .bubble.voice-note-msg{display:flex;align-items:center;gap:10px;padding:10px 14px;min-width:150px;}
  .voice-play-btn{width:32px;height:32px;border-radius:50%;border:none;background:linear-gradient(155deg, var(--primary-light), var(--primary));color:var(--primary-ink);font-size:11px;cursor:pointer;flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:transform .15s;}
  .voice-play-btn:hover{transform:scale(1.08);}
  .voice-note-bars{display:flex;align-items:center;gap:2px;flex:1;height:22px;}
  .voice-note-bars span{width:3px;background:var(--ink-dim);border-radius:2px;flex-shrink:0;opacity:.7;}
  .voice-note-bars span:nth-child(3n){height:40%;}
  .voice-note-bars span:nth-child(3n+1){height:90%;}
  .voice-note-bars span:nth-child(3n+2){height:60%;}
  .bubble.gif img{display:block;max-width:220px;border-radius:14px;}
  .bubble.songcard{background:var(--bg-panel-2);border:1px solid var(--line);padding:14px 16px;min-width:180px;}
  .songNote{font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--primary);margin-bottom:6px;}
  .songRow{display:flex;gap:10px;align-items:center;}
  .songArt{width:52px;height:52px;border-radius:8px;object-fit:cover;flex-shrink:0;}
  .songMeta{min-width:0;}
  .songTitle{font-family:var(--serif);font-size:15px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px;}
  .songArtist{font-size:12.5px;color:var(--ink-dim);margin-bottom:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px;}
  .songLinks{display:flex;gap:10px;align-items:center;}
  .songPreviewBtn{background:var(--primary);color:var(--primary-ink);border:none;border-radius:100px;width:26px;height:26px;font-size:11px;cursor:pointer;flex-shrink:0;}
  .songLink{display:inline-block;font-size:12px;color:var(--primary);text-decoration:none;font-weight:600;}
  .songLink:hover{text-decoration:underline;}

  .attach-panel{position:absolute;left:0;right:0;bottom:0;max-height:70%;background:var(--bg-panel);border-radius:22px 22px 0 0;box-shadow:0 -18px 50px rgba(0,0,0,.4);border:1px solid var(--line);border-bottom:none;transform:translateY(105%);transition:transform .32s cubic-bezier(.16,1,.3,1);z-index:41;display:flex;flex-direction:column;padding:12px 16px 14px;overflow-y:auto;}
  .attach-panel.open{transform:translateY(0);}
  .attach-panel-backdrop{position:absolute;inset:0;background:rgba(5,6,12,0.55);backdrop-filter:blur(3px);opacity:0;pointer-events:none;transition:opacity .25s;z-index:40;}
  .attach-panel-backdrop.open{opacity:1;pointer-events:auto;}
  .attach-tabs{display:flex;gap:6px;margin-bottom:10px;align-items:center;}
  .attach-tab{flex:1;padding:8px;border-radius:10px;border:1px solid var(--line);background:var(--bg-panel);color:var(--ink-dim);font-size:12.5px;cursor:pointer;}
  .attach-tab.on{background:var(--primary);border-color:var(--primary);color:var(--primary-ink);font-weight:600;}
  .attach-close{background:none;border:none;color:var(--ink-dim);font-size:14px;cursor:pointer;padding:4px 6px;}
  .attach-gif-search{display:flex;gap:8px;margin-bottom:10px;}
  .backend-note{background:var(--bg-panel);border:1px dashed var(--line);border-radius:10px;padding:12px 14px;}
  .backend-note b{display:block;font-size:12.5px;color:var(--primary);margin-bottom:6px;}
  .backend-note p{margin:0;font-size:12px;color:var(--ink-dim);line-height:1.5;}
  .attach-gif-search input{flex:1;background:var(--bg-panel);border:1px solid var(--line);border-radius:10px;padding:8px 10px;color:var(--ink);font-size:13px;}
  .attach-gif-results{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
  .attach-gif-results img{width:100%;border-radius:8px;cursor:pointer;display:block;}

  /* Sticker search — real Giphy-backed illustrated/cartoon sticker content,
     searchable, matching what real messaging apps actually offer here. */
  /* ---------------- Noto Animated Emoji reaction drawer ---------------- */
  /* CC BY 4.0, Google Fonts — see ATTRIBUTION.md */
  .reaction-backdrop{position:absolute;inset:0;background:rgba(5,6,12,0.55);backdrop-filter:blur(3px);opacity:0;pointer-events:none;transition:opacity .25s;z-index:40;}
  .reaction-backdrop.open{opacity:1;pointer-events:auto;}
  .reaction-drawer{position:absolute;left:0;right:0;bottom:0;max-height:74%;background:var(--bg-panel);border-radius:22px 22px 0 0;box-shadow:0 -18px 50px rgba(0,0,0,.4);border:1px solid var(--line);border-bottom:none;transform:translateY(105%);transition:transform .32s cubic-bezier(.16,1,.3,1);z-index:41;display:flex;flex-direction:column;padding:10px 16px 14px;}
  .reaction-drawer.open{transform:translateY(0);}
  .reaction-drag-handle{width:36px;height:4px;border-radius:2px;background:var(--line);margin:2px auto 12px;cursor:grab;touch-action:none;}
  .reaction-drawer-head{display:flex;gap:8px;margin-bottom:10px;flex-shrink:0;}
  .media-picker-tabs{display:flex;gap:6px;align-items:center;margin-bottom:12px;flex-shrink:0;}
  .media-picker-tab{flex:1;padding:9px 6px;border-radius:10px;border:1px solid var(--line);background:var(--bg-panel);color:var(--ink-dim);font-size:13px;cursor:pointer;font-weight:500;}
  .media-picker-tab.on{background:var(--primary);border-color:var(--primary);color:var(--primary-ink);font-weight:600;}
  .reaction-drawer-head input{flex:1;background:rgba(28,31,61,0.7);backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:12px;padding:10px 14px;color:var(--ink);font-size:14px;font-family:var(--sans);}
  .reaction-drawer-head input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(140,158,255,0.18);}
  .reaction-close-btn{width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:var(--bg-panel-2);color:var(--ink);font-size:14px;cursor:pointer;flex-shrink:0;transition:.15s;}
  .reaction-close-btn:hover{background:var(--bg-panel);transform:rotate(90deg);}
  .reaction-cat-tabs{display:flex;gap:6px;overflow-x:auto;padding-bottom:8px;margin-bottom:4px;scrollbar-width:none;flex-shrink:0;}
  .reaction-cat-tabs::-webkit-scrollbar{display:none;}
  .reaction-cat-btn{flex:none;background:var(--bg-panel-2);border:1px solid var(--line);border-radius:100px;padding:6px 12px;font-size:11.5px;color:var(--ink-dim);cursor:pointer;white-space:nowrap;transition:.15s;}
  .reaction-cat-btn.on{background:linear-gradient(155deg, var(--primary-light), var(--primary));color:var(--primary-ink);border-color:var(--primary);font-weight:600;}
  .reaction-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;overflow-y:auto;flex:1;padding:4px 2px;min-height:120px;}
  .reaction-cell{aspect-ratio:1;background:var(--bg-panel-2);border:1px solid transparent;border-radius:12px;cursor:pointer;transition:transform .15s, border-color .15s;position:relative;display:flex;align-items:center;justify-content:center;font-size:26px;line-height:1;}
  .reaction-cell:hover{transform:scale(1.1);z-index:1;}
  .reaction-cell.selected{border-color:var(--primary);box-shadow:0 0 0 2px rgba(140,158,255,.3);animation:cardSelectPop 0.3s cubic-bezier(0.34,1.56,0.64,1);}
  @keyframes reactionCellIn{0%{opacity:0;transform:scale(.5);}100%{opacity:1;transform:scale(1);}}
  .reaction-cell{animation:reactionCellIn .28s cubic-bezier(.34,1.56,.64,1) backwards;animation-delay:var(--cell-delay,0ms);}
  .reaction-cell svg{width:100%;height:100%;pointer-events:none;}
  .reaction-count{text-align:center;font-size:11px;color:var(--ink-dim);padding:6px 0 2px;flex-shrink:0;}
  
  @media(min-width:700px){ .reaction-grid{grid-template-columns:repeat(8,1fr);} }

  /* Sent reactions in chat — lighter than a text bubble, no background box,
     play once on arrival and hold, replay on tap */
  .bubble.reaction-bubble{background:none;padding:0;box-shadow:none;font-size:64px;line-height:1;animation:reactionPop .3s cubic-bezier(.34,1.56,.64,1);}
  @keyframes reactionPop{0%{transform:scale(.4);opacity:0;}100%{transform:scale(1);opacity:1;}}

  .quick-sticker-row{display:flex;gap:6px;overflow-x:auto;padding:2px 0 10px;scrollbar-width:none;}
  .quick-sticker-row::-webkit-scrollbar{display:none;}
  .quick-sticker-row button{flex:none;background:var(--bg-panel);border:1px solid var(--line);border-radius:100px;padding:6px 12px;font-size:12.5px;color:var(--ink);cursor:pointer;white-space:nowrap;transition:.15s;}
  .quick-sticker-row button:hover{border-color:var(--primary-dim);background:var(--bg-panel-2);transform:translateY(-1px);}
  .attach-song-item{padding:10px 12px;border-radius:10px;background:var(--bg-panel);border:1px solid var(--line);margin-bottom:8px;cursor:pointer;}
  .attach-song-item:hover{border-color:var(--primary-dim);}
  .chat-input-row{display:flex;gap:8px;flex-shrink:0;position:sticky;bottom:0;background:var(--bg-deep);padding-top:8px;align-items:flex-end;z-index:2;}
  .chat-input-row input{flex:1;}
  .chat-input-row textarea{flex:1;resize:none;overflow-y:auto;max-height:120px;line-height:1.4;font-family:inherit;font-size:inherit;background:var(--bg-panel);border:1px solid var(--line);border-radius:14px;padding:11px 14px;color:var(--ink);}

  /* Composer toolbar — simple, always-visible icon row. Previously a
     single "+" trigger that fanned four icons out radially; user-testing
     feedback was explicit that hiding these behind a trigger was the
     single biggest UX issue in the chat screen, and the fan-out geometry
     had also been a repeat source of overlap bugs across several rounds.
     This is a straightforward reversion to always-visible icons. */
  .composer-toolbar{display:flex;gap:4px;flex-shrink:0;}
  .chat-input-row .composer-icon-btn{width:30px;height:30px;padding:0;border-radius:50%;border:none;background:var(--bg-panel);color:var(--ink-dim);font-size:13px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .15s, background .15s;flex-shrink:0;}
  .chat-input-row .composer-icon-btn:hover{transform:scale(1.08);}
  .chat-input-row .composer-icon-btn:active{transform:scale(.94);}
  .chat-input-row textarea:focus{outline:none;border-color:var(--primary);}
  .chat-input-row button{width:auto;padding:12px 18px;}
  #userMicBtn.recording{background:linear-gradient(155deg, var(--rose), #b56a86);animation:userMicPulse 1s ease-in-out infinite;}
  @keyframes userMicPulse{0%,100%{box-shadow:0 0 0 0 rgba(217,139,166,.5);}50%{box-shadow:0 0 0 10px rgba(217,139,166,0);}}
  .chat-head-btn{background:var(--bg-panel);border:1px solid var(--line);border-radius:100px;width:38px;height:38px;font-size:16px;cursor:pointer;flex-shrink:0;}
  .chat-head-btn.call-btn{width:auto;padding:0 12px;display:flex;align-items:center;gap:5px;font-size:12px;font-weight:600;color:var(--ink);white-space:nowrap;}
  .chat-head-btn.call-btn.low-time{border-color:var(--rose);color:var(--rose);}

  /* ---------------- Call screen — payphone (prepaid minutes + live call, see calls.js / liveCall.js) ---------------- */
  .call-head{display:flex;align-items:center;gap:12px;margin-bottom:6px;}
  .call-screen-body{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;}
  .call-status-text{font-size:14px;color:var(--ink-dim);}
  .call-timer-big{font-family:var(--serif);font-size:28px;color:var(--ink);}
  .call-timer-big.low-time{color:var(--rose);}
  .call-buy-time{margin-top:6px;}
  .call-buy-time-panel{display:none;flex-direction:column;align-items:center;gap:12px;margin-top:6px;padding:16px;border-radius:16px;background:var(--bg-panel);border:1px solid var(--line);}
  .call-buy-time-panel.open{display:flex;}
  .call-buy-time-mock-note{font-size:10.5px;color:var(--ink-dim);opacity:.7;max-width:260px;}
  .call-pack-row{display:flex;gap:8px;}
  .call-pack{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;min-width:64px;padding:10px 8px;border-radius:12px;border:1px solid var(--line);background:var(--bg-panel-2);color:var(--ink-dim);font-size:13px;font-weight:600;cursor:pointer;transition:.15s;}
  .call-pack span{font-size:11px;font-weight:500;opacity:.8;}
  .call-pack.on{background:linear-gradient(155deg, var(--primary-light), var(--primary));border-color:var(--primary);color:var(--primary-ink);}
  .call-video-soon{margin-top:4px;font-size:11.5px;color:var(--ink-dim);opacity:.55;border:1px dashed var(--line);border-radius:10px;padding:7px 12px;}
  .payphone-pill{margin-left:5px;font-size:10px;font-weight:700;background:rgba(255,255,255,.22);border-radius:6px;padding:1px 5px;}
  /* payphoneBtn intentionally stays fixed-width now — no balance pill grows it into videoCallBtn's space (see renderPayphone()). */
  /* Active call screen */
  #inCallScreen{background:radial-gradient(120% 90% at 50% 0%, var(--bg-panel) 0%, var(--bg-deep) 70%);}
  .incall-body{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;}
  .incall-photo{width:128px;height:128px;border-radius:50%;object-fit:cover;border:2px solid var(--line);background:var(--bg-panel-2);}
  .incall-name{font-family:var(--serif);font-size:22px;color:var(--ink);}
  .incall-status{font-size:13px;color:var(--ink-dim);letter-spacing:.02em;}
  .incall-timer{font-family:var(--serif);font-size:32px;color:var(--ink);}
  .incall-timer.low-time{color:var(--rose);}
  .incall-controls{display:flex;gap:12px;margin-top:10px;}
  .incall-btn{width:auto;padding:12px 22px;border-radius:26px;border:1px solid var(--line);background:var(--bg-panel-2);color:var(--ink);font-size:14px;font-weight:600;cursor:pointer;}
  .incall-btn.muted{background:linear-gradient(155deg, var(--primary-light), var(--primary));border-color:var(--primary);color:var(--primary-ink);}
  .incall-btn.incall-primary{background:linear-gradient(155deg, var(--primary-light), var(--primary));border-color:var(--primary);color:var(--primary-ink);}
  .incall-hangup{background:linear-gradient(155deg,#e0607f,#b8324f);border-color:#b8324f;color:#fff;}
  .incall-note{font-size:11.5px;color:var(--ink-dim);opacity:.8;max-width:260px;min-height:1em;}
  /* Full-screen avatar video — added so a Therapist video call fills the
     screen like a real video call, instead of the small 128px circle used
     for the static photo / audio calls. Toggled via #inCallScreen.video-active
     (see beginLiveCall()'s TrackSubscribed/TrackUnsubscribed handlers). */
  #inCallScreen.video-active #inCallVideo{position:absolute;inset:0;width:100%;height:100%;max-width:none;border-radius:0;border:none;object-fit:cover;z-index:0;}
  #inCallScreen.video-active .incall-body{position:relative;z-index:1;justify-content:flex-end;padding-bottom:36px;background:linear-gradient(to bottom, rgba(6,7,20,0) 0%, rgba(6,7,20,.22) 55%, rgba(6,7,20,.88) 100%);}
  .chat-head-btn:first-of-type{margin-left:auto;}
  .doodle-canvas{width:100%;aspect-ratio:1;background:var(--bg-panel);border-radius:16px;border:1px solid var(--line);touch-action:none;display:block;}
  .doodle-controls{display:flex;gap:10px;margin-top:12px;}

  .navbar{position:absolute;bottom:0;left:0;right:0;background:rgba(18,20,42,0.92);backdrop-filter:blur(6px);border-top:1px solid var(--line);display:flex;padding:10px 10px 16px;gap:6px;transition:opacity 0.3s ease;}
  .phone:has(#splash.active) .navbar{opacity:0;pointer-events:none;}
  .navbar button{flex:1;background:none;border:none;color:var(--ink-dim);font-family:var(--sans);font-size:10.5px;padding:6px 2px;cursor:pointer;border-radius:10px;}
  .navbar button.active{color:var(--primary);background:var(--bg-panel-2);}

  .plan{display:flex;justify-content:space-between;align-items:center;padding:14px 0;border-bottom:1px solid var(--line);}
  .tier-option{cursor:pointer;border-radius:12px;padding-left:10px;padding-right:10px;margin:0 -10px;transition:background .15s;}
  .tier-option:hover{background:rgba(140,158,255,0.06);}
  .tier-option.on{background:rgba(140,158,255,0.1);}
  .tier-option.on h4{color:var(--primary);}
  .provider-select{margin:14px 0;}
  .provider-select-label{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-dim);margin-bottom:8px;}
  .provider-options{display:flex;gap:8px;}
  .provider-btn{flex:1;display:flex;flex-direction:column;align-items:center;gap:5px;background:var(--bg-panel);border:1px solid var(--line);border-radius:10px;padding:10px 6px;font-size:12px;color:var(--ink-dim);cursor:pointer;transition:.15s;}
  .provider-badge{width:20px;height:20px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;color:#fff;font-family:var(--sans);}
  .provider-btn.on{background:linear-gradient(155deg, var(--primary-light), var(--primary));border-color:var(--primary);color:var(--primary-ink);font-weight:600;}
  .coupon-field{margin:14px 0;}
  .coupon-field input{width:100%;background:var(--bg-panel);border:1px solid var(--line);border-radius:10px;padding:12px 14px;color:var(--ink);font-size:13.5px;font-family:var(--sans);outline:none;text-transform:uppercase;transition:border-color .15s;}
  .coupon-field input:focus{border-color:var(--primary);}
  .coupon-field input::placeholder{text-transform:none;color:var(--ink-dim);}
  .plan:last-child{border-bottom:none;}
  .plan h4{margin:0 0 2px;font-family:var(--serif);font-weight:500;font-size:15px;}
  .plan span{font-size:12px;color:var(--ink-dim);}
  .price{font-family:var(--serif);font-size:17px;}

  .note-box{background:var(--bg-panel);border:1px solid var(--line);border-radius:14px;padding:14px;font-size:12.5px;color:var(--ink-dim);line-height:1.5;margin-top:16px;}
  .note-box b{color:var(--ink);}

  /* ---------------- theme studio: velvet (default) / moonlight / pearl ---------------- */
  .theme-studio{position:relative;display:flex;align-items:center;}
  .theme-toggle{width:26px;height:26px;border-radius:50%;border:1px solid rgba(255,255,255,.13);background:rgba(18,18,23,.6);color:var(--ink);font-size:12px;cursor:pointer;transition:transform .3s cubic-bezier(.34,1.56,.64,1);}
  .theme-toggle:hover{transform:rotate(20deg) scale(1.1)}
  .theme-menu{position:absolute;top:calc(100% + 8px);left:50%;display:flex;gap:7px;padding:6px;border:1px solid rgba(255,255,255,.11);border-radius:99px;background:rgba(18,18,23,.9);backdrop-filter:blur(22px);opacity:0;transform:translateX(-50%) translateY(-6px) scale(.9);pointer-events:none;transition:.28s cubic-bezier(.16,1,.3,1);z-index:35;max-width:min(320px,88vw);overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
  .theme-menu::-webkit-scrollbar{display:none;}
  .theme-option{flex-shrink:0;}
  .theme-studio.open .theme-menu{opacity:1;transform:translateX(-50%) translateY(0) scale(1);pointer-events:auto;}
  .theme-option{width:30px;height:30px;border:0;border-radius:50%;cursor:pointer;box-shadow:inset 0 0 0 1px rgba(255,255,255,.24);transition:transform .25s;position:relative;}
  .theme-option:hover,.theme-option.active{transform:scale(1.16)}
  .theme-option.active::after{content:'✓';position:absolute;inset:0;display:grid;place-items:center;color:white;font-size:11px;text-shadow:0 1px 4px #000;}
  .theme-option.velvet{background:linear-gradient(135deg,#B4C0FF,#8C9EFF)}
  .theme-option.moonlight{background:linear-gradient(135deg,#8deaff,#384a98)}
  .theme-option.pearl{background:linear-gradient(135deg,#fffaf0,#e59b75)}
  .theme-option.anime{background:linear-gradient(135deg,#ff8fc4,#4fd8ff)}
  .theme-option.sakura{background:linear-gradient(135deg,#ffd4e8,#e8b4e0)}
  .theme-option.ocean{background:linear-gradient(135deg,#7fe0ff,#4dc9ff)}
  .theme-option.ninja{background:linear-gradient(135deg,#f0855a,#e8623c)}
  .theme-option.shinobi{background:linear-gradient(135deg,#c0a0f0,#a888e8)}
  .theme-option.midnight{background:linear-gradient(135deg,#f0dca0,#e8c874)}
  .theme-option.garden{background:linear-gradient(135deg,#b4e8a0,#9ed88f)}
  .theme-option.samurai{background:linear-gradient(135deg,#f06060,#e83c3c)}
  .theme-option.forest{background:linear-gradient(135deg,#7ad498,#5cc884)}
  .theme-option.desert{background:linear-gradient(135deg,#f0c070,#e8a84c)}
  .theme-option.lightning{background:linear-gradient(135deg,#90b4ff,#6c9cff)}
  .theme-option.halloween{background:linear-gradient(135deg,#f0a868,#e8853c)}
  .theme-option.dream{background:linear-gradient(135deg,#b0a0d0,#9888b8)}
  .theme-option.dragon{background:linear-gradient(135deg,#d4b0f0,#9858d8)}
  .theme-option.ghost{background:linear-gradient(135deg,#f5d0e4,#f0b0d0)}
  .theme-option.songbird{background:linear-gradient(135deg,#a8d0f5,#4d8ce0)}
  .theme-option.bat{background:linear-gradient(135deg,#c9b0e8,#8a68b8)}
  .theme-option.lanternfox{background:linear-gradient(135deg,#f0c880,#f0a858)}
  .theme-option.seaserpent{background:linear-gradient(135deg,#7fd4e8,#28a8c4)}
  .theme-option.frog{background:linear-gradient(135deg,#a8e898,#6cc85c)}
  .theme-option.redpanda{background:linear-gradient(135deg,#f0a878,#d8622c)}
  .theme-option.cloudspirit{background:linear-gradient(135deg,#c8d4f0,#a8b8e0)}
  .theme-option.car{background:linear-gradient(135deg,#f0b878,#e8853c)}
  .theme-option.meadow{background:linear-gradient(135deg,#b4e8c4,#8ec5e8)}

  /* Moonlight Glass — cool, immersive, slightly futuristic */
  html[data-theme="moonlight"]{--bg-deep:#07111e;--bg-panel:rgba(15,31,51,.7);--bg-panel-2:rgba(25,48,76,.72);--ink:#edfaff;--ink-dim:#8ea8b9;--primary:#a5f0ff;--primary-dim:#6298b1;--primary-ink:#04151b;--rose:#bcabff;--friend-accent:#99f4da;--line:rgba(160,225,255,.13);}
  html[data-theme="moonlight"] body{background:radial-gradient(circle at 50% -5%,rgba(47,133,177,.34),transparent 34%),radial-gradient(circle at 5% 88%,rgba(101,70,183,.21),transparent 31%),#030912;}
  html[data-theme="moonlight"] .phone{background:linear-gradient(155deg,rgba(7,19,34,.96),rgba(5,11,23,.98));border-color:rgba(145,224,255,.22);box-shadow:0 45px 120px rgba(0,0,0,.68),inset 0 1px rgba(190,235,255,.12);}
  html[data-theme="moonlight"] .card{background:linear-gradient(145deg,rgba(124,211,247,.095),rgba(95,92,189,.055));box-shadow:inset 0 1px rgba(255,255,255,.06),0 18px 44px rgba(0,0,0,.2);backdrop-filter:blur(18px)}
  html[data-theme="moonlight"] .btn{background:linear-gradient(135deg,#a7f1ff,#6ed3f1);box-shadow:0 10px 32px rgba(86,205,235,.22)}
  html[data-theme="moonlight"] .chip.on{background:#a7f1ff;border-color:#a7f1ff;color:#04151b}
  html[data-theme="moonlight"] .eyebrow{color:#8cecff}
  html[data-theme="moonlight"] .bubble.me{background:linear-gradient(135deg,#277ba0,#315e94)}
  html[data-theme="moonlight"] .navbar{background:rgba(4,12,23,.88)}
  html[data-theme="moonlight"] .theme-toggle,html[data-theme="moonlight"] .theme-menu{background:rgba(7,17,30,.82);}
  html[data-theme="moonlight"] .particle.p1,html[data-theme="moonlight"] .particle.p4{background:radial-gradient(circle,#c8f5ff,transparent 70%);}
  html[data-theme="moonlight"] .particle.p2,html[data-theme="moonlight"] .particle.p5{background:radial-gradient(circle,#b3a3ff,transparent 70%);}
  html[data-theme="moonlight"] .particle.p3,html[data-theme="moonlight"] .particle.p6{background:radial-gradient(circle,#7cf1d0,transparent 70%);}

  /* Pearl — bright, editorial, intimate and airy */
  html[data-theme="pearl"]{--bg-deep:#f7f1e8;--bg-panel:#fffaf3;--bg-panel-2:#f3e8dc;--ink:#302927;--ink-dim:#7f736d;--primary:#e6ad93;--primary-dim:#cb8f7e;--primary-ink:#2b1710;--rose:#e19b9e;--friend-accent:#8fb9ad;--line:rgba(80,55,45,.11);}
  html[data-theme="pearl"] body{background:radial-gradient(circle at 50% -10%,rgba(238,164,130,.38),transparent 36%),radial-gradient(circle at 5% 92%,rgba(111,165,150,.15),transparent 30%),#e9ddd0;}
  html[data-theme="pearl"] .phone{background:linear-gradient(155deg,#fffaf3,#f4eadf);border-color:rgba(71,45,37,.12);box-shadow:0 45px 100px rgba(65,39,28,.22),inset 0 1px white;}
  html[data-theme="pearl"] .card{background:rgba(255,255,255,.58);box-shadow:0 14px 36px rgba(84,51,38,.08);backdrop-filter:blur(10px);}
  html[data-theme="pearl"] .btn{background:linear-gradient(135deg,#efb092,#df8d6e);box-shadow:0 10px 28px rgba(191,108,74,.2)}
  html[data-theme="pearl"] .btn.ghost,html[data-theme="pearl"] .chip,html[data-theme="pearl"] input[type=text],html[data-theme="pearl"] input[type=password]{background:rgba(255,255,255,.48);color:var(--ink)}
  html[data-theme="pearl"] .chip.on{background:#e79d7b;border-color:#e79d7b;color:#29160f}
  html[data-theme="pearl"] .eyebrow{color:#bd684e}
  html[data-theme="pearl"] .bubble.them{background:#fffaf4;box-shadow:0 6px 18px rgba(84,51,38,.07)}
  html[data-theme="pearl"] .bubble.me{background:linear-gradient(135deg,#d88065,#b96255)}
  html[data-theme="pearl"] .navbar{background:rgba(247,241,232,.9)}
  html[data-theme="pearl"] .navbar button{color:#92847d}
  html[data-theme="pearl"] .navbar button.active{color:#b85e48;background:rgba(210,118,87,.1)}
  html[data-theme="pearl"] .theme-toggle,html[data-theme="pearl"] .theme-menu{background:rgba(255,250,243,.82);border-color:rgba(75,48,38,.12);color:#3d302c}
  html[data-theme="pearl"] .empty-hint{color:#8c7b73}
  html[data-theme="pearl"] .particle{background:radial-gradient(circle,#df9675,transparent 70%) !important;opacity:0.3;}

  /* Anime — vivid, high-energy, magical-girl-inspired: hot magenta against
     electric cyan, deeper contrast than the other themes on purpose */
  html[data-theme="anime"]{--bg-deep:#150d2e;--bg-panel:rgba(45,20,64,.72);--bg-panel-2:rgba(64,26,90,.74);--ink:#fdf3ff;--ink-dim:#c79fe0;--primary:#ff82bb;--primary-dim:#c16894;--primary-ink:#2b0a1c;--rose:#76e1ff;--friend-accent:#9af5d4;--line:rgba(255,140,200,.18);}
  html[data-theme="anime"] body{background:radial-gradient(circle at 50% -8%,rgba(255,95,168,.32),transparent 38%),radial-gradient(circle at 8% 90%,rgba(79,216,255,.22),transparent 32%),#0c0720;}
  html[data-theme="anime"] .phone{background:linear-gradient(155deg,#1c1033,#100a24);border-color:rgba(255,140,200,.22);box-shadow:0 45px 110px rgba(0,0,0,.65),inset 0 1px rgba(255,180,220,.15);}
  html[data-theme="anime"] .card{background:linear-gradient(145deg,rgba(255,95,168,.12),rgba(79,216,255,.07));box-shadow:inset 0 1px rgba(255,255,255,.08),0 16px 40px rgba(0,0,0,.28);backdrop-filter:blur(16px);}
  html[data-theme="anime"] .btn{background:linear-gradient(135deg,#ff8fc4,#ff5fa8);box-shadow:0 10px 30px rgba(255,95,168,.35)}
  html[data-theme="anime"] .chip.on{background:linear-gradient(135deg,#7ef2ff,#4fd8ff);border-color:#4fd8ff;color:#0c2a33}
  html[data-theme="anime"] .eyebrow{color:#ff5fa8}
  html[data-theme="anime"] .bubble.me{background:linear-gradient(135deg,#c93d80,#8b2f66)}
  html[data-theme="anime"] .bubble.them{background:rgba(64,26,90,.55);box-shadow:0 6px 18px rgba(0,0,0,.2)}
  html[data-theme="anime"] .navbar{background:rgba(21,13,46,.9)}
  html[data-theme="anime"] .navbar button.active{color:#ff8fc4}
  html[data-theme="anime"] .theme-toggle,html[data-theme="anime"] .theme-menu{background:rgba(28,16,51,.85);border-color:rgba(255,140,200,.2)}
  html[data-theme="anime"] .particle.p1,html[data-theme="anime"] .particle.p4{background:radial-gradient(circle,#ff9fd0,transparent 70%);}
  html[data-theme="anime"] .particle.p2,html[data-theme="anime"] .particle.p5{background:radial-gradient(circle,#7ef2ff,transparent 70%);}
  html[data-theme="anime"] .particle.p3,html[data-theme="anime"] .particle.p6{background:radial-gradient(circle,#c9a8ff,transparent 70%);}

  /* Sakura — soft, romantic, pastel pink; cherry-blossom cozy rather than
     Anime's high-contrast energy — same anime-adjacent DNA, opposite mood */
  html[data-theme="sakura"]{--bg-deep:#2b161e;--bg-panel:rgba(58,28,38,.7);--bg-panel-2:rgba(74,36,48,.72);--ink:#fdf1f4;--ink-dim:#d9a8b8;--primary:#f8bbd1;--primary-dim:#d597ac;--primary-ink:#3a1420;--rose:#edc4e7;--friend-accent:#d5bbed;--line:rgba(246,168,196,.16);}
  html[data-theme="sakura"] body{background:radial-gradient(circle at 50% -8%,rgba(246,168,196,.28),transparent 38%),radial-gradient(circle at 8% 90%,rgba(201,168,232,.18),transparent 32%),#1c0f15;}
  html[data-theme="sakura"] .phone{background:linear-gradient(155deg,#331a23,#201117);border-color:rgba(246,168,196,.2);box-shadow:0 45px 110px rgba(0,0,0,.6),inset 0 1px rgba(255,220,230,.12);}
  html[data-theme="sakura"] .card{background:linear-gradient(145deg,rgba(246,168,196,.12),rgba(201,168,232,.07));box-shadow:inset 0 1px rgba(255,255,255,.07),0 14px 36px rgba(0,0,0,.22);backdrop-filter:blur(14px);}
  html[data-theme="sakura"] .btn{background:linear-gradient(135deg,#ffc4dc,#f6a8c4);box-shadow:0 10px 26px rgba(246,168,196,.3)}
  html[data-theme="sakura"] .chip.on{background:linear-gradient(135deg,#f0c4ec,#e8b4e0);border-color:#e8b4e0;color:#3a1420}
  html[data-theme="sakura"] .eyebrow{color:#f6a8c4}
  html[data-theme="sakura"] .bubble.me{background:linear-gradient(135deg,#d97fa0,#a85c78)}
  html[data-theme="sakura"] .bubble.them{background:rgba(74,36,48,.55)}
  html[data-theme="sakura"] .navbar{background:rgba(43,22,30,.9)}
  html[data-theme="sakura"] .navbar button.active{color:#f6a8c4}
  html[data-theme="sakura"] .theme-toggle,html[data-theme="sakura"] .theme-menu{background:rgba(51,26,35,.85);border-color:rgba(246,168,196,.18)}
  html[data-theme="sakura"] .particle{background:radial-gradient(circle,#ffd4e8,transparent 70%) !important;opacity:.4;}
  html[data-theme="ocean"]{--bg-deep:#08222f;--bg-panel:rgba(14,45,61,.7);--bg-panel-2:rgba(19,58,79,.72);--ink:#eaf7fb;--ink-dim:#8fc9dd;--primary:#74d5ff;--primary-dim:#5dadd1;--primary-ink:#022538;--rose:#9be7dd;--friend-accent:#80c8ed;--line:rgba(77,201,255,.16);}
  html[data-theme="ocean"] body{background:radial-gradient(circle at 50% -8%,rgba(77,201,255,.22),transparent 40%),radial-gradient(circle at 8% 90%,rgba(127,224,212,.14),transparent 34%),#051620;}
  html[data-theme="ocean"] .phone{background:linear-gradient(155deg,#0d2b3d,#061a25);border-color:rgba(77,201,255,.2);box-shadow:0 45px 110px rgba(0,0,0,.6),inset 0 1px rgba(200,240,255,.1);}
  html[data-theme="ocean"] .card{background:linear-gradient(145deg,rgba(77,201,255,.1),rgba(127,224,212,.06));box-shadow:inset 0 1px rgba(255,255,255,.06),0 14px 36px rgba(0,0,0,.24);backdrop-filter:blur(14px);}
  html[data-theme="ocean"] .btn{background:linear-gradient(135deg,#7fe0ff,#4dc9ff);box-shadow:0 10px 26px rgba(77,201,255,.28)}
  html[data-theme="ocean"] .chip.on{background:linear-gradient(135deg,#8ce8dc,#7fe0d4);border-color:#7fe0d4;color:#022538}
  html[data-theme="ocean"] .eyebrow{color:#4dc9ff}
  html[data-theme="ocean"] .bubble.me{background:linear-gradient(135deg,#2f96c4,#1e6b8f)}
  html[data-theme="ocean"] .bubble.them{background:rgba(19,58,79,.55)}
  html[data-theme="ocean"] .navbar{background:rgba(8,34,47,.9)}
  html[data-theme="ocean"] .navbar button.active{color:#4dc9ff}
  html[data-theme="ocean"] .theme-toggle,html[data-theme="ocean"] .theme-menu{background:rgba(13,43,61,.85);border-color:rgba(77,201,255,.18)}
  html[data-theme="ocean"] .particle{background:radial-gradient(circle,#a8e8ff,transparent 70%) !important;opacity:.4;}

  @keyframes particleDrift{0%{opacity:0;transform:translateY(0);}25%{opacity:1;}100%{opacity:0;transform:translateY(-10px);}}

  html[data-theme="ocean"] .bubble.them{margin-top:22px;}
  html[data-theme="ocean"] .bubble.them::before{content:'';position:absolute;top:-24px;left:8px;width:38px;height:34px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%22-3%2030%2022%3B3%2030%2022%3B-3%2030%2022%22%20dur%3D%223.4s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M8%2030C8%2015%2017%206%2030%206s22%209%2022%2024%22%20fill%3D%22%238ce8dc%22%20stroke%3D%22%234dc9ff%22%20stroke-width%3D%222%22/%3E%3Cellipse%20cx%3D%2223%22%20cy%3D%2222%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%23022538%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Cellipse%20cx%3D%2237%22%20cy%3D%2222%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%23022538%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Cpath%20d%3D%22M24%2028c2%202.4%2010%202.4%2012%200%22%20stroke%3D%22%23022538%22%20stroke-width%3D%222%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%3C/g%3E%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%220%2014%2030%3B6%2014%2030%3B0%2014%2030%3B-6%2014%2030%3B0%2014%2030%22%20dur%3D%222.4s%22%20begin%3D%220s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M14%2030c0%208-3%2012-2%2020%22%20stroke%3D%22%234dc9ff%22%20stroke-width%3D%223%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%3C/g%3E%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%220%2024%2030%3B6%2024%2030%3B0%2024%2030%3B-6%2024%2030%3B0%2024%2030%22%20dur%3D%222.4s%22%20begin%3D%220.2s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M24%2030c0%209-2%2013%200%2022%22%20stroke%3D%22%234dc9ff%22%20stroke-width%3D%223%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%3C/g%3E%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%220%2036%2030%3B6%2036%2030%3B0%2036%2030%3B-6%2036%2030%3B0%2036%2030%22%20dur%3D%222.4s%22%20begin%3D%220.4s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M36%2030c0%209%202%2013%200%2022%22%20stroke%3D%22%234dc9ff%22%20stroke-width%3D%223%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%3C/g%3E%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%220%2046%2030%3B6%2046%2030%3B0%2046%2030%3B-6%2046%2030%3B0%2046%2030%22%20dur%3D%222.4s%22%20begin%3D%220.6s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M46%2030c0%208%203%2012%202%2020%22%20stroke%3D%22%234dc9ff%22%20stroke-width%3D%223%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;}
  html[data-theme="ocean"] .bubble.them + .bubble.them{margin-top:10px;}
  html[data-theme="ocean"] .bubble.them + .bubble.them::before{display:none;}
  html[data-theme="ocean"] .bubble.me::after,html[data-theme="ocean"] .bubble.them::after{content:'';position:absolute;bottom:-8px;left:14px;width:34px;height:17px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2040%2020%22%3E%3Cpath%20d%3D%22M2%2012c3-5%206-5%209%200s6%205%209%200s6-5%209%200%22%20stroke%3D%22%2374d5ff%22%20stroke-width%3D%221.8%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%20opacity%3D%220.6%22/%3E%3Ccircle%20cx%3D%2234%22%20cy%3D%226%22%20r%3D%221.4%22%20fill%3D%22%239be7dd%22%20opacity%3D%220.5%22/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;animation:particleDrift 3.2s ease-in-out infinite;}
  html[data-theme="ocean"] .bubble.me::after{right:14px;left:auto;}

  html[data-theme="ninja"] .bubble.them{margin-top:22px;}
  html[data-theme="ninja"] .bubble.them::before{content:'';position:absolute;top:-24px;left:8px;width:38px;height:34px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%0A%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%22-6%2012%2032%3B6%2012%2032%3B-6%2012%2032%22%20dur%3D%223s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M4%2048c-2-10%204-20%2014-18-6%204-8%2010-6%2016%204-6%2010-8%2014-4-8%202-14%208-14%2014-4-2-7-5-8-8Z%22%20fill%3D%22%23e8623c%22/%3E%3Cpath%20d%3D%22M2%2050c1-8%206-14%2012-14%22%20stroke%3D%22%23fbd7bc%22%20stroke-width%3D%222%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%3C/g%3E%0A%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%22-3%2030%2028%3B3%2030%2028%3B-3%2030%2028%22%20dur%3D%223.4s%22%20repeatCount%3D%22indefinite%22/%3E%0A%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%220%2013%2022%3B8%2013%2022%3B0%2013%2022%3B-8%2013%2022%3B0%2013%2022%22%20dur%3D%222.6s%22%20begin%3D%220s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M13%2022%20L4%207%20L21%2015%20Z%22%20fill%3D%22%23e8623c%22/%3E%3C/g%3E%0A%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%220%2047%2022%3B8%2047%2022%3B0%2047%2022%3B-8%2047%2022%3B0%2047%2022%22%20dur%3D%222.6s%22%20begin%3D%220.3s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M47%2022%20L56%207%20L39%2015%20Z%22%20fill%3D%22%23e8623c%22/%3E%3C/g%3E%0A%3Cpath%20d%3D%22M10%2026C10%2015%2018%209%2030%209s20%206%2020%2017c0%2011-9%2018-20%2018s-20-7-20-18Z%22%20fill%3D%22%23f0825a%22/%3E%0A%3Cpath%20d%3D%22M30%2026C22%2026%2017%2031%2017%2038c0%205%206%208%2013%208s13-3%2013-8c0-7-5-12-13-12Z%22%20fill%3D%22%23fbd7bc%22/%3E%0A%3Cellipse%20cx%3D%2223%22%20cy%3D%2227%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%231a0805%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%0A%3Cellipse%20cx%3D%2237%22%20cy%3D%2227%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%231a0805%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%0A%3Cpath%20d%3D%22M28%2034l2%202%202-2%22%20fill%3D%22%23c96a3a%22/%3E%0A%3Cpath%20d%3D%22M27%2039c1.4%201.6%204.6%201.6%206%200%22%20stroke%3D%22%231a0805%22%20stroke-width%3D%222%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%0A%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;}
  html[data-theme="ninja"] .bubble.them + .bubble.them{margin-top:10px;}
  html[data-theme="ninja"] .bubble.them + .bubble.them::before{display:none;}
  html[data-theme="ninja"] .bubble.me::after,html[data-theme="ninja"] .bubble.them::after{content:'';position:absolute;bottom:-8px;left:14px;width:34px;height:17px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2040%2020%22%3E%3Ccircle%20cx%3D%226%22%20cy%3D%2213%22%20r%3D%222.2%22%20fill%3D%22%23f0a688%22%20opacity%3D%220.55%22/%3E%3Ccircle%20cx%3D%2216%22%20cy%3D%227%22%20r%3D%221.5%22%20fill%3D%22%23f5d4bc%22%20opacity%3D%220.5%22/%3E%3Ccircle%20cx%3D%2226%22%20cy%3D%2213%22%20r%3D%222%22%20fill%3D%22%23ecaf7d%22%20opacity%3D%220.45%22/%3E%3Ccircle%20cx%3D%2234%22%20cy%3D%228%22%20r%3D%221.3%22%20fill%3D%22%23fbe0a0%22%20opacity%3D%220.5%22/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;animation:particleDrift 3.2s ease-in-out infinite;}
  html[data-theme="ninja"] .bubble.me::after{right:14px;left:auto;}

  html[data-theme="shinobi"] .bubble.them{margin-top:22px;}
  html[data-theme="shinobi"] .bubble.them::before{content:'';position:absolute;top:-24px;left:8px;width:38px;height:34px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%3Cpath%20d%3D%22M10%2020C10%2010%2018%205%2030%205s20%205%2020%2015v20c0%206-9%2010-20%2010s-20-4-20-10Z%22%20fill%3D%22%234a3a6a%22/%3E%3Cpath%20d%3D%22M8%2026h44v9c0%202-2%203-4%203H12c-2%200-4-1-4-3Z%22%20fill%3D%22%23241c38%22/%3E%3Ccircle%20cx%3D%2223%22%20cy%3D%2230%22%20r%3D%222.8%22%20fill%3D%22%23c9b8ff%22/%3E%3Ccircle%20cx%3D%2237%22%20cy%3D%2230%22%20r%3D%222.8%22%20fill%3D%22%23c9b8ff%22/%3E%3Cpath%20d%3D%22M5%2014l8%204M55%2014l-8%204%22%20stroke%3D%22%234a3a6a%22%20stroke-width%3D%223%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;}
  html[data-theme="shinobi"] .bubble.them + .bubble.them{margin-top:10px;}
  html[data-theme="shinobi"] .bubble.them + .bubble.them::before{display:none;}
  html[data-theme="shinobi"] .bubble.me::after,html[data-theme="shinobi"] .bubble.them::after{content:'';position:absolute;bottom:-8px;left:14px;width:34px;height:17px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2040%2020%22%3E%3Ccircle%20cx%3D%226%22%20cy%3D%2213%22%20r%3D%222.2%22%20fill%3D%22%23d4c8f0%22%20opacity%3D%220.55%22/%3E%3Ccircle%20cx%3D%2216%22%20cy%3D%227%22%20r%3D%221.5%22%20fill%3D%22%23e5d8ff%22%20opacity%3D%220.5%22/%3E%3Ccircle%20cx%3D%2226%22%20cy%3D%2213%22%20r%3D%222%22%20fill%3D%22%23c9b8ff%22%20opacity%3D%220.45%22/%3E%3Ccircle%20cx%3D%2234%22%20cy%3D%228%22%20r%3D%221.3%22%20fill%3D%22%23e0d4ff%22%20opacity%3D%220.5%22/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;animation:particleDrift 3.2s ease-in-out infinite;}
  html[data-theme="shinobi"] .bubble.me::after{right:14px;left:auto;}

  

  html[data-theme="halloween"]{--bg-deep:#160a1c;--bg-panel:rgba(42,24,54,.7);--bg-panel-2:rgba(54,30,68,.72);--ink:#f5ecf7;--ink-dim:#c4a8d0;--primary:#eda067;--primary-dim:#c88550;--primary-ink:#2a1206;--rose:#d4a5ed;--friend-accent:#bba2ed;--line:rgba(232,133,60,.18);}
  html[data-theme="halloween"] body{background:radial-gradient(circle at 50% -8%,rgba(232,133,60,.2),transparent 40%),radial-gradient(circle at 8% 90%,rgba(168,136,232,.13),transparent 34%),#0e0714;}
  html[data-theme="halloween"] .phone{background:linear-gradient(155deg,#2a1836,#160a1c);border-color:rgba(232,133,60,.2);box-shadow:0 45px 110px rgba(0,0,0,.6),inset 0 1px rgba(232,180,255,.08);}
  html[data-theme="halloween"] .card{background:linear-gradient(145deg,rgba(232,133,60,.09),rgba(168,136,232,.06));box-shadow:inset 0 1px rgba(255,255,255,.05),0 14px 36px rgba(0,0,0,.26);backdrop-filter:blur(14px);}
  html[data-theme="halloween"] .btn{background:linear-gradient(135deg,#f0a868,#e8853c);box-shadow:0 10px 26px rgba(232,133,60,.28)}
  html[data-theme="halloween"] .chip.on{background:linear-gradient(135deg,#d8b0f0,#a888e8);border-color:#a888e8;color:#2a1206}
  html[data-theme="halloween"] .eyebrow{color:#e8853c}
  html[data-theme="halloween"] .bubble.me{background:linear-gradient(135deg,#b8621f,#8a4a15)}
  html[data-theme="halloween"] .bubble.them{background:rgba(54,30,68,.55);margin-top:22px;}
  html[data-theme="halloween"] .navbar{background:rgba(22,10,28,.9)}
  html[data-theme="halloween"] .navbar button.active{color:#e8853c}
  html[data-theme="halloween"] .theme-toggle,html[data-theme="halloween"] .theme-menu{background:rgba(42,24,54,.85);border-color:rgba(232,133,60,.18)}
  html[data-theme="halloween"] .particle{background:radial-gradient(circle,#d8b0f0,transparent 70%) !important;opacity:.35;}
  html[data-theme="halloween"] .bubble.them::before{content:'';position:absolute;top:-24px;left:8px;width:38px;height:34px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%3Crect%20x%3D%2227%22%20y%3D%224%22%20width%3D%226%22%20height%3D%228%22%20rx%3D%222%22%20fill%3D%22%234c7a3a%22%20transform%3D%22rotate%28-12%2030%208%29%22/%3E%3Cpath%20d%3D%22M8%2030C8%2017%2017%2011%2030%2011s22%206%2022%2019c0%2011-10%2017-22%2017S8%2041%208%2030Z%22%20fill%3D%22%23e8853c%22/%3E%3Cpath%20d%3D%22M17%2024l6%205-6%205Z%22%20fill%3D%22%232a1206%22/%3E%3Cpath%20d%3D%22M43%2024l-6%205%206%205Z%22%20fill%3D%22%232a1206%22/%3E%3Cpath%20d%3D%22M20%2038l2-3%202%203%202-3%202%203%202-3%202%203%202-3%202%203%22%20stroke%3D%22%232a1206%22%20stroke-width%3D%222.4%22%20fill%3D%22none%22%20stroke-linejoin%3D%22round%22/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;}
  html[data-theme="halloween"] .bubble.them + .bubble.them{margin-top:10px;}
  html[data-theme="halloween"] .bubble.them + .bubble.them::before{display:none;}
  html[data-theme="halloween"] .bubble.me::after,html[data-theme="halloween"] .bubble.them::after{content:'';position:absolute;bottom:-8px;left:14px;width:34px;height:17px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2040%2020%22%3E%3Cg%20transform%3D%22translate%284%2C2%29%20rotate%2815%29%22%3E%3Cpath%20d%3D%22M1%2012C1%206%206%201%2012%201c0%206-5%2011-11%2011Z%22%20fill%3D%22%23f0a868%22%20opacity%3D%220.65%22/%3E%3C/g%3E%3Cg%20transform%3D%22translate%2826%2C8%29%20rotate%28-20%29%20scale%280.6%29%22%3E%3Cpath%20d%3D%22M1%2012C1%206%206%201%2012%201c0%206-5%2011-11%2011Z%22%20fill%3D%22%23e8853c%22%20opacity%3D%220.5%22/%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;animation:particleDrift 3.2s ease-in-out infinite;}
  html[data-theme="halloween"] .bubble.me::after{right:14px;left:auto;}

  html[data-theme="dream"]{--bg-deep:#0f1428;--bg-panel:rgba(28,24,50,.7);--bg-panel-2:rgba(36,32,62,.72);--ink:#f0ecfb;--ink-dim:#a8a0c8;--primary:#afa2c8;--primary-dim:#8c80ac;--primary-ink:#1c1830;--rose:#d5c8ed;--friend-accent:#bbafda;--line:rgba(152,136,184,.16);}
  html[data-theme="dream"] body{background:radial-gradient(circle at 50% -8%,rgba(152,136,184,.2),transparent 40%),radial-gradient(circle at 8% 90%,rgba(201,184,232,.12),transparent 34%),#0a0e1c;}
  html[data-theme="dream"] .phone{background:linear-gradient(155deg,#1c1836,#0e0c1c);border-color:rgba(152,136,184,.2);box-shadow:0 45px 110px rgba(0,0,0,.6),inset 0 1px rgba(220,210,255,.08);}
  html[data-theme="dream"] .card{background:linear-gradient(145deg,rgba(152,136,184,.09),rgba(201,184,232,.05));box-shadow:inset 0 1px rgba(255,255,255,.05),0 14px 36px rgba(0,0,0,.26);backdrop-filter:blur(14px);}
  html[data-theme="dream"] .btn{background:linear-gradient(135deg,#b0a0d0,#9888b8);box-shadow:0 10px 26px rgba(152,136,184,.28)}
  html[data-theme="dream"] .chip.on{background:linear-gradient(135deg,#d0c4e8,#a898d0);border-color:#a898d0;color:#1c1830}
  html[data-theme="dream"] .eyebrow{color:#9888b8}
  html[data-theme="dream"] .bubble.me{background:linear-gradient(135deg,#6c5c94,#4c3f70)}
  html[data-theme="dream"] .bubble.them{background:rgba(36,32,62,.55);margin-top:22px;}
  html[data-theme="dream"] .navbar{background:rgba(15,20,40,.9)}
  html[data-theme="dream"] .navbar button.active{color:#9888b8}
  html[data-theme="dream"] .theme-toggle,html[data-theme="dream"] .theme-menu{background:rgba(28,24,50,.85);border-color:rgba(152,136,184,.18)}
  html[data-theme="dream"] .particle{background:radial-gradient(circle,#d0c4e8,transparent 70%) !important;opacity:.35;}
  html[data-theme="dream"] .bubble.them::before{content:'';position:absolute;top:-24px;left:8px;width:38px;height:34px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%22-2%2030%2027%3B2%2030%2027%3B-2%2030%2027%22%20dur%3D%224s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M15%2014C15%209%2019%206%2022%209c2-4%208-4%2010%200%203-3%207%200%207%205%22%20fill%3D%22%237a6a9a%22/%3E%3Cpath%20d%3D%22M10%2024C10%2013%2018%207%2030%207s20%206%2020%2017c0%2011-9%2019-20%2019s-20-8-20-19Z%22%20fill%3D%22%239888b8%22/%3E%3Ccircle%20cx%3D%2221%22%20cy%3D%2225%22%20r%3D%229%22%20fill%3D%22%23e8e0f5%22/%3E%3Ccircle%20cx%3D%2239%22%20cy%3D%2225%22%20r%3D%229%22%20fill%3D%22%23e8e0f5%22/%3E%3Cpath%20d%3D%22M14%2025c2-3%2010-3%2012%200%22%20stroke%3D%22%234a3a6a%22%20stroke-width%3D%222.4%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%3E%3Canimate%20attributeName%3D%22d%22%20values%3D%22M14%2025c2-3%2010-3%2012%200%3BM14%2024c2%203%2010%203%2012%200%3BM14%2025c2-3%2010-3%2012%200%22%20dur%3D%225s%22%20repeatCount%3D%22indefinite%22/%3E%3C/path%3E%3Cpath%20d%3D%22M32%2025c2-3%2010-3%2012%200%22%20stroke%3D%22%234a3a6a%22%20stroke-width%3D%222.4%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%3E%3Canimate%20attributeName%3D%22d%22%20values%3D%22M32%2025c2-3%2010-3%2012%200%3BM32%2024c2%203%2010%203%2012%200%3BM32%2025c2-3%2010-3%2012%200%22%20dur%3D%225s%22%20repeatCount%3D%22indefinite%22/%3E%3C/path%3E%3Cpath%20d%3D%22M27%2030l3%204%203-4Z%22%20fill%3D%22%23e8a84c%22/%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;}
  html[data-theme="dream"] .bubble.them + .bubble.them{margin-top:10px;}
  html[data-theme="dream"] .bubble.them + .bubble.them::before{display:none;}
  html[data-theme="dream"] .bubble.me::after,html[data-theme="dream"] .bubble.them::after{content:'';position:absolute;bottom:-8px;left:14px;width:34px;height:17px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2040%2020%22%3E%3Cpath%20d%3D%22M8%203l1.6%206.4L16%2011l-6.4%201.6L8%2019l-1.6-6.4L0%2011l6.4-1.6Z%22%20fill%3D%22%23d0c4e8%22%20opacity%3D%220.65%22/%3E%3Cpath%20d%3D%22M30%206l0.9%203.6L34.5%2011l-3.1%200.9L30%2015l-0.9-3.6L26.5%2011l3.1-0.9Z%22%20fill%3D%22%23c9b8e8%22%20opacity%3D%220.55%22/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;animation:particleDrift 3.2s ease-in-out infinite;}
  html[data-theme="dream"] .bubble.me::after{right:14px;left:auto;}
  html[data-theme="dragon"]{--bg-deep:#1c0a2a;--bg-panel:rgba(42,24,64,.7);--bg-panel-2:rgba(54,30,80,.72);--ink:#f0e0fb;--ink-dim:#c4a8e0;--primary:#af7de1;--primary-dim:#8f64bb;--primary-ink:#2a1240;--rose:#ddc1f3;--friend-accent:#c896ed;--line:rgba(152,88,216,.16);}
  html[data-theme="dragon"] body{background:radial-gradient(circle at 50% -8%,rgba(152,88,216,.2),transparent 40%),radial-gradient(circle at 8% 90%,rgba(152,88,216,.12),transparent 34%),#1c0a2a;}
  html[data-theme="dragon"] .phone{background:linear-gradient(155deg,#1c0a2a,#000);border-color:rgba(152,88,216,.2);box-shadow:0 45px 110px rgba(0,0,0,.6),inset 0 1px rgba(255,255,255,.08);}
  html[data-theme="dragon"] .card{background:linear-gradient(145deg,rgba(152,88,216,.09),rgba(152,88,216,.05));box-shadow:inset 0 1px rgba(255,255,255,.05),0 14px 36px rgba(0,0,0,.26);backdrop-filter:blur(14px);}
  html[data-theme="dragon"] .btn{background:linear-gradient(135deg,#d4b0f0,#9858d8);box-shadow:0 10px 26px rgba(152,88,216,.28)}
  html[data-theme="dragon"] .chip.on{background:linear-gradient(135deg,#d4b0f0,#b878e8);border-color:#b878e8;color:#2a1240}
  html[data-theme="dragon"] .eyebrow{color:#9858d8}
  html[data-theme="dragon"] .bubble.me{background:linear-gradient(135deg,#7038a8,#2a1240)}
  html[data-theme="dragon"] .bubble.them{background:rgba(54,30,80,.55);margin-top:22px;}
  html[data-theme="dragon"] .navbar{background:rgba(42,24,64,.9)}
  html[data-theme="dragon"] .navbar button.active{color:#9858d8}
  html[data-theme="dragon"] .theme-toggle,html[data-theme="dragon"] .theme-menu{background:rgba(42,24,64,.85);border-color:rgba(152,88,216,.18)}
  html[data-theme="dragon"] .particle{background:radial-gradient(circle,#d4b0f0,transparent 70%) !important;opacity:.35;}
  html[data-theme="dragon"] .bubble.them::before{content:'';position:absolute;top:-24px;left:8px;width:38px;height:34px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%22-3%2030%2028%3B3%2030%2028%3B-3%2030%2028%22%20dur%3D%223.4s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M12%2020%20L4%208%20L18%2014%20Z%22%20fill%3D%22%237a3ab8%22/%3E%3Cpath%20d%3D%22M48%2020%20L56%208%20L42%2014%20Z%22%20fill%3D%22%237a3ab8%22/%3E%3Cpath%20d%3D%22M10%2026C10%2015%2018%209%2030%209s20%206%2020%2017c0%2011-9%2018-20%2018s-20-7-20-18Z%22%20fill%3D%22%239858d8%22/%3E%3Cpath%20d%3D%22M30%2026C22%2026%2017%2031%2017%2037c0%204%206%206%2013%206s13-2%2013-6c0-6-5-11-13-11Z%22%20fill%3D%22%23d4b0f0%22/%3E%3Cellipse%20cx%3D%2223%22%20cy%3D%2227%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%231c0a2a%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.5s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Cellipse%20cx%3D%2237%22%20cy%3D%2227%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%231c0a2a%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.5s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Cpath%20d%3D%22M27%2036c1.4%201.4%204.6%201.4%206%200%22%20stroke%3D%22%231c0a2a%22%20stroke-width%3D%222%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;}
  html[data-theme="dragon"] .bubble.them + .bubble.them{margin-top:10px;}
  html[data-theme="dragon"] .bubble.them + .bubble.them::before{display:none;}
  html[data-theme="dragon"] .bubble.me::after,html[data-theme="dragon"] .bubble.them::after{content:'';position:absolute;bottom:-8px;left:14px;width:34px;height:17px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2040%2020%22%3E%3Cpath%20d%3D%22M8%203l1.6%206.4L16%2011l-6.4%201.6L8%2019l-1.6-6.4L0%2011l6.4-1.6Z%22%20fill%3D%22%23d4b0f0%22%20opacity%3D%220.65%22/%3E%3Cpath%20d%3D%22M30%206l0.9%203.6L34.5%2011l-3.1%200.9L30%2015l-0.9-3.6L26.5%2011l3.1-0.9Z%22%20fill%3D%22%23c99cf0%22%20opacity%3D%220.55%22/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;animation:particleDrift 3.2s ease-in-out infinite;}
  html[data-theme="dragon"] .bubble.me::after{right:14px;left:auto;}
  html[data-theme="ghost"]{--bg-deep:#1c0a1c;--bg-panel:rgba(48,26,48,.7);--bg-panel-2:rgba(60,32,60,.72);--ink:#fbe8f5;--ink-dim:#e0a8c8;--primary:#f3c1da;--primary-dim:#ce96af;--primary-ink:#3a1428;--rose:#f7daea;--friend-accent:#eda2c8;--line:rgba(240,176,208,.16);}
  html[data-theme="ghost"] body{background:radial-gradient(circle at 50% -8%,rgba(240,176,208,.2),transparent 40%),radial-gradient(circle at 8% 90%,rgba(240,176,208,.12),transparent 34%),#1c0a1c;}
  html[data-theme="ghost"] .phone{background:linear-gradient(155deg,#1c0a1c,#000);border-color:rgba(240,176,208,.2);box-shadow:0 45px 110px rgba(0,0,0,.6),inset 0 1px rgba(255,255,255,.08);}
  html[data-theme="ghost"] .card{background:linear-gradient(145deg,rgba(240,176,208,.09),rgba(240,176,208,.05));box-shadow:inset 0 1px rgba(255,255,255,.05),0 14px 36px rgba(0,0,0,.26);backdrop-filter:blur(14px);}
  html[data-theme="ghost"] .btn{background:linear-gradient(135deg,#f5d0e4,#f0b0d0);box-shadow:0 10px 26px rgba(240,176,208,.28)}
  html[data-theme="ghost"] .chip.on{background:linear-gradient(135deg,#f5d0e4,#e888b8);border-color:#e888b8;color:#3a1428}
  html[data-theme="ghost"] .eyebrow{color:#f0b0d0}
  html[data-theme="ghost"] .bubble.me{background:linear-gradient(135deg,#c07898,#3a1428)}
  html[data-theme="ghost"] .bubble.them{background:rgba(60,32,60,.55);margin-top:22px;}
  html[data-theme="ghost"] .navbar{background:rgba(48,26,48,.9)}
  html[data-theme="ghost"] .navbar button.active{color:#f0b0d0}
  html[data-theme="ghost"] .theme-toggle,html[data-theme="ghost"] .theme-menu{background:rgba(48,26,48,.85);border-color:rgba(240,176,208,.18)}
  html[data-theme="ghost"] .particle{background:radial-gradient(circle,#f5d0e4,transparent 70%) !important;opacity:.35;}
  html[data-theme="ghost"] .bubble.them::before{content:'';position:absolute;top:-24px;left:8px;width:38px;height:34px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22translate%22%20values%3D%220%200%3B0%20-3%3B0%200%22%20dur%3D%223s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M14%2040V24c0-9%207-16%2016-16s16%207%2016%2016v16l-4-4-4%204-4-4-4%204-4-4-4%204-4-4-4%204Z%22%20fill%3D%22%23f0b0d0%22/%3E%3Cellipse%20cx%3D%2223%22%20cy%3D%2224%22%20rx%3D%222.4%22%20ry%3D%222.4%22%20fill%3D%22%235a1c40%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.4%3B2.4%3B0.3%3B2.4%3B2.4%22%20dur%3D%224s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Cellipse%20cx%3D%2237%22%20cy%3D%2224%22%20rx%3D%222.4%22%20ry%3D%222.4%22%20fill%3D%22%235a1c40%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.4%3B2.4%3B0.3%3B2.4%3B2.4%22%20dur%3D%224s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Ccircle%20cx%3D%2230%22%20cy%3D%2231%22%20r%3D%222.4%22%20fill%3D%22%23e888b8%22/%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;}
  html[data-theme="ghost"] .bubble.them + .bubble.them{margin-top:10px;}
  html[data-theme="ghost"] .bubble.them + .bubble.them::before{display:none;}
  html[data-theme="ghost"] .bubble.me::after,html[data-theme="ghost"] .bubble.them::after{content:'';position:absolute;bottom:-8px;left:14px;width:34px;height:17px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2040%2020%22%3E%3Cpath%20d%3D%22M8%203l1.6%206.4L16%2011l-6.4%201.6L8%2019l-1.6-6.4L0%2011l6.4-1.6Z%22%20fill%3D%22%23f8d4e8%22%20opacity%3D%220.65%22/%3E%3Cpath%20d%3D%22M30%206l0.9%203.6L34.5%2011l-3.1%200.9L30%2015l-0.9-3.6L26.5%2011l3.1-0.9Z%22%20fill%3D%22%23f5d0e4%22%20opacity%3D%220.55%22/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;animation:particleDrift 3.2s ease-in-out infinite;}
  html[data-theme="ghost"] .bubble.me::after{right:14px;left:auto;}
  html[data-theme="songbird"]{--bg-deep:#0a1a2a;--bg-panel:rgba(20,42,64,.7);--bg-panel-2:rgba(26,54,80,.72);--ink:#e8f2fb;--ink-dim:#9cc0e0;--primary:#74a5e7;--primary-dim:#6189c1;--primary-ink:#0a2038;--rose:#bbdaf7;--friend-accent:#8cbbed;--line:rgba(77,140,224,.16);}
  html[data-theme="songbird"] body{background:radial-gradient(circle at 50% -8%,rgba(77,140,224,.2),transparent 40%),radial-gradient(circle at 8% 90%,rgba(77,140,224,.12),transparent 34%),#0a1a2a;}
  html[data-theme="songbird"] .phone{background:linear-gradient(155deg,#0a1a2a,#000);border-color:rgba(77,140,224,.2);box-shadow:0 45px 110px rgba(0,0,0,.6),inset 0 1px rgba(255,255,255,.08);}
  html[data-theme="songbird"] .card{background:linear-gradient(145deg,rgba(77,140,224,.09),rgba(77,140,224,.05));box-shadow:inset 0 1px rgba(255,255,255,.05),0 14px 36px rgba(0,0,0,.26);backdrop-filter:blur(14px);}
  html[data-theme="songbird"] .btn{background:linear-gradient(135deg,#a8d0f5,#4d8ce0);box-shadow:0 10px 26px rgba(77,140,224,.28)}
  html[data-theme="songbird"] .chip.on{background:linear-gradient(135deg,#a8d0f5,#6ca8e8);border-color:#6ca8e8;color:#0a2038}
  html[data-theme="songbird"] .eyebrow{color:#4d8ce0}
  html[data-theme="songbird"] .bubble.me{background:linear-gradient(135deg,#3468b0,#0a2038)}
  html[data-theme="songbird"] .bubble.them{background:rgba(26,54,80,.55);margin-top:22px;}
  html[data-theme="songbird"] .navbar{background:rgba(20,42,64,.9)}
  html[data-theme="songbird"] .navbar button.active{color:#4d8ce0}
  html[data-theme="songbird"] .theme-toggle,html[data-theme="songbird"] .theme-menu{background:rgba(20,42,64,.85);border-color:rgba(77,140,224,.18)}
  html[data-theme="songbird"] .particle{background:radial-gradient(circle,#a8d0f5,transparent 70%) !important;opacity:.35;}
  html[data-theme="songbird"] .bubble.them::before{content:'';position:absolute;top:-24px;left:8px;width:38px;height:34px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%22-3%2030%2028%3B3%2030%2028%3B-3%2030%2028%22%20dur%3D%223.6s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M28%206l3%205%203-5Z%22%20fill%3D%22%236ca8e8%22/%3E%3Cpath%20d%3D%22M38%2022c10-4%2016%204%2010%2010-2-6-6-9-10-8Z%22%20fill%3D%22%233a6cc0%22/%3E%3Cpath%20d%3D%22M10%2028C10%2017%2018%2011%2030%2011s20%206%2020%2017c0%2010-9%2016-20%2016s-20-6-20-16Z%22%20fill%3D%22%234d8ce0%22/%3E%3Cellipse%20cx%3D%2224%22%20cy%3D%2226%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%231a0805%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Cellipse%20cx%3D%2236%22%20cy%3D%2226%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%231a0805%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Cpath%20d%3D%22M27%2033l4%204%204-4Z%22%20fill%3D%22%23e8a84c%22/%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;}
  html[data-theme="songbird"] .bubble.them + .bubble.them{margin-top:10px;}
  html[data-theme="songbird"] .bubble.them + .bubble.them::before{display:none;}
  html[data-theme="songbird"] .bubble.me::after,html[data-theme="songbird"] .bubble.them::after{content:'';position:absolute;bottom:-8px;left:14px;width:34px;height:17px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2040%2020%22%3E%3Cpath%20d%3D%22M2%2010c4-4%208-4%2010%200s6%204%2010%200%22%20stroke%3D%22%23a8d0f5%22%20stroke-width%3D%221.4%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%20opacity%3D%220.5%22/%3E%3Ccircle%20cx%3D%2230%22%20cy%3D%226%22%20r%3D%221.6%22%20fill%3D%22%23d4e8ff%22%20opacity%3D%220.5%22/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;animation:particleDrift 3.2s ease-in-out infinite;}
  html[data-theme="songbird"] .bubble.me::after{right:14px;left:auto;}
  html[data-theme="bat"]{--bg-deep:#0c0818;--bg-panel:rgba(30,20,52,.7);--bg-panel-2:rgba(38,26,64,.72);--ink:#ece8fb;--ink-dim:#b0a0d4;--primary:#a489c8;--primary-dim:#8670a8;--primary-ink:#180c2c;--rose:#d5c1ed;--friend-accent:#8c72b0;--line:rgba(138,104,184,.16);}
  html[data-theme="bat"] body{background:radial-gradient(circle at 50% -8%,rgba(138,104,184,.2),transparent 40%),radial-gradient(circle at 8% 90%,rgba(138,104,184,.12),transparent 34%),#0c0818;}
  html[data-theme="bat"] .phone{background:linear-gradient(155deg,#0c0818,#000);border-color:rgba(138,104,184,.2);box-shadow:0 45px 110px rgba(0,0,0,.6),inset 0 1px rgba(255,255,255,.08);}
  html[data-theme="bat"] .card{background:linear-gradient(145deg,rgba(138,104,184,.09),rgba(138,104,184,.05));box-shadow:inset 0 1px rgba(255,255,255,.05),0 14px 36px rgba(0,0,0,.26);backdrop-filter:blur(14px);}
  html[data-theme="bat"] .btn{background:linear-gradient(135deg,#c9b0e8,#8a68b8);box-shadow:0 10px 26px rgba(138,104,184,.28)}
  html[data-theme="bat"] .chip.on{background:linear-gradient(135deg,#c9b0e8,#6c4a9a);border-color:#6c4a9a;color:#180c2c}
  html[data-theme="bat"] .eyebrow{color:#8a68b8}
  html[data-theme="bat"] .bubble.me{background:linear-gradient(135deg,#644890,#180c2c)}
  html[data-theme="bat"] .bubble.them{background:rgba(38,26,64,.55);margin-top:22px;}
  html[data-theme="bat"] .navbar{background:rgba(30,20,52,.9)}
  html[data-theme="bat"] .navbar button.active{color:#8a68b8}
  html[data-theme="bat"] .theme-toggle,html[data-theme="bat"] .theme-menu{background:rgba(30,20,52,.85);border-color:rgba(138,104,184,.18)}
  html[data-theme="bat"] .particle{background:radial-gradient(circle,#c9b0e8,transparent 70%) !important;opacity:.35;}
  html[data-theme="bat"] .bubble.them::before{content:'';position:absolute;top:-24px;left:8px;width:38px;height:34px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%22-3%2030%2028%3B3%2030%2028%3B-3%2030%2028%22%20dur%3D%223.4s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M12%2024C2%2014%20-2%2030%206%2034c3-8%205-10%208-8Z%22%20fill%3D%22%236c4a9a%22/%3E%3Cpath%20d%3D%22M48%2024c10-10%2014%206%206%2010-3-8-5-10-8-8Z%22%20fill%3D%22%236c4a9a%22/%3E%3Cpath%20d%3D%22M12%2026C12%2016%2020%2010%2030%2010s18%206%2018%2016c0%209-8%2015-18%2015s-18-6-18-15Z%22%20fill%3D%22%238a68b8%22/%3E%3Cellipse%20cx%3D%2224%22%20cy%3D%2225%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%231a0805%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Cellipse%20cx%3D%2236%22%20cy%3D%2225%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%231a0805%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Cpath%20d%3D%22M27%2031c1.4%201.2%204.6%201.2%206%200%22%20stroke%3D%22%231c0a2a%22%20stroke-width%3D%221.8%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;}
  html[data-theme="bat"] .bubble.them + .bubble.them{margin-top:10px;}
  html[data-theme="bat"] .bubble.them + .bubble.them::before{display:none;}
  html[data-theme="bat"] .bubble.me::after,html[data-theme="bat"] .bubble.them::after{content:'';position:absolute;bottom:-8px;left:14px;width:34px;height:17px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2040%2020%22%3E%3Ccircle%20cx%3D%226%22%20cy%3D%2213%22%20r%3D%222.2%22%20fill%3D%22%23c9b0e8%22%20opacity%3D%220.55%22/%3E%3Ccircle%20cx%3D%2216%22%20cy%3D%227%22%20r%3D%221.5%22%20fill%3D%22%23dcc8f0%22%20opacity%3D%220.5%22/%3E%3Ccircle%20cx%3D%2226%22%20cy%3D%2213%22%20r%3D%222%22%20fill%3D%22%23b8a0d4%22%20opacity%3D%220.45%22/%3E%3Ccircle%20cx%3D%2234%22%20cy%3D%228%22%20r%3D%221.3%22%20fill%3D%22%23d4c0e8%22%20opacity%3D%220.5%22/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;animation:particleDrift 3.2s ease-in-out infinite;}
  html[data-theme="bat"] .bubble.me::after{right:14px;left:auto;}
  html[data-theme="lanternfox"]{--bg-deep:#1a1206;--bg-panel:rgba(48,32,14,.7);--bg-panel-2:rgba(60,40,18,.72);--ink:#fbf0e0;--ink-dim:#d9b98f;--primary:#f3bb7d;--primary-dim:#ce965e;--primary-ink:#2a1a08;--rose:#f3d49c;--friend-accent:#eda567;--line:rgba(240,168,88,.16);}
  html[data-theme="lanternfox"] body{background:radial-gradient(circle at 50% -8%,rgba(240,168,88,.2),transparent 40%),radial-gradient(circle at 8% 90%,rgba(240,168,88,.12),transparent 34%),#1a1206;}
  html[data-theme="lanternfox"] .phone{background:linear-gradient(155deg,#1a1206,#000);border-color:rgba(240,168,88,.2);box-shadow:0 45px 110px rgba(0,0,0,.6),inset 0 1px rgba(255,255,255,.08);}
  html[data-theme="lanternfox"] .card{background:linear-gradient(145deg,rgba(240,168,88,.09),rgba(240,168,88,.05));box-shadow:inset 0 1px rgba(255,255,255,.05),0 14px 36px rgba(0,0,0,.26);backdrop-filter:blur(14px);}
  html[data-theme="lanternfox"] .btn{background:linear-gradient(135deg,#f0c880,#f0a858);box-shadow:0 10px 26px rgba(240,168,88,.28)}
  html[data-theme="lanternfox"] .chip.on{background:linear-gradient(135deg,#f0c880,#e88c3c);border-color:#e88c3c;color:#2a1a08}
  html[data-theme="lanternfox"] .eyebrow{color:#f0a858}
  html[data-theme="lanternfox"] .bubble.me{background:linear-gradient(135deg,#c07830,#2a1a08)}
  html[data-theme="lanternfox"] .bubble.them{background:rgba(60,40,18,.55);margin-top:22px;}
  html[data-theme="lanternfox"] .navbar{background:rgba(48,32,14,.9)}
  html[data-theme="lanternfox"] .navbar button.active{color:#f0a858}
  html[data-theme="lanternfox"] .theme-toggle,html[data-theme="lanternfox"] .theme-menu{background:rgba(48,32,14,.85);border-color:rgba(240,168,88,.18)}
  html[data-theme="lanternfox"] .particle{background:radial-gradient(circle,#f0c880,transparent 70%) !important;opacity:.35;}
  html[data-theme="lanternfox"] .bubble.them::before{content:'';position:absolute;top:-24px;left:8px;width:38px;height:34px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%22-3%2030%2028%3B3%2030%2028%3B-3%2030%2028%22%20dur%3D%223.4s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M13%2022%20L4%207%20L21%2015%20Z%22%20fill%3D%22%23e88c3c%22/%3E%3Cpath%20d%3D%22M47%2022%20L56%207%20L39%2015%20Z%22%20fill%3D%22%23e88c3c%22/%3E%3Cpath%20d%3D%22M10%2026C10%2015%2018%209%2030%209s20%206%2020%2017c0%2011-9%2018-20%2018s-20-7-20-18Z%22%20fill%3D%22%23f0a858%22/%3E%3Cpath%20d%3D%22M30%2026C22%2026%2017%2031%2017%2038c0%205%206%208%2013%208s13-3%2013-8c0-7-5-12-13-12Z%22%20fill%3D%22%23fbe4bc%22/%3E%3Cellipse%20cx%3D%2223%22%20cy%3D%2227%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%231a0805%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Cellipse%20cx%3D%2237%22%20cy%3D%2227%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%231a0805%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Ccircle%20cx%3D%2246%22%20cy%3D%2236%22%20r%3D%224%22%20fill%3D%22%23e8c874%22%20opacity%3D%220.85%22/%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;}
  html[data-theme="lanternfox"] .bubble.them + .bubble.them{margin-top:10px;}
  html[data-theme="lanternfox"] .bubble.them + .bubble.them::before{display:none;}
  html[data-theme="lanternfox"] .bubble.me::after,html[data-theme="lanternfox"] .bubble.them::after{content:'';position:absolute;bottom:-8px;left:14px;width:34px;height:17px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2040%2020%22%3E%3Cg%20transform%3D%22translate%284%2C2%29%20rotate%2815%29%22%3E%3Cpath%20d%3D%22M1%2012C1%206%206%201%2012%201c0%206-5%2011-11%2011Z%22%20fill%3D%22%23f5dca0%22%20opacity%3D%220.65%22/%3E%3C/g%3E%3Cg%20transform%3D%22translate%2826%2C8%29%20rotate%28-20%29%20scale%280.6%29%22%3E%3Cpath%20d%3D%22M1%2012C1%206%206%201%2012%201c0%206-5%2011-11%2011Z%22%20fill%3D%22%23f0a858%22%20opacity%3D%220.5%22/%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;animation:particleDrift 3.2s ease-in-out infinite;}
  html[data-theme="lanternfox"] .bubble.me::after{right:14px;left:auto;}
  html[data-theme="seaserpent"]{--bg-deep:#04121c;--bg-panel:rgba(12,42,54,.7);--bg-panel-2:rgba(16,54,68,.72);--ink:#e0f5fb;--ink-dim:#88c4d4;--primary:#57bbd1;--primary-dim:#4e96a8;--primary-ink:#022430;--rose:#9bdded;--friend-accent:#4ca5bb;--line:rgba(40,168,196,.16);}
  html[data-theme="seaserpent"] body{background:radial-gradient(circle at 50% -8%,rgba(40,168,196,.2),transparent 40%),radial-gradient(circle at 8% 90%,rgba(40,168,196,.12),transparent 34%),#04121c;}
  html[data-theme="seaserpent"] .phone{background:linear-gradient(155deg,#04121c,#000);border-color:rgba(40,168,196,.2);box-shadow:0 45px 110px rgba(0,0,0,.6),inset 0 1px rgba(255,255,255,.08);}
  html[data-theme="seaserpent"] .card{background:linear-gradient(145deg,rgba(40,168,196,.09),rgba(40,168,196,.05));box-shadow:inset 0 1px rgba(255,255,255,.05),0 14px 36px rgba(0,0,0,.26);backdrop-filter:blur(14px);}
  html[data-theme="seaserpent"] .btn{background:linear-gradient(135deg,#7fd4e8,#28a8c4);box-shadow:0 10px 26px rgba(40,168,196,.28)}
  html[data-theme="seaserpent"] .chip.on{background:linear-gradient(135deg,#7fd4e8,#1a8ca8);border-color:#1a8ca8;color:#022430}
  html[data-theme="seaserpent"] .eyebrow{color:#28a8c4}
  html[data-theme="seaserpent"] .bubble.me{background:linear-gradient(135deg,#1c7890,#022430)}
  html[data-theme="seaserpent"] .bubble.them{background:rgba(16,54,68,.55);margin-top:22px;}
  html[data-theme="seaserpent"] .navbar{background:rgba(12,42,54,.9)}
  html[data-theme="seaserpent"] .navbar button.active{color:#28a8c4}
  html[data-theme="seaserpent"] .theme-toggle,html[data-theme="seaserpent"] .theme-menu{background:rgba(12,42,54,.85);border-color:rgba(40,168,196,.18)}
  html[data-theme="seaserpent"] .particle{background:radial-gradient(circle,#7fd4e8,transparent 70%) !important;opacity:.35;}
  html[data-theme="seaserpent"] .bubble.them::before{content:'';position:absolute;top:-24px;left:8px;width:38px;height:34px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%22-4%2020%2030%3B4%2020%2030%3B-4%2020%2030%22%20dur%3D%223.8s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M14%2044C6%2040%206%2032%2014%2030c-4-3-4-9%202-11%203%204%201%208-2%209%206-4%2013-1%2012%205%205-5%2012-2%2010%205%22%20stroke%3D%22%231a8ca8%22%20stroke-width%3D%227%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%3Cellipse%20cx%3D%2217%22%20cy%3D%2221%22%20rx%3D%228%22%20ry%3D%228%22%20fill%3D%22%2328a8c4%22/%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2219%22%20r%3D%221.6%22%20fill%3D%22%2304121c%22/%3E%3Cpath%20d%3D%22M12%2025c2%201.4%206%201.4%208%200%22%20stroke%3D%22%2304121c%22%20stroke-width%3D%221.6%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;}
  html[data-theme="seaserpent"] .bubble.them + .bubble.them{margin-top:10px;}
  html[data-theme="seaserpent"] .bubble.them + .bubble.them::before{display:none;}
  html[data-theme="seaserpent"] .bubble.me::after,html[data-theme="seaserpent"] .bubble.them::after{content:'';position:absolute;bottom:-8px;left:14px;width:34px;height:17px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2040%2020%22%3E%3Cpath%20d%3D%22M2%2012c3-5%206-5%209%200s6%205%209%200s6-5%209%200%22%20stroke%3D%22%234dc4de%22%20stroke-width%3D%221.8%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%20opacity%3D%220.6%22/%3E%3Ccircle%20cx%3D%2234%22%20cy%3D%226%22%20r%3D%221.4%22%20fill%3D%22%237fd4e8%22%20opacity%3D%220.5%22/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;animation:particleDrift 3.2s ease-in-out infinite;}
  html[data-theme="seaserpent"] .bubble.me::after{right:14px;left:auto;}
  html[data-theme="frog"]{--bg-deep:#0a1c0c;--bg-panel:rgba(20,46,24,.7);--bg-panel-2:rgba(26,58,30,.72);--ink:#eefbf0;--ink-dim:#a8d4a8;--primary:#8cd480;--primary-dim:#72af6a;--primary-ink:#0c2810;--rose:#bbedaf;--friend-accent:#80c873;--line:rgba(108,200,92,.16);}
  html[data-theme="frog"] body{background:radial-gradient(circle at 50% -8%,rgba(108,200,92,.2),transparent 40%),radial-gradient(circle at 8% 90%,rgba(108,200,92,.12),transparent 34%),#0a1c0c;}
  html[data-theme="frog"] .phone{background:linear-gradient(155deg,#0a1c0c,#000);border-color:rgba(108,200,92,.2);box-shadow:0 45px 110px rgba(0,0,0,.6),inset 0 1px rgba(255,255,255,.08);}
  html[data-theme="frog"] .card{background:linear-gradient(145deg,rgba(108,200,92,.09),rgba(108,200,92,.05));box-shadow:inset 0 1px rgba(255,255,255,.05),0 14px 36px rgba(0,0,0,.26);backdrop-filter:blur(14px);}
  html[data-theme="frog"] .btn{background:linear-gradient(135deg,#a8e898,#6cc85c);box-shadow:0 10px 26px rgba(108,200,92,.28)}
  html[data-theme="frog"] .chip.on{background:linear-gradient(135deg,#a8e898,#5cb84c);border-color:#5cb84c;color:#0c2810}
  html[data-theme="frog"] .eyebrow{color:#6cc85c}
  html[data-theme="frog"] .bubble.me{background:linear-gradient(135deg,#4a9840,#0c2810)}
  html[data-theme="frog"] .bubble.them{background:rgba(26,58,30,.55);margin-top:22px;}
  html[data-theme="frog"] .navbar{background:rgba(20,46,24,.9)}
  html[data-theme="frog"] .navbar button.active{color:#6cc85c}
  html[data-theme="frog"] .theme-toggle,html[data-theme="frog"] .theme-menu{background:rgba(20,46,24,.85);border-color:rgba(108,200,92,.18)}
  html[data-theme="frog"] .particle{background:radial-gradient(circle,#a8e898,transparent 70%) !important;opacity:.35;}
  html[data-theme="frog"] .bubble.them::before{content:'';position:absolute;top:-24px;left:8px;width:38px;height:34px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%22-3%2030%2028%3B3%2030%2028%3B-3%2030%2028%22%20dur%3D%223.4s%22%20repeatCount%3D%22indefinite%22/%3E%3Ccircle%20cx%3D%2218%22%20cy%3D%2216%22%20r%3D%227%22%20fill%3D%22%235cb84c%22/%3E%3Ccircle%20cx%3D%2242%22%20cy%3D%2216%22%20r%3D%227%22%20fill%3D%22%235cb84c%22/%3E%3Cpath%20d%3D%22M10%2030C10%2020%2018%2016%2030%2016s20%204%2020%2014c0%209-9%2014-20%2014s-20-5-20-14Z%22%20fill%3D%22%236cc85c%22/%3E%3Ccircle%20cx%3D%2218%22%20cy%3D%2216%22%20r%3D%223%22%20fill%3D%22%230a1c0c%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%223%3B3%3B0.3%3B3%3B3%22%20dur%3D%224.3s%22%20repeatCount%3D%22indefinite%22/%3E%3C/circle%3E%3Ccircle%20cx%3D%2242%22%20cy%3D%2216%22%20r%3D%223%22%20fill%3D%22%230a1c0c%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%223%3B3%3B0.3%3B3%3B3%22%20dur%3D%224.3s%22%20repeatCount%3D%22indefinite%22/%3E%3C/circle%3E%3Cpath%20d%3D%22M22%2034c3%203%2013%203%2016%200%22%20stroke%3D%22%230a1c0c%22%20stroke-width%3D%222%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;}
  html[data-theme="frog"] .bubble.them + .bubble.them{margin-top:10px;}
  html[data-theme="frog"] .bubble.them + .bubble.them::before{display:none;}
  html[data-theme="frog"] .bubble.me::after,html[data-theme="frog"] .bubble.them::after{content:'';position:absolute;bottom:-8px;left:14px;width:34px;height:17px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2040%2020%22%3E%3Cpath%20d%3D%22M2%2010c4-4%208-4%2010%200s6%204%2010%200%22%20stroke%3D%22%23a8e898%22%20stroke-width%3D%221.4%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%20opacity%3D%220.5%22/%3E%3Ccircle%20cx%3D%2230%22%20cy%3D%226%22%20r%3D%221.6%22%20fill%3D%22%23c8f0b8%22%20opacity%3D%220.5%22/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;animation:particleDrift 3.2s ease-in-out infinite;}
  html[data-theme="frog"] .bubble.me::after{right:14px;left:auto;}
  html[data-theme="redpanda"]{--bg-deep:#1c0a06;--bg-panel:rgba(48,26,16,.7);--bg-panel-2:rgba(60,32,20,.72);--ink:#fbf0e8;--ink-dim:#e0b09c;--primary:#e1855a;--primary-dim:#bb7050;--primary-ink:#2a1206;--rose:#f3bb96;--friend-accent:#d47650;--line:rgba(216,98,44,.16);}
  html[data-theme="redpanda"] body{background:radial-gradient(circle at 50% -8%,rgba(216,98,44,.2),transparent 40%),radial-gradient(circle at 8% 90%,rgba(216,98,44,.12),transparent 34%),#1c0a06;}
  html[data-theme="redpanda"] .phone{background:linear-gradient(155deg,#1c0a06,#000);border-color:rgba(216,98,44,.2);box-shadow:0 45px 110px rgba(0,0,0,.6),inset 0 1px rgba(255,255,255,.08);}
  html[data-theme="redpanda"] .card{background:linear-gradient(145deg,rgba(216,98,44,.09),rgba(216,98,44,.05));box-shadow:inset 0 1px rgba(255,255,255,.05),0 14px 36px rgba(0,0,0,.26);backdrop-filter:blur(14px);}
  html[data-theme="redpanda"] .btn{background:linear-gradient(135deg,#f0a878,#d8622c);box-shadow:0 10px 26px rgba(216,98,44,.28)}
  html[data-theme="redpanda"] .chip.on{background:linear-gradient(135deg,#f0a878,#c8501e);border-color:#c8501e;color:#2a1206}
  html[data-theme="redpanda"] .eyebrow{color:#d8622c}
  html[data-theme="redpanda"] .bubble.me{background:linear-gradient(135deg,#a8481e,#2a1206)}
  html[data-theme="redpanda"] .bubble.them{background:rgba(60,32,20,.55);margin-top:22px;}
  html[data-theme="redpanda"] .navbar{background:rgba(48,26,16,.9)}
  html[data-theme="redpanda"] .navbar button.active{color:#d8622c}
  html[data-theme="redpanda"] .theme-toggle,html[data-theme="redpanda"] .theme-menu{background:rgba(48,26,16,.85);border-color:rgba(216,98,44,.18)}
  html[data-theme="redpanda"] .particle{background:radial-gradient(circle,#f0a878,transparent 70%) !important;opacity:.35;}
  html[data-theme="redpanda"] .bubble.them::before{content:'';position:absolute;top:-24px;left:8px;width:38px;height:34px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%22-3%2030%2028%3B3%2030%2028%3B-3%2030%2028%22%20dur%3D%223.4s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M10%2018%20L4%206%20L20%2012%20Z%22%20fill%3D%22%23c8501e%22/%3E%3Cpath%20d%3D%22M50%2018%20L56%206%20L40%2012%20Z%22%20fill%3D%22%23c8501e%22/%3E%3Cpath%20d%3D%22M10%2026C10%2015%2018%209%2030%209s20%206%2020%2017c0%2011-9%2018-20%2018s-20-7-20-18Z%22%20fill%3D%22%23d8622c%22/%3E%3Cpath%20d%3D%22M30%2027C22%2027%2017%2032%2017%2038c0%205%206%207%2013%207s13-2%2013-7c0-6-5-11-13-11Z%22%20fill%3D%22%23f5ece0%22/%3E%3Cellipse%20cx%3D%2223%22%20cy%3D%2228%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%231a0805%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Cellipse%20cx%3D%2237%22%20cy%3D%2228%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%231a0805%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Cellipse%20cx%3D%2230%22%20cy%3D%2233%22%20rx%3D%222.6%22%20ry%3D%222%22%20fill%3D%22%231c0a06%22/%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;}
  html[data-theme="redpanda"] .bubble.them + .bubble.them{margin-top:10px;}
  html[data-theme="redpanda"] .bubble.them + .bubble.them::before{display:none;}
  html[data-theme="redpanda"] .bubble.me::after,html[data-theme="redpanda"] .bubble.them::after{content:'';position:absolute;bottom:-8px;left:14px;width:34px;height:17px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2040%2020%22%3E%3Cg%20transform%3D%22translate%284%2C2%29%20rotate%2815%29%22%3E%3Cpath%20d%3D%22M1%2012C1%206%206%201%2012%201c0%206-5%2011-11%2011Z%22%20fill%3D%22%23f0a878%22%20opacity%3D%220.65%22/%3E%3C/g%3E%3Cg%20transform%3D%22translate%2826%2C8%29%20rotate%28-20%29%20scale%280.6%29%22%3E%3Cpath%20d%3D%22M1%2012C1%206%206%201%2012%201c0%206-5%2011-11%2011Z%22%20fill%3D%22%23e88850%22%20opacity%3D%220.5%22/%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;animation:particleDrift 3.2s ease-in-out infinite;}
  html[data-theme="redpanda"] .bubble.me::after{right:14px;left:auto;}
  html[data-theme="cloudspirit"]{--bg-deep:#0a1428;--bg-panel:rgba(24,34,58,.7);--bg-panel-2:rgba(30,42,72,.72);--ink:#eef2fb;--ink-dim:#a8b4d4;--primary:#bbc8e7;--primary-dim:#96a2c8;--primary-ink:#141c34;--rose:#d4ddf3;--friend-accent:#a2afd4;--line:rgba(168,184,224,.16);}
  html[data-theme="cloudspirit"] body{background:radial-gradient(circle at 50% -8%,rgba(168,184,224,.2),transparent 40%),radial-gradient(circle at 8% 90%,rgba(168,184,224,.12),transparent 34%),#0a1428;}
  html[data-theme="cloudspirit"] .phone{background:linear-gradient(155deg,#0a1428,#000);border-color:rgba(168,184,224,.2);box-shadow:0 45px 110px rgba(0,0,0,.6),inset 0 1px rgba(255,255,255,.08);}
  html[data-theme="cloudspirit"] .card{background:linear-gradient(145deg,rgba(168,184,224,.09),rgba(168,184,224,.05));box-shadow:inset 0 1px rgba(255,255,255,.05),0 14px 36px rgba(0,0,0,.26);backdrop-filter:blur(14px);}
  html[data-theme="cloudspirit"] .btn{background:linear-gradient(135deg,#c8d4f0,#a8b8e0);box-shadow:0 10px 26px rgba(168,184,224,.28)}
  html[data-theme="cloudspirit"] .chip.on{background:linear-gradient(135deg,#c8d4f0,#8898c8);border-color:#8898c8;color:#141c34}
  html[data-theme="cloudspirit"] .eyebrow{color:#a8b8e0}
  html[data-theme="cloudspirit"] .bubble.me{background:linear-gradient(135deg,#7888b8,#141c34)}
  html[data-theme="cloudspirit"] .bubble.them{background:rgba(30,42,72,.55);margin-top:22px;}
  html[data-theme="cloudspirit"] .navbar{background:rgba(24,34,58,.9)}
  html[data-theme="cloudspirit"] .navbar button.active{color:#a8b8e0}
  html[data-theme="cloudspirit"] .theme-toggle,html[data-theme="cloudspirit"] .theme-menu{background:rgba(24,34,58,.85);border-color:rgba(168,184,224,.18)}
  html[data-theme="cloudspirit"] .particle{background:radial-gradient(circle,#c8d4f0,transparent 70%) !important;opacity:.35;}
  html[data-theme="cloudspirit"] .bubble.them::before{content:'';position:absolute;top:-24px;left:8px;width:38px;height:34px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22translate%22%20values%3D%220%200%3B0%20-3%3B0%200%22%20dur%3D%223.4s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M14%2030c-6%200-6-10%202-10%201-6%208-8%2011-3%204-4%2012-1%2011%205%206%200%206%209-1%209Z%22%20fill%3D%22%23e8ecf5%22/%3E%3Cellipse%20cx%3D%2223%22%20cy%3D%2224%22%20rx%3D%222%22%20ry%3D%222%22%20fill%3D%22%234a5878%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222%3B2%3B0.3%3B2%3B2%22%20dur%3D%224.8s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Cellipse%20cx%3D%2237%22%20cy%3D%2224%22%20rx%3D%222%22%20ry%3D%222%22%20fill%3D%22%234a5878%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222%3B2%3B0.3%3B2%3B2%22%20dur%3D%224.8s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Cpath%20d%3D%22M26%2029c1.4%201.2%204.6%201.2%206%200%22%20stroke%3D%22%234a5878%22%20stroke-width%3D%221.6%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;}
  html[data-theme="cloudspirit"] .bubble.them + .bubble.them{margin-top:10px;}
  html[data-theme="cloudspirit"] .bubble.them + .bubble.them::before{display:none;}
  html[data-theme="cloudspirit"] .bubble.me::after,html[data-theme="cloudspirit"] .bubble.them::after{content:'';position:absolute;bottom:-8px;left:14px;width:34px;height:17px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2040%2020%22%3E%3Cpath%20d%3D%22M8%203l1.6%206.4L16%2011l-6.4%201.6L8%2019l-1.6-6.4L0%2011l6.4-1.6Z%22%20fill%3D%22%23d8e0f5%22%20opacity%3D%220.65%22/%3E%3Cpath%20d%3D%22M30%206l0.9%203.6L34.5%2011l-3.1%200.9L30%2015l-0.9-3.6L26.5%2011l3.1-0.9Z%22%20fill%3D%22%23c8d4f0%22%20opacity%3D%220.55%22/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;animation:particleDrift 3.2s ease-in-out infinite;}
  html[data-theme="cloudspirit"] .bubble.me::after{right:14px;left:auto;}
  html[data-theme="car"]{--bg-deep:#1a1206;--bg-panel:rgba(48,30,14,.7);--bg-panel-2:rgba(60,38,18,.72);--ink:#fbf0e0;--ink-dim:#d9b090;--primary:#eda067;--primary-dim:#c88550;--primary-ink:#2a1a08;--rose:#f3c896;--friend-accent:#e1915a;--line:rgba(232,133,60,.16);}
  html[data-theme="car"] body{background:radial-gradient(circle at 50% -8%,rgba(232,133,60,.2),transparent 40%),radial-gradient(circle at 8% 90%,rgba(232,133,60,.12),transparent 34%),#1a1206;}
  html[data-theme="car"] .phone{background:linear-gradient(155deg,#1a1206,#000);border-color:rgba(232,133,60,.2);box-shadow:0 45px 110px rgba(0,0,0,.6),inset 0 1px rgba(255,255,255,.08);}
  html[data-theme="car"] .card{background:linear-gradient(145deg,rgba(232,133,60,.09),rgba(232,133,60,.05));box-shadow:inset 0 1px rgba(255,255,255,.05),0 14px 36px rgba(0,0,0,.26);backdrop-filter:blur(14px);}
  html[data-theme="car"] .btn{background:linear-gradient(135deg,#f0b878,#e8853c);box-shadow:0 10px 26px rgba(232,133,60,.28)}
  html[data-theme="car"] .chip.on{background:linear-gradient(135deg,#f0b878,#d8722c);border-color:#d8722c;color:#2a1a08}
  html[data-theme="car"] .eyebrow{color:#e8853c}
  html[data-theme="car"] .bubble.me{background:linear-gradient(135deg,#b8621f,#2a1a08)}
  html[data-theme="car"] .bubble.them{background:rgba(60,38,18,.55);margin-top:22px;}
  html[data-theme="car"] .navbar{background:rgba(48,30,14,.9)}
  html[data-theme="car"] .navbar button.active{color:#e8853c}
  html[data-theme="car"] .theme-toggle,html[data-theme="car"] .theme-menu{background:rgba(48,30,14,.85);border-color:rgba(232,133,60,.18)}
  html[data-theme="car"] .particle{background:radial-gradient(circle,#f0b878,transparent 70%) !important;opacity:.35;}
  html[data-theme="car"] .bubble.them::before{content:'';position:absolute;top:-24px;left:8px;width:38px;height:34px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22translate%22%20values%3D%220%200%3B0%20-2%3B0%200%22%20dur%3D%222.2s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M8%2032c0-3%203-5%206-8%203-3%208-4%2016-4s13%201%2016%204c3%203%206%205%206%208v4H8Z%22%20fill%3D%22%23e8853c%22/%3E%3Crect%20x%3D%2218%22%20y%3D%2218%22%20width%3D%2224%22%20height%3D%2210%22%20rx%3D%223%22%20fill%3D%22%23a8d8f0%22%20opacity%3D%220.85%22/%3E%3Ccircle%20cx%3D%2218%22%20cy%3D%2238%22%20r%3D%225%22%20fill%3D%22%231a1206%22/%3E%3Ccircle%20cx%3D%2242%22%20cy%3D%2238%22%20r%3D%225%22%20fill%3D%22%231a1206%22/%3E%3Ccircle%20cx%3D%2218%22%20cy%3D%2238%22%20r%3D%222%22%20fill%3D%22%238a8a8a%22/%3E%3Ccircle%20cx%3D%2242%22%20cy%3D%2238%22%20r%3D%222%22%20fill%3D%22%238a8a8a%22/%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;}
  html[data-theme="car"] .bubble.them + .bubble.them{margin-top:10px;}
  html[data-theme="car"] .bubble.them + .bubble.them::before{display:none;}
  html[data-theme="car"] .bubble.me::after,html[data-theme="car"] .bubble.them::after{content:'';position:absolute;bottom:-8px;left:14px;width:34px;height:17px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2040%2020%22%3E%3Cpath%20d%3D%22M2%2010c4-4%208-4%2010%200s6%204%2010%200%22%20stroke%3D%22%23f0b878%22%20stroke-width%3D%221.4%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%20opacity%3D%220.5%22/%3E%3Ccircle%20cx%3D%2230%22%20cy%3D%226%22%20r%3D%221.6%22%20fill%3D%22%23f5cc9a%22%20opacity%3D%220.5%22/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;animation:particleDrift 3.2s ease-in-out infinite;}
  html[data-theme="car"] .bubble.me::after{right:14px;left:auto;}
  html[data-theme="samurai"] .bubble.them::before{content:'';position:absolute;top:-24px;left:8px;width:38px;height:34px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%22-3%2030%2028%3B3%2030%2028%3B-3%2030%2028%22%20dur%3D%223.4s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M22%206l3%206M38%206l-3%206%22%20stroke%3D%22%238a2020%22%20stroke-width%3D%222.4%22%20stroke-linecap%3D%22round%22/%3E%3Cpath%20d%3D%22M10%2024C10%2013%2018%208%2030%208s20%205%2020%2016c0%2012-9%2019-20%2019s-20-7-20-19Z%22%20fill%3D%22%23b83030%22/%3E%3Cpath%20d%3D%22M8%2026h44v10c0%202-2%203-4%203H12c-2%200-4-1-4-3Z%22%20fill%3D%22%235a1414%22/%3E%3Cellipse%20cx%3D%2223%22%20cy%3D%2230%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%23f0d090%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Cellipse%20cx%3D%2237%22%20cy%3D%2230%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%23f0d090%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;}
  html[data-theme="samurai"] .bubble.them + .bubble.them::before{display:none;}
  html[data-theme="samurai"] .bubble.me::after,html[data-theme="samurai"] .bubble.them::after{content:'';position:absolute;bottom:-8px;left:14px;width:34px;height:17px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2040%2020%22%3E%3Ccircle%20cx%3D%226%22%20cy%3D%2213%22%20r%3D%222.2%22%20fill%3D%22%23e59a9a%22%20opacity%3D%220.55%22/%3E%3Ccircle%20cx%3D%2216%22%20cy%3D%227%22%20r%3D%221.5%22%20fill%3D%22%23f0c0c0%22%20opacity%3D%220.5%22/%3E%3Ccircle%20cx%3D%2226%22%20cy%3D%2213%22%20r%3D%222%22%20fill%3D%22%23e08080%22%20opacity%3D%220.45%22/%3E%3Ccircle%20cx%3D%2234%22%20cy%3D%228%22%20r%3D%221.3%22%20fill%3D%22%23f0a8a8%22%20opacity%3D%220.5%22/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;animation:particleDrift 3.2s ease-in-out infinite;}
  html[data-theme="samurai"] .bubble.me::after{right:14px;left:auto;}
  html[data-theme="forest"] .bubble.them::before{content:'';position:absolute;top:-24px;left:8px;width:38px;height:34px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%22-3%2030%2028%3B3%2030%2028%3B-3%2030%2028%22%20dur%3D%223.4s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M18%2012c-4-4-2-10%203-8-1%203%200%206%202%207Z%20M42%2012c4-4%202-10-3-8%201%203%200%206-2%207Z%22%20fill%3D%22%238a6a4a%22/%3E%3Cpath%20d%3D%22M10%2026C10%2015%2018%209%2030%209s20%206%2020%2017c0%2011-9%2018-20%2018s-20-7-20-18Z%22%20fill%3D%22%23a8825c%22/%3E%3Cpath%20d%3D%22M30%2027C22%2027%2017%2032%2017%2038c0%205%206%207%2013%207s13-2%2013-7c0-6-5-11-13-11Z%22%20fill%3D%22%23ede0cc%22/%3E%3Cellipse%20cx%3D%2223%22%20cy%3D%2227%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%232a1c10%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Cellipse%20cx%3D%2237%22%20cy%3D%2227%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%232a1c10%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Cellipse%20cx%3D%2230%22%20cy%3D%2233%22%20rx%3D%222.4%22%20ry%3D%221.8%22%20fill%3D%22%232a1c10%22/%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;}
  html[data-theme="forest"] .bubble.them + .bubble.them::before{display:none;}
  html[data-theme="forest"] .bubble.me::after,html[data-theme="forest"] .bubble.them::after{content:'';position:absolute;bottom:-8px;left:14px;width:34px;height:17px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2040%2020%22%3E%3Cg%20transform%3D%22translate%287%2C13%29%20scale%281%29%20rotate%280%29%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23c4b088%22%20opacity%3D%220.6%22%20transform%3D%22rotate%280%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23c4b088%22%20opacity%3D%220.6%22%20transform%3D%22rotate%2872%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23c4b088%22%20opacity%3D%220.6%22%20transform%3D%22rotate%28144%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23c4b088%22%20opacity%3D%220.6%22%20transform%3D%22rotate%28216%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23c4b088%22%20opacity%3D%220.6%22%20transform%3D%22rotate%28288%29%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%220%22%20r%3D%221%22%20fill%3D%22%23e8dcb8%22/%3E%3C/g%3E%3Cg%20transform%3D%22translate%2830%2C7%29%20scale%280.75%29%20rotate%2820%29%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23c4b088%22%20opacity%3D%220.6%22%20transform%3D%22rotate%280%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23c4b088%22%20opacity%3D%220.6%22%20transform%3D%22rotate%2872%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23c4b088%22%20opacity%3D%220.6%22%20transform%3D%22rotate%28144%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23c4b088%22%20opacity%3D%220.6%22%20transform%3D%22rotate%28216%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23c4b088%22%20opacity%3D%220.6%22%20transform%3D%22rotate%28288%29%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%220%22%20r%3D%221%22%20fill%3D%22%23e8dcb8%22/%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;animation:particleDrift 3.2s ease-in-out infinite;}
  html[data-theme="forest"] .bubble.me::after{right:14px;left:auto;}
  html[data-theme="lightning"] .bubble.them::before{content:'';position:absolute;top:-24px;left:8px;width:38px;height:34px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%22-3%2030%2028%3B3%2030%2028%3B-3%2030%2028%22%20dur%3D%223.4s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M10%2026C10%2015%2018%209%2030%209s20%206%2020%2017c0%2011-9%2018-20%2018s-20-7-20-18Z%22%20fill%3D%22%235c6ce0%22/%3E%3Cpath%20d%3D%22M26%203l-7%2012h5l-4%209%2012-14h-5l5-7Z%22%20fill%3D%22%23f0e060%22/%3E%3Cellipse%20cx%3D%2223%22%20cy%3D%2227%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%231a0805%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Cellipse%20cx%3D%2237%22%20cy%3D%2227%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%231a0805%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Cpath%20d%3D%22M27%2034c1.4%201.4%204.6%201.4%206%200%22%20stroke%3D%22%230a0c1c%22%20stroke-width%3D%222%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;}
  html[data-theme="lightning"] .bubble.them + .bubble.them::before{display:none;}
  html[data-theme="lightning"] .bubble.me::after,html[data-theme="lightning"] .bubble.them::after{content:'';position:absolute;bottom:-8px;left:14px;width:34px;height:17px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2040%2020%22%3E%3Cpath%20d%3D%22M8%203l1.6%206.4L16%2011l-6.4%201.6L8%2019l-1.6-6.4L0%2011l6.4-1.6Z%22%20fill%3D%22%23f0e090%22%20opacity%3D%220.65%22/%3E%3Cpath%20d%3D%22M30%206l0.9%203.6L34.5%2011l-3.1%200.9L30%2015l-0.9-3.6L26.5%2011l3.1-0.9Z%22%20fill%3D%22%23a8b4ff%22%20opacity%3D%220.55%22/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;animation:particleDrift 3.2s ease-in-out infinite;}
  html[data-theme="lightning"] .bubble.me::after{right:14px;left:auto;}
  html[data-theme="midnight"] .bubble.them::before{content:'';position:absolute;top:-24px;left:8px;width:38px;height:34px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%22-3%2030%2028%3B3%2030%2028%3B-3%2030%2028%22%20dur%3D%223.6s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M10%2028C10%2017%2018%2011%2030%2011s20%206%2020%2017c0%2010-9%2016-20%2016s-20-6-20-16Z%22%20fill%3D%22%233a4a8c%22/%3E%3Cpath%20d%3D%22M30%200l3.4%207.4L41%2010l-7.6%202.6L30%2020l-3.4-7.4L19%2010l7.6-2.6Z%22%20fill%3D%22%23e8c874%22/%3E%3Cellipse%20cx%3D%2223%22%20cy%3D%2227%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%231a0805%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Cellipse%20cx%3D%2237%22%20cy%3D%2227%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%231a0805%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Cpath%20d%3D%22M27%2033c1.4%201.4%204.6%201.4%206%200%22%20stroke%3D%22%230a1128%22%20stroke-width%3D%222%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;}
  html[data-theme="midnight"] .bubble.them + .bubble.them::before{display:none;}
  html[data-theme="midnight"] .bubble.me::after,html[data-theme="midnight"] .bubble.them::after{content:'';position:absolute;bottom:-8px;left:14px;width:34px;height:17px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2040%2020%22%3E%3Cpath%20d%3D%22M8%203l1.6%206.4L16%2011l-6.4%201.6L8%2019l-1.6-6.4L0%2011l6.4-1.6Z%22%20fill%3D%22%23eddca8%22%20opacity%3D%220.65%22/%3E%3Cpath%20d%3D%22M30%206l0.9%203.6L34.5%2011l-3.1%200.9L30%2015l-0.9-3.6L26.5%2011l3.1-0.9Z%22%20fill%3D%22%23eddca8%22%20opacity%3D%220.55%22/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;animation:particleDrift 3.2s ease-in-out infinite;}
  html[data-theme="midnight"] .bubble.me::after{right:14px;left:auto;}

  html[data-theme="desert"] .bubble.them{margin-top:22px;}
  html[data-theme="desert"] .bubble.them::before{content:'';position:absolute;top:-24px;left:8px;width:38px;height:34px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%0A%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%22-6%2044%2040%3B6%2044%2040%3B-6%2044%2040%22%20dur%3D%221.1s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M44%2040c6%204%2012%202%2013-4-5%202-9%201-11-3%205%200%208-4%207-9-4%203-8%205-11%204Z%22%20fill%3D%22%23c98a4a%22/%3E%3C/g%3E%0A%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%22-3%2030%2030%3B3%2030%2030%3B-3%2030%2030%22%20dur%3D%223.4s%22%20repeatCount%3D%22indefinite%22/%3E%0A%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%220%2014%2020%3B8%2014%2020%3B0%2014%2020%3B-8%2014%2020%3B0%2014%2020%22%20dur%3D%222.9s%22%20begin%3D%220s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M8%2020%20Q4%208%2014%2014%20Q18%2018%2016%2026%20Z%22%20fill%3D%22%23c98a4a%22/%3E%3C/g%3E%0A%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%220%2046%2020%3B8%2046%2020%3B0%2046%2020%3B-8%2046%2020%3B0%2046%2020%22%20dur%3D%222.9s%22%20begin%3D%220.3s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M52%2020%20Q56%208%2046%2014%20Q42%2018%2044%2026%20Z%22%20fill%3D%22%23c98a4a%22/%3E%3C/g%3E%0A%3Cpath%20d%3D%22M10%2026C10%2015%2018%209%2030%209s20%206%2020%2017c0%2011-9%2018-20%2018s-20-7-20-18Z%22%20fill%3D%22%23e8a868%22/%3E%0A%3Cpath%20d%3D%22M30%2027C22%2027%2017%2032%2017%2039c0%205%206%207%2013%207s13-2%2013-7c0-7-5-12-13-12Z%22%20fill%3D%22%23fbe4c8%22/%3E%0A%3Cellipse%20cx%3D%2223%22%20cy%3D%2227%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%231a0805%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%0A%3Cellipse%20cx%3D%2237%22%20cy%3D%2227%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%231a0805%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%0A%3Cellipse%20cx%3D%2230%22%20cy%3D%2233%22%20rx%3D%223%22%20ry%3D%222.2%22%20fill%3D%22%231a0805%22/%3E%0A%3Cpath%20d%3D%22M27%2040c1.4%201.6%204.6%201.6%206%200%22%20stroke%3D%22%231a0805%22%20stroke-width%3D%222%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%0A%3Cpath%20d%3D%22M30%2041v4%22%20stroke%3D%22%23e8607a%22%20stroke-width%3D%223%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%0A%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;}
  html[data-theme="desert"] .bubble.them + .bubble.them{margin-top:10px;}
  html[data-theme="desert"] .bubble.them + .bubble.them::before{display:none;}
  html[data-theme="desert"] .bubble.me::after,html[data-theme="desert"] .bubble.them::after{content:'';position:absolute;bottom:-8px;left:14px;width:34px;height:17px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2040%2020%22%3E%3Cg%20transform%3D%22translate%284%2C2%29%20rotate%2815%29%22%3E%3Cpath%20d%3D%22M1%2012C1%206%206%201%2012%201c0%206-5%2011-11%2011Z%22%20fill%3D%22%23eec090%22%20opacity%3D%220.65%22/%3E%3C/g%3E%3Cg%20transform%3D%22translate%2826%2C8%29%20rotate%28-20%29%20scale%280.6%29%22%3E%3Cpath%20d%3D%22M1%2012C1%206%206%201%2012%201c0%206-5%2011-11%2011Z%22%20fill%3D%22%23e8a868%22%20opacity%3D%220.5%22/%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;animation:particleDrift 3.2s ease-in-out infinite;}
  html[data-theme="desert"] .bubble.me::after{right:14px;left:auto;}

  html[data-theme="garden"] .bubble.them{margin-top:22px;}
  html[data-theme="garden"] .bubble.them::before{content:'';position:absolute;top:-24px;left:8px;width:38px;height:34px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%3Cpath%20d%3D%22M9%2022%20L6%206%20L22%2016%20Z%22%20fill%3D%22%239ed88f%22/%3E%3Cpath%20d%3D%22M51%2022%20L54%206%20L38%2016%20Z%22%20fill%3D%22%239ed88f%22/%3E%3Cpath%20d%3D%22M11%2027C11%2016%2019%2010%2030%2010s19%206%2019%2017c0%2011-8%2017-19%2017s-19-6-19-17Z%22%20fill%3D%22%23b8e8a8%22/%3E%3Ccircle%20cx%3D%2223%22%20cy%3D%2228%22%20r%3D%222.6%22%20fill%3D%22%230a2410%22/%3E%3Ccircle%20cx%3D%2237%22%20cy%3D%2228%22%20r%3D%222.6%22%20fill%3D%22%230a2410%22/%3E%3Cpath%20d%3D%22M28%2033l2%202%202-2%22%20fill%3D%22%234c7f40%22/%3E%3Cpath%20d%3D%22M27%2037c1.4%201.4%204.6%201.4%206%200%22%20stroke%3D%22%230a2410%22%20stroke-width%3D%222%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%3Cpath%20d%3D%22M14%2030l-9-2M14%2034l-9%201M46%2030l9-2M46%2034l9%201%22%20stroke%3D%22%230a2410%22%20stroke-width%3D%221.4%22%20stroke-linecap%3D%22round%22/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;}
  html[data-theme="garden"] .bubble.them + .bubble.them{margin-top:10px;}
  html[data-theme="garden"] .bubble.them + .bubble.them::before{display:none;}
  html[data-theme="garden"] .bubble.me::after,html[data-theme="garden"] .bubble.them::after{content:'';position:absolute;bottom:-8px;left:14px;width:34px;height:17px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2040%2020%22%3E%3Cg%20transform%3D%22translate%287%2C13%29%20scale%281%29%20rotate%280%29%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23c8e8a8%22%20opacity%3D%220.6%22%20transform%3D%22rotate%280%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23c8e8a8%22%20opacity%3D%220.6%22%20transform%3D%22rotate%2872%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23c8e8a8%22%20opacity%3D%220.6%22%20transform%3D%22rotate%28144%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23c8e8a8%22%20opacity%3D%220.6%22%20transform%3D%22rotate%28216%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23c8e8a8%22%20opacity%3D%220.6%22%20transform%3D%22rotate%28288%29%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%220%22%20r%3D%221%22%20fill%3D%22%23f0e888%22/%3E%3C/g%3E%3Cg%20transform%3D%22translate%2830%2C7%29%20scale%280.75%29%20rotate%2820%29%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23c8e8a8%22%20opacity%3D%220.6%22%20transform%3D%22rotate%280%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23c8e8a8%22%20opacity%3D%220.6%22%20transform%3D%22rotate%2872%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23c8e8a8%22%20opacity%3D%220.6%22%20transform%3D%22rotate%28144%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23c8e8a8%22%20opacity%3D%220.6%22%20transform%3D%22rotate%28216%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23c8e8a8%22%20opacity%3D%220.6%22%20transform%3D%22rotate%28288%29%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%220%22%20r%3D%221%22%20fill%3D%22%23f0e888%22/%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;animation:particleDrift 3.2s ease-in-out infinite;}
  html[data-theme="garden"] .bubble.me::after{right:14px;left:auto;}

  /* ==== 6 base themes: mascot + drifting particles (parity with the other 20) ==== */
  /* --- velvet mascot + particles --- */
  html[data-theme="velvet"] .bubble.them::before{content:'';position:absolute;top:-24px;left:8px;width:38px;height:34px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%0A%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%22-6%2046%2046%3B6%2046%2046%3B-6%2046%2046%22%20dur%3D%222.6s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M46%2046m-7%2C0a7%2C7%200%201%2C0%2014%2C0a7%2C7%200%201%2C0%20-14%2C0%22%20fill%3D%22%23e8ecff%22/%3E%3C/g%3E%0A%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%22-3%2030%2028%3B3%2030%2028%3B-3%2030%2028%22%20dur%3D%223.4s%22%20repeatCount%3D%22indefinite%22/%3E%0A%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%220%2016%2022%3B8%2016%2022%3B0%2016%2022%3B-8%2016%2022%3B0%2016%2022%22%20dur%3D%222.8s%22%20begin%3D%220s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M16%2022C8%2010%2010%20-2%2016%204c5%205%206%2014%205%2020Z%22%20fill%3D%22%238C9EFF%22/%3E%3C/g%3E%0A%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%220%2044%2022%3B8%2044%2022%3B0%2044%2022%3B-8%2044%2022%3B0%2044%2022%22%20dur%3D%222.8s%22%20begin%3D%220.3s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M44%2022c8-12%206-24%200-18-5%205-6%2014-5%2020Z%22%20fill%3D%22%238C9EFF%22/%3E%3C/g%3E%0A%3Cpath%20d%3D%22M10%2032C10%2020%2018%2014%2030%2014s20%206%2020%2018c0%2010-9%2016-20%2016s-20-6-20-16Z%22%20fill%3D%22%23B4C0FF%22/%3E%0A%3Cellipse%20cx%3D%2223%22%20cy%3D%2231%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%2312142A%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%0A%3Cellipse%20cx%3D%2237%22%20cy%3D%2231%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%2312142A%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%0A%3Cpath%20d%3D%22M28%2037c1.4%201.4%204.6%201.4%206%200%22%20stroke%3D%22%2312142A%22%20stroke-width%3D%222%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%0A%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;}
  html[data-theme="velvet"] .bubble.them + .bubble.them{margin-top:10px;}
  html[data-theme="velvet"] .bubble.them + .bubble.them::before{display:none;}
  html.mascot-idle[data-theme="velvet"] .bubble.them::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%0A%3Cpath%20d%3D%22M16%2022C8%2010%2010%20-2%2016%204c5%205%206%2014%205%2020Z%22%20fill%3D%22%238C9EFF%22%20opacity%3D%220.6%22/%3E%0A%3Cpath%20d%3D%22M44%2022c8-12%206-24%200-18-5%205-6%2014-5%2020Z%22%20fill%3D%22%238C9EFF%22%20opacity%3D%220.6%22/%3E%0A%3Cpath%20d%3D%22M10%2032C10%2020%2018%2014%2030%2014s20%206%2020%2018c0%2010-9%2016-20%2016s-20-6-20-16Z%22%20fill%3D%22%23B4C0FF%22/%3E%0A%0A%3Cpath%20d%3D%22M19%2027c1.4-1.2%204.6-1.2%206%200%22%20stroke%3D%22%2312142A%22%20stroke-width%3D%222%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%0A%3Cpath%20d%3D%22M33%2027c1.4-1.2%204.6-1.2%206%200%22%20stroke%3D%22%2312142A%22%20stroke-width%3D%222%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%0A%0A%3Cg%20opacity%3D%220.85%22%3E%3Canimate%20attributeName%3D%22opacity%22%20values%3D%220.85%3B0.3%3B0.85%22%20dur%3D%222.6s%22%20repeatCount%3D%22indefinite%22/%3E%3Ctext%20x%3D%2244%22%20y%3D%2214%22%20font-size%3D%229%22%20fill%3D%22%238C9EFF%22%20font-family%3D%22sans-serif%22%3Ez%3C/text%3E%3Ctext%20x%3D%2250%22%20y%3D%228%22%20font-size%3D%226%22%20fill%3D%22%238C9EFF%22%20font-family%3D%22sans-serif%22%3Ez%3C/text%3E%3C/g%3E%0A%3C/svg%3E") !important;}
  html.mascot-idle[data-theme="ninja"] .bubble.them::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%0A%3Cpath%20d%3D%22M13%2022%20L4%207%20L21%2015%20Z%22%20fill%3D%22%23e8623c%22%20opacity%3D%220.6%22/%3E%0A%3Cpath%20d%3D%22M47%2022%20L56%207%20L39%2015%20Z%22%20fill%3D%22%23e8623c%22%20opacity%3D%220.6%22/%3E%0A%3Cpath%20d%3D%22M10%2026C10%2015%2018%209%2030%209s20%206%2020%2017c0%2011-9%2018-20%2018s-20-7-20-18Z%22%20fill%3D%22%23f0825a%22/%3E%0A%3Cpath%20d%3D%22M30%2026C22%2026%2017%2031%2017%2038c0%205%206%208%2013%208s13-3%2013-8c0-7-5-12-13-12Z%22%20fill%3D%22%23fbd7bc%22/%3E%0A%3Cpath%20d%3D%22M19%2027c1.4-1.2%204.6-1.2%206%200%22%20stroke%3D%22%231a0805%22%20stroke-width%3D%222%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%0A%3Cpath%20d%3D%22M33%2027c1.4-1.2%204.6-1.2%206%200%22%20stroke%3D%22%231a0805%22%20stroke-width%3D%222%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%0A%3Cpath%20d%3D%22M28%2034l2%202%202-2%22%20fill%3D%22%23c96a3a%22/%3E%0A%3Cg%20opacity%3D%220.85%22%3E%3Canimate%20attributeName%3D%22opacity%22%20values%3D%220.85%3B0.3%3B0.85%22%20dur%3D%222.6s%22%20repeatCount%3D%22indefinite%22/%3E%3Ctext%20x%3D%2244%22%20y%3D%2214%22%20font-size%3D%229%22%20fill%3D%22%23e8623c%22%20font-family%3D%22sans-serif%22%3Ez%3C/text%3E%3Ctext%20x%3D%2250%22%20y%3D%228%22%20font-size%3D%226%22%20fill%3D%22%23e8623c%22%20font-family%3D%22sans-serif%22%3Ez%3C/text%3E%3C/g%3E%0A%3C/svg%3E") !important;}
  html.mascot-idle[data-theme="desert"] .bubble.them::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%0A%3Cpath%20d%3D%22M8%2020%20Q4%208%2014%2014%20Q18%2018%2016%2026%20Z%22%20fill%3D%22%23c98a4a%22%20opacity%3D%220.6%22/%3E%0A%3Cpath%20d%3D%22M52%2020%20Q56%208%2046%2014%20Q42%2018%2044%2026%20Z%22%20fill%3D%22%23c98a4a%22%20opacity%3D%220.6%22/%3E%0A%3Cpath%20d%3D%22M10%2026C10%2015%2018%209%2030%209s20%206%2020%2017c0%2011-9%2018-20%2018s-20-7-20-18Z%22%20fill%3D%22%23e8a868%22/%3E%0A%3Cpath%20d%3D%22M30%2027C22%2027%2017%2032%2017%2039c0%205%206%207%2013%207s13-2%2013-7c0-7-5-12-13-12Z%22%20fill%3D%22%23fbe4c8%22/%3E%0A%3Cpath%20d%3D%22M19%2027c1.4-1.2%204.6-1.2%206%200%22%20stroke%3D%22%231a0805%22%20stroke-width%3D%222%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%0A%3Cpath%20d%3D%22M33%2027c1.4-1.2%204.6-1.2%206%200%22%20stroke%3D%22%231a0805%22%20stroke-width%3D%222%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%0A%3Cellipse%20cx%3D%2230%22%20cy%3D%2233%22%20rx%3D%223%22%20ry%3D%222.2%22%20fill%3D%22%231a0805%22/%3E%0A%3Cg%20opacity%3D%220.85%22%3E%3Canimate%20attributeName%3D%22opacity%22%20values%3D%220.85%3B0.3%3B0.85%22%20dur%3D%222.6s%22%20repeatCount%3D%22indefinite%22/%3E%3Ctext%20x%3D%2244%22%20y%3D%2214%22%20font-size%3D%229%22%20fill%3D%22%23e8a868%22%20font-family%3D%22sans-serif%22%3Ez%3C/text%3E%3Ctext%20x%3D%2250%22%20y%3D%228%22%20font-size%3D%226%22%20fill%3D%22%23e8a868%22%20font-family%3D%22sans-serif%22%3Ez%3C/text%3E%3C/g%3E%0A%3C/svg%3E") !important;}
  html.mascot-idle[data-theme="ocean"] .bubble.them::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%3Cpath%20d%3D%22M8%2030C8%2015%2017%206%2030%206s22%209%2022%2024%22%20fill%3D%22%238ce8dc%22%20stroke%3D%22%234dc9ff%22%20stroke-width%3D%222%22/%3E%3Cpath%20d%3D%22M19%2022c1.4-1.2%204.6-1.2%206%200%22%20stroke%3D%22%23022538%22%20stroke-width%3D%222%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%3Cpath%20d%3D%22M33%2022c1.4-1.2%204.6-1.2%206%200%22%20stroke%3D%22%23022538%22%20stroke-width%3D%222%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%3Cpath%20d%3D%22M14%2030c0%208-3%2012-2%2020M24%2030c0%209-2%2013%200%2022M36%2030c0%209%202%2013%200%2022M46%2030c0%208%203%2012%202%2020%22%20stroke%3D%22%234dc9ff%22%20stroke-width%3D%223%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%20opacity%3D%220.6%22/%3E%3Cg%20opacity%3D%220.85%22%3E%3Canimate%20attributeName%3D%22opacity%22%20values%3D%220.85%3B0.3%3B0.85%22%20dur%3D%222.6s%22%20repeatCount%3D%22indefinite%22/%3E%3Ctext%20x%3D%2244%22%20y%3D%2214%22%20font-size%3D%229%22%20fill%3D%22%234dc9ff%22%20font-family%3D%22sans-serif%22%3Ez%3C/text%3E%3Ctext%20x%3D%2250%22%20y%3D%228%22%20font-size%3D%226%22%20fill%3D%22%234dc9ff%22%20font-family%3D%22sans-serif%22%3Ez%3C/text%3E%3C/g%3E%3C/svg%3E") !important;}
  html[data-theme="velvet"] .bubble.me::after,html[data-theme="velvet"] .bubble.them::after{content:'';position:absolute;bottom:-8px;left:14px;width:34px;height:17px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2040%2020%22%3E%3Cpath%20d%3D%22M8%203l1.6%206.4L16%2011l-6.4%201.6L8%2019l-1.6-6.4L0%2011l6.4-1.6Z%22%20fill%3D%22%23B4C0FF%22%20opacity%3D%220.65%22/%3E%3Cpath%20d%3D%22M30%206l0.9%203.6L34.5%2011l-3.1%200.9L30%2015l-0.9-3.6L26.5%2011l3.1-0.9Z%22%20fill%3D%22%238C9EFF%22%20opacity%3D%220.55%22/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;animation:particleDrift 3.2s ease-in-out infinite;}
  html[data-theme="velvet"] .bubble.me::after{right:14px;left:auto;}
  html[data-theme="velvet"] .bubble.them{margin-top:22px;}
  /* --- moonlight mascot + particles --- */
  html[data-theme="moonlight"] .bubble.them::before{content:'';position:absolute;top:-24px;left:8px;width:38px;height:34px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%22-3%2030%2028%3B3%2030%2028%3B-3%2030%2028%22%20dur%3D%223.4s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M10%2018%20L4%206%20L20%2012%20Z%22%20fill%3D%22%233d5a70%22/%3E%3Cpath%20d%3D%22M50%2018%20L56%206%20L40%2012%20Z%22%20fill%3D%22%233d5a70%22/%3E%3Cpath%20d%3D%22M10%2026C10%2015%2018%209%2030%209s20%206%2020%2017c0%2011-9%2018-20%2018s-20-7-20-18Z%22%20fill%3D%22%237a97ac%22/%3E%3Cpath%20d%3D%22M12%2022c0%206%204%2011%2011%2011s11-5%2011-11c0-3-2-5-11-5s-11%202-11%205Z%22%20fill%3D%22%230a1d2c%22%20opacity%3D%220.75%22/%3E%3Cpath%20d%3D%22M27%2022c0%206%204%2011%2011%2011s11-5%2011-11c0-3-2-5-11-5s-11%202-11%205Z%22%20fill%3D%22%230a1d2c%22%20opacity%3D%220.75%22/%3E%3Cellipse%20cx%3D%2223%22%20cy%3D%2226%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%23dcecf2%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Cellipse%20cx%3D%2237%22%20cy%3D%2226%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%23dcecf2%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Cellipse%20cx%3D%2230%22%20cy%3D%2233%22%20rx%3D%222.4%22%20ry%3D%221.8%22%20fill%3D%22%230a1d2c%22/%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;}
  html[data-theme="moonlight"] .bubble.them + .bubble.them{margin-top:10px;}
  html[data-theme="moonlight"] .bubble.them + .bubble.them::before{display:none;}
  html[data-theme="moonlight"] .bubble.me::after,html[data-theme="moonlight"] .bubble.them::after{content:'';position:absolute;bottom:-8px;left:14px;width:34px;height:17px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2040%2020%22%3E%3Cpath%20d%3D%22M8%203l1.6%206.4L16%2011l-6.4%201.6L8%2019l-1.6-6.4L0%2011l6.4-1.6Z%22%20fill%3D%22%23a5f0ff%22%20opacity%3D%220.65%22/%3E%3Cpath%20d%3D%22M30%206l0.9%203.6L34.5%2011l-3.1%200.9L30%2015l-0.9-3.6L26.5%2011l3.1-0.9Z%22%20fill%3D%22%23bcabff%22%20opacity%3D%220.55%22/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;animation:particleDrift 3.2s ease-in-out infinite;}
  html[data-theme="moonlight"] .bubble.me::after{right:14px;left:auto;}
  html[data-theme="moonlight"] .bubble.them{margin-top:22px;}
  /* --- pearl mascot + particles --- */
  html[data-theme="pearl"] .bubble.them{background:#fffaf4;box-shadow:0 6px 18px rgba(84,51,38,.07);margin-top:22px;}
  html[data-theme="pearl"] .bubble.them::before{content:'';position:absolute;top:-24px;left:8px;width:38px;height:34px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%22-3%2030%2028%3B3%2030%2028%3B-3%2030%2028%22%20dur%3D%223.8s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M38%206C30%206%2026%2014%2030%2020c-6%202-10%208-10%2014%200%208%207%2014%2016%2014s16-6%2016-14c0-11-6-28-14-28Z%22%20fill%3D%22%23fffaf3%22%20stroke%3D%22%23e6ad93%22%20stroke-width%3D%221.6%22/%3E%3Cpath%20d%3D%22M40%2016c3-2%206-1%205%202-2%200-4%200-5-2Z%22%20fill%3D%22%23e6ad93%22/%3E%3Ccircle%20cx%3D%2235%22%20cy%3D%2214%22%20r%3D%221.8%22%20fill%3D%22%23302927%22/%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;}
  html[data-theme="pearl"] .bubble.them + .bubble.them{margin-top:10px;}
  html[data-theme="pearl"] .bubble.them + .bubble.them::before{display:none;}
  html[data-theme="pearl"] .bubble.me::after,html[data-theme="pearl"] .bubble.them::after{content:'';position:absolute;bottom:-8px;left:14px;width:34px;height:17px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2040%2020%22%3E%3Ccircle%20cx%3D%226%22%20cy%3D%2213%22%20r%3D%222.2%22%20fill%3D%22%23e6ad93%22%20opacity%3D%220.55%22/%3E%3Ccircle%20cx%3D%2216%22%20cy%3D%227%22%20r%3D%221.5%22%20fill%3D%22%23f0c8b0%22%20opacity%3D%220.5%22/%3E%3Ccircle%20cx%3D%2226%22%20cy%3D%2213%22%20r%3D%222%22%20fill%3D%22%23cb8f7e%22%20opacity%3D%220.45%22/%3E%3Ccircle%20cx%3D%2234%22%20cy%3D%228%22%20r%3D%221.3%22%20fill%3D%22%23e19b9e%22%20opacity%3D%220.5%22/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;animation:particleDrift 3.2s ease-in-out infinite;}
  html[data-theme="pearl"] .bubble.me::after{right:14px;left:auto;}
  /* --- anime mascot + particles --- */
  html[data-theme="anime"] .bubble.them{background:rgba(64,26,90,.55);box-shadow:0 6px 18px rgba(0,0,0,.2);margin-top:22px;}
  html[data-theme="anime"] .bubble.them::before{content:'';position:absolute;top:-24px;left:8px;width:38px;height:34px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%22-3%2030%2028%3B3%2030%2028%3B-3%2030%2028%22%20dur%3D%223.6s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M10%2022%20L4%206%20L22%2014%20Z%22%20fill%3D%22%23ff82bb%22/%3E%3Cpath%20d%3D%22M50%2022%20L56%206%20L38%2014%20Z%22%20fill%3D%22%23ff82bb%22/%3E%3Cpath%20d%3D%22M10%2027C10%2016%2018%2010%2030%2010s20%206%2020%2017c0%2010-9%2016-20%2016s-20-6-20-16Z%22%20fill%3D%22%23ffa8cc%22/%3E%3Cpath%20d%3D%22M20%2026l2%202.4%202-2.4-1%203%202%201-2.4.6.4%202.4-2-1.6-2%201.6.4-2.4-2.4-.6%202-1Z%22%20fill%3D%22%23150d2e%22/%3E%3Cpath%20d%3D%22M34%2026l2%202.4%202-2.4-1%203%202%201-2.4.6.4%202.4-2-1.6-2%201.6.4-2.4-2.4-.6%202-1Z%22%20fill%3D%22%23150d2e%22/%3E%3Cpath%20d%3D%22M28%2033c1%201%203%201%204%200%22%20stroke%3D%22%23150d2e%22%20stroke-width%3D%221.6%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;}
  html[data-theme="anime"] .bubble.them + .bubble.them{margin-top:10px;}
  html[data-theme="anime"] .bubble.them + .bubble.them::before{display:none;}
  html[data-theme="anime"] .bubble.me::after,html[data-theme="anime"] .bubble.them::after{content:'';position:absolute;bottom:-8px;left:14px;width:34px;height:17px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2040%2020%22%3E%3Cpath%20d%3D%22M8%203l1.6%206.4L16%2011l-6.4%201.6L8%2019l-1.6-6.4L0%2011l6.4-1.6Z%22%20fill%3D%22%23ff82bb%22%20opacity%3D%220.65%22/%3E%3Cpath%20d%3D%22M30%206l0.9%203.6L34.5%2011l-3.1%200.9L30%2015l-0.9-3.6L26.5%2011l3.1-0.9Z%22%20fill%3D%22%2376e1ff%22%20opacity%3D%220.55%22/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;animation:particleDrift 3.2s ease-in-out infinite;}
  html[data-theme="anime"] .bubble.me::after{right:14px;left:auto;}
  /* --- sakura mascot + particles --- */
  html[data-theme="sakura"] .bubble.them{background:rgba(74,36,48,.55);margin-top:22px;}
  html[data-theme="sakura"] .bubble.them::before{content:'';position:absolute;top:-24px;left:8px;width:38px;height:34px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%22-3%2030%2028%3B3%2030%2028%3B-3%2030%2028%22%20dur%3D%223.4s%22%20repeatCount%3D%22indefinite%22/%3E%3Cpath%20d%3D%22M18%2012c-4-4-2-10%203-8-1%203%200%206%202%207Z%20M42%2012c4-4%202-10-3-8%201%203%200%206-2%207Z%22%20fill%3D%22%23c98a9e%22/%3E%3Cpath%20d%3D%22M10%2026C10%2015%2018%209%2030%209s20%206%2020%2017c0%2011-9%2018-20%2018s-20-7-20-18Z%22%20fill%3D%22%23f0a8bc%22/%3E%3Cpath%20d%3D%22M30%2027C22%2027%2017%2032%2017%2038c0%205%206%207%2013%207s13-2%2013-7c0-6-5-11-13-11Z%22%20fill%3D%22%23fde4ec%22/%3E%3Cg%20transform%3D%22translate%2844%2C10%29%20scale%280.7%29%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-4%22%20rx%3D%222.6%22%20ry%3D%223.6%22%20fill%3D%22%23f8bbd1%22%20opacity%3D%220.85%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-4%22%20rx%3D%222.6%22%20ry%3D%223.6%22%20fill%3D%22%23f8bbd1%22%20opacity%3D%220.85%22%20transform%3D%22rotate%2872%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-4%22%20rx%3D%222.6%22%20ry%3D%223.6%22%20fill%3D%22%23f8bbd1%22%20opacity%3D%220.85%22%20transform%3D%22rotate%28144%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-4%22%20rx%3D%222.6%22%20ry%3D%223.6%22%20fill%3D%22%23f8bbd1%22%20opacity%3D%220.85%22%20transform%3D%22rotate%28216%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-4%22%20rx%3D%222.6%22%20ry%3D%223.6%22%20fill%3D%22%23f8bbd1%22%20opacity%3D%220.85%22%20transform%3D%22rotate%28288%29%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%220%22%20r%3D%221.6%22%20fill%3D%22%23e8c874%22/%3E%3C/g%3E%3Cellipse%20cx%3D%2223%22%20cy%3D%2227%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%233a1420%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Cellipse%20cx%3D%2237%22%20cy%3D%2227%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%233a1420%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Cellipse%20cx%3D%2230%22%20cy%3D%2233%22%20rx%3D%222.4%22%20ry%3D%221.8%22%20fill%3D%22%233a1420%22/%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;}
  html[data-theme="sakura"] .bubble.them + .bubble.them{margin-top:10px;}
  html[data-theme="sakura"] .bubble.them + .bubble.them::before{display:none;}
  html[data-theme="sakura"] .bubble.me::after,html[data-theme="sakura"] .bubble.them::after{content:'';position:absolute;bottom:-8px;left:14px;width:34px;height:17px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2040%2020%22%3E%3Cg%20transform%3D%22translate%287%2C13%29%20scale%281%29%20rotate%280%29%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23f8bbd1%22%20opacity%3D%220.6%22%20transform%3D%22rotate%280%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23f8bbd1%22%20opacity%3D%220.6%22%20transform%3D%22rotate%2872%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23f8bbd1%22%20opacity%3D%220.6%22%20transform%3D%22rotate%28144%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23f8bbd1%22%20opacity%3D%220.6%22%20transform%3D%22rotate%28216%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23f8bbd1%22%20opacity%3D%220.6%22%20transform%3D%22rotate%28288%29%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%220%22%20r%3D%221%22%20fill%3D%22%23e8c874%22/%3E%3C/g%3E%3Cg%20transform%3D%22translate%2830%2C7%29%20scale%280.75%29%20rotate%2820%29%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23f8bbd1%22%20opacity%3D%220.6%22%20transform%3D%22rotate%280%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23f8bbd1%22%20opacity%3D%220.6%22%20transform%3D%22rotate%2872%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23f8bbd1%22%20opacity%3D%220.6%22%20transform%3D%22rotate%28144%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23f8bbd1%22%20opacity%3D%220.6%22%20transform%3D%22rotate%28216%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23f8bbd1%22%20opacity%3D%220.6%22%20transform%3D%22rotate%28288%29%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%220%22%20r%3D%221%22%20fill%3D%22%23e8c874%22/%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;animation:particleDrift 3.2s ease-in-out infinite;}
  html[data-theme="sakura"] .bubble.me::after{right:14px;left:auto;}
  /* --- meadow mascot + particles --- */
  html[data-theme="meadow"] .bubble.them{background:rgba(30,54,44,.55);margin-top:22px;}
  html[data-theme="meadow"] .bubble.them::before{content:'';position:absolute;top:-24px;left:8px;width:38px;height:34px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2054%22%3E%3Cg%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20values%3D%22-3%2030%2028%3B3%2030%2028%3B-3%2030%2028%22%20dur%3D%223.2s%22%20repeatCount%3D%22indefinite%22/%3E%3Cellipse%20cx%3D%2214%22%20cy%3D%2220%22%20rx%3D%227%22%20ry%3D%2210%22%20fill%3D%22%23d5e4a8%22%20opacity%3D%220.65%22%20transform%3D%22rotate%28-25%2014%2020%29%22/%3E%3Cellipse%20cx%3D%2246%22%20cy%3D%2220%22%20rx%3D%227%22%20ry%3D%2210%22%20fill%3D%22%23d5e4a8%22%20opacity%3D%220.65%22%20transform%3D%22rotate%2825%2046%2020%29%22/%3E%3Cpath%20d%3D%22M10%2028C10%2017%2018%2011%2030%2011s20%206%2020%2017c0%2010-9%2016-20%2016s-20-6-20-16Z%22%20fill%3D%22%23f0d060%22/%3E%3Cpath%20d%3D%22M11%2024h38M11%2033h38%22%20stroke%3D%22%230d2418%22%20stroke-width%3D%224.5%22/%3E%3Cellipse%20cx%3D%2223%22%20cy%3D%2228%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%230d2418%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Cellipse%20cx%3D%2237%22%20cy%3D%2228%22%20rx%3D%222.6%22%20ry%3D%222.6%22%20fill%3D%22%230d2418%22%3E%3Canimate%20attributeName%3D%22ry%22%20values%3D%222.6%3B2.6%3B0.3%3B2.6%3B2.6%22%20dur%3D%224.2s%22%20repeatCount%3D%22indefinite%22/%3E%3C/ellipse%3E%3Cpath%20d%3D%22M27%2034c1.4%201.2%204.6%201.2%206%200%22%20stroke%3D%22%230d2418%22%20stroke-width%3D%221.8%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22/%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;}
  html[data-theme="meadow"] .bubble.them + .bubble.them{margin-top:10px;}
  html[data-theme="meadow"] .bubble.them + .bubble.them::before{display:none;}
  html[data-theme="meadow"] .bubble.me::after,html[data-theme="meadow"] .bubble.them::after{content:'';position:absolute;bottom:-8px;left:14px;width:34px;height:17px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2040%2020%22%3E%3Cg%20transform%3D%22translate%287%2C13%29%20scale%281%29%20rotate%280%29%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23d5e4a8%22%20opacity%3D%220.6%22%20transform%3D%22rotate%280%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23d5e4a8%22%20opacity%3D%220.6%22%20transform%3D%22rotate%2872%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23d5e4a8%22%20opacity%3D%220.6%22%20transform%3D%22rotate%28144%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23d5e4a8%22%20opacity%3D%220.6%22%20transform%3D%22rotate%28216%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23d5e4a8%22%20opacity%3D%220.6%22%20transform%3D%22rotate%28288%29%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%220%22%20r%3D%221%22%20fill%3D%22%23f0e888%22/%3E%3C/g%3E%3Cg%20transform%3D%22translate%2830%2C7%29%20scale%280.75%29%20rotate%2820%29%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23d5e4a8%22%20opacity%3D%220.6%22%20transform%3D%22rotate%280%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23d5e4a8%22%20opacity%3D%220.6%22%20transform%3D%22rotate%2872%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23d5e4a8%22%20opacity%3D%220.6%22%20transform%3D%22rotate%28144%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23d5e4a8%22%20opacity%3D%220.6%22%20transform%3D%22rotate%28216%29%22/%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.6%22%20rx%3D%221.6%22%20ry%3D%222.3%22%20fill%3D%22%23d5e4a8%22%20opacity%3D%220.6%22%20transform%3D%22rotate%28288%29%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%220%22%20r%3D%221%22%20fill%3D%22%23f0e888%22/%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none;animation:particleDrift 3.2s ease-in-out infinite;}
  html[data-theme="meadow"] .bubble.me::after{right:14px;left:auto;}

  html[data-theme="ninja"]{--bg-deep:#1c0d09;--bg-panel:rgba(58,26,16,.7);--bg-panel-2:rgba(74,33,20,.72);--ink:#fdf0e8;--ink-dim:#d9a893;--primary:#ed8567;--primary-dim:#c86f50;--primary-ink:#3a1408;--rose:#f3bb96;--friend-accent:#edaf7d;--line:rgba(232,98,60,.16);}
  html[data-theme="ninja"] body{background:radial-gradient(circle at 50% -8%,rgba(232,98,60,.24),transparent 40%),radial-gradient(circle at 8% 90%,rgba(240,168,120,.14),transparent 34%),#140a06;}
  html[data-theme="ninja"] .phone{background:linear-gradient(155deg,#2a1410,#180b06);border-color:rgba(232,98,60,.2);box-shadow:0 45px 110px rgba(0,0,0,.6),inset 0 1px rgba(255,220,200,.1);}
  html[data-theme="ninja"] .card{background:linear-gradient(145deg,rgba(232,98,60,.1),rgba(240,168,120,.06));box-shadow:inset 0 1px rgba(255,255,255,.06),0 14px 36px rgba(0,0,0,.24);backdrop-filter:blur(14px);}
  html[data-theme="ninja"] .btn{background:linear-gradient(135deg,#f0855a,#e8623c);box-shadow:0 10px 26px rgba(232,98,60,.28)}
  html[data-theme="ninja"] .chip.on{background:linear-gradient(135deg,#f0b088,#e89858);border-color:#e89858;color:#3a1408}
  html[data-theme="ninja"] .eyebrow{color:#e8623c}
  html[data-theme="ninja"] .bubble.me{background:linear-gradient(135deg,#b8461f,#8a3316)}
  html[data-theme="ninja"] .bubble.them{background:rgba(74,33,20,.55);}
  html[data-theme="ninja"] .navbar{background:rgba(28,13,9,.9)}
  html[data-theme="ninja"] .navbar button.active{color:#e8623c}
  html[data-theme="ninja"] .theme-toggle,html[data-theme="ninja"] .theme-menu{background:rgba(42,20,16,.85);border-color:rgba(232,98,60,.18)}
  html[data-theme="ninja"] .particle{background:radial-gradient(circle,#f0b088,transparent 70%) !important;opacity:.4;}


  html[data-theme="shinobi"]{--bg-deep:#161022;--bg-panel:rgba(38,29,58,.7);--bg-panel-2:rgba(48,37,74,.72);--ink:#f0ecfb;--ink-dim:#b0a0d9;--primary:#bba2ed;--primary-dim:#9780c8;--primary-ink:#1c1430;--rose:#d5c8ff;--friend-accent:#af96e1;--line:rgba(168,136,232,.16);}
  html[data-theme="shinobi"] body{background:radial-gradient(circle at 50% -8%,rgba(168,136,232,.22),transparent 40%),radial-gradient(circle at 8% 90%,rgba(201,184,255,.14),transparent 34%),#0e0a18;}
  html[data-theme="shinobi"] .phone{background:linear-gradient(155deg,#241c38,#150f22);border-color:rgba(168,136,232,.2);box-shadow:0 45px 110px rgba(0,0,0,.6),inset 0 1px rgba(220,200,255,.1);}
  html[data-theme="shinobi"] .card{background:linear-gradient(145deg,rgba(168,136,232,.1),rgba(201,184,255,.06));box-shadow:inset 0 1px rgba(255,255,255,.06),0 14px 36px rgba(0,0,0,.24);backdrop-filter:blur(14px);}
  html[data-theme="shinobi"] .btn{background:linear-gradient(135deg,#c0a0f0,#a888e8);box-shadow:0 10px 26px rgba(168,136,232,.28)}
  html[data-theme="shinobi"] .chip.on{background:linear-gradient(135deg,#d4c4ff,#c9b8ff);border-color:#c9b8ff;color:#1c1430}
  html[data-theme="shinobi"] .eyebrow{color:#a888e8}
  html[data-theme="shinobi"] .bubble.me{background:linear-gradient(135deg,#7a5cb8,#5a4088)}
  html[data-theme="shinobi"] .bubble.them{background:rgba(48,37,74,.55);}
  html[data-theme="shinobi"] .navbar{background:rgba(22,16,34,.9)}
  html[data-theme="shinobi"] .navbar button.active{color:#a888e8}
  html[data-theme="shinobi"] .theme-toggle,html[data-theme="shinobi"] .theme-menu{background:rgba(36,28,56,.85);border-color:rgba(168,136,232,.18)}
  html[data-theme="shinobi"] .particle{background:radial-gradient(circle,#d4c4ff,transparent 70%) !important;opacity:.4;}


  html[data-theme="midnight"]{--bg-deep:#0a1128;--bg-panel:rgba(20,28,58,.7);--bg-panel-2:rgba(26,36,74,.72);--ink:#f0ecdc;--ink-dim:#a8a0c0;--primary:#edd493;--primary-dim:#c8b076;--primary-ink:#2a2008;--rose:#e7ddb5;--friend-accent:#d5c89c;--line:rgba(232,200,116,.14);}
  html[data-theme="midnight"] body{background:radial-gradient(circle at 50% -8%,rgba(232,200,116,.16),transparent 40%),radial-gradient(circle at 8% 90%,rgba(168,160,192,.1),transparent 34%),#060a1a;}
  html[data-theme="midnight"] .phone{background:linear-gradient(155deg,#141c38,#0a1024);border-color:rgba(232,200,116,.16);box-shadow:0 45px 110px rgba(0,0,0,.6),inset 0 1px rgba(232,200,116,.08);}
  html[data-theme="midnight"] .card{background:linear-gradient(145deg,rgba(232,200,116,.07),rgba(168,160,192,.05));box-shadow:inset 0 1px rgba(255,255,255,.05),0 14px 36px rgba(0,0,0,.26);backdrop-filter:blur(14px);}
  html[data-theme="midnight"] .btn{background:linear-gradient(135deg,#f0dca0,#e8c874);box-shadow:0 10px 26px rgba(232,200,116,.24)}
  html[data-theme="midnight"] .chip.on{background:linear-gradient(135deg,#e8dcb0,#e0d4a0);border-color:#e0d4a0;color:#2a2008}
  html[data-theme="midnight"] .eyebrow{color:#e8c874}
  html[data-theme="midnight"] .bubble.me{background:linear-gradient(135deg,#b89a4f,#8a7238)}
  html[data-theme="midnight"] .bubble.them{background:rgba(26,36,74,.55);margin-top:22px;}
  html[data-theme="midnight"] .navbar{background:rgba(10,17,40,.9)}
  html[data-theme="midnight"] .navbar button.active{color:#e8c874}
  html[data-theme="midnight"] .theme-toggle,html[data-theme="midnight"] .theme-menu{background:rgba(20,28,56,.85);border-color:rgba(232,200,116,.16)}
  html[data-theme="midnight"] .particle{background:radial-gradient(circle,#e8dcb0,transparent 70%) !important;opacity:.3;}

  html[data-theme="garden"]{--bg-deep:#0d1a10;--bg-panel:rgba(20,38,24,.7);--bg-panel-2:rgba(26,48,30,.72);--ink:#eef7ee;--ink-dim:#a3c4a8;--primary:#b3e1a8;--primary-dim:#8fc082;--primary-ink:#0d2410;--rose:#f3bbce;--friend-accent:#d5e4a8;--line:rgba(158,216,143,.16);}
  html[data-theme="garden"] body{background:radial-gradient(circle at 50% -8%,rgba(158,216,143,.18),transparent 40%),radial-gradient(circle at 8% 90%,rgba(240,168,192,.12),transparent 34%),#081208;}
  html[data-theme="garden"] .phone{background:linear-gradient(155deg,#142a18,#0a1a0c);border-color:rgba(158,216,143,.18);box-shadow:0 45px 110px rgba(0,0,0,.6),inset 0 1px rgba(220,255,220,.08);}
  html[data-theme="garden"] .card{background:linear-gradient(145deg,rgba(158,216,143,.08),rgba(240,168,192,.05));box-shadow:inset 0 1px rgba(255,255,255,.05),0 14px 36px rgba(0,0,0,.24);backdrop-filter:blur(14px);}
  html[data-theme="garden"] .btn{background:linear-gradient(135deg,#b4e8a0,#9ed88f);box-shadow:0 10px 26px rgba(158,216,143,.24)}
  html[data-theme="garden"] .chip.on{background:linear-gradient(135deg,#c9e8b0,#c9dc8f);border-color:#c9dc8f;color:#0d2410}
  html[data-theme="garden"] .eyebrow{color:#9ed88f}
  html[data-theme="garden"] .bubble.me{background:linear-gradient(135deg,#6fae5f,#4c7f40)}
  html[data-theme="garden"] .bubble.them{background:rgba(26,48,30,.55);}
  html[data-theme="garden"] .navbar{background:rgba(13,26,16,.9)}
  html[data-theme="garden"] .navbar button.active{color:#9ed88f}
  html[data-theme="garden"] .theme-toggle,html[data-theme="garden"] .theme-menu{background:rgba(20,38,24,.85);border-color:rgba(158,216,143,.16)}
  html[data-theme="garden"] .particle{background:radial-gradient(circle,#c9e8b0,transparent 70%) !important;opacity:.35;}

  html[data-theme="samurai"]{--bg-deep:#1a0808;--bg-panel:rgba(48,16,16,.7);--bg-panel-2:rgba(62,20,20,.72);--ink:#fbe8e8;--ink-dim:#d99a9a;--primary:#ed6767;--primary-dim:#c85050;--primary-ink:#2a0808;--rose:#f39c9c;--friend-accent:#e77d7d;--line:rgba(232,60,60,.16);}
  html[data-theme="samurai"] body{background:radial-gradient(circle at 50% -8%,rgba(232,60,60,.2),transparent 40%),radial-gradient(circle at 8% 90%,rgba(240,128,128,.12),transparent 34%),#100505;}
  html[data-theme="samurai"] .phone{background:linear-gradient(155deg,#280a0a,#160505);border-color:rgba(232,60,60,.2);box-shadow:0 45px 110px rgba(0,0,0,.6),inset 0 1px rgba(255,200,200,.08);}
  html[data-theme="samurai"] .card{background:linear-gradient(145deg,rgba(232,60,60,.09),rgba(240,128,128,.05));box-shadow:inset 0 1px rgba(255,255,255,.05),0 14px 36px rgba(0,0,0,.26);backdrop-filter:blur(14px);}
  html[data-theme="samurai"] .btn{background:linear-gradient(135deg,#f06060,#e83c3c);box-shadow:0 10px 26px rgba(232,60,60,.28)}
  html[data-theme="samurai"] .chip.on{background:linear-gradient(135deg,#f0a0a0,#e05858);border-color:#e05858;color:#2a0808}
  html[data-theme="samurai"] .eyebrow{color:#e83c3c}
  html[data-theme="samurai"] .bubble.me{background:linear-gradient(135deg,#b81f1f,#8a1515)}
  html[data-theme="samurai"] .bubble.them{background:rgba(62,20,20,.55);margin-top:22px;}
  html[data-theme="samurai"] .navbar{background:rgba(26,8,8,.9)}
  html[data-theme="samurai"] .navbar button.active{color:#e83c3c}
  html[data-theme="samurai"] .theme-toggle,html[data-theme="samurai"] .theme-menu{background:rgba(48,16,16,.85);border-color:rgba(232,60,60,.18)}
  html[data-theme="samurai"] .particle{background:radial-gradient(circle,#f0a0a0,transparent 70%) !important;opacity:.35;}

  html[data-theme="forest"]{--bg-deep:#0a1a12;--bg-panel:rgba(18,42,28,.7);--bg-panel-2:rgba(24,54,36,.72);--ink:#e8f5ec;--ink-dim:#9cc4a8;--primary:#80d49f;--primary-dim:#68af83;--primary-ink:#0a2414;--rose:#a5edc8;--friend-accent:#97ddaf;--line:rgba(92,200,132,.16);}
  html[data-theme="forest"] body{background:radial-gradient(circle at 50% -8%,rgba(92,200,132,.2),transparent 40%),radial-gradient(circle at 8% 90%,rgba(140,232,184,.12),transparent 34%),#061208;}
  html[data-theme="forest"] .phone{background:linear-gradient(155deg,#123020,#081a10);border-color:rgba(92,200,132,.2);box-shadow:0 45px 110px rgba(0,0,0,.6),inset 0 1px rgba(200,255,220,.08);}
  html[data-theme="forest"] .card{background:linear-gradient(145deg,rgba(92,200,132,.09),rgba(140,232,184,.05));box-shadow:inset 0 1px rgba(255,255,255,.05),0 14px 36px rgba(0,0,0,.26);backdrop-filter:blur(14px);}
  html[data-theme="forest"] .btn{background:linear-gradient(135deg,#7ad498,#5cc884);box-shadow:0 10px 26px rgba(92,200,132,.28)}
  html[data-theme="forest"] .chip.on{background:linear-gradient(135deg,#a0e8b8,#7ad498);border-color:#7ad498;color:#0a2414}
  html[data-theme="forest"] .eyebrow{color:#5cc884}
  html[data-theme="forest"] .bubble.me{background:linear-gradient(135deg,#3d9860,#2a7048)}
  html[data-theme="forest"] .bubble.them{background:rgba(24,54,36,.55);margin-top:22px;}
  html[data-theme="forest"] .navbar{background:rgba(10,26,18,.9)}
  html[data-theme="forest"] .navbar button.active{color:#5cc884}
  html[data-theme="forest"] .theme-toggle,html[data-theme="forest"] .theme-menu{background:rgba(18,42,28,.85);border-color:rgba(92,200,132,.18)}
  html[data-theme="forest"] .particle{background:radial-gradient(circle,#a0e8b8,transparent 70%) !important;opacity:.35;}

  html[data-theme="desert"]{--bg-deep:#1c1206;--bg-panel:rgba(48,32,14,.7);--bg-panel-2:rgba(62,42,18,.72);--ink:#fbf0e0;--ink-dim:#d9b98f;--primary:#edbb73;--primary-dim:#c89c50;--primary-ink:#2a1a08;--rose:#f3d49c;--friend-accent:#e7bb7d;--line:rgba(232,168,76,.16);}
  html[data-theme="desert"] body{background:radial-gradient(circle at 50% -8%,rgba(232,168,76,.2),transparent 40%),radial-gradient(circle at 8% 90%,rgba(240,200,128,.12),transparent 34%),#120c04;}
  html[data-theme="desert"] .phone{background:linear-gradient(155deg,#301f0a,#1a1006);border-color:rgba(232,168,76,.2);box-shadow:0 45px 110px rgba(0,0,0,.6),inset 0 1px rgba(255,230,190,.08);}
  html[data-theme="desert"] .card{background:linear-gradient(145deg,rgba(232,168,76,.09),rgba(240,200,128,.05));box-shadow:inset 0 1px rgba(255,255,255,.05),0 14px 36px rgba(0,0,0,.26);backdrop-filter:blur(14px);}
  html[data-theme="desert"] .btn{background:linear-gradient(135deg,#f0c070,#e8a84c);box-shadow:0 10px 26px rgba(232,168,76,.28)}
  html[data-theme="desert"] .chip.on{background:linear-gradient(135deg,#f0d4a0,#e0a858);border-color:#e0a858;color:#2a1a08}
  html[data-theme="desert"] .eyebrow{color:#e8a84c}
  html[data-theme="desert"] .bubble.me{background:linear-gradient(135deg,#b8801f,#8a5f15)}
  html[data-theme="desert"] .bubble.them{background:rgba(62,42,18,.55);}
  html[data-theme="desert"] .navbar{background:rgba(28,18,6,.9)}
  html[data-theme="desert"] .navbar button.active{color:#e8a84c}
  html[data-theme="desert"] .theme-toggle,html[data-theme="desert"] .theme-menu{background:rgba(48,32,14,.85);border-color:rgba(232,168,76,.18)}
  html[data-theme="desert"] .particle{background:radial-gradient(circle,#f0d4a0,transparent 70%) !important;opacity:.35;}

  html[data-theme="lightning"]{--bg-deep:#080c1c;--bg-panel:rgba(16,22,42,.7);--bg-panel-2:rgba(22,30,54,.72);--ink:#e8ecfb;--ink-dim:#9ca8d9;--primary:#8cb2ff;--primary-dim:#6d8fd4;--primary-ink:#0a1030;--rose:#b5ceff;--friend-accent:#9cbbf3;--line:rgba(108,156,255,.18);}
  html[data-theme="lightning"] body{background:radial-gradient(circle at 50% -8%,rgba(108,156,255,.22),transparent 40%),radial-gradient(circle at 8% 90%,rgba(160,192,255,.13),transparent 34%),#04060f;}
  html[data-theme="lightning"] .phone{background:linear-gradient(155deg,#101c38,#080c1c);border-color:rgba(108,156,255,.22);box-shadow:0 45px 110px rgba(0,0,0,.6),inset 0 1px rgba(200,220,255,.1);}
  html[data-theme="lightning"] .card{background:linear-gradient(145deg,rgba(108,156,255,.1),rgba(160,192,255,.06));box-shadow:inset 0 1px rgba(255,255,255,.06),0 14px 36px rgba(0,0,0,.26);backdrop-filter:blur(14px);}
  html[data-theme="lightning"] .btn{background:linear-gradient(135deg,#90b4ff,#6c9cff);box-shadow:0 10px 26px rgba(108,156,255,.3)}
  html[data-theme="lightning"] .chip.on{background:linear-gradient(135deg,#b8ccff,#80a8f0);border-color:#80a8f0;color:#0a1030}
  html[data-theme="lightning"] .eyebrow{color:#6c9cff}
  html[data-theme="lightning"] .bubble.me{background:linear-gradient(135deg,#4470c8,#2c4c98)}
  html[data-theme="lightning"] .bubble.them{background:rgba(22,30,54,.55);margin-top:22px;}
  html[data-theme="lightning"] .navbar{background:rgba(8,12,28,.9)}
  html[data-theme="lightning"] .navbar button.active{color:#6c9cff}
  html[data-theme="lightning"] .theme-toggle,html[data-theme="lightning"] .theme-menu{background:rgba(16,22,42,.85);border-color:rgba(108,156,255,.2)}
  html[data-theme="lightning"] .particle{background:radial-gradient(circle,#b8ccff,transparent 70%) !important;opacity:.4;}



  /* Meadow — calm, nature-inspired sage and sky, the quietest of the six;
     for anyone who wants the app to feel less "screen glow," more outdoors */
  html[data-theme="meadow"]{--bg-deep:#0f1f1a;--bg-panel:rgba(22,42,34,.7);--bg-panel-2:rgba(30,54,44,.72);--ink:#eef7f0;--ink-dim:#a3c4b0;--primary:#a8ddbb;--primary-dim:#82b896;--primary-ink:#0d2418;--rose:#a7d2ed;--friend-accent:#d5e4a8;--line:rgba(143,212,168,.16);}
  html[data-theme="meadow"] body{background:radial-gradient(circle at 50% -8%,rgba(143,212,168,.22),transparent 38%),radial-gradient(circle at 8% 90%,rgba(142,197,232,.18),transparent 32%),#081410;}
  html[data-theme="meadow"] .phone{background:linear-gradient(155deg,#152b22,#0d1c16);border-color:rgba(143,212,168,.2);box-shadow:0 45px 110px rgba(0,0,0,.6),inset 0 1px rgba(200,235,210,.1);}
  html[data-theme="meadow"] .card{background:linear-gradient(145deg,rgba(143,212,168,.1),rgba(142,197,232,.06));box-shadow:inset 0 1px rgba(255,255,255,.06),0 14px 36px rgba(0,0,0,.22);backdrop-filter:blur(14px);}
  html[data-theme="meadow"] .btn{background:linear-gradient(135deg,#b4e8c4,#8fd4a8);box-shadow:0 10px 26px rgba(143,212,168,.28)}
  html[data-theme="meadow"] .chip.on{background:linear-gradient(135deg,#b0d8ec,#8ec5e8);border-color:#8ec5e8;color:#0d2418}
  html[data-theme="meadow"] .eyebrow{color:#8fd4a8}
  html[data-theme="meadow"] .bubble.me{background:linear-gradient(135deg,#5a9470,#3f7256)}
  html[data-theme="meadow"] .bubble.them{background:rgba(30,54,44,.55)}
  html[data-theme="meadow"] .navbar{background:rgba(15,31,26,.9)}
  html[data-theme="meadow"] .navbar button.active{color:#8fd4a8}
  html[data-theme="meadow"] .theme-toggle,html[data-theme="meadow"] .theme-menu{background:rgba(21,43,34,.85);border-color:rgba(143,212,168,.18)}
  html[data-theme="meadow"] .particle{background:radial-gradient(circle,#c4ecd0,transparent 70%) !important;opacity:.35;}

/* ============ Your Secret World — a small personal game world ============ */
#secretWorldApp.screen{ padding:0; overflow:hidden; background:#120f1e; }
.sw-root{ position:absolute; inset:0; display:flex; flex-direction:column; }

/* ---- shared surfaces ---- */
.sw-topbar{ display:flex; align-items:center; justify-content:space-between; padding:14px 16px 10px; position:relative; z-index:5; }
.sw-back{ background:rgba(0,0,0,0.35); border:1px solid rgba(255,255,255,0.18); color:#fff; border-radius:999px; padding:7px 14px; font-size:13px; font-weight:600; cursor:pointer; backdrop-filter:blur(6px); }
.sw-title-wrap{ text-align:center; flex:1; }
.sw-day{ font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:rgba(255,255,255,0.65); }
.sw-title{ font-family:'Playfair Display', Georgia, serif; font-size:20px; color:#fff; margin-top:1px; }
.sw-disclosure{ font-size:10px; color:rgba(255,255,255,0.55); background:rgba(0,0,0,0.3); border-radius:999px; padding:4px 10px; white-space:nowrap; }
.sw-sos{ background:rgba(220,60,60,0.85); color:#fff; border:none; border-radius:999px; padding:6px 12px; font-size:12px; font-weight:700; cursor:pointer; }

.sw-scroll{ flex:1; overflow-y:auto; position:relative; -webkit-overflow-scrolling:touch; }
.sw-view{ display:none; height:100%; }
.sw-view.active{ display:block; animation:swFadeIn .35s ease; }
@keyframes swFadeIn{ from{ opacity:0; transform:translateY(6px);} to{ opacity:1; transform:translateY(0);} }

/* ---- entry view ---- */
.sw-entry{ display:flex; flex-direction:column; align-items:center; justify-content:center; height:100%; padding:32px 24px; text-align:center; position:relative; }
.sw-entry-art{ width:100%; max-width:320px; height:200px; border-radius:24px; margin-bottom:22px; position:relative; overflow:hidden; box-shadow:0 20px 50px rgba(0,0,0,0.45); background:linear-gradient(160deg,#3a2f63,#171226 70%); }
.sw-entry-art::before, .sw-entry-art::after{ content:''; position:absolute; border-radius:50%; filter:blur(2px); opacity:.85; }
.sw-entry-art::before{ width:70px; height:70px; background:radial-gradient(circle,#ffe9b0,transparent 70%); top:18px; right:26px; animation:swDrift 7s ease-in-out infinite; }
.sw-entry-art::after{ width:120px; height:40px; background:radial-gradient(ellipse,rgba(255,255,255,0.25),transparent 70%); bottom:24px; left:-10px; animation:swDrift 9s ease-in-out infinite reverse; }
@keyframes swDrift{ 0%,100%{ transform:translateY(0) translateX(0);} 50%{ transform:translateY(-10px) translateX(8px);} }
.sw-entry-title{ font-family:'Playfair Display', Georgia, serif; font-size:26px; color:#fff; margin-bottom:6px; }
.sw-entry-sub{ color:rgba(255,255,255,0.72); font-size:14px; margin-bottom:18px; }
.sw-entry-progress{ font-size:12px; color:rgba(255,255,255,0.55); margin-bottom:26px; letter-spacing:.02em; }
.sw-btn-primary{ background:linear-gradient(135deg,#8b7cf6,#c084fc); color:#1a1030; border:none; border-radius:999px; padding:14px 30px; font-size:15px; font-weight:700; cursor:pointer; box-shadow:0 10px 26px rgba(139,124,246,0.4); }
.sw-btn-primary:active{ transform:scale(0.97); }

/* ---- zone select ---- */
.sw-zone-select{ padding:18px 16px 90px; }
.sw-lead{ text-align:center; margin-bottom:18px; }
.sw-lead h2{ font-family:'Playfair Display', Georgia, serif; font-size:21px; color:#fff; margin-bottom:4px; }
.sw-lead p{ font-size:13px; color:rgba(255,255,255,0.65); }
.sw-zone-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.sw-zone-card{ position:relative; border-radius:18px; overflow:hidden; height:150px; cursor:pointer; border:2px solid transparent; transition:transform .15s ease, border-color .15s ease; }
.sw-zone-card:active{ transform:scale(0.97); }
.sw-zone-card.selected{ border-color:#c084fc; }
.sw-zone-bg{ position:absolute; inset:0; }
.sw-zone-card .sw-zone-particle{ position:absolute; border-radius:50%; opacity:.8; pointer-events:none; }
.sw-zone-label{ position:absolute; left:0; right:0; bottom:0; padding:10px 10px 9px; background:linear-gradient(to top, rgba(0,0,0,0.75), transparent); }
.sw-zone-name{ color:#fff; font-weight:700; font-size:13.5px; }
.sw-zone-tag{ color:rgba(255,255,255,0.75); font-size:10.5px; margin-top:1px; line-height:1.25; }
.sw-zone-icon{ position:absolute; top:8px; left:9px; font-size:16px; filter:drop-shadow(0 2px 4px rgba(0,0,0,0.5)); }

/* per-zone palettes */
.sw-zone-bg.cozy-classroom{ background:linear-gradient(150deg,#6b4a2e,#2c1c11 75%); }
.sw-zone-bg.magical-city{ background:linear-gradient(150deg,#3a2a63,#120a24 75%); }
.sw-zone-bg.enchanted-forest{ background:linear-gradient(150deg,#1f4d33,#0c1f15 75%); }
.sw-zone-bg.ocean-world{ background:linear-gradient(150deg,#1c6e8c,#0a2536 75%); }
.sw-zone-bg.dream-office{ background:linear-gradient(150deg,#5b6ea8,#211f3d 75%); }
.sw-zone-bg.ai-city{ background:linear-gradient(150deg,#1a2f5c,#05070f 75%); }
.sw-zone-card .sw-zone-bg{ background-size:cover; background-position:center; filter:saturate(1.05); }
.sw-zone-card .sw-zone-bg::after{ content:''; position:absolute; inset:0; background:linear-gradient(180deg,rgba(11,8,24,.04),rgba(11,8,24,.78)); }
.sw-zone-card .sw-zone-bg.cozy-classroom{ background-image:url('/worlds/secret-world-map.png'); background-position:10% 20%; }
.sw-zone-card .sw-zone-bg.magical-city{ background-image:url('/worlds/secret-world-map.png'); background-position:45% 18%; }
.sw-zone-card .sw-zone-bg.enchanted-forest{ background-image:url('/worlds/secret-world-map.png'); background-position:82% 18%; }
.sw-zone-card .sw-zone-bg.ocean-world{ background-image:url('/worlds/secret-world-map.png'); background-position:13% 78%; }
.sw-zone-card .sw-zone-bg.dream-office{ background-image:url('/worlds/secret-world-map.png'); background-position:56% 68%; }
.sw-zone-card .sw-zone-bg.ai-city{ background-image:url('/worlds/secret-world-map.png'); background-position:82% 70%; }
.sw-zone-particle.p1{ animation:swDrift 6s ease-in-out infinite; }
.sw-zone-particle.p2{ animation:swDrift 8s ease-in-out infinite reverse; }

/* ---- world map ---- */
.sw-map-wrap{ position:relative; min-height:100%; padding-bottom:110px; }
.sw-map-bg{ position:absolute; inset:0; z-index:0; background-image:url('/worlds/secret-world-map.png') !important; background-size:cover; background-position:center; filter:saturate(1.08); }
.sw-map-bg::after{ content:''; position:absolute; inset:0; background:linear-gradient(180deg,rgba(13,9,28,.36),rgba(13,9,28,.08) 38%,rgba(13,9,28,.5)); }
.sw-map-wrap::before{ content:'Your world, your rules'; position:absolute; z-index:2; left:14px; top:70px; color:#fff; font:600 11px/1.2 system-ui,sans-serif; letter-spacing:.08em; text-transform:uppercase; text-shadow:0 2px 8px #140d25; opacity:.8; }
.sw-map-canvas{ position:relative; z-index:1; height:560px; margin:0 6px; }
.sw-map-path{ position:absolute; inset:0; z-index:1; opacity:.5; }
.sw-node{ position:absolute; display:flex; flex-direction:column; align-items:center; gap:5px; cursor:pointer; z-index:2; transform:translate(-50%,-50%); }
.sw-node-dot{ width:52px; height:52px; border-radius:50%; background:rgba(255,255,255,0.14); border:2px solid rgba(255,255,255,0.4); display:flex; align-items:center; justify-content:center; font-size:22px; backdrop-filter:blur(4px); box-shadow:0 8px 20px rgba(0,0,0,0.35); transition:transform .15s ease; }
.sw-node-dot{ background:rgba(38,24,69,.72); border-color:rgba(255,232,188,.8); }
.sw-node:active .sw-node-dot{ transform:scale(0.92); }
.sw-node.locked .sw-node-dot{ background:rgba(0,0,0,0.35); border-style:dashed; opacity:.7; }
.sw-node-label{ font-size:10.5px; color:#fff; background:rgba(0,0,0,0.45); padding:2px 8px; border-radius:999px; white-space:nowrap; max-width:120px; overflow:hidden; text-overflow:ellipsis; }
.sw-node.has-character .sw-node-dot{ border-color:#ffe9b0; box-shadow:0 0 0 4px rgba(255,233,176,0.18), 0 8px 20px rgba(0,0,0,0.35); }

.sw-companion-pin{ position:absolute; z-index:3; display:flex; flex-direction:column; align-items:center; gap:3px; transform:translate(-50%,-100%); cursor:pointer; animation:swWalkIn .6s cubic-bezier(.2,.9,.3,1.2); }
@keyframes swWalkIn{ from{ opacity:0; transform:translate(-50%,-70%) scale(0.7);} to{ opacity:1; transform:translate(-50%,-100%) scale(1);} }
.sw-companion-photo-wrap{ width:56px; height:56px; border-radius:50%; overflow:hidden; border:3px solid #ffe9b0; box-shadow:0 10px 22px rgba(0,0,0,0.45); animation:swIdleBob 3.2s ease-in-out infinite; }
@keyframes swIdleBob{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-5px);} }
.sw-companion-photo-wrap img{ width:100%; height:100%; object-fit:cover; display:block; }
.sw-companion-pin-name{ font-size:10.5px; font-weight:700; color:#fff; background:rgba(0,0,0,0.5); padding:2px 8px; border-radius:999px; }

.sw-invite-fab{ position:absolute; right:16px; bottom:126px; z-index:4; background:linear-gradient(135deg,#8b7cf6,#c084fc); color:#1a1030; border:none; border-radius:999px; padding:13px 18px; font-weight:700; font-size:13px; box-shadow:0 12px 26px rgba(139,124,246,0.45); cursor:pointer; }

.sw-task-banner{ position:absolute; left:12px; right:12px; top:10px; z-index:4; background:rgba(20,14,34,0.72); border:1px solid rgba(255,255,255,0.16); backdrop-filter:blur(8px); border-radius:16px; padding:11px 14px; display:flex; align-items:center; gap:10px; cursor:pointer; }
.sw-task-banner-icon{ font-size:20px; }
.sw-task-banner-text{ flex:1; }
.sw-task-banner-label{ font-size:10px; text-transform:uppercase; letter-spacing:.05em; color:rgba(255,255,255,0.55); }
.sw-task-banner-title{ font-size:12.5px; color:#fff; font-weight:600; line-height:1.3; }
.sw-task-banner.done{ opacity:.6; }

/* ---- bottom nav (mobile) ---- */
.sw-bottomnav{ position:absolute; left:0; right:0; bottom:0; display:flex; background:rgba(15,11,26,0.92); backdrop-filter:blur(10px); border-top:1px solid rgba(255,255,255,0.1); padding:8px 4px 10px; z-index:6; }
.sw-bottomnav button{ flex:1; background:none; border:none; color:rgba(255,255,255,0.55); font-size:10.5px; display:flex; flex-direction:column; align-items:center; gap:3px; padding:5px 2px; cursor:pointer; }
.sw-bottomnav button.active{ color:#fff; }
.sw-bottomnav button .sw-nav-icon{ font-size:18px; }

/* ---- sheets (creator / interaction / task) ---- */
.sw-sheet-backdrop{ position:absolute; inset:0; background:rgba(0,0,0,0.55); z-index:10; opacity:0; pointer-events:none; transition:opacity .2s ease; }
.sw-sheet-backdrop.open{ opacity:1; pointer-events:auto; }
.sw-sheet{ position:absolute; left:0; right:0; bottom:0; max-height:88%; background:#1a1428; border-radius:22px 22px 0 0; z-index:11; transform:translateY(100%); transition:transform .28s cubic-bezier(.2,.85,.3,1.1); display:flex; flex-direction:column; box-shadow:0 -20px 50px rgba(0,0,0,0.5); }
.sw-sheet.open{ transform:translateY(0); }
.sw-sheet-handle{ width:36px; height:4px; background:rgba(255,255,255,0.25); border-radius:99px; margin:10px auto 4px; }
.sw-sheet-head{ display:flex; align-items:center; justify-content:space-between; padding:8px 18px 4px; }
.sw-sheet-head h3{ font-family:'Playfair Display', Georgia, serif; font-size:18px; color:#fff; }
.sw-sheet-close{ background:rgba(255,255,255,0.1); border:none; color:#fff; width:28px; height:28px; border-radius:50%; font-size:15px; cursor:pointer; }
.sw-sheet-body{ padding:12px 18px 22px; overflow-y:auto; }

/* creator */
.sw-step-dots{ display:flex; gap:5px; justify-content:center; margin-bottom:14px; }
.sw-step-dots span{ width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,0.25); }
.sw-step-dots span.on{ background:#c084fc; width:16px; border-radius:99px; }
.sw-creator-preview{ display:flex; align-items:center; gap:12px; background:rgba(255,255,255,0.05); border-radius:16px; padding:10px 12px; margin-bottom:16px; }
.sw-creator-preview img{ width:52px; height:52px; border-radius:50%; object-fit:cover; border:2px solid rgba(255,255,255,0.2); }
.sw-creator-preview-name{ color:#fff; font-weight:700; font-size:14px; }
.sw-creator-preview-tag{ color:rgba(255,255,255,0.6); font-size:11.5px; margin-top:2px; }
.sw-step-title{ color:#fff; font-size:14px; font-weight:700; margin-bottom:10px; }
.sw-card-grid{ display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-bottom:16px; }
.sw-card-grid.cols3{ grid-template-columns:1fr 1fr 1fr; }
.sw-pick-card{ background:rgba(255,255,255,0.06); border:2px solid rgba(255,255,255,0.08); border-radius:14px; padding:10px; cursor:pointer; text-align:left; }
.sw-pick-card.selected{ border-color:#c084fc; background:rgba(192,132,252,0.14); }
.sw-pick-card-title{ color:#fff; font-size:13px; font-weight:700; }
.sw-pick-card-sub{ color:rgba(255,255,255,0.55); font-size:10.5px; margin-top:2px; line-height:1.3; }
.sw-portrait-card{ text-align:center; padding:8px; }
.sw-portrait-card img{ width:100%; aspect-ratio:1; object-fit:cover; border-radius:12px; margin-bottom:6px; }
.sw-step-actions{ display:flex; gap:10px; margin-top:4px; }
.sw-btn-ghost{ flex:1; background:rgba(255,255,255,0.08); color:#fff; border:none; border-radius:999px; padding:12px; font-weight:600; font-size:13.5px; cursor:pointer; }
.sw-btn-fill{ flex:2; background:linear-gradient(135deg,#8b7cf6,#c084fc); color:#1a1030; border:none; border-radius:999px; padding:12px; font-weight:700; font-size:13.5px; cursor:pointer; }
.sw-btn-fill:disabled{ opacity:.4; }

/* interaction panel */
.sw-interact-hero{ display:flex; align-items:center; gap:14px; margin-bottom:14px; }
.sw-interact-hero img{ width:64px; height:64px; border-radius:50%; object-fit:cover; border:3px solid #ffe9b0; }
.sw-interact-name{ color:#fff; font-size:17px; font-weight:700; }
.sw-interact-sub{ color:rgba(255,255,255,0.6); font-size:12px; margin-top:2px; }
.sw-interact-mood{ color:rgba(255,255,255,0.75); font-size:12.5px; margin:2px 0 14px; font-style:italic; }
.sw-interact-actions{ display:flex; flex-direction:column; gap:9px; }
.sw-interact-actions button{ width:100%; text-align:left; background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.1); color:#fff; border-radius:14px; padding:13px 14px; font-size:13.5px; font-weight:600; cursor:pointer; display:flex; align-items:center; gap:10px; }
.sw-interact-actions button .ic{ font-size:17px; }
.sw-disclosure-chip{ display:inline-block; font-size:10px; color:rgba(255,255,255,0.5); background:rgba(255,255,255,0.06); padding:4px 9px; border-radius:999px; margin-top:12px; }

/* task sheet */
.sw-task-title{ color:#fff; font-size:15px; font-weight:700; margin-bottom:6px; }
.sw-task-desc{ color:rgba(255,255,255,0.75); font-size:13.5px; line-height:1.5; margin-bottom:18px; }
.sw-task-actions{ display:flex; gap:8px; flex-wrap:wrap; }
.sw-task-actions button{ flex:1; min-width:90px; }
.sw-task-done-msg{ text-align:center; color:#ffe9b0; font-size:13.5px; font-style:italic; padding:10px 0; }

/* ---- chat drawer over the map ---- */
.sw-chat-drawer{ position:absolute; left:0; right:0; bottom:0; top:16%; z-index:20; background:rgba(15,11,26,0.94); backdrop-filter:blur(14px); border-radius:24px 24px 0 0; display:flex; flex-direction:column; transform:translateY(100%); transition:transform .32s cubic-bezier(.2,.85,.3,1.05); box-shadow:0 -20px 60px rgba(0,0,0,0.55); }
.sw-chat-drawer.open{ transform:translateY(0); }
.sw-chat-head{ display:flex; align-items:center; gap:10px; padding:14px 14px 10px; border-bottom:1px solid rgba(255,255,255,0.08); }
.sw-chat-head img{ width:38px; height:38px; border-radius:50%; object-fit:cover; }
.sw-chat-head-info{ flex:1; }
.sw-chat-head-name{ color:#fff; font-weight:700; font-size:14px; }
.sw-chat-head-sub{ color:rgba(255,255,255,0.55); font-size:10.5px; }
.sw-chat-messages{ flex:1; overflow-y:auto; padding:14px; display:flex; flex-direction:column; gap:8px; }
.sw-bubble{ max-width:78%; padding:10px 13px; border-radius:16px; font-size:13.5px; line-height:1.4; }
.sw-bubble.them{ align-self:flex-start; background:rgba(255,255,255,0.09); color:#fff; border-bottom-left-radius:4px; }
.sw-bubble.me{ align-self:flex-end; background:linear-gradient(135deg,#8b7cf6,#c084fc); color:#1a1030; border-bottom-right-radius:4px; font-weight:500; }
.sw-bubble.typing span{ display:inline-block; width:6px; height:6px; background:rgba(255,255,255,0.6); border-radius:50%; margin:0 2px; animation:swTyping 1s infinite; }
.sw-bubble.typing span:nth-child(2){ animation-delay:.15s; } .sw-bubble.typing span:nth-child(3){ animation-delay:.3s; }
@keyframes swTyping{ 0%,60%,100%{ transform:translateY(0); opacity:.5;} 30%{ transform:translateY(-4px); opacity:1;} }
.sw-bubble.crisis{ align-self:stretch; background:rgba(220,60,60,0.18); border:1px solid rgba(220,60,60,0.4); }
.sw-crisis-actions{ display:flex; gap:8px; margin-top:8px; flex-wrap:wrap; }
.sw-crisis-actions a{ background:rgba(220,60,60,0.85); color:#fff; text-decoration:none; padding:6px 11px; border-radius:999px; font-size:11.5px; font-weight:700; }
.sw-quick-actions{ display:flex; gap:8px; padding:0 14px 8px; overflow-x:auto; }
.sw-quick-actions button{ white-space:nowrap; background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.12); color:#fff; border-radius:999px; padding:7px 13px; font-size:12px; cursor:pointer; }
.sw-chat-input-row{ display:flex; align-items:center; gap:8px; padding:10px 12px 16px; border-top:1px solid rgba(255,255,255,0.08); }
.sw-chat-input-row input{ flex:1; background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.12); color:#fff; border-radius:999px; padding:11px 16px; font-size:13.5px; }
.sw-chat-input-row input::placeholder{ color:rgba(255,255,255,0.4); }
@media (max-width:520px){
  .sw-zone-select{padding:14px 12px 92px}.sw-zone-grid{gap:9px}.sw-zone-card{height:132px;border-radius:15px}
  .sw-map-canvas{height:520px;margin:0}.sw-node-dot{width:44px;height:44px;font-size:19px}.sw-node-label{font-size:9px;max-width:92px}
  .sw-task-banner{left:10px;right:10px;top:8px}.sw-task-banner-title{font-size:11.5px}.sw-chat-drawer{top:8%}
}
.sw-chat-send{ background:linear-gradient(135deg,#8b7cf6,#c084fc); border:none; color:#1a1030; width:38px; height:38px; border-radius:50%; font-size:16px; cursor:pointer; flex-shrink:0; }

/* progress toast */
.sw-progress-toast{ position:absolute; left:50%; top:16px; transform:translate(-50%,-140%); z-index:30; background:rgba(20,14,34,0.92); border:1px solid rgba(255,233,176,0.4); color:#ffe9b0; padding:9px 16px; border-radius:999px; font-size:12.5px; font-weight:600; white-space:nowrap; transition:transform .35s cubic-bezier(.2,.85,.3,1.1); pointer-events:none; }
.sw-progress-toast.show{ transform:translate(-50%,0); }
.sw-location-scene{position:absolute;inset:0;z-index:18;display:none;overflow:hidden;background:#100b1d;color:#fff}.sw-location-scene.open{display:block;animation:swSceneIn .38s ease-out}@keyframes swSceneIn{from{opacity:0;transform:scale(1.04)}to{opacity:1;transform:none}}
.sw-scene-bg{position:absolute;inset:0;background-size:cover;background-position:center;filter:saturate(1.15) brightness(.78);transform:scale(1.08)}.sw-scene-bg.city{background-image:url('/worlds/secret-city-v3.png')}.sw-scene-bg.enchanted-forest{background-image:url('/worlds/secret-forest-v5.png')}.sw-scene-bg.inside{filter:saturate(1.1) brightness(.46) sepia(.18);transform:scale(1.35);background-position:center 68%}.sw-scene-vignette{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,5,18,.22),rgba(8,5,18,.1) 48%,rgba(8,5,18,.92)),radial-gradient(circle at 50% 42%,transparent 20%,rgba(7,4,16,.58) 100%)}
.sw-scene-top{position:absolute;left:12px;right:12px;top:14px;z-index:2;display:flex;align-items:center;gap:10px}.sw-scene-back{border:1px solid rgba(255,255,255,.32);background:rgba(15,10,28,.7);color:#fff;border-radius:999px;padding:9px 13px}.sw-scene-title{flex:1;text-shadow:0 2px 10px #000}.sw-scene-title b{display:block;font:700 19px Georgia,serif}.sw-scene-title small{opacity:.72}.sw-scene-tabs{position:absolute;right:14px;top:70px;z-index:2;display:flex;background:rgba(12,8,24,.76);border-radius:999px;padding:3px}.sw-scene-tabs button{border:0;background:transparent;color:#cfc7dc;border-radius:999px;padding:7px 10px;font-size:11px}.sw-scene-tabs button.on{background:#ffe5a1;color:#24152d;font-weight:800}
.sw-scene-building{position:absolute;width:46%;max-width:260px;left:8%;top:24%;filter:drop-shadow(0 18px 20px rgba(0,0,0,.58))}.sw-scene-companion{position:absolute;height:48%;max-height:350px;right:2%;bottom:18%;filter:drop-shadow(0 14px 18px rgba(0,0,0,.66));animation:swSceneIdle 3s ease-in-out infinite}@keyframes swSceneIdle{50%{transform:translateY(-6px) rotate(.6deg)}}
.sw-scene-panel{position:absolute;z-index:3;left:12px;right:12px;bottom:14px;background:rgba(18,12,31,.9);border:1px solid rgba(255,229,161,.35);border-radius:18px;padding:13px;backdrop-filter:blur(12px);box-shadow:0 18px 42px rgba(0,0,0,.48)}.sw-scene-speaker{color:#ffe5a1;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.sw-scene-dialogue{font:500 14px/1.45 Georgia,serif;margin:5px 0 11px}.sw-scene-actions{display:flex;gap:7px;overflow-x:auto}.sw-scene-actions button{white-space:nowrap;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.09);color:#fff;border-radius:999px;padding:8px 11px;font-size:11px;font-weight:700}.sw-rare-item{display:inline-flex;align-items:center;gap:6px;margin:4px 4px 7px 0;background:linear-gradient(135deg,rgba(255,215,111,.18),rgba(179,111,255,.18));border:1px solid rgba(255,224,148,.42);border-radius:10px;padding:7px 9px;font-size:11px;color:#fff1ba}
.sw-game-hud{position:absolute;right:12px;top:68px;z-index:5;display:flex;gap:6px}.sw-game-hud span{background:rgba(22,15,38,.82);color:#ffe9b0;border:1px solid rgba(255,233,176,.3);border-radius:999px;padding:5px 9px;font-size:11px}.sw-decor{position:absolute;z-index:2;font-size:27px;filter:drop-shadow(0 5px 8px rgba(0,0,0,.45));animation:swIdleBob 4s ease-in-out infinite}.sw-helper-pin{position:absolute;z-index:3;transform:translate(-50%,-50%);text-align:center;cursor:pointer}.sw-helper-pin b{display:block;font-size:28px}.sw-helper-pin small{background:rgba(0,0,0,.55);color:#fff;border-radius:999px;padding:2px 7px;font-size:9px}.sw-style-badge{position:absolute;right:-7px;bottom:-5px;background:#2a1b43;border:2px solid #ffe9b0;border-radius:50%;width:25px;height:25px;display:grid;place-items:center;font-size:13px}.sw-world-tools{position:absolute;left:12px;bottom:116px;z-index:5;display:flex;gap:7px}.sw-world-tools button{border:1px solid rgba(255,255,255,.25);background:rgba(20,14,34,.82);color:#fff;border-radius:999px;padding:8px 11px;font-size:11px}.sw-map-wrap.palette-sunset .sw-map-bg{filter:saturate(1.12) sepia(.12) hue-rotate(-10deg)}.sw-map-wrap.palette-moon .sw-map-bg{filter:saturate(.85) brightness(.75) hue-rotate(18deg)}.sw-map-wrap.palette-spring .sw-map-bg{filter:saturate(1.28) brightness(1.05)}

/* Secret World v2 — an isometric, buildable world rather than a static map. */
.sw-world-stage{position:relative;height:540px;margin-top:58px;overflow:hidden;background:#1e2733}
.sw-webgl{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:crosshair}
.sw-3d-label{position:absolute;left:12px;bottom:14px;z-index:5;background:rgba(11,9,22,.72);color:#fff;border:1px solid rgba(255,255,255,.18);border-radius:12px;padding:8px 10px;font-size:10px;line-height:1.35;backdrop-filter:blur(7px);pointer-events:none}.sw-3d-label b{color:#ffe29a;display:block;font-size:11px}
.sw-world-stage::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,transparent 55%,rgba(8,5,18,.48));z-index:4}
.sw-world-sky{position:absolute;inset:0;overflow:hidden}.sw-world-sky i{position:absolute;width:3px;height:3px;border-radius:50%;background:#fff;box-shadow:0 0 10px #fff;animation:swTwinkle 3s ease-in-out infinite}.sw-world-sky i:nth-child(1){left:13%;top:17%}.sw-world-sky i:nth-child(2){left:78%;top:21%;animation-delay:1s}.sw-world-sky i:nth-child(3){left:58%;top:8%;animation-delay:2s}@keyframes swTwinkle{50%{opacity:.25;transform:scale(.5)}}
.sw-iso-land{position:absolute;left:50%;top:49%;width:330px;height:330px;transform:translate(-50%,-50%) rotateX(58deg) rotateZ(45deg);border-radius:34px;background:linear-gradient(135deg,#74b96c,#326d48);box-shadow:18px 25px 0 #244633,28px 38px 45px rgba(0,0,0,.48);border:2px solid rgba(255,255,255,.22)}
.sw-iso-grid{position:absolute;inset:14px;border-radius:24px;background-image:linear-gradient(rgba(255,255,255,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.12) 1px,transparent 1px);background-size:50px 50px}
.sw-world-stage.world-city{background:linear-gradient(#7053a4 0,#d591a3 43%,#2a2445 44%)}.sw-world-stage.world-city .sw-iso-land{background:linear-gradient(135deg,#8993a2,#485466);box-shadow:18px 25px 0 #303846,28px 38px 45px rgba(0,0,0,.55)}
.sw-world-stage.world-enchanted-forest{background:linear-gradient(#213b51,#466d63 46%,#13271e 47%)}.sw-world-stage.world-enchanted-forest .sw-iso-land{background:linear-gradient(135deg,#79b568,#2f7045);box-shadow:18px 25px 0 #214a31,28px 38px 45px rgba(0,0,0,.55)}
.sw-world-stage.world-island-kingdom{background:linear-gradient(#72c8e7,#bde9ec 45%,#187da0 46%)}.sw-world-stage.world-island-kingdom .sw-iso-land{background:linear-gradient(135deg,#e4d18b,#65a85f);box-shadow:18px 25px 0 #166b87,28px 38px 45px rgba(0,0,0,.42)}
.sw-world-stage.world-cloud-realm{background:linear-gradient(#806fc0,#e8bfe4 60%,#9b82c4)}.sw-world-stage.world-cloud-realm .sw-iso-land{background:linear-gradient(135deg,#eef0ff,#a9a0d7);box-shadow:18px 25px 0 #6e5fa0,28px 38px 45px rgba(0,0,0,.35)}
.sw-world-stage.world-ocean-sanctuary{background:linear-gradient(#166d91,#48b5bf 52%,#073d5d)}.sw-world-stage.world-ocean-sanctuary .sw-iso-land{background:linear-gradient(135deg,#67c8bb,#247b7c);box-shadow:18px 25px 0 #09546c,28px 38px 45px rgba(0,0,0,.48)}
.sw-world-stage.world-desert-empire{background:linear-gradient(#cd7759,#efb36f 48%,#8f4f37)}.sw-world-stage.world-desert-empire .sw-iso-land{background:linear-gradient(135deg,#e8bc72,#b86e3e);box-shadow:18px 25px 0 #70412e,28px 38px 45px rgba(0,0,0,.48)}
.sw-built-object{position:absolute;z-index:3;transform:translate(-50%,-100%);text-align:center;cursor:pointer;filter:drop-shadow(0 10px 8px rgba(0,0,0,.4));animation:swObjectArrive .55s cubic-bezier(.2,.9,.3,1.3)}@keyframes swObjectArrive{from{opacity:0;transform:translate(-50%,-70%) scale(.5)}to{opacity:1;transform:translate(-50%,-100%) scale(1)}}
.sw-built-object .obj-icon{font-size:42px;display:block;animation:swIdleBob 4.2s ease-in-out infinite}.sw-built-object .obj-level{font-size:9px;color:#fff;background:rgba(15,10,28,.76);border:1px solid rgba(255,255,255,.25);padding:2px 7px;border-radius:999px;white-space:nowrap}.sw-built-object.level-2 .obj-icon{font-size:50px}.sw-built-object.level-3 .obj-icon{font-size:58px;filter:drop-shadow(0 0 10px rgba(255,232,151,.55))}
.sw-empty-plot{position:absolute;z-index:2;width:54px;height:30px;border:1px dashed rgba(255,255,255,.55);background:rgba(255,255,255,.09);border-radius:50%;transform:translate(-50%,-50%) rotate(-12deg);cursor:pointer}.sw-empty-plot::after{content:'+';position:absolute;inset:0;display:grid;place-items:center;color:#fff;font:bold 20px system-ui;transform:rotate(12deg)}
.sw-build-dock{position:absolute;left:10px;right:10px;bottom:112px;z-index:6;display:flex;gap:8px}.sw-build-dock button{flex:1;border:1px solid rgba(255,255,255,.22);background:rgba(17,12,31,.88);color:#fff;padding:10px 6px;border-radius:13px;font-size:11px;font-weight:700;backdrop-filter:blur(8px)}
.sw-world-progress{position:absolute;left:12px;right:12px;top:10px;z-index:6;background:rgba(17,12,31,.78);border:1px solid rgba(255,255,255,.18);border-radius:14px;padding:9px 11px;backdrop-filter:blur(8px)}.sw-world-progress-row{display:flex;justify-content:space-between;color:#fff;font-size:11px;margin-bottom:6px}.sw-world-progress-track{height:5px;background:rgba(255,255,255,.16);border-radius:99px;overflow:hidden}.sw-world-progress-fill{height:100%;background:linear-gradient(90deg,#ffe08a,#c084fc);border-radius:99px}
.sw-world-avatar{position:absolute;z-index:5;left:53%;top:58%;transform:translate(-50%,-100%);cursor:pointer;text-align:center}.sw-avatar-head{width:52px;height:52px;border-radius:50%;overflow:hidden;border:3px solid #ffe7a5;background:#392959;animation:swHeadAlive 4s ease-in-out infinite;transform-origin:50% 90%;box-shadow:0 8px 18px rgba(0,0,0,.45)}.sw-avatar-head img{width:100%;height:100%;object-fit:cover}.sw-avatar-body{width:40px;height:52px;margin:-5px auto 0;border-radius:16px 16px 9px 9px;background:linear-gradient(145deg,#7d5ce0,#49358c);position:relative;z-index:-1}.world-enchanted-forest .sw-avatar-body{background:linear-gradient(145deg,#668849,#2f5739)}.world-city .sw-avatar-body{background:linear-gradient(145deg,#4cd3dc,#4a4d98)}.world-desert-empire .sw-avatar-body{background:linear-gradient(145deg,#d9a05a,#833c43)}@keyframes swHeadAlive{0%,44%,48%,100%{transform:rotate(0)}45%{transform:rotate(-4deg)}47%{transform:rotate(4deg)}}
.sw-avatar-speech{position:absolute;left:48px;top:-18px;width:128px;background:#fff;color:#251d35;border-radius:14px 14px 14px 3px;padding:8px 9px;font-size:10px;line-height:1.25;text-align:left;box-shadow:0 8px 22px rgba(0,0,0,.25);animation:swSpeech 6s ease-in-out infinite}@keyframes swSpeech{0%,70%,100%{opacity:0;transform:translateY(4px)}8%,58%{opacity:1;transform:translateY(0)}}
.sw-build-card{position:relative;overflow:hidden}.sw-build-card .sw-pick-card-title{font-size:15px}.sw-build-price{display:flex;justify-content:space-between;align-items:center;margin-top:8px;color:#ffe9b0;font-size:11px}.sw-lock-note{font-size:10px;color:rgba(255,255,255,.5);margin-top:5px}.sw-ability-chip{display:inline-flex;align-items:center;gap:5px;margin:3px;padding:6px 9px;border-radius:999px;background:rgba(192,132,252,.13);border:1px solid rgba(192,132,252,.35);color:#fff;font-size:11px}
.sw-clue-card{background:linear-gradient(145deg,rgba(255,224,138,.14),rgba(192,132,252,.08));border:1px solid rgba(255,224,138,.28);border-radius:15px;padding:12px;color:#fff;margin:10px 0}.sw-clue-card b{color:#ffe08a}.sw-call-float{position:absolute;right:12px;bottom:174px;z-index:6;width:46px;height:46px;border:none;border-radius:50%;background:linear-gradient(145deg,#65d89a,#2aa96c);color:#10261a;font-size:19px;box-shadow:0 10px 24px rgba(42,169,108,.38)}

  /* Fast category flow: the whole card is the action—no duplicate arrow. */
  #categories .cat-card{position:relative;cursor:pointer;}
  #categories .cat-card::after{content:none!important;display:none!important;}
  .category-legacy-continue{display:none!important;}

  /* Compact chat identity lives in the always-visible dark top panel. */
  .chat-top-identity,.chat-top-call{display:none;}
  .phone.chat-mode .statusbar{height:64px;padding:0 14px;gap:8px;background:rgba(5,6,16,.92);border-bottom:1px solid rgba(255,255,255,.08);}
  .phone.chat-mode .statusbar>span:first-child{display:none;}
  .phone.chat-mode .chat-top-identity{display:flex;min-width:0;flex:1;align-items:center;gap:9px;border:0;background:none;color:var(--ink);padding:0;text-align:left;cursor:pointer;}
  .chat-top-identity img{width:40px;height:40px;border-radius:50%;object-fit:cover;object-position:center top;border:1px solid rgba(255,255,255,.2);background:var(--bg-panel-2);}
  .chat-top-identity>span{display:flex;min-width:0;flex-direction:column;gap:2px;}
  .chat-top-identity b{font-size:13px;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .chat-top-identity small{font-size:9px;color:var(--ink-dim);}
  .phone.chat-mode .theme-studio{margin-left:auto;}
  .phone.chat-mode .chat-top-call{display:grid;place-items:center;width:34px;height:34px;flex:0 0 34px;border-radius:50%;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.08);color:var(--ink);font-size:16px;cursor:pointer;}
  .phone.chat-mode .statusbar-sos{flex:0 0 auto;}
  .phone.chat-mode .statusbar-sos-label{display:none;}
  .phone.chat-mode .chat-hero{display:none;}
  .phone.chat-mode #chat{padding-top:10px;}

  /* Mobile Safari can draw its own large play badge over muted category
     previews. The card owns the tap, so suppress that redundant media UI. */
  .category-teddy-video{pointer-events:none;}
  .category-teddy-video::-webkit-media-controls,
  .category-teddy-video::-webkit-media-controls-panel,
  .category-teddy-video::-webkit-media-controls-start-playback-button,
  .category-teddy-video::-webkit-media-controls-overlay-play-button{display:none!important;-webkit-appearance:none;opacity:0!important;}

  /* Keep the composer fully above the absolute bottom navigation on every
     viewport, including short desktop previews and phones with a safe area. */
  .phone.chat-mode .chat-input-row{
    position:relative;
    bottom:auto;
    z-index:4;
    padding-bottom:4px;
  }


  /* Chat layout: keep the composer and bottom navigation in normal flex flow.
     This prevents the composer from being clipped or floating too high as the
     viewport height changes. Other screens keep the existing overlay navbar. */
  .phone.chat-mode .navbar{
    position:relative;
    left:auto;
    right:auto;
    bottom:auto;
    flex:0 0 auto;
    z-index:5;
  }
  .phone.chat-mode #chat{
    min-height:0;
    padding-bottom:10px;
  }
  .phone.chat-mode .chat-input-row{
    margin-bottom:0;
    padding-bottom:2px;
  }


  /* Final viewport polish: reclaim the fake preview clock area on normal
     screens while preserving the functional companion header in chat. */
  .statusbar>span:first-child{display:none!important;}
  .phone:not(.chat-mode) .statusbar{
    position:absolute;
    inset:0 0 auto 0;
    height:44px;
    z-index:20;
    pointer-events:none;
    background:transparent;
  }
  .phone:not(.chat-mode) .statusbar .theme-studio,
  .phone:not(.chat-mode) .statusbar button{pointer-events:auto;}
  .phone:not(.chat-mode) .statusbar .theme-studio{margin-left:auto;}
  .phone.chat-mode .statusbar{position:relative;inset:auto;}

  /* Let the composer surface reach both screen edges while keeping its
     controls aligned with the chat content. */
  .phone.chat-mode .chat-input-row{
    margin-left:-22px;
    margin-right:-22px;
    padding:8px 22px 2px;
    background:var(--bg-deep);
  }

  /* Desktop users can drag a subtle scrollbar; touch keeps momentum scroll. */
  .chat-suggestions{scrollbar-width:thin;scrollbar-color:rgba(180,192,255,.42) transparent;overscroll-behavior-inline:contain;}
  @media (hover:hover) and (pointer:fine){
    .chat-suggestions{padding-bottom:8px;cursor:grab;}
    .chat-suggestions:active{cursor:grabbing;}
    .chat-suggestions::-webkit-scrollbar{display:block;height:5px;}
    .chat-suggestions::-webkit-scrollbar-track{background:transparent;}
    .chat-suggestions::-webkit-scrollbar-thumb{background:rgba(180,192,255,.42);border-radius:999px;}
  }

  /* Avoid unnecessary enlargement/softening of the supplied splash source. */
  .cinematic-splash-art{inset:0;}
  .cinematic-splash-art video{
    transform:scaleX(-1);
    filter:saturate(.96) contrast(1.08) brightness(.76);
    image-rendering:auto;
  }


  /* Force the supplied cinematic splash to mirror consistently so the face
     anchors on the right, including reduced-motion and theme overrides. */
  #splash .cinematic-splash-art video{
    transform:none!important;
    object-position:52% center!important;
    image-rendering:auto;
  }


  /* Remove the decorative phone-status strip completely outside chat.
     The theme control floats over the content and consumes no layout space. */
  .phone:not(.chat-mode) .statusbar{
    height:0!important;
    min-height:0!important;
    padding:0!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    overflow:visible!important;
  }
  .phone:not(.chat-mode) .statusbar .theme-studio{
    position:absolute!important;
    top:14px!important;
    right:14px!important;
    margin:0!important;
  }


  /* Instant-first-paint splash: never hide the lightweight poster behind an entrance animation. */
  #splash.active{animation:none!important;opacity:1!important;filter:none!important;transform:none!important}
  #splash .cinematic-splash-art{animation:none!important;opacity:1!important;filter:none!important;transform:none!important}


/* ===== LIVING TABLE ===== */
.table-mode-rail{gap:7px!important;padding-block:7px!important}
.table-mode-chip{border:1px solid rgba(186,178,255,.2)!important;background:rgba(18,16,38,.54)!important;backdrop-filter:blur(16px);transition:transform .18s ease,background .18s ease,border-color .18s ease!important}
.table-mode-chip:hover{transform:translateY(-1px);border-color:rgba(199,182,255,.52)!important}
.table-mode-chip.on{background:linear-gradient(135deg,rgba(127,103,255,.48),rgba(216,112,194,.28))!important;border-color:rgba(225,205,255,.72)!important;box-shadow:0 7px 22px rgba(83,55,180,.2)}
.table-mode-notice{align-self:center;margin:7px auto;padding:5px 11px;border-radius:999px;background:rgba(139,116,220,.12);border:1px solid rgba(193,178,255,.16);color:var(--ink-dim);font-size:11px;letter-spacing:.02em;animation:reactionPop .25s ease}
.table-reaction-row{display:flex;gap:7px;max-width:92%;margin:2px 0 10px 11px;animation:reactionPop .28s ease}
.table-reaction-chip{display:flex;align-items:center;gap:6px;min-width:0;padding:5px 9px 5px 5px;border-radius:999px;border:1px solid rgba(190,182,232,.14);background:rgba(24,23,46,.5);color:var(--ink-dim);font:500 11px/1.2 var(--sans);cursor:pointer;opacity:.82;transition:opacity .18s ease,transform .18s ease,border-color .18s ease}
.table-reaction-chip:hover{opacity:1;transform:translateY(-1px);border-color:rgba(193,179,255,.38)}
.table-reaction-chip img{width:24px;height:24px;border-radius:50%;object-fit:cover;border:1px solid rgba(255,255,255,.18)}
.table-reaction-emoji{font-size:12px}
.persona-label{max-width:86%;background:transparent!important;border:0!important;box-shadow:none!important;padding:3px 4px!important;color:var(--ink-dim)!important;font-size:11.5px!important}
.persona-label-avatar{width:28px!important;height:28px!important;box-shadow:0 0 0 2px rgba(172,150,255,.2)}
@media(max-width:560px){.table-reaction-row{max-width:100%;overflow-x:auto;scrollbar-width:none}.table-reaction-row::-webkit-scrollbar{display:none}.table-reaction-chip{flex:0 0 auto}}


/* ===== PLANNER CATEGORY PAIR ===== */
.planner-category-pair{display:flex!important;align-items:flex-end!important;justify-content:center!important;gap:0!important;overflow:hidden!important;background:radial-gradient(circle at 50% 75%,rgba(134,108,255,.22),transparent 64%)!important}
.planner-category-pair img{width:58%!important;height:96%!important;object-fit:contain!important;object-position:center bottom!important;filter:drop-shadow(0 10px 18px rgba(0,0,0,.32));transition:transform .28s cubic-bezier(.16,1,.3,1),filter .28s ease}
.planner-category-pair img:first-child{margin-right:-16%;transform:translateX(3%) scale(.96)}
.planner-category-pair img:last-child{transform:translateX(-3%) scale(.96)}
.cat-card:hover .planner-category-pair img:first-child,.cat-card.selected .planner-category-pair img:first-child{transform:translateX(-1%) scale(1)}
.cat-card:hover .planner-category-pair img:last-child,.cat-card.selected .planner-category-pair img:last-child{transform:translateX(1%) scale(1)}


/* ===== PLANNER FACE VISIBILITY + SEAMLESS SPLASH =====
   Planner thumbnails crop lower-body detail, never the face. The splash
   paints a liquid-dark background immediately and reveals video only once
   the browser has decoded a frame, avoiding a poster-to-video flash. */
.planner-category-pair img{
  width:58%!important;
  height:112%!important;
  flex:0 0 58%!important;
  align-self:flex-start!important;
  margin-top:4px!important;
  object-fit:cover!important;
  object-position:center 7%!important;
}
.planner-category-pair img:first-child{margin-right:-16%!important}
#splash .cinematic-splash-art{
  background:radial-gradient(circle at 76% 42%,rgba(120,88,255,.22),transparent 34%),linear-gradient(145deg,#070816,#111027 58%,#080914)!important;
}
#splash .cinematic-splash-art video{
  opacity:0!important;
  transition:opacity .52s cubic-bezier(.22,.61,.36,1)!important;
  will-change:opacity;
}
#splash .cinematic-splash-art.video-ready video{opacity:1!important}
@media (prefers-reduced-motion:reduce){
  #splash .cinematic-splash-art video{transition:opacity .18s linear!important}
}


/* Planner portraits are tall 2:3 originals. Anchor their square roster crop
   to the top so hair, forehead, eyes and the complete face remain visible. */
.roster-card.planner-roster-card img{
  object-fit:cover!important;
  object-position:center top!important;
}


/* ===== FUTURE YOU: POSSIBLE LIVES STUDIO ===== */
.future-studio-screen{background:
 radial-gradient(circle at 88% 8%,rgba(116,74,255,.22),transparent 30%),
 radial-gradient(circle at 8% 82%,rgba(31,181,255,.14),transparent 34%),
 var(--bg-deep);}
.future-studio-screen h1{font-size:29px;line-height:1.02;margin:8px 0 12px;letter-spacing:-.02em}
.future-kicker{color:#9eeeff;font-size:10px;font-weight:800;letter-spacing:.18em;text-transform:uppercase}
.future-back{border:1px solid rgba(255,255,255,.16);background:rgba(12,13,32,.5);color:var(--ink);border-radius:999px;padding:8px 12px;font:600 11px var(--sans);cursor:pointer}
.future-step-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}
.future-step-head>span{font-size:10px;letter-spacing:.16em;color:var(--ink-dim)}
.future-portal-shell blockquote{margin:18px 0;padding:13px 15px;border-left:2px solid #a58cff;background:rgba(119,91,245,.08);border-radius:0 14px 14px 0;color:#e9e5ff;font:italic 14px/1.45 var(--serif)}
.future-portal{height:190px;position:relative;margin:16px 0 20px;border-radius:28px;overflow:hidden;background:linear-gradient(160deg,#080a19,#19163a 52%,#090b18);border:1px solid rgba(180,166,255,.24);box-shadow:inset 0 0 50px rgba(96,73,220,.12),0 24px 52px rgba(0,0,0,.25)}
.future-present-self,.future-arrived-self{position:absolute;bottom:18px;width:72px;height:128px;border-radius:48% 48% 28% 28%;filter:drop-shadow(0 14px 18px rgba(0,0,0,.4))}
.future-present-self{left:42px;background:linear-gradient(160deg,#27304b,#0b1021)}
.future-arrived-self{right:42px;background:linear-gradient(160deg,#ba8cff,#4d37a9);animation:futureAlive 4s ease-in-out infinite}
.future-present-self:before,.future-arrived-self:before{content:'';position:absolute;left:16px;top:-27px;width:40px;height:46px;border-radius:48% 48% 44% 44%;background:inherit}
.future-present-self span,.future-arrived-self span{position:absolute;bottom:-14px;left:50%;transform:translateX(-50%);white-space:nowrap;color:var(--ink-dim);font-size:8px;letter-spacing:.14em}
.future-portal-ring{position:absolute;left:50%;top:50%;width:112px;height:160px;transform:translate(-50%,-50%);border:1px solid rgba(170,151,255,.72);border-radius:50%;box-shadow:0 0 18px #7459e8,inset 0 0 22px rgba(79,220,255,.28);animation:portalPulse 3.2s ease-in-out infinite}
.future-portal-ring:after{content:'';position:absolute;inset:9px;border-radius:50%;background:linear-gradient(110deg,rgba(70,227,255,.08),rgba(176,92,255,.18),rgba(255,255,255,.02));backdrop-filter:blur(3px)}
.future-portal-ring i{position:absolute;width:5px;height:5px;border-radius:50%;background:#c8f7ff;box-shadow:0 0 12px #78eaff;animation:portalOrbit 5s linear infinite}
.future-portal-ring i:nth-child(1){left:8px;top:28px}.future-portal-ring i:nth-child(2){right:4px;top:83px;animation-delay:-1.7s}.future-portal-ring i:nth-child(3){left:31px;bottom:4px;animation-delay:-3.2s}
@keyframes portalPulse{50%{transform:translate(-50%,-50%) scale(1.035);filter:brightness(1.2)}}@keyframes portalOrbit{50%{transform:translate(9px,-7px);opacity:.45}}@keyframes futureAlive{50%{transform:translateY(-4px) rotate(.5deg)}}
.future-entry-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.future-entry-card,.future-self-card,.future-horizon-track button,.future-mode{border:1px solid rgba(173,158,255,.22);background:linear-gradient(145deg,rgba(39,37,76,.78),rgba(15,17,39,.74));color:var(--ink);border-radius:18px;padding:14px;text-align:left;cursor:pointer;transition:transform .18s ease,border-color .18s ease,background .18s ease}
.future-entry-card:hover,.future-self-card:hover,.future-horizon-track button:hover,.future-mode:hover,.future-self-card.selected,.future-horizon-track button.selected{transform:translateY(-2px);border-color:rgba(149,224,255,.7);background:linear-gradient(145deg,rgba(77,64,143,.82),rgba(22,33,67,.8))}
.future-entry-card b,.future-self-card b,.future-horizon-track b,.future-mode b{display:block;font-size:13px}.future-entry-card span,.future-self-card span,.future-horizon-track span,.future-mode span{display:block;color:var(--ink-dim);font-size:10px;line-height:1.35;margin-top:4px}
.future-self-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.future-self-card{min-height:102px}.future-self-card i{display:block;color:#a8efff;font:normal 22px var(--serif);margin-bottom:10px}.future-self-card.wide{grid-column:1/-1;min-height:86px}
.future-horizon-track{display:grid;gap:11px;position:relative}.future-horizon-track:before{content:'';position:absolute;left:20px;top:28px;bottom:28px;width:1px;background:linear-gradient(#64e5ff,#9b76ff,transparent)}
.future-horizon-track button{position:relative;padding-left:42px;min-height:72px}.future-horizon-track button:before{content:'';position:absolute;left:15px;top:27px;width:11px;height:11px;border-radius:50%;background:#12172e;border:2px solid #90ebff;box-shadow:0 0 12px rgba(89,226,255,.6)}
.future-field{display:block;margin:14px 0}.future-field>span,.future-mode-title{display:block;margin-bottom:8px;color:#cdd7ff;font-size:10px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.future-field textarea,.future-module input,.future-module textarea{width:100%;box-sizing:border-box;border:1px solid rgba(171,158,255,.2);background:rgba(10,12,30,.68);color:var(--ink);border-radius:13px;padding:12px;font:13px/1.45 var(--sans);outline:none}.future-field textarea{min-height:92px;resize:vertical}.future-module input+input{margin-top:8px}.future-module textarea{min-height:74px;resize:vertical}.future-module input:focus,.future-module textarea:focus,.future-field textarea:focus{border-color:#75ddff;box-shadow:0 0 0 3px rgba(79,209,255,.08)}
.future-module{margin:10px 0;border:1px solid rgba(173,158,255,.18);border-radius:17px;background:rgba(17,18,43,.58);overflow:hidden}.future-module summary{list-style:none;cursor:pointer;padding:13px 14px}.future-module summary::-webkit-details-marker{display:none}.future-module summary span{display:block;font-size:13px;font-weight:750}.future-module summary small{display:block;color:var(--ink-dim);margin-top:3px}.future-module summary:after{content:'+';float:right;margin-top:-26px;color:#9de9ff;font-size:18px}.future-module[open] summary:after{content:'–'}.future-module-body{padding:0 13px 13px}.future-module-body p{color:var(--ink-dim);font-size:10px;line-height:1.4;margin:9px 2px 0}
.future-mini-timeline{display:flex;align-items:center;gap:5px;overflow-x:auto;margin-top:10px;color:#dfe6ff;font-size:8px;white-space:nowrap}.future-mini-timeline i{width:18px;height:1px;background:linear-gradient(90deg,#79e5ff,#a676ff);flex:0 0 auto}
.future-mode-title{margin-top:18px}.future-mode-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.future-mode{min-height:88px;padding:12px}.future-mode.on{border-color:rgba(126,227,255,.62);box-shadow:inset 0 0 24px rgba(84,129,255,.11)}.future-mode.on:after{content:'✓';float:right;margin-top:-38px;color:#8decff}
.future-ready-card{margin:16px 0;padding:15px;border-radius:18px;border:1px solid rgba(118,222,255,.27);background:linear-gradient(135deg,rgba(60,88,166,.22),rgba(103,53,160,.16))}.future-ready-card span{font-size:8px;letter-spacing:.16em;color:#8feeff}.future-ready-card b{display:block;margin:5px 0;font:600 17px var(--serif)}.future-ready-card p{margin:0;color:var(--ink-dim);font-size:11px;line-height:1.4}
.future-enter-btn{background:linear-gradient(100deg,#39c6ff,#816cff 56%,#db6fd0)!important;box-shadow:0 10px 30px rgba(90,94,255,.25)}.future-ethics{text-align:center;color:var(--ink-dim);font-size:9px;line-height:1.4;margin:10px 12px 0}
@media(max-width:420px){.future-present-self{left:30px}.future-arrived-self{right:30px}.future-studio-screen h1{font-size:27px}}


/* ===== FUTURE YOU CHAT WORKSPACE ===== */
.future-chat-workspace{flex:0 0 auto;margin:-2px -10px 6px;padding:8px 10px 7px;background:linear-gradient(180deg,rgba(12,13,34,.98),rgba(14,16,40,.9));border-bottom:1px solid rgba(139,214,255,.16);position:relative;z-index:6}
.future-goal-banner{width:100%;display:grid;grid-template-columns:34px minmax(0,1fr) 54px 14px;align-items:center;gap:9px;padding:9px 10px;border-radius:15px;border:1px solid rgba(135,219,255,.25);background:linear-gradient(110deg,rgba(44,69,137,.32),rgba(104,54,158,.24));color:var(--ink);text-align:left;cursor:pointer;box-shadow:inset 0 1px rgba(255,255,255,.05)}
.future-goal-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;border:1px solid rgba(135,231,255,.48);color:#9aeeff;box-shadow:0 0 15px rgba(83,206,255,.18);font-size:18px}
.future-goal-copy{min-width:0;display:block}.future-goal-copy small{display:block;color:#86eaff;font-size:7px;letter-spacing:.16em}.future-goal-copy b{display:block;margin:2px 0;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.future-goal-copy em{display:block;color:var(--ink-dim);font:normal 8.5px/1.2 var(--sans);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.future-goal-progress{height:4px;background:rgba(255,255,255,.1);border-radius:99px;overflow:hidden}.future-goal-progress i{display:block;width:0;height:100%;background:linear-gradient(90deg,#57dcff,#9d74ff,#ed78d0);border-radius:99px;transition:width .45s ease}
.future-goal-arrow{color:#a9eaff;font-size:20px}.future-chat-context{display:flex;justify-content:space-between;align-items:center;margin:6px 3px 0}.future-chat-context>span{color:var(--ink-dim);font-size:7.5px;letter-spacing:.12em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.future-chat-context button{border:0;background:rgba(255,255,255,.06);color:var(--ink);border-radius:999px;padding:4px 8px;font-size:9px;cursor:pointer}.future-chat-context button b{color:#91eaff}
.future-chat-mode #chatMessages{background:radial-gradient(circle at 90% 10%,rgba(96,69,190,.08),transparent 28%)}
.future-topic-rail{scrollbar-width:none}.future-topic-rail::-webkit-scrollbar{display:none}.future-topic-rail .chat-suggestion-chip{border-color:rgba(129,216,255,.22);background:linear-gradient(135deg,rgba(39,52,103,.72),rgba(55,37,91,.62))}
.bubble.future-pinnable{position:relative;padding-right:35px}.future-pin-btn{position:absolute;right:7px;top:7px;width:23px;height:23px;border:0;border-radius:50%;background:rgba(6,8,20,.22);color:rgba(255,255,255,.38);font-size:10px;display:grid;place-items:center;opacity:.22;cursor:pointer;transition:opacity .16s ease,transform .16s ease,background .16s ease}.bubble.future-pinnable:hover .future-pin-btn,.future-pin-btn.on{opacity:1}.future-pin-btn:hover{transform:scale(1.08)}.future-pin-btn.on{background:rgba(90,206,255,.18);color:#b6f2ff;box-shadow:0 0 0 1px rgba(126,224,255,.28)}.bubble.future-pinnable.is-pinned{box-shadow:inset 2px 0 rgba(117,224,255,.55)}
.future-pins-panel{background:linear-gradient(180deg,rgba(17,18,43,.99),rgba(9,10,26,.99))!important}.future-pinned-card{margin:9px 0;padding:12px;border:1px solid rgba(145,214,255,.18);border-radius:15px;background:rgba(56,54,103,.24)}.future-pinned-card small{color:#86eaff;font-size:7px;letter-spacing:.13em}.future-pinned-card p{margin:7px 0 10px;color:var(--ink);font-size:11px;line-height:1.45;white-space:pre-wrap}.future-pinned-card>div{display:flex;gap:7px}.future-pinned-card button{border:1px solid rgba(160,190,255,.2);background:rgba(255,255,255,.05);color:var(--ink-dim);border-radius:999px;padding:6px 9px;font-size:8px;cursor:pointer}.future-pinned-card button:first-child{color:#b8efff;border-color:rgba(117,222,255,.26)}
@media(max-width:560px){.future-pin-btn{opacity:.48}.future-goal-banner{grid-template-columns:32px minmax(0,1fr) 42px 10px}.future-goal-copy b{font-size:11px}}


/* ===== CATEGORY CINEMATIC ART CARDS ===== */
.category-art-scene{display:block!important;overflow:hidden!important;background:#080918!important;isolation:isolate}
.category-art-scene img{width:100%!important;height:100%!important;display:block!important;object-fit:cover!important;object-position:center 22%!important;transform:scale(1.01);transition:transform .38s cubic-bezier(.16,1,.3,1),filter .32s ease;filter:saturate(.94) contrast(1.02)}
.cat-card:hover .category-art-scene img,.cat-card.selected .category-art-scene img{transform:scale(1.08);filter:saturate(1.06) contrast(1.04) brightness(1.04)}
.cat-card:hover .category-art-scene,.cat-card.selected .category-art-scene{border-color:rgba(184,166,255,.58);box-shadow:inset 0 1px rgba(255,255,255,.14),0 0 20px rgba(132,107,255,.2)}
@media (prefers-reduced-motion:reduce){.category-art-scene img{transition:none!important}.cat-card:hover .category-art-scene img,.cat-card.selected .category-art-scene img{transform:scale(1.01)}}

/* Secret World visual novel v9 */
.sw-novel{background:#090817;color:#fff;overflow:hidden}.sw-novel .sw-topbar{background:rgba(7,6,19,.88);border-bottom:1px solid #ffffff14}.sw-nnav{display:flex!important;background:#080714e8;backdrop-filter:blur(24px);border-top:1px solid #ffffff18}.sw-nnav button{position:relative;color:#ffffff7a}.sw-nnav button span{font-size:18px}.sw-nnav button.active{color:#fff}.sw-nnav button.active:after{content:"";position:absolute;bottom:5px;left:50%;width:22px;height:2px;transform:translateX(-50%);background:linear-gradient(90deg,#77e4ff,#cf83ff)}
.swn-page{padding:28px 22px 110px;max-width:850px;margin:auto}.swn-kicker{font-size:10px;letter-spacing:.2em;color:#9fc9ff;font-weight:800}.swn-page h1{font:600 clamp(35px,7vw,54px)/1 'Playfair Display',Georgia,serif;margin:8px 0 12px}.swn-page>p{color:#ffffffa8;line-height:1.5}.swn-library{display:grid;gap:14px;margin-top:22px}.swn-card{min-height:205px;position:relative;overflow:hidden;border:1px solid #ffffff22;border-radius:26px;padding:22px;color:#fff;text-align:left;display:flex;flex-direction:column;align-items:flex-start;cursor:pointer;box-shadow:0 18px 38px #0005;transition:.25s}.swn-card:hover{transform:translateY(-3px);border-color:#ffffff66}.swn-card:after{content:"";position:absolute;width:180px;height:180px;right:-45px;top:-65px;border-radius:50%;background:radial-gradient(circle,#ffffff52,transparent 66%)}.swn-card.amber{background:linear-gradient(135deg,#38231f,#7c483b 55%,#1b1727)}.swn-card.violet{background:linear-gradient(135deg,#111943,#49327b 55%,#171225)}.swn-card.rose{background:linear-gradient(135deg,#3d1833,#7b4260 55%,#171326)}.swn-card small{font-size:9px;letter-spacing:.18em;color:#ffffff9c}.swn-card b{font:600 27px Georgia,serif;margin-top:34px}.swn-card em{font:normal 11px sans-serif;color:#d8c7ff;margin:5px 0 9px}.swn-card span{font-size:12px;line-height:1.4;color:#ffffffb8;max-width:82%}.swn-card strong{margin-top:auto;padding-top:15px;font-size:11px}.swn-page footer{text-align:center;color:#ffffff70;font-size:10px;margin:20px}
.swn-story{min-height:100%;padding-bottom:110px;background:#090817}.swn-scene{height:47vh;min-height:320px;max-height:520px;position:relative;overflow:hidden;background:linear-gradient(#243253,#9b5c5b 58%,#231b29)}.swn-story.violet .swn-scene{background:linear-gradient(#10193e,#55417c 56%,#17152d)}.swn-story.rose .swn-scene{background:linear-gradient(#26214a,#955d79 58%,#25182b)}.swn-orb{position:absolute;width:105px;height:105px;right:12%;top:12%;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#eadcff 60%,#ac8ee1);box-shadow:0 0 70px #d8baff88}.swn-land{position:absolute;left:-8%;right:-8%;bottom:-22%;height:65%;background:linear-gradient(145deg,transparent 30%,#0d0d207c 31% 49%,transparent 50%),linear-gradient(215deg,transparent 32%,#0b0b20d9 33% 58%,transparent 59%)}.swn-scene img{position:absolute;height:90%;max-width:74%;object-fit:contain;object-position:center bottom;left:50%;bottom:-2%;transform:translateX(-50%);filter:drop-shadow(0 20px 20px #0007);animation:swnBreath 4s ease-in-out infinite}.swn-scene label{position:absolute;left:18px;bottom:16px;background:#08071399;border:1px solid #ffffff38;border-radius:999px;padding:8px 11px;font-size:9px;letter-spacing:.08em;backdrop-filter:blur(12px)}.swn-create{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border:1px solid #ffffff55;background:#080714aa;color:#fff;border-radius:999px;padding:12px 18px}
@keyframes swnBreath{50%{transform:translateX(-50%) translateY(-4px) scale(1.008)}}.swn-dialog{max-width:760px;margin:auto;padding:22px;background:linear-gradient(#111022,#090817)}.swn-meta{display:flex;justify-content:space-between;color:#aab9ea;font-size:9px;letter-spacing:.1em;text-transform:uppercase}.swn-dialog h2{font:600 30px Georgia,serif;margin:10px 0}.swn-narr{color:#ffffff9c;line-height:1.55;font-style:italic}.swn-dialog blockquote{margin:17px 0;padding:17px 18px;border:1px solid #96aeff38;border-radius:19px;background:linear-gradient(135deg,#6971d02e,#d07ec51a)}.swn-dialog blockquote b{font-size:10px;letter-spacing:.1em;color:#bed9ff;text-transform:uppercase}.swn-dialog blockquote p{font:500 17px/1.5 Georgia,serif;margin:8px 0 0}.swn-choices{display:grid;gap:9px}.swn-choices button{border:1px solid #ffffff24;background:#ffffff0e;color:#fff;border-radius:16px;padding:13px 15px;text-align:left}.swn-choices button:hover{background:#9a89ff33;transform:translateX(3px)}.swn-choices i{display:inline-grid;place-items:center;width:25px;height:25px;margin-right:10px;border-radius:50%;background:#ffffff18;font:normal 9px sans-serif}.swn-picked{border-left:2px solid #bd9cff;background:#bd9cff14;padding:12px 14px;display:grid;gap:4px}.swn-picked small,.swn-picked span{font-size:9px;color:#ffffff78}.swn-pager{display:flex;justify-content:space-between;margin:16px 0}.swn-pager button{border:0;background:none;color:#c4cff5;padding:8px}.swn-pager button:disabled{opacity:.2}.swn-dialog aside{display:flex;flex-direction:column;text-align:center;background:#ffffff0b;border-radius:15px;padding:12px;font-size:10px}.swn-dialog aside span{color:#ffffff70;margin-top:3px}.swn-mem{display:grid;gap:10px;margin-top:20px}.swn-mem article{display:grid;gap:6px;border:1px solid #ffffff18;background:#ffffff0b;border-radius:17px;padding:16px}.swn-mem small{font-size:9px;color:#9fc9ff}.swn-mem b{font:600 19px Georgia,serif}.swn-mem span{color:#ffffffa8}.swn-empty{text-align:center;padding:55px 15px;color:#ffffff9b}.swn-empty>b{font-size:44px}@media(min-width:700px){.swn-library{grid-template-columns:repeat(3,1fr)}.swn-card{min-height:270px}.swn-scene{height:54vh}.swn-scene img{height:96%}}@media(prefers-reduced-motion:reduce){.swn-scene img{animation:none}}

/* Secret World Daily Edition v10 */
.swd-root{background:#080713;color:#fff;overflow:hidden}.swd-top{background:#080713e8;border-bottom:1px solid #ffffff14}.swd-nav{display:flex!important;background:#090815ed;backdrop-filter:blur(24px);border-top:1px solid #ffffff17}.swd-nav button{position:relative;color:#ffffff70}.swd-nav button>span{font-size:18px}.swd-nav button.active{color:#fff}.swd-nav button.active:after{content:"";position:absolute;bottom:5px;left:50%;transform:translateX(-50%);width:24px;height:2px;background:linear-gradient(90deg,#76dcff,#d583ff)}
.swd-loading,.swd-error{min-height:70vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:10px;padding:30px}.swd-loading i{width:42px;height:42px;border:2px solid #ffffff24;border-top-color:#bd9cff;border-radius:50%;animation:swdSpin 1s linear infinite}.swd-loading span,.swd-error span{color:#ffffff83;font-size:12px;max-width:300px}.swd-error button{border:1px solid #ffffff31;border-radius:999px;background:#ffffff10;color:#fff;padding:10px 18px}@keyframes swdSpin{to{transform:rotate(360deg)}}
.swd-story{min-height:100%;padding-bottom:108px;background:#080713}.swd-scene{position:relative;height:48vh;min-height:330px;max-height:560px;overflow:hidden;background:linear-gradient(180deg,var(--swd-a),var(--swd-b) 58%,#171222)}.swd-sky:before{content:"";position:absolute;width:118px;height:118px;right:10%;top:10%;border-radius:50%;background:radial-gradient(circle at 32% 30%,#fff,var(--swd-c) 65%,transparent 68%);box-shadow:0 0 80px color-mix(in srgb,var(--swd-c) 60%,transparent)}.swd-city{position:absolute;inset:50% -5% -15%;opacity:.7;background:linear-gradient(150deg,transparent 27%,#090b20 28% 48%,transparent 49%),linear-gradient(210deg,transparent 30%,#090a1f 31% 55%,transparent 56%)}.swd-cast{position:absolute;left:50%;bottom:-2%;height:94%;max-width:94%;object-fit:contain;transform:translateX(-50%);filter:drop-shadow(0 18px 22px #0009);animation:swdBreath 4.5s ease-in-out infinite}.swd-user-companion{position:absolute;right:3%;bottom:0;width:24%;height:45%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 12px 18px #0008);border-radius:30%}.swd-episode{position:absolute;left:17px;bottom:15px;padding:8px 11px;border:1px solid #ffffff42;border-radius:999px;background:#0807139e;backdrop-filter:blur(12px);font-size:9px;letter-spacing:.09em}.swd-panel{max-width:780px;margin:auto;padding:22px}.swd-series{display:flex;justify-content:space-between;color:#aab9ea;font-size:9px;letter-spacing:.12em;text-transform:uppercase}.swd-panel h1{font:600 34px/1.05 'Playfair Display',Georgia,serif;margin:10px 0}.swd-recap{color:#ffffff82;font-style:italic;line-height:1.45}.swd-prose p{color:#ffffffb8;line-height:1.62;margin:11px 0}.swd-dialogue{display:grid;gap:9px;margin-top:16px}.swd-dialogue article{padding:13px 15px;border:1px solid #ffffff13;border-radius:16px;background:#ffffff08;opacity:.68}.swd-dialogue article.latest{opacity:1;border-color:#9eb7ff48;background:linear-gradient(135deg,#6971d026,#d07ec514)}.swd-dialogue b{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#bcd7ff}.swd-dialogue p{font:500 16px/1.45 Georgia,serif;margin:6px 0 0}.swd-continue{width:100%;display:flex;justify-content:space-between;margin-top:14px;border:1px solid #b49cff45;background:#a58aff20;color:#fff;border-radius:16px;padding:14px 16px;text-align:left}.swd-continue span{font-size:20px}.swd-choicebox{margin-top:18px;padding:16px;border:1px solid #ffffff18;border-radius:20px;background:#ffffff08}.swd-choicebox h3{font:600 19px Georgia,serif;margin:0 0 12px}.swd-choicebox button{display:grid;width:100%;gap:3px;text-align:left;border:0;border-top:1px solid #ffffff12;background:none;color:#fff;padding:12px 4px}.swd-choicebox button:first-of-type{border-top:0}.swd-choicebox small{color:#ffffff6e}.swd-selected{display:grid;gap:5px;margin-top:18px;border-left:2px solid #c597ff;background:#c597ff12;padding:14px}.swd-selected small{font-size:9px;letter-spacing:.1em;color:#bfcfff}.swd-selected span{color:#ffffff89;font-style:italic}.swd-selected b{font:600 18px Georgia,serif}@keyframes swdBreath{50%{transform:translateX(-50%) translateY(-4px) scale(1.006)}}
.swd-news{min-height:100%;padding:28px 21px 110px;max-width:820px;margin:auto}.swd-newshero{padding:18px 0 24px}.swd-newshero small{font-size:9px;letter-spacing:.18em;color:#9fc9ff}.swd-newshero h1{font:600 clamp(38px,8vw,58px)/1 'Playfair Display',Georgia,serif;margin:9px 0}.swd-newshero p{color:#ffffff98;max-width:520px;line-height:1.5}.swd-feed{display:grid;gap:12px}.swd-feed article{display:grid;grid-template-columns:38px 1fr;gap:12px;padding:18px;border:1px solid #ffffff14;background:linear-gradient(135deg,#ffffff0b,#ffffff05);border-radius:20px}.swd-feed article>span{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#8fa8ff20;color:#a9c8ff;font-size:9px}.swd-feed h2{font:600 21px/1.2 Georgia,serif;margin:2px 0 8px}.swd-feed p{color:#ffffffa7;line-height:1.5;margin:0}.swd-feed aside{margin-top:10px;padding:10px 12px;border-left:2px solid #9fc9ff;background:#9fc9ff0c;color:#ffffff91;font-size:11px}.swd-feed aside b{display:block;color:#bfe0ff;margin-bottom:3px}.swd-sources{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}.swd-sources a{border:1px solid #ffffff18;border-radius:999px;padding:6px 9px;color:#cbd8ff;font-size:9px;text-decoration:none;max-width:240px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.swd-news footer{text-align:center;color:#ffffff57;font-size:9px;margin:22px}.swd-emptynews{display:grid;gap:6px;text-align:center;padding:45px 20px;border:1px dashed #ffffff20;border-radius:20px}.swd-emptynews span{color:#ffffff78;font-size:11px}@media(min-width:760px){.swd-scene{height:58vh}.swd-feed{grid-template-columns:1fr 1fr}.swd-cast{height:100%}}@media(prefers-reduced-motion:reduce){.swd-cast{animation:none}}

/* HereWhen Anime founder launch */
.af-root{min-height:100%;background:#070713;color:#fff;overflow-y:auto}.af-top{position:sticky;top:0;z-index:20;height:62px;display:flex;align-items:center;gap:10px;padding:0 18px;background:#080714d9;backdrop-filter:blur(22px);border-bottom:1px solid #ffffff12}.af-top button{border:1px solid #ffffff24;background:#ffffff0b;color:#fff;border-radius:999px;padding:8px 13px}.af-top img{width:25px;height:25px;margin-left:auto}.af-top span{font-size:9px;letter-spacing:.16em;color:#ffffff86}.af-hero{position:relative;min-height:670px;overflow:hidden;display:flex;align-items:flex-end;background:radial-gradient(circle at 65% 25%,#69487a 0,#242044 32%,#090817 72%)}.af-glow{position:absolute;width:430px;height:430px;right:-70px;top:-60px;border-radius:50%;background:radial-gradient(circle,#f4bd7070,transparent 66%);filter:blur(4px)}.af-stars{position:absolute;inset:0;opacity:.45;background-image:radial-gradient(circle,#fff 1px,transparent 1px);background-size:43px 43px;mask-image:linear-gradient(#000,transparent 75%)}.af-cast{position:absolute;right:-16%;top:10px;width:90%;height:75%;object-fit:contain;filter:drop-shadow(0 28px 34px #000c);animation:afFloat 5s ease-in-out infinite}.af-copy{position:relative;z-index:3;padding:360px 23px 42px;background:linear-gradient(transparent,#090817 38%);width:100%}.af-pill{display:inline-block;padding:7px 10px;border:1px solid #e2baff55;border-radius:999px;background:#ae75dc19;color:#e6c5ff;font-size:9px;font-weight:800;letter-spacing:.13em}.af-copy h1{font:600 clamp(44px,10vw,72px)/.96 'Playfair Display',Georgia,serif;margin:16px 0;letter-spacing:-.04em}.af-copy h1 em{font-style:italic;color:#e4b5ff}.af-copy>p{max-width:540px;color:#ffffffa8;line-height:1.55}.af-tags{display:flex;gap:7px;flex-wrap:wrap;margin-top:17px}.af-tags span{font-size:9px;border:1px solid #ffffff1c;background:#ffffff09;border-radius:999px;padding:7px 10px;color:#ffffff9c}.af-offer{padding:46px 22px 60px;max-width:760px;margin:auto}.af-overline{font-size:9px;letter-spacing:.18em;color:#a8c9ff;font-weight:800}.af-offer h2{font:600 34px/1.05 'Playfair Display',Georgia,serif;margin:10px 0}.af-intro{color:#ffffff83}.af-price{display:grid;grid-template-columns:1fr 1px 1fr;gap:18px;align-items:center;margin:25px 0;padding:20px;border:1px solid #ffffff18;background:linear-gradient(135deg,#aa78f51a,#69d8ff0d);border-radius:24px}.af-price small{display:block;font-size:8px;letter-spacing:.12em;color:#aebfe8}.af-price strong{font:700 43px Georgia,serif}.af-price strong sup{font-size:17px}.af-price>div>span{font-size:10px;color:#ffffff78}.af-price>i{width:1px;height:54px;background:#ffffff1e}.af-standard b{display:block;margin:9px 0 4px}.af-standard span{display:block;line-height:1.3}.af-meter>div{height:7px;border-radius:99px;background:#ffffff12;overflow:hidden}.af-meter>div>span{display:block;height:100%;min-width:3%;border-radius:inherit;background:linear-gradient(90deg,#75dcff,#d17cff);box-shadow:0 0 18px #b684ff}.af-meter p{text-align:center;font-size:10px;color:#ffffff70}.af-meter p b{color:#fff}.af-cta{width:100%;display:flex;justify-content:space-between;align-items:center;margin-top:24px;padding:16px 18px;border:0;border-radius:17px;background:linear-gradient(110deg,#627bff,#bd68e5 55%,#f48ab8);color:#fff;font-weight:800;box-shadow:0 16px 38px #8d5dce4a}.af-cta i{font-style:normal;font-size:19px}.af-nocharge{text-align:center;color:#ffffff64;font-size:9px;line-height:1.45}.af-confirmed{display:flex;gap:12px;align-items:flex-start;margin-top:23px;padding:17px;border:1px solid #7ce5bf50;background:#58d4a014;border-radius:18px}.af-confirmed>span{display:grid;place-items:center;width:29px;height:29px;border-radius:50%;background:#6fe0b3;color:#082017;font-weight:900}.af-confirmed b{color:#aaf1d4}.af-confirmed p{margin:5px 0 0;color:#ffffff80;font-size:11px;line-height:1.4}.af-includes{margin-top:42px}.af-includes h3{font:600 22px Georgia,serif}.af-includes>div{display:grid;gap:9px}.af-includes article{display:grid;grid-template-columns:35px 1fr;gap:3px 8px;padding:14px;border:1px solid #ffffff10;border-radius:16px;background:#ffffff07}.af-includes article>span{grid-row:1/3;color:#a7bfff;font-size:10px}.af-includes article p{margin:0;color:#ffffff70;font-size:10px;line-height:1.4}.af-tease{padding:55px 23px 120px;text-align:center;background:radial-gradient(circle at 50% 10%,#754e7235,transparent 62%)}.af-tease small{font-size:9px;letter-spacing:.18em;color:#d0aaff}.af-tease h2{font:italic 600 40px Georgia,serif;margin:11px}.af-tease p{max-width:520px;margin:0 auto;color:#ffffff8f;line-height:1.55}.af-characters{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:19px}.af-characters span{border:1px solid #ffffff1b;border-radius:999px;padding:7px 11px;color:#ffffff91;font-size:9px}@keyframes afFloat{50%{transform:translateY(-5px)}}@media(min-width:760px){.af-hero{min-height:620px;align-items:center}.af-cast{right:0;top:0;width:58%;height:100%}.af-copy{width:54%;padding:90px 0 90px 7%;background:none}.af-includes>div{grid-template-columns:repeat(3,1fr)}.af-includes article{grid-template-columns:1fr}.af-includes article>span{grid-row:auto}}@media(prefers-reduced-motion:reduce){.af-cast{animation:none}}

/* Anime flavour pass */
.af-speedlines{position:absolute;inset:-20%;opacity:.13;background:repeating-conic-gradient(from 205deg at 72% 38%,transparent 0 4deg,#fff 4.25deg 4.45deg,transparent 4.7deg 9deg);mask-image:radial-gradient(circle at 72% 38%,#000 0,transparent 62%);animation:afPulse 4s ease-in-out infinite}.af-jp-mark{position:absolute;left:5%;top:16%;font:900 clamp(64px,15vw,128px)/1 sans-serif;writing-mode:vertical-rl;letter-spacing:.05em;color:transparent;-webkit-text-stroke:1px #ffffff20;transform:rotate(9deg);z-index:1}.af-petals i{position:absolute;z-index:4;width:9px;height:14px;border-radius:80% 20% 70% 30%;background:linear-gradient(145deg,#ffd3e7,#d78cff);box-shadow:0 0 12px #de9bff99;animation:afPetal 7s linear infinite}.af-petals i:nth-child(1){left:7%;top:-5%;animation-delay:-1s}.af-petals i:nth-child(2){left:24%;top:-8%;animation-delay:-4s;scale:.7}.af-petals i:nth-child(3){left:46%;top:-4%;animation-delay:-2.2s}.af-petals i:nth-child(4){left:68%;top:-6%;animation-delay:-5.5s;scale:.8}.af-petals i:nth-child(5){left:84%;top:-9%;animation-delay:-3.4s}.af-petals i:nth-child(6){left:94%;top:-3%;animation-delay:-6.4s;scale:.6}@keyframes afPetal{0%{translate:0 -20px;rotate:0deg;opacity:0}10%{opacity:.85}100%{translate:-120px 760px;rotate:540deg;opacity:0}}@keyframes afPulse{50%{opacity:.2;transform:scale(1.03)}}.af-anime-bubble{position:absolute;right:7%;top:52%;z-index:6;display:grid;gap:2px;padding:10px 14px;background:#fff;color:#161224;border-radius:15px 15px 3px 15px;box-shadow:7px 9px 0 #16122466;transform:rotate(-2deg);animation:afBubble 3.8s ease-in-out infinite}.af-anime-bubble:after{content:"";position:absolute;right:3px;bottom:-9px;border:9px solid transparent;border-right-color:#fff;rotate:-12deg}.af-anime-bubble b{font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:#8557a8}.af-anime-bubble span{font:italic 600 12px Georgia,serif}.af-eyeline{display:block;margin-top:13px;color:#ffffff6b;font-size:10px;letter-spacing:.2em}.af-premiere{display:flex;align-items:center;gap:10px;max-width:370px;margin-top:20px;padding:10px;border:1px solid #ffffff20;background:#08071373;backdrop-filter:blur(12px);border-radius:15px}.af-premiere>i{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:linear-gradient(145deg,#786dff,#d16fd1);font-style:normal;font-size:9px;font-weight:900}.af-premiere>div{display:grid;gap:2px}.af-premiere b{font-size:11px}.af-premiere span{font-size:9px;color:#ffffff70}.af-premiere>strong{margin-left:auto;display:grid;place-items:center;width:30px;height:30px;border:1px solid #ffffff2b;border-radius:50%;font-size:9px}.af-manga-strip{display:grid;grid-template-columns:1.1fr .9fr;grid-template-rows:150px 115px;gap:7px;margin-top:36px;transform:rotate(-1deg)}.af-manga-strip article{position:relative;overflow:hidden;border:3px solid #f5efff;background:#161329;padding:12px;display:flex;flex-direction:column;justify-content:flex-end;box-shadow:6px 7px 0 #0007}.af-manga-strip article:before{content:"";position:absolute;inset:0;opacity:.8}.af-manga-strip article:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(135deg,transparent 0 12px,#ffffff08 12px 13px)}.af-manga-strip .panel-one{grid-row:1/3}.af-manga-strip .panel-one:before{background:radial-gradient(circle at 60% 32%,#ffd99888,transparent 18%),linear-gradient(155deg,#191b43,#694765 63%,#100e20)}.af-manga-strip .panel-two:before{background:radial-gradient(circle at 72% 36%,#f3d385,transparent 12%),linear-gradient(210deg,#171536,#50447c)}.af-manga-strip .panel-three:before{background:repeating-conic-gradient(from 10deg at 50% 45%,#19142d 0 6deg,#44305f 7deg 12deg)}.af-manga-strip span,.af-manga-strip b{position:relative;z-index:2}.af-manga-strip span{font-size:8px;letter-spacing:.13em;color:#e3c5ff}.af-manga-strip b{max-width:220px;font:italic 600 16px/1.15 Georgia,serif;margin-top:5px}.af-characters{align-items:stretch}.af-characters>span{display:grid;grid-template-columns:30px auto;grid-template-rows:auto auto;gap:0 8px;align-items:center;text-align:left;padding:9px 13px}.af-characters i{grid-row:1/3;display:grid;place-items:center;width:29px;height:29px;border-radius:50%;background:linear-gradient(145deg,#708aff,#d77fca);font:normal 800 8px sans-serif}.af-characters small{font-size:8px;color:#ffffff64}.af-season-stamp{display:inline-flex;flex-direction:column;gap:3px;margin-top:26px;padding:12px 24px;border:1px solid #d8b1ff42;background:#c493ff0c;transform:rotate(-1deg)}.af-season-stamp span{font-size:8px;letter-spacing:.2em;color:#cda7ff}.af-season-stamp b{font:italic 600 15px Georgia,serif}@keyframes afBubble{50%{transform:rotate(-1deg) translateY(-5px)}}@media(max-width:759px){.af-anime-bubble{right:5%;top:37%;max-width:170px}.af-jp-mark{top:10%}.af-manga-strip{grid-template-columns:1fr 1fr}.af-manga-strip .panel-one{grid-row:auto;grid-column:1/3}.af-copy{padding-top:395px}}@media(prefers-reduced-motion:reduce){.af-speedlines,.af-petals i,.af-anime-bubble{animation:none}}

/* Video-led HereWhen Anime launch v13 */
.af2-root{min-height:100%;background:#080711;color:#fff;overflow-y:auto}.af2-top{position:absolute;z-index:20;top:0;left:0;right:0;height:68px;display:flex;align-items:center;padding:0 20px;background:linear-gradient(#070611c9,transparent)}.af2-top>button{border:1px solid #ffffff35;background:#09081773;backdrop-filter:blur(12px);color:#fff;border-radius:999px;padding:8px 14px}.af2-brand{display:flex;align-items:center;gap:8px;margin-left:auto}.af2-brand img{width:29px;height:29px}.af2-brand span{font-size:8px;line-height:1.15;letter-spacing:.14em;color:#ffffff92}.af2-brand b{color:#fff}.af2-status{display:none;margin-left:20px;font-size:8px;letter-spacing:.13em;color:#ffffff95}.af2-status i{display:inline-block;width:6px;height:6px;margin-right:6px;border-radius:50%;background:#79e0bc;box-shadow:0 0 10px #79e0bc}.af2-hero{position:relative;height:min(78vh,720px);min-height:570px;overflow:hidden;background:#11132d}.af2-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:59% center;opacity:0;transform:scale(1.018);transition:opacity .65s ease}.af2-video.ready{opacity:1}.af2-shade{position:absolute;inset:0;background:linear-gradient(90deg,#080711e6 0,#08071184 34%,transparent 66%),linear-gradient(0deg,#080711 0,transparent 43%),linear-gradient(180deg,#0807118a 0,transparent 25%)}.af2-title{position:absolute;z-index:3;left:22px;right:22px;bottom:76px;max-width:540px}.af2-kicker,.af2-section-kicker{font-size:9px;letter-spacing:.2em;color:#f1c477;font-weight:800}.af2-title h1{font:600 clamp(52px,11vw,86px)/.82 'Playfair Display',Georgia,serif;letter-spacing:-.055em;margin:13px 0 20px;text-shadow:0 6px 30px #000}.af2-title h1 em{font-style:italic;color:#ffd694}.af2-title>p{max-width:430px;font:italic 500 16px/1.45 Georgia,serif;color:#ffffffe0}.af2-chips{display:flex;gap:7px;flex-wrap:wrap;margin-top:17px}.af2-chips span{padding:7px 10px;border:1px solid #ffffff30;background:#08071163;backdrop-filter:blur(10px);border-radius:999px;font-size:8px;letter-spacing:.06em}.af2-episode{position:absolute;z-index:3;right:20px;bottom:22px;display:none;min-width:160px;padding:13px 15px;border:1px solid #ffffff35;background:#0807118a;backdrop-filter:blur(14px);border-radius:14px}.af2-episode span,.af2-episode small{display:block;font-size:8px;letter-spacing:.12em;color:#ffffff78}.af2-episode b{display:block;font:600 17px Georgia,serif;margin:5px 0 2px}.af2-reserve{position:relative;z-index:5;padding:0 18px 55px;margin-top:-42px}.af2-card{max-width:720px;margin:auto;padding:23px;border:1px solid #ffffff21;background:linear-gradient(145deg,#161329ed,#0c0a18f5);backdrop-filter:blur(24px);border-radius:26px;box-shadow:0 24px 70px #0008}.af2-cardhead{display:flex;justify-content:space-between;align-items:flex-start}.af2-cardhead span{font-size:8px;letter-spacing:.17em;color:#d6b6ff}.af2-cardhead h2{font:600 29px/1.05 Georgia,serif;margin:8px 0}.af2-number{font:italic 700 44px/1 Georgia,serif!important;color:#ffffff0f!important}.af2-card>p{color:#ffffff88;line-height:1.5}.af2-prices{display:grid;grid-template-columns:1.15fr .85fr;gap:10px;margin:22px 0}.af2-prices>div{padding:15px;border-radius:17px;background:#ffffff08;border:1px solid #ffffff10}.af2-prices .founder{background:linear-gradient(135deg,#9771e42b,#f0ad5920);border-color:#eec48437}.af2-prices small{display:block;font-size:7px;letter-spacing:.12em;color:#ffffff68}.af2-prices b{display:inline-block;font:700 39px Georgia,serif;margin-top:7px;color:#ffe0a9}.af2-prices b sup{font-size:14px}.af2-prices .founder>span{font-size:8px;color:#ffffff78}.af2-prices strong{display:block;margin-top:14px;font:600 17px Georgia,serif}.af2-meter>div{height:6px;border-radius:99px;background:#ffffff10;overflow:hidden}.af2-meter>div span{display:block;height:100%;min-width:2%;border-radius:inherit;background:linear-gradient(90deg,#8c7cff,#ffc26c);box-shadow:0 0 15px #a987ff}.af2-meter p{text-align:right;font-size:9px;color:#ffffff65}.af2-meter p b{color:#fff}.af2-cta{width:100%;display:flex;align-items:center;justify-content:space-between;border:0;border-radius:16px;padding:16px 18px;background:linear-gradient(105deg,#786bdb,#af68d0 55%,#e89a6f);color:#fff;font-weight:800;box-shadow:0 14px 35px #8458bc42}.af2-cta b{font-size:20px}.af2-terms{display:flex;justify-content:center;align-items:center;gap:7px;flex-wrap:wrap;margin-top:11px;color:#ffffff61;font-size:8px}.af2-terms i{width:3px;height:3px;background:#ffffff42;border-radius:50%}.af2-confirmed{display:flex;gap:12px;margin-top:20px;padding:15px;border:1px solid #6ee0b14a;background:#55d49e12;border-radius:16px}.af2-confirmed>span{display:grid;place-items:center;flex:0 0 30px;height:30px;border-radius:50%;background:#70dfb4;color:#08251a;font-weight:900}.af2-confirmed b{color:#aff2d7}.af2-confirmed p{margin:4px 0 0;color:#ffffff75;font-size:10px;line-height:1.4}.af2-story{max-width:760px;margin:auto;padding:35px 23px 65px}.af2-story h2{max-width:650px;font:italic 600 clamp(34px,7vw,50px)/1.06 Georgia,serif;margin:12px 0 18px}.af2-story>p{max-width:600px;color:#ffffff8e;line-height:1.65}.af2-cast{display:grid;gap:9px;margin-top:28px}.af2-cast article{display:flex;gap:12px;align-items:center;padding:12px;border:1px solid #ffffff10;border-radius:15px;background:#ffffff06}.af2-cast i{display:grid;place-items:center;width:37px;height:37px;border-radius:50%;background:linear-gradient(145deg,#5864aa,#c27aa5);font:normal 800 8px sans-serif}.af2-cast article div{display:grid;gap:3px}.af2-cast b{font:600 15px Georgia,serif}.af2-cast span{font-size:9px;color:#ffffff65}.af2-promise{display:grid;grid-template-columns:repeat(3,1fr);max-width:760px;margin:0 auto 110px;border-top:1px solid #ffffff12;border-bottom:1px solid #ffffff12}.af2-promise>div{text-align:center;padding:24px 8px;border-left:1px solid #ffffff12}.af2-promise>div:first-child{border-left:0}.af2-promise span{display:block;font:italic 600 28px Georgia,serif;color:#f0c887}.af2-promise p{margin:5px 0 0;font-size:8px;color:#ffffff5f;text-transform:uppercase;letter-spacing:.08em}@media(min-width:760px){.af2-status,.af2-episode{display:block}.af2-top{padding:0 5%}.af2-hero{min-height:650px}.af2-video{object-position:center center}.af2-title{left:7%;bottom:100px}.af2-reserve{margin-top:-75px}.af2-card{padding:30px}.af2-cast{grid-template-columns:repeat(3,1fr)}.af2-story{padding-top:65px}}@media(prefers-reduced-motion:reduce){.af2-video{transform:none}}


/* Curated Friend profiles v1 */
#rosterGrid[data-category="friend"]{gap:14px;padding-bottom:28px}
.friend-profile-card{position:relative;overflow:hidden;border:1px solid color-mix(in srgb,var(--accent,#9b7cff) 24%,#fff 12%);background:linear-gradient(155deg,#ffffff14,#ffffff07);box-shadow:0 16px 38px #07051442;transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}
.friend-profile-card:hover,.friend-profile-card:focus-within{transform:translateY(-4px);border-color:#c6a7ff80;box-shadow:0 22px 48px #7252ae35}
.friend-profile-card img{width:100%;aspect-ratio:2/3;object-fit:cover;object-position:center top;display:block;background:linear-gradient(145deg,#171633,#493b7e)}
.friend-profile-card .roster-card-body{position:absolute;left:0;right:0;bottom:0;padding:34px 13px 13px;background:linear-gradient(transparent,#090714ed 58%,#090714);color:#fff}
.friend-profile-card .roster-card-name{font:600 20px/1.05 Georgia,serif;letter-spacing:.01em}
.friend-profile-card .roster-card-tag{display:block;margin-top:5px;color:#eee8ffb8;font-size:9px;line-height:1.35}
@media(max-width:560px){#rosterGrid[data-category="friend"]{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.friend-profile-card .roster-card-name{font-size:18px}}


/* Curated Girlfriend profiles v1 */
#rosterGrid[data-category="girlfriend"]{gap:14px;padding-bottom:28px}
.girlfriend-profile-card{position:relative;overflow:hidden;border:1px solid #f6a9cd38;background:linear-gradient(155deg,#ffcad718,#7f5cff0c);box-shadow:0 16px 40px #4c173842;transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}
.girlfriend-profile-card:hover,.girlfriend-profile-card:focus-within{transform:translateY(-4px);border-color:#ffb9d987;box-shadow:0 22px 52px #b5538438}
.girlfriend-profile-card img{width:100%;aspect-ratio:2/3;object-fit:cover;object-position:center top;display:block;background:linear-gradient(145deg,#2a1637,#784369)}
.girlfriend-profile-card .roster-card-body{position:absolute;left:0;right:0;bottom:0;padding:38px 13px 13px;background:linear-gradient(transparent,#190a18e8 55%,#120811);color:#fff}
.girlfriend-profile-card .roster-card-name{font:italic 600 21px/1.05 Georgia,serif;letter-spacing:.01em;color:#fff4f8}
.girlfriend-profile-card .roster-card-tag{display:block;margin-top:5px;color:#ffe6f1bd;font-size:9px;line-height:1.35}
@media(max-width:560px){#rosterGrid[data-category="girlfriend"]{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.girlfriend-profile-card .roster-card-name{font-size:18px}}


/* Boyfriend collection — warm midnight glass with portrait-safe framing */
#rosterGrid[data-category="boyfriend"]{
  gap:14px;
}
.boyfriend-profile-card{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(117,214,207,.38);
  background:linear-gradient(155deg,rgba(16,36,53,.94),rgba(34,25,55,.92));
  box-shadow:0 16px 34px rgba(2,12,24,.34),inset 0 1px rgba(255,255,255,.12);
}
.boyfriend-profile-card::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,transparent 54%,rgba(5,14,26,.08) 62%,rgba(5,14,26,.8) 100%);
}
.boyfriend-profile-card img{
  width:100%;
  aspect-ratio:2/3;
  height:auto;
  object-fit:cover;
  object-position:center 20%;
  display:block;
}
.boyfriend-profile-card .roster-card-body{
  position:relative;
  z-index:1;
  background:linear-gradient(135deg,rgba(11,28,43,.97),rgba(45,30,63,.96));
  border-top:1px solid rgba(244,197,104,.28);
}
.boyfriend-profile-card .roster-card-name{color:#fff4db}
.boyfriend-profile-card .roster-card-tag{color:#b9dedb}
.boyfriend-profile-card:hover,
.boyfriend-profile-card:focus-visible{
  transform:translateY(-3px);
  border-color:rgba(244,197,104,.72);
  box-shadow:0 20px 42px rgba(2,12,24,.46),0 0 0 1px rgba(117,214,207,.22);
}