  
  :root {
    --bg:#000; --cell:#000; --cell-hover:#070707; --line:#1c1c1c; --line2:#2c2c2c;
    --fg:#ededed; --muted:#7d7d7d; --soft:#b3b3b3; --dim:#3a3a3a;
    --accent:#f5f5f5; --accent-fg:#000; --pink:#ff8fc8; --red:#ff6b81; --ok:#6ee7a8;
    --mono:"JetBrains Mono", ui-monospace, Consolas, monospace;
    --sans:var(--mono);
    --ease:cubic-bezier(0.22, 1, 0.36, 1);
  }
  * { box-sizing:border-box; }
  html { scroll-behavior:smooth; }
  body { margin:0; background:var(--bg); color:var(--fg); font:14px/1.7 var(--mono); -webkit-font-smoothing:antialiased; }
  a { color:inherit; text-decoration:none; }
  ::selection { background:var(--pink); color:#000; }
  .wrap { max-width:1120px; margin:0 auto; padding:0 24px; }
  .mono { font-family:var(--mono); }
  svg { display:block; }

  
  .nav { position:fixed; top:14px; left:50%; transform:translateX(-50%); z-index:10; display:flex; align-items:center; gap:26px; padding:6px 6px 6px 16px; border:1px solid var(--line); background:rgba(0,0,0,.85); backdrop-filter:blur(12px); width:max-content; max-width:calc(100% - 24px); }
  .nav .links { display:flex; gap:20px; font-size:12px; color:var(--muted); }
  .nav .links a { transition:color .15s; }
  .nav .links a::before { content:"/"; color:var(--dim); margin-right:2px; }
  .nav .links a:hover { color:var(--pink); }
  .logo { display:inline-flex; align-items:center; gap:9px; font:600 14px var(--mono); letter-spacing:-.01em; }
  .logo i { width:14px; height:14px; display:grid; grid-template-columns:repeat(3,1fr); gap:1px; }
  .logo i b { background:var(--fg); }
  .logo i b:nth-child(2), .logo i b:nth-child(4), .logo i b:nth-child(9) { background:transparent; }
  .logo i b:nth-child(5) { background:var(--pink); }
  @media (max-width:820px) { .nav .links { display:none; } }

  
  .btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:11px 18px; font:600 13px var(--mono); letter-spacing:.02em; border:1px solid var(--accent); background:var(--accent); color:var(--accent-fg); transition:background-color .2s var(--ease), border-color .2s var(--ease), color .2s var(--ease); white-space:nowrap; cursor:pointer; }
  .btn::before { content:"["; opacity:.5; }
  .btn::after { content:"]"; opacity:.5; }
  .btn:hover { background:var(--pink); border-color:var(--pink); color:#000; }
  .btn:focus-visible { outline:2px solid var(--pink); outline-offset:2px; }
  .btn.ghost { background:transparent; color:var(--fg); border-color:var(--line2); }
  .btn.ghost:hover { color:var(--pink); border-color:var(--pink); background:transparent; }
  .btn.sm { padding:7px 14px; font-size:12px; }

  
  .hero { position:relative; min-height:100vh; display:flex; align-items:center; justify-content:center; text-align:center; padding:140px 24px 100px; overflow:hidden; }
  .glow { display:none; }
  .hero > div { position:relative; max-width:820px; }
  .hero > .hero-grid { max-width:1120px; }
  .eyebrow { display:inline-flex; gap:10px; margin-bottom:24px; font:500 12px var(--mono); text-transform:uppercase; letter-spacing:.14em; color:var(--muted); }
  .eyebrow em { display:none; }
  .eyebrow::before { content:"//"; color:var(--pink); letter-spacing:0; }
  .hero h1 { font-weight:600; font-size:clamp(36px, 5.6vw, 64px); line-height:1.05; letter-spacing:-.05em; margin:0 0 22px; }
  .hero h1 span { color:#4a4a4a; }
  .hero h1 span::after { content:"_"; color:var(--pink); animation:blink 1.1s steps(1) infinite; }
  @keyframes blink { 50% { opacity:0; } }
  .hero p { color:var(--soft); font-size:15px; max-width:560px; margin:0 auto 32px; }
  .cta { display:flex; gap:10px; justify-content:center; flex-wrap:wrap; }
  .facts { display:flex; gap:10px 28px; justify-content:center; flex-wrap:wrap; margin-top:32px; font-size:12px; color:var(--muted); }
  .facts span { display:inline-flex; gap:8px; align-items:center; }
  .facts span::before { content:""; width:5px; height:5px; background:var(--pink); }

  
  .hero-grid { display:grid; grid-template-columns:minmax(0, 1.05fr) minmax(0, .95fr); gap:64px; align-items:center; width:100%; text-align:left; }
  .hero-grid .hero-copy h1 { font-size:clamp(34px, 4vw, 48px); }
  .hero-grid .hero-copy p { margin-left:0; margin-right:0; }
  .hero-grid .cta, .hero-grid .facts { justify-content:flex-start; }
  @media (max-width:900px) { .hero-grid { grid-template-columns:1fr; gap:40px; text-align:center; } .hero-grid .hero-copy p { margin:0 auto 32px; } .hero-grid .cta, .hero-grid .facts { justify-content:center; } }
  .ascii-card { margin:0; justify-self:center; width:min(440px, 100%); animation:float 7s ease-in-out infinite; }
  @keyframes float { 0%, 100% { transform:translateY(0) rotate(-1deg); } 50% { transform:translateY(-14px) rotate(1deg); } }
  .ascii-bar { display:none; }
  #ascii { display:block; width:100%; aspect-ratio:368 / 496; }
  #asciiSrc { position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
  .page-hero { min-height:auto; padding:170px 24px 80px; }

  
  main { counter-reset:sec; }
  section { padding:112px 0 0; position:relative; }

  
  .head { display:grid; grid-template-columns:minmax(0, 1.2fr) minmax(0, 1fr); gap:16px 64px; align-items:end; margin-bottom:48px; }
  .kicker { grid-column:1 / -1; display:flex; align-items:center; gap:14px; margin-bottom:20px; font:500 12px var(--mono); text-transform:uppercase; letter-spacing:.14em; color:var(--muted); }
  .kicker::before { counter-increment:sec; content:counter(sec, decimal-leading-zero); color:var(--pink); letter-spacing:0; }
  .kicker::after { content:""; flex:1; height:1px; background:var(--line); }
  h2 { font-weight:600; font-size:clamp(28px, 3.6vw, 42px); letter-spacing:-.045em; line-height:1.08; margin:0; }
  .lead { color:var(--muted); font-size:14px; margin:0; max-width:440px; }
  .head.center { text-align:left; }
  @media (max-width:820px) { .head { grid-template-columns:1fr; } }

  
  .steps, .features, .trust, .teaser, .plans { display:grid; gap:1px; background:var(--line); border:1px solid var(--line); }
  .steps > *, .features > *, .trust > *, .teaser > *, .plans > * { position:relative; background:var(--cell); border:none; transition:opacity .7s var(--ease), transform .7s var(--ease), background-color .25s var(--ease); }
  .features > *:hover, .trust > *:hover, .teaser > *:hover, .plans > *:hover { background:var(--cell-hover); }
  
  .features > *::before, .trust > *::before, .teaser > *::before, .plans > *::before { content:""; position:absolute; top:-1px; left:-1px; width:7px; height:7px; background:var(--pink); opacity:0; transition:opacity .25s var(--ease); }
  .features > *:hover::before, .trust > *:hover::before, .teaser > *:hover::before, .plans > *:hover::before { opacity:1; }
  .card { border:1px solid var(--line); background:var(--cell); }

  
  .steps { grid-template-columns:repeat(3, 1fr); }
  .steps > div { padding:28px 28px 32px; display:flex; flex-direction:column; }
  @media (max-width:860px) { .steps { grid-template-columns:1fr; } }
  .num { font:700 56px/1 var(--mono); letter-spacing:-.06em; color:transparent; -webkit-text-stroke:1px #444; margin-bottom:28px; transition:-webkit-text-stroke-color .25s var(--ease); }
  .steps > div:hover .num { -webkit-text-stroke-color:var(--pink); }
  .steps h3 { margin:0 0 8px; font-size:17px; font-weight:600; letter-spacing:-.02em; }
  .steps p { margin:0 0 24px; color:var(--muted); font-size:13px; }
  .code { display:flex; gap:6px; margin-top:auto; }
  .code span { width:34px; height:42px; display:grid; place-items:center; border:1px solid var(--line2); font:600 18px var(--mono); }
  .code span:first-child { border-color:var(--pink); color:var(--pink); }
  .live { margin-top:auto; display:grid; gap:8px; font-size:12px; }
  .live div { display:flex; gap:10px; align-items:center; color:var(--soft); }
  .live i { width:16px; height:16px; display:grid; place-items:center; font:700 10px var(--mono); font-style:normal; background:var(--fg); color:#000; }
  .live i.wait { background:transparent; border:1px solid var(--pink); animation:blink 1.1s steps(1) infinite; }
  .verdict { margin-top:auto; border:1px solid var(--line2); padding:12px 14px; font-size:12px; display:flex; justify-content:space-between; gap:12px; }
  .verdict span { color:var(--muted); }
  .verdict b { color:var(--red); font-weight:600; letter-spacing:.06em; }

  
  .features { grid-template-columns:repeat(3, 1fr); }
  .trust { grid-template-columns:repeat(4, 1fr); }
  @media (max-width:900px) { .features { grid-template-columns:repeat(2, 1fr); } .trust { grid-template-columns:repeat(2, 1fr); } }
  @media (max-width:600px) { .features, .trust { grid-template-columns:1fr; } }
  .features > *, .trust > * { padding:28px; }
  .tag { display:inline-block; margin-bottom:40px; font:500 12px var(--mono); color:var(--pink); }
  .feature h3, .trust b { display:block; margin:0 0 6px; font-size:15px; font-weight:600; letter-spacing:-.01em; }
  .feature p, .trust span { margin:0; color:var(--muted); font-size:13px; }

  
  .split { display:grid; grid-template-columns:1fr 1.05fr; gap:64px; align-items:center; }
  @media (max-width:900px) { .split { grid-template-columns:1fr; gap:40px; } }
  .split .kicker { margin-bottom:28px; }
  .split h2 { margin-bottom:16px; }
  .ticks { list-style:none; margin:32px 0 0; padding:0; border-top:1px solid var(--line); }
  .ticks li { display:flex; gap:14px; padding:14px 0; border-bottom:1px solid var(--line); }
  .ticks li i { flex:none; font:700 12px var(--mono); font-style:normal; color:var(--pink); margin-top:2px; }
  .ticks b { display:block; font-weight:600; font-size:14px; }
  .ticks span { color:var(--muted); font-size:13px; }
  .mock { border:1px solid var(--line2); background:#030303; }
  .mock-bar { display:flex; gap:6px; align-items:center; padding:10px 14px; border-bottom:1px solid var(--line); }
  .mock-bar i { width:8px; height:8px; background:var(--dim); }
  .mock-bar i:first-child { background:var(--pink); }
  .mock-bar::after { content:"panel.kara / report"; margin-left:auto; font-size:11px; color:var(--muted); }
  .report { padding:28px 24px 20px; text-align:center; }
  .report .icon { width:52px; height:52px; margin:0 auto 14px; display:grid; place-items:center; font:700 24px var(--mono); border:1px solid var(--red); color:var(--red); }
  .report h3 { margin:0; font-size:24px; font-weight:600; letter-spacing:-.04em; color:var(--red); }
  .report .who { color:var(--muted); font-size:12px; margin:6px 0 20px; }
  .report ul { list-style:none; margin:0; padding:0; text-align:left; border-top:1px solid var(--line); }
  .report li { display:flex; align-items:center; gap:12px; padding:11px 4px; border-bottom:1px solid var(--line); font-size:13px; }
  .report li i { width:7px; height:7px; background:#ff9d7a; flex:none; }
  .report li i.crit { background:var(--red); }
  .report li b { font-weight:500; }
  .report li span { margin-left:auto; color:var(--muted); font-size:12px; }
  .report .tabs { display:flex; gap:2px; width:max-content; margin:0 auto 22px; padding:2px; border:1px solid var(--line); font-size:11px; }
  .report .tabs b { padding:4px 12px; font-weight:500; color:var(--muted); }
  .report .tabs b.on { background:var(--fg); color:#000; }
  .caption { text-align:center; color:#555; font-size:11px; margin-top:12px; }

  
  .teaser { grid-template-columns:1fr 1fr; }
  @media (max-width:760px) { .teaser { grid-template-columns:1fr; } }
  .teaser > * { padding:32px 28px; display:flex; flex-direction:column; gap:6px; }
  .teaser .price { margin:18px 0 6px; }
  .teaser .per { margin:0 0 24px; flex:none; }
  .teaser .more { margin-top:auto; font-size:13px; color:var(--pink); }
  #pricing .cta { justify-content:flex-start; margin-top:24px; }

  
  .plans { grid-template-columns:repeat(4, 1fr); }
  @media (max-width:980px) { .plans { grid-template-columns:repeat(2, 1fr); } }
  @media (max-width:560px) { .plans { grid-template-columns:1fr; } }
  .tier { padding:28px 24px 24px; display:flex; flex-direction:column; }
  .plans > .tier.best { background:#060606; box-shadow:inset 0 2px 0 var(--pink); }
  .plans > .tier.custom { background:repeating-linear-gradient(135deg, #0d0d0d 0 1px, transparent 1px 9px), var(--cell); }
  .badge { position:absolute; top:30px; right:20px; font:600 10px var(--mono); text-transform:uppercase; letter-spacing:.1em; color:var(--pink); }
  .plan { font:500 12px var(--mono); color:var(--muted); text-transform:uppercase; letter-spacing:.14em; }
  .tier.best .plan { color:var(--fg); }
  .price { font-size:40px; font-weight:600; letter-spacing:-.06em; line-height:1.1; margin:20px 0 16px; }
  .price small { font-size:13px; color:var(--muted); letter-spacing:0; font-weight:400; margin-left:4px; }
  .quota { font-size:13px; color:var(--soft); padding:12px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
  .quota b { color:var(--fg); font-weight:600; }
  .per { color:var(--muted); font-size:13px; margin:12px 0 24px; flex:1; }
  .tier .btn { width:100%; }
  .included { margin-top:-1px; padding:20px 28px; display:flex; gap:12px 36px; align-items:center; flex-wrap:wrap; }
  .included h4 { margin:0; font-size:13px; font-weight:600; color:var(--fg); }
  .included .ticks { margin:0; border:none; display:flex; flex-wrap:wrap; gap:8px 28px; }
  .included .ticks li { padding:0; border:none; font-size:13px; color:var(--soft); gap:8px; align-items:center; }
  .included .ticks li i { margin:0; }

  
  #faq .wrap { display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1.6fr); gap:0 64px; align-items:start; }
  #faq .head { display:block; margin:0; position:sticky; top:110px; }
  @media (max-width:860px) { #faq .wrap { grid-template-columns:1fr; } #faq .head { position:static; margin-bottom:32px; } }
  .faq { border-top:1px solid var(--line); margin-top:4px; }
  details { border-bottom:1px solid var(--line); }
  summary { cursor:pointer; list-style:none; padding:20px 4px; display:flex; justify-content:space-between; gap:16px; font-weight:500; font-size:14px; transition:color .15s; }
  summary::-webkit-details-marker { display:none; }
  summary::after { content:"+"; font:400 18px var(--mono); color:var(--pink); line-height:1; transition:transform .25s var(--ease); }
  summary:hover { color:var(--pink); }
  details[open] summary::after { transform:rotate(45deg); }
  details p { margin:0; padding:0 4px 22px; color:var(--muted); font-size:13px; max-width:620px; }

  
  .final { position:relative; text-align:center; border:1px solid var(--line); padding:96px 24px; overflow:hidden; isolation:isolate; }
  .final::before { content:""; position:absolute; inset:0; z-index:-1; background-image:radial-gradient(#2a2a2a 1px, transparent 1.2px); background-size:12px 12px;
    -webkit-mask-image:radial-gradient(ellipse at center, #000 10%, transparent 75%); mask-image:radial-gradient(ellipse at center, #000 10%, transparent 75%); }
  .final .kicker { width:max-content; margin:0 auto 24px; }
  .final .kicker::after { display:none; }
  .final h2 { font-size:clamp(32px, 5vw, 56px); margin-bottom:16px; }
  .final p { color:var(--muted); margin:0 auto 32px; max-width:480px; font-size:14px; }

  
  footer { margin-top:112px; border-top:1px solid var(--line); padding:48px 0 40px; color:#555; font-size:12px; }
  .figlet { margin:0 0 40px; font:600 clamp(8px, 1.9vw, 22px)/1.15 var(--mono); color:#222; white-space:pre; overflow:hidden; user-select:none; transition:color .4s var(--ease); }
  footer:hover .figlet { color:var(--pink); }
  footer .row { display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap; align-items:center; }
  footer nav { display:flex; gap:20px; }
  footer a:hover { color:var(--pink); }

  .reveal { opacity:0; transform:translateY(16px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
  .reveal.in { opacity:1; transform:none; }
  @media (prefers-reduced-motion: reduce) {
    .reveal { opacity:1; transform:none; transition:none; } html { scroll-behavior:auto; }
    .ascii-card, .hero h1 span::after, .live i.wait { animation:none; }
  }

  
  :root { --sans:"Geist", ui-sans-serif, system-ui, sans-serif; }
  body { font:15px/1.65 var(--sans); }
  .hero p, .lead, .steps p, .feature p, .trust span, .ticks span, .per, details p, .final p, .included .ticks li, .quota { font-family:var(--sans); }
  .steps h3, .feature h3, .trust b, .ticks b, summary { font-family:var(--sans); font-weight:500; letter-spacing:-.01em; }
  .hero p, .lead, .final p { font-size:16px; }
  .steps p, .feature p, .trust span, .ticks span, details p, .per { font-size:14px; line-height:1.6; }
  summary { font-size:15px; }

  
  .steps { background:none; border:none; gap:48px; counter-reset:none; }
  .steps > div { padding:0; background:none; }
  .num { display:flex; align-items:center; gap:14px; margin-bottom:24px; font:500 13px var(--mono); letter-spacing:0; color:var(--pink); -webkit-text-stroke:0; }
  .num::after { content:""; flex:1; height:1px; background:var(--line2); }
  .steps > div:last-child .num::after { background:linear-gradient(90deg, var(--line2), transparent); }
  .steps h3 { font-size:18px; margin-bottom:8px; }
  .steps p { margin:0; }
  @media (max-width:860px) { .steps { gap:36px; } }

  
  .story { height:330vh; padding:0; }
  .story-pin { position:sticky; top:0; height:100vh; display:flex; align-items:center; }
  .story-pin .wrap { width:100%; }
  .story .kicker { margin-bottom:48px; }
  .story-lines { position:relative; min-height:calc(3.4em + 40px); font:600 clamp(30px, 4.6vw, 60px)/1.12 var(--sans); letter-spacing:-.045em; max-width:980px; }
  .story-line { position:absolute; inset:0 0 auto 0; margin:0; opacity:0; transform:translateY(40px); transition:opacity .6s var(--ease), transform .6s var(--ease); }
  .story-line.on { opacity:1; transform:none; transition-delay:.18s; }
  .story-line.past { opacity:0; transform:translateY(-40px); transition-duration:.3s; }
  .story-n { display:block; margin-bottom:20px; font:500 13px var(--mono); letter-spacing:0; color:var(--pink); }
  .w { color:#262626; transition:color .25s var(--ease); }
  .w.lit { color:var(--fg); }
  .story-bar { display:flex; gap:6px; margin-top:56px; width:180px; height:2px; background:var(--line); }
  .story-bar i { display:block; height:100%; width:0; background:var(--pink); }
  h2 .w { color:#2a2a2a; }
  h2 .w.lit { color:var(--fg); }
  @media (prefers-reduced-motion: reduce) {
    .story { height:auto; padding:112px 0 0; }
    .story-pin { position:static; height:auto; }
    .story-lines { min-height:0; display:grid; gap:40px; }
    .story-line { position:static; opacity:1; transform:none; }
    .w, h2 .w { color:var(--fg); }
    .story-bar { display:none; }
  }


  
  .story-pin .wrap { text-align:center; }
  .story-tabs { display:flex; justify-content:center; gap:8px; margin-bottom:56px; }
  .story-tabs span { position:relative; display:inline-flex; align-items:center; gap:10px; padding:8px 16px 10px; font:500 12px var(--mono); text-transform:uppercase; letter-spacing:.12em; color:#444; transition:color .3s var(--ease); }
  .story-tabs b { font-weight:500; color:#333; transition:color .3s var(--ease); }
  .story-tabs span.on { color:var(--fg); }
  .story-tabs span.on b { color:var(--pink); }
  .story-tabs span::after { content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:var(--line2); }
  .story-tabs i { position:absolute; left:0; right:0; bottom:0; height:1px; z-index:1; background:var(--pink); transform:scaleX(0); transform-origin:left; }
  .story-lines { margin:0 auto; max-width:900px; min-height:3.4em; font:600 clamp(30px, 4.8vw, 62px)/1.1 var(--sans); letter-spacing:-.045em; }
  .story-line { text-wrap:balance; }
  .story .w { color:#222; transition:color .35s var(--ease); }
  .story .w.lit { color:var(--fg); }
  @media (max-width:600px) { .story-tabs { gap:0; margin-bottom:36px; } .story-tabs span { padding:8px 10px 10px; gap:6px; } }
  @media (prefers-reduced-motion: reduce) { .story-tabs span { color:var(--fg); } .story-tabs i { transform:none; } }


  
  .offers { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:24px; max-width:880px; }
  @media (max-width:820px) { .offers { grid-template-columns:1fr; } }
  .offer { display:flex; flex-direction:column; padding:32px; border:1px solid #262626; border-radius:24px; background:#0b0b0b; font-family:var(--sans); }
  .offer-best { border-color:rgba(255, 143, 200, .45); background:#111; }
  .offer-top { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:24px; }
  .offer-top h3 { margin:0; font:500 16px/24px var(--sans); color:var(--fg); }
  .offer-badge { display:inline-flex; align-items:center; gap:6px; padding:4px 12px; border-radius:9999px; background:#1f1f1f; color:var(--soft); font:500 12px/16px var(--sans); text-transform:uppercase; letter-spacing:.06em; }
  .offer-best .offer-badge { background:rgba(255, 143, 200, .12); color:var(--pink); }
  .offer-title { margin:0; font:600 30px/36px var(--sans); letter-spacing:-.02em; color:var(--fg); }
  .offer-sub { margin:8px 0 24px; font:400 16px/24px var(--sans); color:var(--muted); }
  .offer-btn { display:flex; align-items:center; justify-content:center; gap:8px; height:48px; padding:8px 16px; border-radius:9999px; background:var(--fg); color:#000; font:600 16px/24px var(--sans);
    transition:background-color .3s var(--ease), transform .3s var(--ease); }
  .offer-btn:hover { background:#fff; transform:translateY(-1px); }
  .offer-btn:active { transform:scale(.98); }
  .offer-btn:focus-visible { outline:2px solid var(--pink); outline-offset:2px; }
  .offer-best .offer-btn { background:var(--pink); }
  .offer-best .offer-btn:hover { background:#ffa6d4; }
  .offer-price { display:flex; align-items:baseline; gap:8px; margin:24px 0; color:var(--muted); font:400 16px/24px var(--sans); }
  .offer-price b { font:500 36px/40px var(--sans); color:var(--fg); letter-spacing:-.02em; }
  .offer-from { font-size:14px; }
  .offer-list { list-style:none; margin:0; padding:0; display:grid; gap:16px; flex:1; }
  .offer-list li { display:flex; gap:12px; align-items:flex-start; font:400 16px/24px var(--sans); color:var(--soft); }
  .offer-list i { flex:none; font-size:20px; line-height:24px; color:var(--fg); }
  .offer-best .offer-list i { color:var(--pink); }
  .offer-fine { margin:32px 0 0; padding-top:16px; border-top:1px solid #1f1f1f; font:400 12px/16px var(--sans); color:#666; }
  #pricing .head { margin-bottom:40px; }

  
  .plans { background:none; border:none; gap:16px; }
  .plans > .tier { border:1px solid #262626; border-radius:24px; background:#0b0b0b; padding:28px 24px 24px; font-family:var(--sans); }
  .plans > .tier:hover { background:#0f0f0f; }
  .plans > *::before { display:none; }
  .plans > .tier.best { border-color:rgba(255, 143, 200, .45); background:#111; box-shadow:none; }
  .plans > .tier.custom { background:#0b0b0b; border-style:dashed; }
  .tier .plan { font:500 16px/24px var(--sans); text-transform:none; letter-spacing:0; color:var(--fg); }
  .badge { top:26px; right:20px; padding:4px 10px; border-radius:9999px; background:rgba(255, 143, 200, .12); font:500 11px/16px var(--sans); }
  .tier .price { font:500 36px/40px var(--sans); letter-spacing:-.02em; margin:24px 0 16px; }
  .tier .price small { font:400 14px var(--sans); }
  .tier .quota { border:none; padding:0; font:400 16px/24px var(--sans); }
  .tier .per { font:400 14px/20px var(--sans); margin:4px 0 24px; }
  .tier .btn { border-radius:9999px; height:48px; font:600 16px/24px var(--sans); letter-spacing:0; background:var(--fg); color:#000; border:none; }
  .tier .btn::before, .tier .btn::after { content:none; }
  .tier .btn:hover { background:#fff; color:#000; }
  .tier.best .btn { background:var(--pink); }
  .tier.best .btn:hover { background:#ffa6d4; }
  .included { border-radius:24px; margin-top:16px; border:1px solid #262626; background:#0b0b0b; }

  
  .btn.pbtn { position:relative; isolation:isolate; overflow:hidden; gap:8px; height:44px; padding:4px 18px 4px 4px; border-radius:9999px;
    border:1px solid #2a2a2a; background:#141414; color:var(--fg); font:600 14px/20px var(--sans); letter-spacing:0;
    transition:background-color .3s var(--ease), border-color .3s var(--ease), transform .3s var(--ease); }
  .btn.pbtn::before, .btn.pbtn::after { content:none; }
  .btn.pbtn:hover { background:#1b1b1b; border-color:#3a3a3a; color:var(--fg); }
  .btn.pbtn:active { transform:scale(.97); }
  .btn.pbtn.sm { height:36px; padding:3px 14px 3px 3px; font-size:13px; }
  .pbtn-ico { display:grid; place-items:center; width:34px; height:34px; border-radius:9999px; background:var(--pink); color:#000; font-size:16px; flex:none;
    transition:transform .3s var(--ease); }
  .btn.pbtn.sm .pbtn-ico { width:28px; height:28px; font-size:14px; }
  .btn.pbtn.ghost .pbtn-ico { background:#262626; color:var(--fg); }
  .btn.pbtn:hover .pbtn-ico { transform:translateX(2px); }
  .pbtn-txt { position:relative; transition:color .3s var(--ease); }
  .btn.pbtn:not(.ghost) .pbtn-txt { color:var(--fg); }

  
  .pbtn-fill { position:absolute; inset:-8px; z-index:-1; pointer-events:none; border-radius:inherit;
    background:radial-gradient(60% 120% at 20% 50%, rgba(255, 143, 200, .55), rgba(255, 143, 200, .18) 60%, transparent 80%);
    filter:blur(6px); opacity:0; transform:translateX(-70%); }
  .pwrap { display:inline-flex; align-items:center; gap:8px; }
  .pwrap.busy .pbtn-fill { opacity:1; transform:translateX(0); transition:transform 1.1s var(--ease), opacity .3s var(--ease); }
  .pwrap.busy .btn.pbtn { border-color:rgba(255, 143, 200, .5); }
  .pwrap.busy .pbtn-ico i.ph-circle-notch { animation:pbtn-spin .8s linear infinite; }
  @keyframes pbtn-spin { to { transform:rotate(360deg); } }
  .pwrap.done .pbtn-ico { background:var(--ok); }

  
  .pbtn-x { display:grid; place-items:center; width:44px; height:44px; padding:0; border-radius:9999px; border:1px solid #2a2a2a; background:#141414; color:var(--fg); font-size:16px;
    opacity:0; transform:translateX(-28px) scale(.6); pointer-events:none; margin-left:-52px;
    transition:opacity .35s var(--ease), transform .45s var(--ease), margin-left .45s var(--ease); }
  .btn.pbtn.sm + .pbtn-x { width:36px; height:36px; margin-left:-44px; font-size:14px; }
  .pwrap.busy .pbtn-x { opacity:1; transform:none; pointer-events:auto; margin-left:0; }
  .pbtn-x:hover { background:#1f1f1f; }
  .pbtn-x:focus-visible, .btn.pbtn:focus-visible { outline:2px solid var(--pink); outline-offset:2px; }
  @media (prefers-reduced-motion: reduce) { .pbtn-fill, .pbtn-x, .pbtn-ico { transition:none !important; } .pwrap.busy .pbtn-ico i { animation:none; } }

  
  .nav, .btn.pbtn, .pbtn-x {
    background:rgba(255, 255, 255, .06);
    -webkit-backdrop-filter:blur(18px) saturate(180%);
            backdrop-filter:blur(18px) saturate(180%);
    border:1px solid rgba(255, 255, 255, .14);
    box-shadow:inset 0 1px 0 rgba(255, 255, 255, .28), inset 0 -1px 0 rgba(255, 255, 255, .06),
               inset 0 0 18px rgba(255, 255, 255, .05), 0 10px 30px -10px rgba(0, 0, 0, .7);
  }
  @supports (backdrop-filter: url(#glass-refract)) {
    .nav, .btn.pbtn { backdrop-filter:url(#glass-refract) blur(16px) saturate(180%); }
  }
  .nav { border-radius:9999px; padding:6px 6px 6px 20px; gap:20px; }
  .nav::before, .btn.pbtn::before { content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
    background:linear-gradient(180deg, rgba(255, 255, 255, .14), rgba(255, 255, 255, 0) 45%); opacity:.6; }
  .nav .links { gap:4px; }
  .nav .links a { padding:6px 12px; border-radius:9999px; font:500 13px/20px var(--sans); color:rgba(255, 255, 255, .7);
    transition:background-color .3s var(--ease), color .3s var(--ease); }
  .nav .links a::before { content:none; }
  .nav .links a:hover { background:rgba(255, 255, 255, .1); color:#fff; }
  .nav .logo { font-family:var(--sans); }

  .btn.pbtn { color:#fff; }
  .btn.pbtn:hover { background:rgba(255, 255, 255, .1); border-color:rgba(255, 255, 255, .22); }
  .btn.pbtn:not(.ghost) { background:rgba(255, 143, 200, .14); border-color:rgba(255, 143, 200, .35); }
  .btn.pbtn:not(.ghost):hover { background:rgba(255, 143, 200, .22); }
  .pbtn-ico { box-shadow:inset 0 1px 0 rgba(255, 255, 255, .5), 0 2px 8px rgba(255, 143, 200, .35); }
  .btn.pbtn.ghost .pbtn-ico { background:rgba(255, 255, 255, .12); box-shadow:inset 0 1px 0 rgba(255, 255, 255, .25); }
  .pbtn-x:hover { background:rgba(255, 255, 255, .12); }

  
  .story-tabs { position:relative; display:inline-flex; gap:4px; padding:5px; margin:0 auto 56px; border-radius:9999px;
    background:rgba(255, 255, 255, .06); border:1px solid rgba(255, 255, 255, .14);
    -webkit-backdrop-filter:blur(18px) saturate(180%); backdrop-filter:blur(18px) saturate(180%);
    box-shadow:inset 0 1px 0 rgba(255, 255, 255, .28), inset 0 -1px 0 rgba(255, 255, 255, .06), 0 10px 30px -10px rgba(0, 0, 0, .7); }
  .story-pin .wrap { display:flex; flex-direction:column; align-items:center; }
  .story-tabs span { overflow:hidden; isolation:isolate; padding:8px 18px; border-radius:9999px; font:500 13px/20px var(--sans); text-transform:none; letter-spacing:0;
    color:rgba(255, 255, 255, .45); transition:color .35s var(--ease), background-color .35s var(--ease), box-shadow .35s var(--ease); }
  .story-tabs span::after { content:none; }
  .story-tabs b { font:500 12px/20px var(--mono); color:rgba(255, 255, 255, .3); }
  .story-tabs span.on { color:#fff; background:rgba(255, 255, 255, .12);
    box-shadow:inset 0 1px 0 rgba(255, 255, 255, .35), 0 4px 14px -4px rgba(0, 0, 0, .6); }
  .story-tabs span.on b { color:var(--pink); }
  
  .story-tabs i { inset:0; height:auto; z-index:-1; border-radius:inherit; background:rgba(255, 143, 200, .16); }
  @media (max-width:600px) { .story-tabs span { padding:8px 12px; } }
  .story-pin .wrap .story-lines { width:100%; }

  
  .faq { border-top:none; margin-top:0; display:grid; gap:8px; }
  .faq details { border:1px solid transparent; border-radius:20px; transition:background-color .5s var(--ease), border-color .5s var(--ease), box-shadow .5s var(--ease); }
  .faq details, .faq details:first-of-type { border-bottom:1px solid #1c1c1c; }
  .faq details:hover { background:rgba(255, 255, 255, .03); }
  .faq details.is-open { background:rgba(255, 255, 255, .06); border-color:rgba(255, 255, 255, .14);
    box-shadow:inset 0 1px 0 rgba(255, 255, 255, .22), 0 14px 40px -18px rgba(0, 0, 0, .8); }
  .faq summary { padding:20px 20px; align-items:center; font:500 16px/24px var(--sans); color:var(--fg); }
  .faq summary:hover { color:#fff; }
  
  .faq summary::after { content:"+"; display:grid; place-items:center; flex:none; width:32px; height:32px; border-radius:9999px;
    font:400 20px/1 var(--sans); color:var(--pink); background:rgba(255, 255, 255, .06); border:1px solid rgba(255, 255, 255, .12);
    box-shadow:inset 0 1px 0 rgba(255, 255, 255, .2); transition:transform .5s var(--ease), background-color .3s var(--ease), color .3s var(--ease); }
  .faq details[open] summary::after { transform:none; }
  .faq details.is-open summary::after { transform:rotate(135deg); background:var(--pink); color:#000; border-color:transparent; }
  .faq-body { display:grid; grid-template-rows:0fr; transition:grid-template-rows .5s var(--ease); }
  .faq-body > div { overflow:hidden; }
  .faq details.is-open .faq-body { grid-template-rows:1fr; }
  .faq details p { padding:0 20px 22px; font:400 15px/24px var(--sans); color:var(--muted); opacity:0; transform:translateY(-6px);
    transition:opacity .4s var(--ease), transform .5s var(--ease); }
  .faq details.is-open p { opacity:1; transform:none; transition-delay:.08s; }
  
  .faq.reveal { opacity:1; transform:none; }
  .faq.reveal details { opacity:0; transform:translateY(16px); }
  .faq.reveal.in details { opacity:1; transform:none; transition:opacity .6s var(--ease) calc(var(--i) * 70ms), transform .6s var(--ease) calc(var(--i) * 70ms),
    background-color .5s var(--ease), border-color .5s var(--ease), box-shadow .5s var(--ease); }
  @media (prefers-reduced-motion: reduce) {
    .faq-body, .faq details p, .faq summary::after { transition:none; }
    .faq.reveal details { opacity:1; transform:none; }
  }
  .offers { margin:0 auto; }

  
  .final { border-radius:28px; border-color:rgba(255, 255, 255, .1); }
  .final.has-fx::before { content:none; }
  .final-fx { position:absolute; inset:0; z-index:-1; width:100%; height:100%; pointer-events:none; }
  .pwrap.busy .btn.pbtn + .pbtn-x, .pwrap.busy .btn.pbtn.sm + .pbtn-x { margin-left:0; }   

  
  .credits { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:16px; }
  @media (max-width:760px) { .credits { grid-template-columns:1fr; } }
  .credit-card { margin:0; border:1px solid #222; border-radius:24px; background:#070707; overflow:hidden; transition:border-color .3s var(--ease); }
  .credit-card:hover { border-color:rgba(255, 143, 200, .4); }
  canvas.credit { display:block; width:100%; height:200px; }

  
  .logo .logo-star { width:24px; height:24px; display:block; flex:none; transition:transform .5s cubic-bezier(0.34, 1.56, 0.64, 1); }
  .logo:hover .logo-star { transform:rotate(-14deg) scale(1.12); }
  footer .logo .logo-star { width:20px; height:20px; }

  
  .kb { position:fixed; right:24px; bottom:24px; z-index:50; font-family:var(--sans); }
  .kb-star { position:relative; display:grid; place-items:center; width:72px; height:72px; padding:0; border:none; background:none; cursor:pointer; }
  .kb-star img { width:64px; height:64px; filter:drop-shadow(0 10px 18px rgba(255, 143, 200, .35)); transform-origin:50% 60%;
    animation:kb-float 3.2s ease-in-out infinite, kb-blink 5s steps(1) infinite; }
  .kb-star::after { content:""; position:absolute; left:50%; bottom:2px; width:36px; height:6px; margin-left:-18px; border-radius:50%;
    background:rgba(255, 143, 200, .25); filter:blur(3px); animation:kb-shadow 3.2s ease-in-out infinite; }
  .kb-star:hover img { animation:kb-wiggle .6s cubic-bezier(0.34, 1.56, 0.64, 1), kb-float 3.2s ease-in-out .6s infinite; }
  .kb-star:focus-visible { outline:2px solid var(--pink); outline-offset:4px; border-radius:50%; }
  @keyframes kb-float { 0%, 100% { transform:translateY(0) rotate(-4deg); } 50% { transform:translateY(-8px) rotate(4deg); } }
  @keyframes kb-shadow { 0%, 100% { transform:scaleX(1); opacity:1; } 50% { transform:scaleX(.7); opacity:.5; } }
  
  @keyframes kb-blink { 0%, 96% { scale:1 1; } 97% { scale:1.04 .9; } 98% { scale:1 1; } }
  @keyframes kb-wiggle { 0% { transform:rotate(0) scale(1); } 30% { transform:rotate(-18deg) scale(1.12); } 60% { transform:rotate(12deg) scale(1.06); } 100% { transform:rotate(0) scale(1); } }
  
  .kb[data-mood="thinking"] .kb-star img, .kb[data-mood="thinking"] .kb-avatar { animation:kb-think 1.2s linear infinite; }
  .kb[data-mood="talking"] .kb-star img, .kb[data-mood="talking"] .kb-avatar { animation:kb-talk .45s ease-in-out infinite; }
  @keyframes kb-think { to { transform:rotate(360deg); } }
  @keyframes kb-talk { 0%, 100% { transform:translateY(0) scale(1, 1); } 50% { transform:translateY(-4px) scale(1.04, .96); } }

  .kb-hello { position:absolute; right:78px; bottom:22px; padding:8px 14px; border-radius:16px 16px 4px 16px; white-space:nowrap;
    background:rgba(255, 255, 255, .08); border:1px solid rgba(255, 255, 255, .14); color:#fff; font-size:14px;
    -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); opacity:0; transform:translateY(8px) scale(.9); pointer-events:none;
    transition:opacity .4s var(--ease), transform .5s cubic-bezier(0.34, 1.56, 0.64, 1); }
  .kb-hello.show { opacity:1; transform:none; }

  .kb-panel { position:absolute; right:0; bottom:88px; width:min(380px, calc(100vw - 32px)); height:min(540px, calc(100vh - 140px));
    display:flex; flex-direction:column; border-radius:24px; overflow:hidden;
    background:rgba(12, 12, 12, .92); border:1px solid rgba(255, 255, 255, .12);
    -webkit-backdrop-filter:blur(20px) saturate(160%); backdrop-filter:blur(20px) saturate(160%);
    box-shadow:inset 0 1px 0 rgba(255, 255, 255, .14), 0 30px 80px -20px rgba(0, 0, 0, .9);
    transform-origin:100% 100%; animation:kb-open .45s cubic-bezier(0.34, 1.4, 0.64, 1); }
  .kb-panel[hidden] { display:none; }
  @keyframes kb-open { from { opacity:0; transform:translateY(16px) scale(.92); } }
  .kb-head { display:flex; align-items:center; gap:12px; padding:16px; border-bottom:1px solid rgba(255, 255, 255, .08); }
  .kb-head b { display:block; font-size:16px; line-height:20px; color:#fff; }
  .kb-head span { display:block; font-size:13px; line-height:18px; color:var(--muted); }
  .kb-avatar { width:32px; height:32px; flex:none; }
  .kb-close { margin-left:auto; display:grid; place-items:center; width:32px; height:32px; border-radius:9999px; border:1px solid rgba(255, 255, 255, .12);
    background:rgba(255, 255, 255, .05); color:var(--soft); cursor:pointer; transition:background-color .3s var(--ease); }
  .kb-close:hover { background:rgba(255, 255, 255, .12); color:#fff; }
  .kb-log { flex:1; overflow-y:auto; padding:16px; display:flex; flex-direction:column; gap:10px; }
  .kb-msg { max-width:85%; padding:10px 14px; border-radius:18px; font-size:14px; line-height:21px; white-space:pre-wrap; animation:kb-msg .35s var(--ease); }
  @keyframes kb-msg { from { opacity:0; transform:translateY(6px); } }
  .kb-bot { align-self:flex-start; background:rgba(255, 255, 255, .07); color:var(--fg); border-bottom-left-radius:6px; }
  .kb-user { align-self:flex-end; background:var(--pink); color:#000; border-bottom-right-radius:6px; }
  .kb-error { color:#ffb4bf; }
  .kb-typing::after { content:"●●●"; letter-spacing:3px; font-size:10px; color:var(--muted); animation:kb-dots 1s steps(3) infinite; }
  @keyframes kb-dots { 0% { opacity:.3; } 50% { opacity:1; } }
  .kb-chips { display:flex; flex-wrap:wrap; gap:6px; padding:0 16px 12px; }
  .kb-chips[hidden] { display:none; }
  .kb-chips button { padding:6px 12px; border-radius:9999px; border:1px solid rgba(255, 143, 200, .35); background:rgba(255, 143, 200, .08);
    color:var(--pink); font:500 13px/18px var(--sans); cursor:pointer; transition:background-color .3s var(--ease); }
  .kb-chips button:hover { background:rgba(255, 143, 200, .18); }
  .kb-form { display:flex; gap:8px; padding:12px; border-top:1px solid rgba(255, 255, 255, .08); }
  .kb-form input { flex:1; min-width:0; height:44px; padding:0 16px; border-radius:9999px; border:1px solid rgba(255, 255, 255, .12);
    background:rgba(255, 255, 255, .05); color:#fff; font:400 15px var(--sans); outline:none; transition:border-color .3s var(--ease); }
  .kb-form input:focus { border-color:var(--pink); }
  .kb-form button { display:grid; place-items:center; width:44px; height:44px; flex:none; border:none; border-radius:9999px; background:var(--pink); color:#000;
    font-size:18px; cursor:pointer; transition:transform .3s var(--ease); }
  .kb-form button:active { transform:scale(.94); }
  @media (max-width:520px) { .kb { right:16px; bottom:16px; } }
  @media (prefers-reduced-motion: reduce) { .kb-star img, .kb-star::after, .kb-avatar, .kb-panel, .kb-msg { animation:none !important; } }

  
  .kb-panel { height:auto; max-height:min(560px, calc(100vh - 140px)); background:#0b0b0b; border-color:rgba(255, 255, 255, .1);
    animation:kb-reveal .55s cubic-bezier(0.22, 1, 0.36, 1); }
  
  @keyframes kb-reveal { from { clip-path:circle(0 at calc(100% - 36px) calc(100% + 40px)); opacity:.4; } to { clip-path:circle(150% at calc(100% - 36px) calc(100% + 40px)); opacity:1; } }
  .kb-log { flex:0 1 auto; min-height:0; }
  .kb-head { background:linear-gradient(180deg, rgba(255, 143, 200, .08), transparent); }
  .kb-head, .kb-log, .kb-chips, .kb-form { animation:kb-rise .5s cubic-bezier(0.22, 1, 0.36, 1) both; }
  .kb-log { animation-delay:.08s; } .kb-chips { animation-delay:.14s; } .kb-form { animation-delay:.2s; }
  @keyframes kb-rise { from { opacity:0; transform:translateY(10px); } }
  .kb-avatar { animation:kb-wave 1.2s cubic-bezier(0.34, 1.56, 0.64, 1) .2s both; }
  @keyframes kb-wave { 0% { transform:scale(0) rotate(-90deg); } 60% { transform:scale(1.15) rotate(10deg); } 100% { transform:none; } }

  
  .kb-star.jump img { animation:kb-jump .75s cubic-bezier(0.34, 1.56, 0.64, 1), kb-float 3.2s ease-in-out .75s infinite; }
  @keyframes kb-jump { 0% { transform:scale(1); } 15% { transform:scale(1.18, .78) translateY(4px); } 55% { transform:translateY(-26px) rotate(340deg) scale(1.08); } 80% { transform:translateY(2px) rotate(360deg) scale(.94, 1.06); } 100% { transform:rotate(360deg); } }
  .kb-spark { position:absolute; left:50%; top:50%; width:14px; height:14px; margin:-7px 0 0 -7px; color:var(--pink); pointer-events:none;
    filter:drop-shadow(0 0 6px rgba(255, 143, 200, .8)); animation:kb-spark .8s cubic-bezier(0.22, 1, 0.36, 1) forwards; }
  .kb-spark svg { display:block; }
  @keyframes kb-spark { 0% { opacity:1; transform:translate(0, 0) scale(.2) rotate(0); } 70% { opacity:1; } 100% { opacity:0; transform:translate(var(--x), var(--y)) scale(var(--s)) rotate(var(--r)); } }
  
  .kb.open .kb-star img { scale:.85; }
  @media (prefers-reduced-motion: reduce) { .kb-panel, .kb-head, .kb-log, .kb-chips, .kb-form, .kb-avatar, .kb-star.jump img { animation:none !important; } }
  section.kb-panel { padding:0; }   
  
  .kb-panel, .kb-head, .kb-log, .kb-chips, .kb-form, .kb-avatar { animation:none !important; }
  
  .kb-log { scrollbar-width:thin; scrollbar-color:rgba(255, 255, 255, .18) transparent; }
  .kb-log::-webkit-scrollbar { width:6px; }
  .kb-log::-webkit-scrollbar-thumb { background:rgba(255, 255, 255, .18); border-radius:9999px; }
  .kb-log::-webkit-scrollbar-track { background:transparent; }
  
  .kb-chips { flex-direction:column; flex-wrap:nowrap; gap:0; padding:0 12px 12px; }
  .kb-chips button { display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; padding:11px 14px; border:none; border-radius:12px;
    background:transparent; color:var(--soft); font:500 14px/20px var(--sans); text-align:left; transition:background-color .25s var(--ease), color .25s var(--ease); }
  .kb-chips button + button { border-top:1px solid rgba(255, 255, 255, .06); border-radius:0 0 12px 12px; }
  .kb-chips button::after { content:"→"; color:var(--pink); opacity:.6; transition:transform .25s var(--ease), opacity .25s var(--ease); }
  .kb-chips button:hover { background:rgba(255, 255, 255, .05); color:#fff; }
  .kb-chips button:hover::after { transform:translateX(3px); opacity:1; }

  
  .kl { position:fixed; inset:0; z-index:1000; display:grid; place-items:center; background:#000; transition:opacity .6s cubic-bezier(0.22, 1, 0.36, 1), visibility .6s; }
  .kl.out { opacity:0; visibility:hidden; }
  .kl-label { position:absolute; top:calc(50% + 120px); display:flex; align-items:center; gap:4px; font:500 12px/16px "JetBrains Mono", ui-monospace, monospace;
    letter-spacing:.3em; text-transform:uppercase; color:#555; }
  .kl-label span { margin-right:6px; }
  .kl-label i { width:4px; height:4px; background:#ff8fc8; animation:kl-dot 1.2s ease-in-out infinite; }
  .kl-label i:nth-child(3) { animation-delay:.15s; } .kl-label i:nth-child(4) { animation-delay:.3s; }
  @keyframes kl-dot { 0%, 100% { opacity:.2; } 50% { opacity:1; } }
  html.kl-busy { overflow:hidden; }
  
  .kl-star { position:relative; display:grid; justify-items:center; animation:kl-in .6s cubic-bezier(0.34, 1.56, 0.64, 1) both; }
  .kl-body { position:relative; width:96px; height:96px; transform-origin:50% 100%; animation:kl-hop 1.1s cubic-bezier(0.45, 0, 0.55, 1) .4s infinite; }
  .kl-body img { display:block; width:96px; height:96px; filter:drop-shadow(0 8px 24px rgba(255, 143, 200, .45)); }
  
  .kl-lid { position:absolute; background:#f373af; border-radius:40%; transform:scaleY(0); transform-origin:50% 0; animation:kl-blink 2.6s ease-in-out 1s infinite; }
  .kl-lid.l { left:46%; top:35%; width:12%; height:20%; }
  .kl-lid.r { left:62%; top:31%; width:11%; height:18%; }
  .kl-shadow { width:56px; height:8px; margin-top:10px; border-radius:50%; background:rgba(255, 143, 200, .25); filter:blur(3px); animation:kl-shadow 1.1s cubic-bezier(0.45, 0, 0.55, 1) .4s infinite; }
  @keyframes kl-in { from { opacity:0; transform:scale(.3) rotate(-30deg); } }
  @keyframes kl-hop {
    0%, 100% { transform:translateY(0) scale(1.08, .9); }
    15% { transform:translateY(0) scale(1, 1); }
    50% { transform:translateY(-34px) scale(.96, 1.05) rotate(8deg); }
    85% { transform:translateY(0) scale(1, 1); }
  }
  @keyframes kl-shadow { 0%, 100% { transform:scale(1); opacity:1; } 50% { transform:scale(.55); opacity:.45; } }
  @keyframes kl-blink { 0%, 90%, 100% { transform:scaleY(0); } 94% { transform:scaleY(1); } }
  .kl-label { top:calc(50% + 90px) !important; }
  .kl.out .kl-star { transform:scale(.8); transition:transform .6s cubic-bezier(0.22, 1, 0.36, 1); }
  @media (prefers-reduced-motion: reduce) { .kl-star, .kl-body, .kl-lid, .kl-shadow { animation:none !important; } }

  
  .p6-anchor { position:relative; top:-120px; display:block; }
  .p6-bar { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; flex-wrap:wrap; margin-bottom:32px; }
  .p6-title { margin:0 0 6px; font:600 30px/36px var(--sans); letter-spacing:-.02em; }
  .p6-bar .lead::before { content:none; }
  .p6-tabs { display:flex; gap:2px; padding:4px; border-radius:9999px; border:1px solid rgba(255, 255, 255, .1); background:#0b0b0b; }
  .p6-tabs button { padding:7px 16px; border:none; border-radius:9999px; background:transparent; color:var(--muted); font:500 14px/20px var(--sans); cursor:pointer;
    transition:background-color .25s var(--ease), color .25s var(--ease); }
  .p6-tabs button:hover { color:#fff; }
  .p6-tabs button.on { background:#1c1c1c; color:#fff; box-shadow:0 1px 2px rgba(0, 0, 0, .5), inset 0 1px 0 rgba(255, 255, 255, .08); }
  .p6-grid { display:grid; gap:20px; grid-template-columns:repeat(4, minmax(0, 1fr)); }
  @media (max-width:1100px) { .p6-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); } }
  @media (max-width:600px) { .p6-grid { grid-template-columns:1fr; } }

  .p6-card { display:flex; flex-direction:column; padding:4px; border-radius:20px; border:1px solid rgba(255, 255, 255, .08); background:#0a0a0a;
    animation:p6-in .5s var(--ease) both; }
  .p6-card:nth-child(2) { animation-delay:.05s; } .p6-card:nth-child(3) { animation-delay:.1s; } .p6-card:nth-child(4) { animation-delay:.15s; }
  @keyframes p6-in { from { opacity:0; transform:translateY(10px); } }
  
  .p6-top { position:relative; overflow:hidden; display:flex; flex-direction:column; gap:16px; padding:20px; border-radius:16px;
    border:1px solid rgba(255, 255, 255, .08); background:color-mix(in srgb, var(--a) 10%, #0d0d0d); }
  .p6-blob { position:absolute; border-radius:9999px; pointer-events:none; filter:blur(48px); }
  .p6-blob.a { top:-48px; right:-48px; width:208px; height:208px; background:var(--a); opacity:.45; }
  .p6-blob.b { top:33%; left:-32px; width:240px; height:240px; background:var(--b); opacity:.18; }
  .p6-grain { position:absolute; inset:0; pointer-events:none; opacity:.12; mix-blend-mode:overlay;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.68' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
  .p6-top > :not(i) { position:relative; z-index:1; }
  .p6-head { display:flex; align-items:center; gap:8px; }
  
  .p6-star { position:relative; display:block; width:32px; height:32px; filter:hue-rotate(var(--hue, 0deg)) saturate(var(--sat, 1)) drop-shadow(0 4px 10px rgba(0, 0, 0, .35));
    transition:transform .5s cubic-bezier(0.34, 1.56, 0.64, 1); }
  .p6-star img { display:block; width:32px; height:32px; }
  .p6-star i { position:absolute; background:#f373af; border-radius:40%; transform:scaleY(0); transform-origin:50% 0; animation:p6-blink 3.6s ease-in-out infinite; }
  .p6-star i.l { left:46%; top:35%; width:12%; height:20%; }
  .p6-star i.r { left:62%; top:31%; width:11%; height:18%; animation-delay:60ms; }
  @keyframes p6-blink { 0%, 88%, 100% { transform:scaleY(0); } 93%, 97% { transform:scaleY(1); } }
  .p6-card:hover .p6-star { transform:translateY(-3px) rotate(-12deg) scale(1.1); }
  .p6-tag { padding:2px 10px; border-radius:9999px; background:rgba(255, 255, 255, .14); color:rgba(255, 255, 255, .8); font:500 12px/18px var(--sans);
    -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); }
  .p6-top h3 { margin:0; font:700 20px/28px var(--sans); letter-spacing:-.01em; color:#fff; }
  .p6-desc { margin:2px 0 0; font:400 14px/20px var(--sans); color:rgba(255, 255, 255, .6); }
  .p6-price { display:flex; align-items:baseline; gap:8px; }
  .p6-price b { font:700 30px/36px var(--sans); letter-spacing:-.02em; color:#fff; }
  .p6-price span { font:400 14px var(--sans); color:rgba(255, 255, 255, .5); }
  .p6-note { margin:2px 0 0; font:400 12px/16px var(--sans); color:rgba(255, 255, 255, .5); }
  .p6-cta { display:flex; align-items:center; justify-content:center; height:40px; border-radius:9999px; font:600 14px/20px var(--sans); color:#fff;
    background:rgba(255, 255, 255, .14); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); transition:background-color .25s var(--ease), transform .25s var(--ease); }
  .p6-cta:hover { background:rgba(255, 255, 255, .24); }
  .p6-cta:active { transform:scale(.98); }
  .p6-cta.dark { background:#fff; color:#000; }
  .p6-cta.dark:hover { background:#e9e9e9; }
  .p6-cta:focus-visible { outline:2px solid var(--pink); outline-offset:2px; }
  .p6-body { display:flex; flex-direction:column; gap:20px; flex:1; padding:20px 8px 4px; }
  .p6-body ul { list-style:none; margin:0; padding:0; display:grid; gap:10px; flex:1; }
  .p6-body li { display:flex; align-items:center; gap:8px; font:400 14px/20px var(--sans); color:var(--soft); }
  .p6-body li i { font-size:14px; color:rgba(255, 255, 255, .4); }
  .p6-foot { display:grid; gap:2px; padding:8px; border-top:1px solid rgba(255, 255, 255, .08); }
  .p6-foot b { font:600 12px/16px var(--sans); color:#fff; }
  .p6-foot span { font:400 12px/16px var(--sans); color:var(--muted); }
  
  .p6-head { flex-wrap:wrap; }
  .p6-save { margin-left:auto; padding:2px 8px; border-radius:9999px; background:rgba(255, 143, 200, .16); color:#ffd1e8; font:600 11px/16px var(--mono); letter-spacing:.02em; }
  .p6-cta-wrap { display:grid; gap:8px; }
  .p6-cta { gap:6px; }
  .p6-cta i { font-size:14px; transition:transform .25s var(--ease); }
  .p6-cta:hover i { transform:translateX(3px); }
  .p6-assure { margin:0; text-align:center; font:400 12px/16px var(--sans); color:rgba(255, 255, 255, .5); }
  @media (min-width:1101px) {
    .p6-grid { padding-top:12px; }
    .p6-card.is-featured { transform:translateY(-12px); box-shadow:0 24px 60px -24px rgba(255, 79, 163, .45); }
  }
  .p6-trust { display:flex; flex-wrap:wrap; justify-content:center; gap:10px 24px; margin:36px 0 0; font:400 13px/18px var(--sans); color:var(--muted); }
  .p6-trust span { display:inline-flex; align-items:center; gap:6px; }
  .p6-trust i { font-size:16px; color:rgba(255, 255, 255, .55); }
  .p6-help { display:flex; align-items:center; gap:10px; margin:20px auto 0; padding:10px 18px; border-radius:9999px; border:1px solid rgba(255, 143, 200, .25);
    background:rgba(255, 143, 200, .06); color:#fff; font:500 14px/20px var(--sans); cursor:pointer; transition:background-color .25s var(--ease), border-color .25s var(--ease); }
  .p6-help:hover { background:rgba(255, 143, 200, .12); border-color:rgba(255, 143, 200, .45); }
  .p6-help i { color:var(--pink); transition:transform .25s var(--ease); }
  .p6-help:hover i { transform:translateX(3px); }
  .p6-help:focus-visible { outline:2px solid var(--pink); outline-offset:2px; }
  @media (prefers-reduced-motion: reduce) { .p6-card, .p6-star i { animation:none; } }
  
  .p6-top { background:color-mix(in srgb, var(--a) 7%, #0c0c0c); }
  .p6-blob.a { opacity:var(--glow, .4); }
  .p6-blob.b { opacity:calc(var(--glow, .4) * .45); }
  .p6-card:has(.p6-top.featured) { border-color:rgba(255, 143, 200, .35); box-shadow:0 20px 50px -24px rgba(255, 79, 163, .45); }
  .p6-top.featured { border-color:rgba(255, 143, 200, .3); }
  .p6-top.featured .p6-tag { background:rgba(255, 143, 200, .2); color:#ffd1e8; }
  .p6-cta.dark { background:#ff8fc8; color:#000; }
  .p6-cta.dark:hover { background:#ffa6d4; }
  .p6-body li i { color:rgba(255, 143, 200, .55); }
