/* AIXotic.Chat front page inside Lustlab */
.aix{--ax-pink:#FF4FA3;--ax-yellow:#FFC61A;--ax-green:#6EE7A0;--ax-ink:#F4F1EC;--ax-disp:'Bricolage Grotesque',Manrope,sans-serif;background:#08080A}
.aix .atmosphere{display:none}
.aix header{background:#08080af2;border-color:#1E1E24}
.brand-word.aix{color:var(--ax-pink);font-family:var(--ax-disp)}.brand-word.aix i{color:var(--ax-green)}.brand-word.aix em{color:var(--ax-yellow)}
.aix .head-cta{background:var(--ax-ink);color:#08080A;border-radius:999px}
.ax-hero{display:flex;flex-wrap:wrap;align-items:center;gap:48px;padding-top:clamp(36px,5vw,72px);padding-bottom:clamp(48px,6vw,88px)}
.ax-copy{flex:1 1 520px;min-width:0}
.ax-pill{display:inline-flex;padding:7px 14px;border:1px solid var(--ax-green);border-radius:999px;color:var(--ax-green);font-size:.75rem;font-weight:700;letter-spacing:.14em;margin-bottom:22px}
.ax-hero h1{font:800 clamp(3rem,7.2vw,6.25rem)/.95 var(--ax-disp);letter-spacing:-.045em;color:var(--ax-ink)}
.ax-lede{margin-top:28px;max-width:520px;font-size:1.1875rem;color:#B9B5AD}
.ax-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}
.ax-btn{display:inline-flex;align-items:center;gap:10px;min-height:56px;padding:0 28px;border-radius:16px;font-weight:700;font-size:1.0625rem;transition:transform .2s var(--ease)}
.ax-btn:hover{transform:translateY(-3px)}
.ax-btn.pink{background:var(--ax-pink);color:#1A0510}.ax-btn.line{border:2px solid var(--ax-yellow);color:var(--ax-yellow)}.ax-btn.dark{background:#08080A;color:var(--ax-ink);min-height:60px;border-radius:18px}
.ax-small{margin-top:18px;font-size:.875rem;color:#8C887F}
.ax-demo{flex:1 1 380px;min-width:0;max-width:470px;margin:0 auto;position:relative}
.ax-back{position:absolute;border-radius:30px}.ax-back.y{left:22px;top:22px;right:-14px;bottom:-14px;background:var(--ax-yellow)}.ax-back.g{left:10px;top:10px;right:-4px;bottom:-4px;background:var(--ax-green)}
.ax-card{position:relative;border-radius:28px;background:#121216;border:2px solid var(--ax-pink);padding:20px;display:flex;flex-direction:column;gap:12px}
.ax-card-head{display:flex;align-items:center;gap:12px;padding-bottom:14px;border-bottom:1px solid #25252C}
.ax-card-head img{height:46px;width:auto;object-fit:contain}
.ax-card-head div{flex:1;display:flex;flex-direction:column;line-height:1.3}.ax-card-head span{font-size:.8125rem;color:var(--ax-green)}
.ax-card-head em{font-style:normal;font-size:.6875rem;font-weight:700;letter-spacing:.12em;padding:4px 8px;border-radius:6px;border:1px solid var(--ax-yellow);color:var(--ax-yellow)}
.ax-b{align-self:flex-start;max-width:82%;padding:11px 15px;border-radius:18px 18px 18px 5px;background:#1E1E25;line-height:1.45;animation:pop .5s var(--ease) both}
.ax-b.me{align-self:flex-end;border-radius:18px 18px 5px 18px;background:var(--ax-pink);color:#1A0510;font-weight:500}
.ax-shot{align-self:flex-start;width:56%;height:auto;object-fit:contain;border-radius:18px 18px 18px 5px;border:2px solid var(--ax-green)}
.ax-typing{display:inline-flex;gap:5px;padding:13px 15px}.ax-typing i{width:7px;height:7px;border-radius:50%;background:#B9B5AD;animation:dot 1.1s infinite}.ax-typing i:nth-child(2){animation-delay:.15s}.ax-typing i:nth-child(3){animation-delay:.3s}
.ax-sec{padding-bottom:clamp(56px,7vw,96px);scroll-margin-top:96px}
.ax-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:28px}
.ax-head h2{font:800 clamp(2rem,4vw,3.25rem)/1.02 var(--ax-disp);letter-spacing:-.04em}.ax-head p{color:#B9B5AD;max-width:360px}
.ax-band{border-block:1px solid #1E1E24;margin-bottom:clamp(56px,7vw,96px)}
.ax-feats{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:40px;padding-top:clamp(48px,6vw,88px);padding-bottom:clamp(48px,6vw,88px)}
.ax-feats b{display:block;font:800 4.5rem/1 var(--ax-disp);letter-spacing:-.05em;margin-bottom:12px}
.ax-feats h3{font:800 1.75rem/1.15 var(--ax-disp);letter-spacing:-.03em;margin-bottom:12px}.ax-feats p{color:#B9B5AD}
.ax-close{border-radius:36px;background:var(--ax-yellow);color:#1C1500;padding:clamp(32px,6vw,72px);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:28px}
.ax-close h2{flex:1 1 420px;font:800 clamp(2.25rem,5vw,4rem)/.98 var(--ax-disp);letter-spacing:-.045em}
.ax-close div{display:flex;flex-direction:column;gap:12px;align-items:flex-start;font-size:.875rem;font-weight:500}
.aix footer{margin-top:0}

/* roster: solid colour cards, every photo whole in its own proportions */
.cast{display:flex;gap:18px;align-items:flex-start}
.cast .col{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:18px}
.cast a{display:block;border-radius:24px;padding:14px 14px 18px;background:var(--c);color:var(--k);transition:transform .25s var(--ease)}
.cast a:hover{transform:translateY(-4px)}
.cast a:hover .photo{transform:none;box-shadow:none}
.cast .photo{border-radius:14px;box-shadow:none;border:0;background:var(--k)}

.cast .row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 4px 0}
.cast h2{font:800 1.75rem/1.15 var(--ax-disp);letter-spacing:-.03em;color:var(--k)}
.cast p{font-size:.9375rem;font-weight:500;color:var(--k);line-height:1.4}
.cast u{flex:none;text-decoration:none;font-size:.8125rem;font-weight:700;color:var(--c);background:var(--k);padding:10px 16px;border-radius:999px}
.fine{margin-top:14px;font-size:.8125rem;color:#8C887F;max-width:none}

/* conversation */
.talk{display:grid;grid-template-columns:minmax(0,.62fr) minmax(0,1fr);gap:clamp(16px,2.4vw,32px);align-items:start;padding-top:clamp(16px,2.4vw,28px)}
.who{position:sticky;top:96px}
.who .photo{max-height:calc(100svh - 170px);margin:0 auto}
.back{display:inline-block;margin-bottom:12px;font-size:.8125rem;color:var(--dim)}.back:hover{color:#fff}
.back.small{display:none;margin:0;font-size:1.2rem;padding:4px 8px}
.panel{display:flex;flex-direction:column;height:calc(100svh - 76px - clamp(32px,4.8vw,56px));min-height:420px;border:1px solid var(--line);border-radius:22px;background:#0c1016e6;overflow:hidden}
.panel-head{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line);background:#0e1218}
.thumb{flex:none;height:46px;border-radius:9px;overflow:hidden;border:1px solid color-mix(in srgb,var(--c,var(--lilac)) 45%,transparent)}
.thumb img{height:100%;width:auto;object-fit:contain}
.who-meta{min-width:0;display:flex;flex-direction:column;line-height:1.25}
.who-meta b{font:700 1rem Manrope,sans-serif;color:var(--c,var(--lilac))}
.who-meta span{font-size:.75rem;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ai-tag{font:700 .625rem 'DM Sans',sans-serif;letter-spacing:.12em;padding:4px 8px;border-radius:6px;color:var(--lilac);border:1px solid #b79bff55;background:#b79bff12}
.credits{margin-left:auto;font-size:.75rem;color:var(--lemon);white-space:nowrap}
.log{flex:1;overflow-y:auto;padding:18px 16px;display:flex;flex-direction:column;gap:10px;scrollbar-width:thin}
.line{max-width:min(84%,560px);padding:12px 15px;border-radius:16px 16px 16px 5px;background:#161e2b;border:1px solid #263148;color:#e4eaf5;font-size:.9375rem;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere;animation:pop .28s var(--ease)}
.line em{font-style:italic;color:#b9c4d6}
.line.me{align-self:flex-end;border-radius:16px 16px 5px 16px;background:linear-gradient(125deg,#b79bff2e,#5aa9ff24);border-color:#9b86d766}
.line.typing{display:inline-flex;gap:5px;align-items:center;width:max-content}
.line.typing i{width:6px;height:6px;border-radius:50%;background:var(--dim);animation:dot 1.1s infinite}.line.typing i:nth-child(2){animation-delay:.15s}.line.typing i:nth-child(3){animation-delay:.3s}
@keyframes pop{from{opacity:0;transform:translateY(6px)}}
.notice{margin:0 16px 10px;padding:10px 14px;border-radius:12px;border:1px solid #f2c94c55;background:#f2c94c12;color:#f6dc8a;font-size:.8125rem;line-height:1.5}
.notice a{color:#fff;font-weight:700;text-decoration:underline}
.composer{display:flex;gap:10px;align-items:flex-end;padding:12px 14px;border-top:1px solid var(--line);background:#0e1218}
.composer textarea{flex:1;resize:none;max-height:140px;padding:12px 14px;border-radius:14px;border:1px solid var(--line);background:#07090c;color:var(--ink);font:inherit;font-size:1rem;line-height:1.4}
.composer textarea:focus{outline:none;border-color:var(--lilac)}
.composer button{flex:none;min-height:46px;padding:0 20px;border:0;border-radius:14px;background:linear-gradient(110deg,var(--pink),#ff9bcc);color:#21101b;font:700 .9375rem 'DM Sans',sans-serif;cursor:pointer}
.composer button:disabled{opacity:.5;cursor:default}
.gate{padding:18px 16px;border-top:1px solid var(--line);background:#0e1218;text-align:center}
.gate p{color:var(--dim);font-size:.875rem;margin-bottom:12px}
.panel-foot{display:flex;justify-content:space-between;gap:12px;padding:8px 16px 10px;font-size:.6875rem;color:var(--dim);background:#0e1218}
.panel-foot button{background:none;border:0;padding:0;color:var(--dim);font:inherit;cursor:pointer;text-decoration:underline}
.panel-foot button:hover{color:#fff}
[hidden]{display:none!important}
@media(max-width:860px){
  .talk{grid-template-columns:1fr;padding:0}.who{display:none}.back.small{display:block}
  .panel{height:calc(100svh - 64px);border-radius:0;border-inline:0;min-height:0}
  body.in-chat footer{display:none}
  .cast,.cast .col{gap:10px}.cast a{padding:8px 8px 12px;border-radius:18px}.cast .row{flex-direction:column;align-items:flex-start;padding:10px 4px 0}.cast h2{font-size:1.25rem}.ax-hero{gap:36px}
  .brand-word{font-size:1.25rem}
}

/* ask for a photo or a video */
.ask{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 14px 0;background:#0e1218;font-size:.75rem;color:var(--dim)}
.ask-btn{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:999px;font:700 .875rem 'DM Sans',sans-serif;cursor:pointer;border:1px solid var(--k);color:var(--k);background:color-mix(in srgb,var(--k) 12%,transparent)}
.ask-photo{--k:#6ee7a0}.ask-video{--k:#ffc61a}
.ask-btn small{font-weight:500;font-size:.75rem;color:var(--dim)}
.ask-form{display:flex;flex-direction:column;gap:10px;margin:10px 14px 0;padding:14px;border-radius:16px;border:1px solid #ffc61a66;background:#121008}
.ask-form label{font-size:.8125rem;font-weight:700}
.ask-row{display:flex;flex-wrap:wrap;gap:8px}
.ask-row input,.ask-row select{flex:1 1 220px;min-width:0;min-height:46px;padding:0 14px;border-radius:12px;border:1px solid var(--line);background:#07090c;color:var(--ink);font:inherit}
.ask-row select{flex:0 1 auto}
.ask-row button{min-height:46px;padding:0 18px;border-radius:12px;border:0;font:700 .875rem 'DM Sans',sans-serif;cursor:pointer;background:#ffc61a;color:#1c1500}
.ask-row #ask-cancel{background:none;border:1px solid var(--line);color:var(--dim)}
.log{gap:18px}

button.credits{font-family:inherit;cursor:pointer;background:none;border:1px solid color-mix(in srgb,var(--lemon,#f2c94c) 45%,transparent);border-radius:999px;padding:6px 12px;font-weight:700}
button.credits:hover{background:color-mix(in srgb,var(--lemon,#f2c94c) 14%,transparent)}
button.credits[hidden]{display:none}

/* Hero fits the first screen: copy starts at the top instead of centring against the tall
   demo card, and the headline scales with the window's height as well as its width. */
.ax-hero{align-items:flex-start;padding-top:clamp(18px,2.6vw,36px);gap:clamp(28px,4vw,48px)}
.ax-pill{margin-bottom:clamp(12px,2vh,22px)}
.ax-hero h1{font-size:clamp(2.6rem,min(7.2vw,12.5vh),6.25rem)}
.ax-lede{margin-top:clamp(14px,2.4vh,28px)}
.ax-cta{margin-top:clamp(16px,2.8vh,34px)}
.ax-shot{width:auto;max-width:56%;max-height:36vh}

.coin-slot{display:inline-block;margin-left:auto;flex:none}

/* Her gallery, under her photo: every picture from her stories */
.who-gallery{display:flex;gap:8px;margin-top:12px;padding-bottom:4px;overflow-x:auto;scrollbar-width:thin}
.who-gallery button{flex:none;width:54px;padding:0;border:2px solid transparent;border-radius:10px;background:#0e1218;overflow:hidden;cursor:pointer;opacity:.7;transition:opacity .15s,border-color .15s}
.who-gallery button img{display:block;width:100%;height:auto}
.who-gallery button:hover,.who-gallery button.is-on{opacity:1;border-color:var(--c,var(--ax-pink))}
.who-stories{display:grid;gap:6px;margin-top:10px}
.who-stories a{font-size:.8125rem;color:var(--ax-yellow);text-decoration:none}.who-stories a:hover{text-decoration:underline}
.ax-shot{max-height:340px;width:auto;max-width:70%}

/* Coins and wallet sit in the top bar; full screen puts her picture on the left and the chat beside it */
.head-coins{display:flex;align-items:center;justify-content:flex-end;min-width:0}
.full-btn{margin-left:auto;flex:none;width:42px;height:42px;display:grid;place-items:center;border-radius:12px;border:1px solid var(--line);background:#07090c;color:var(--ink);cursor:pointer;transition:border-color .15s,color .15s}
.full-btn:hover,.full-btn[aria-pressed=true]{border-color:var(--ax-pink);color:var(--ax-pink)}
.panel-head .coin-slot,.panel-head button.credits{margin-left:10px}
body.chat-full>header,body.chat-full>footer{display:none}
body.chat-full .talk{max-width:none;height:100svh;padding:10px;gap:10px;grid-template-columns:auto minmax(0,1fr);align-items:stretch}
body.chat-full .who{position:relative;top:auto;display:flex;flex-direction:column;align-items:flex-start;min-width:0;max-width:46vw}
body.chat-full .who .photo{flex:none;height:calc(100svh - 20px);max-height:none;max-width:46vw;margin:0;border-radius:16px}
body.chat-full .who .photo:hover{transform:none}
body.chat-full .who .photo figcaption{left:auto;bottom:auto;top:10px;right:10px}
body.chat-full .who>.back{position:absolute;z-index:2;left:10px;top:10px;margin:0;padding:7px 13px;border-radius:999px;background:#07090cc4;color:#fff;backdrop-filter:blur(8px)}
body.chat-full .who-gallery{position:absolute;z-index:2;left:10px;right:10px;bottom:10px;margin:0;padding:6px;border-radius:14px;background:#07090c99;backdrop-filter:blur(8px)}
body.chat-full .who-stories{display:none}
body.chat-full .panel{height:calc(100svh - 20px);min-height:0}
@media(max-width:860px){body.chat-full .talk{display:block;padding:0;height:auto}body.chat-full .panel{height:100svh}}

/* Phones, in a conversation: one top bar. The site bar steps aside and her bar carries back, her name,
   the Evoke menu and Coins, so the conversation gets the whole screen. */
.panel-head .evoke-menu-slot{flex:0 0 auto;margin-left:10px}
@media(max-width:860px){
  body.in-chat>header{display:none}
  body.in-chat .panel{height:100svh}
  body.in-chat .full-btn{display:none}
  body.in-chat .panel-head{gap:10px;padding:8px 12px;padding-top:calc(8px + env(safe-area-inset-top))}
  body.in-chat .panel-head .who-meta{flex:1 1 auto}
  body.in-chat .panel-head .evoke-menu-slot{margin-left:0}
  body.in-chat .panel-head .coin-slot,body.in-chat .panel-head button.credits{margin-left:0}
}