/* Allen Claude v7 — Premium Dark Theme */
[data-theme="ember"]{--ac:#d4915c;--ac2:#e0a878;--ac3:#b87040;--glow:0 0 10px rgba(212,145,92,.2);--dim:rgba(212,145,92,.07);--dim2:rgba(212,145,92,.04);--brd:#1e1c1a;--brd2:#2a2724;--bg:#0a0a0a;--bg2:#0f0e0c;--bg3:#151412;--bg4:#1a1917;--bgh:rgba(212,145,92,.04);--tx:#ede8e1;--tx2:#7d756b;--tx3:#4a4440;--ctx:#d8cfc4;--hc:#e8c8a0;--user-bg:rgba(212,145,92,.08);--user-brd:rgba(212,145,92,.15);--code-bg:#0a0a0a;--code-head:rgba(255,255,255,.03)}
[data-theme="sand"]{--ac:#b8904c;--ac2:#c8a468;--ac3:#966e30;--glow:0 0 10px rgba(184,144,76,.2);--dim:rgba(184,144,76,.07);--dim2:rgba(184,144,76,.04);--brd:#1c1a16;--brd2:#28251e;--bg:#0b0a08;--bg2:#0f0e0b;--bg3:#15130e;--bg4:#191711;--bgh:rgba(184,144,76,.03);--tx:#e0d8c8;--tx2:#847660;--tx3:#504838;--ctx:#d0c4b0;--hc:#c8a878;--user-bg:rgba(184,144,76,.08);--user-brd:rgba(184,144,76,.15);--code-bg:#0b0a08;--code-head:rgba(255,255,255,.03)}

/* ═══ MONO — high contrast black & white with electric glow ═══ */
[data-theme="mono"]{
    --ac:#fff;--ac2:#ffffff;--ac3:#888;
    --glow:0 0 12px rgba(255,255,255,.15);
    --dim:rgba(255,255,255,.05);--dim2:rgba(255,255,255,.02);
    --brd:#1a1a1a;--brd2:#222;
    --bg:#000;--bg2:#060606;--bg3:#0d0d0d;--bg4:#111;
    --bgh:rgba(255,255,255,.04);
    --tx:#f0f0f0;--tx2:#666;--tx3:#3a3a3a;
    --ctx:#ccc;--hc:#fff;
    --user-bg:rgba(255,255,255,.05);--user-brd:rgba(255,255,255,.12);
    --code-bg:#000;--code-head:rgba(255,255,255,.04)
}
/* Mono theme special effects */
[data-theme="mono"] .av{background:linear-gradient(135deg,#fff,#888)}
[data-theme="mono"] .profile-av{background:linear-gradient(135deg,#fff,#888)}
[data-theme="mono"] .msg-av-user{background:linear-gradient(135deg,#fff,#888)}
[data-theme="mono"] .msg-av-ai{border-color:#333}
[data-theme="mono"] .mode-card.active{box-shadow:0 0 0 1px #fff,0 0 15px rgba(255,255,255,.08)}
[data-theme="mono"] .msel:hover{border-color:#fff;box-shadow:0 0 8px rgba(255,255,255,.1)}
[data-theme="mono"] .inw:focus-within{border-color:#fff;box-shadow:0 0 10px rgba(255,255,255,.08)}
[data-theme="mono"] .bsend.active{background:#fff;color:#000;box-shadow:0 0 12px rgba(255,255,255,.2)}
[data-theme="mono"] .profile-save{background:#fff;color:#000}
[data-theme="mono"] .chip:hover{border-color:#fff;box-shadow:0 0 8px rgba(255,255,255,.1)}
[data-theme="mono"] .ci.a{border-left-color:#fff;box-shadow:inset 2px 0 8px rgba(255,255,255,.05)}
[data-theme="mono"] .msg-action-btn{border-color:#555;color:#aaa;box-shadow:0 0 4px rgba(255,255,255,.06)}
[data-theme="mono"] .msg-action-btn:hover{border-color:#fff;color:#fff;box-shadow:0 0 10px rgba(255,255,255,.15);background:rgba(255,255,255,.06)}
[data-theme="mono"] .code-cp{border-color:#555;color:#aaa;box-shadow:0 0 3px rgba(255,255,255,.05)}
[data-theme="mono"] .code-cp:hover{border-color:#fff;color:#fff;box-shadow:0 0 8px rgba(255,255,255,.12)}
[data-theme="mono"] .mc a.mc-link{color:#fff;text-decoration-color:#555}
[data-theme="mono"] .mc a.mc-link:hover{text-decoration-color:#fff}
[data-theme="mono"] .lb.active{background:#fff;color:#000;border-color:#fff}
[data-theme="mono"] .bar{border-bottom-color:#181818}
[data-theme="mono"] .sb{border-right-color:#181818}
/* Mono animated scanline effect */
[data-theme="mono"] .main::after{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(255,255,255,.008) 2px,rgba(255,255,255,.008) 4px);z-index:0;opacity:.5}
:root{--fd:'Unbounded',sans-serif;--fb:'Manrope',sans-serif;--fm:'JetBrains Mono',monospace}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;overflow:hidden}
body{font-family:var(--fb);background:var(--bg);color:var(--tx);display:flex;-webkit-font-smoothing:antialiased}
::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--brd2);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--tx3)}
.hidden{display:none!important}button{font-family:var(--fb);cursor:pointer;border:none;background:none;color:inherit}

/* ═══ SIDEBAR — fixed: no text squishing on toggle ═══ */
.sb{width:280px;min-width:280px;background:var(--bg2);border-right:1px solid var(--brd);display:flex;flex-direction:column;z-index:10;position:relative;flex-shrink:0;transition:width .3s cubic-bezier(.4,0,.2,1),min-width .3s cubic-bezier(.4,0,.2,1),border-color .3s}
.sb.collapsed{width:0;min-width:0;border-right-color:transparent;overflow:hidden}
/* Inner wrapper prevents text squishing by keeping content at fixed width */
.sb-inner{width:280px;min-width:280px;display:flex;flex-direction:column;height:100%;overflow:hidden}
.sb-head{display:flex;align-items:center;justify-content:space-between;padding:16px;border-bottom:1px solid var(--brd);flex-shrink:0}
.logo{display:flex;align-items:center;gap:10px;white-space:nowrap}
.logo-i{width:36px;height:36px;object-fit:cover;flex-shrink:0;display:block;border-radius:10px}
.logo-t{font-family:var(--fd);font-weight:600;font-size:12px;letter-spacing:.03em;text-transform:uppercase;color:var(--tx)}
.bi{width:34px;height:34px;border-radius:8px;display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s;flex-shrink:0;color:var(--tx2)}.bi:hover{background:var(--dim);color:var(--ac)}.bi-new{background:var(--dim);border:1px solid var(--brd2);color:var(--ac)}.bi-cls{display:none;color:var(--tx2)}

/* Chat list */
.cl{flex:1;overflow-y:auto;padding:8px}.cl-e{color:var(--tx3);text-align:center;padding:32px 16px;font-size:13px}
.ci{display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:8px;margin-bottom:2px;cursor:pointer;border-left:3px solid transparent;transition:all .15s}.ci:hover{background:var(--bgh)}.ci.a{background:var(--dim);border-left-color:var(--ac)}
.ci-b{flex:1;min-width:0}.ci-t{font-size:13px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--tx)}.ci-m{display:flex;gap:8px;margin-top:3px;font-size:11px}.ci-md{color:var(--ac2);opacity:.7}.ci-n{color:var(--tx3)}
.ci-d{opacity:0;color:var(--tx3);padding:3px;border-radius:4px;transition:.15s;font-size:13px;flex-shrink:0}.ci:hover .ci-d{opacity:.5}.ci-d:hover{color:#c44}

/* Profile area */
.prof{border-top:1px solid var(--brd);padding:10px 12px;position:relative;flex-shrink:0}
.prof-btn{display:flex;align-items:center;gap:10px;padding:8px;border-radius:10px;cursor:pointer;transition:background .15s;white-space:nowrap}.prof-btn:hover{background:var(--bgh)}
.av{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,var(--ac),var(--ac3));display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden;border:2px solid transparent;transition:border-color .15s}.av span{font-weight:700;font-size:14px;color:#fff}.av img{width:100%;height:100%;object-fit:cover}
.prof-i{flex:1;min-width:0;overflow:hidden}.prof-n{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.prof-s{font-size:11px;color:var(--ac);font-family:var(--fm);font-weight:600;white-space:nowrap}
.pp{position:absolute;bottom:calc(100% + 8px);left:12px;right:12px;background:var(--bg3);border:1px solid var(--brd2);border-radius:12px;padding:6px;box-shadow:0 -8px 32px rgba(0,0,0,.5);animation:slideUp .15s;z-index:60;display:flex;flex-direction:column}
.pp-action{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;cursor:pointer;transition:all .15s;font-size:13px;font-weight:500;color:var(--tx);width:100%;text-align:left}.pp-action:hover{background:var(--bgh);color:var(--ac)}
.pp-action .pp-icon{font-size:16px;width:22px;text-align:center;flex-shrink:0}
.pp-sep{height:1px;background:var(--brd);margin:4px 0}
.pp-action.lo{color:var(--tx3)}.pp-action.lo:hover{color:#c44;background:rgba(204,68,68,.06)}

/* ═══ MAIN AREA ═══ */
.main{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0;position:relative}
.bar{display:flex;align-items:center;gap:10px;padding:10px 16px;border-bottom:1px solid var(--brd);background:var(--bg);flex-shrink:0;position:relative;z-index:20}
.msel{display:flex;align-items:center;gap:7px;padding:6px 14px;border-radius:8px;background:var(--dim);border:1px solid var(--brd2);cursor:pointer;transition:all .15s;font-size:13px;font-weight:500}.msel:hover{border-color:var(--ac);background:var(--dim)}
.mlk{display:flex;align-items:center;gap:7px;padding:6px 14px;border-radius:8px;background:var(--dim2);border:1px solid var(--brd);font-size:13px;opacity:.6}
.mode-badge{padding:4px 10px;border-radius:8px;background:var(--dim);border:1px solid var(--brd2);font-size:12px}
.ctx{margin-left:auto;padding:4px 10px;border-radius:8px;background:var(--dim2);font-size:11px;color:var(--tx2);font-family:var(--fm)}
.mdov{position:fixed;inset:0;z-index:25}
.mo-id{font-size:10px;color:var(--tx3);font-family:var(--fm)}
.mo-cr{font-size:10px;font-family:var(--fm);color:var(--ac);margin-left:auto;opacity:.8;white-space:nowrap}
.mo-free{font-size:9px;font-family:var(--fm);color:#5cb85c;background:rgba(92,184,92,.1);padding:1px 6px;border-radius:4px;margin-left:auto}

/* Model dropdown improvements */
.mo{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;cursor:pointer;transition:.12s;border:1px solid transparent}
.mo:hover{background:var(--bgh)}.mo.a{background:var(--dim);border-color:var(--brd2)}
.mo-i{font-size:18px;flex-shrink:0;width:32px;height:32px;border-radius:8px;background:var(--dim);display:flex;align-items:center;justify-content:center}
.mo-logo{width:24px;height:24px;border-radius:50%;object-fit:cover}
.mo-info{flex:1;min-width:0}
.mo-n{font-size:13px;font-weight:500;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.mo-desc{font-size:11px;color:var(--tx3);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mo-tag{font-size:9px;padding:1px 6px;border-radius:3px;background:rgba(212,145,92,.12);color:var(--ac);font-weight:600;white-space:nowrap}
.mdd-group-label{font-size:10px;color:var(--tx3);text-transform:uppercase;letter-spacing:.5px;padding:8px 12px 4px;font-weight:600}
.mdd-sep{height:1px;background:var(--brd);margin:4px 12px}
.mdd-search{padding:8px 12px 6px}
.mdd-search input{width:100%;padding:8px 12px;background:var(--bg);border:1px solid var(--brd2);border-radius:8px;color:var(--tx);font-family:var(--fb);font-size:13px;outline:none;transition:.15s}
.mdd-search input:focus{border-color:var(--ac)}
.mdd-search input::placeholder{color:var(--tx3)}
.mdd-filters{display:flex;gap:4px;padding:0 12px 6px}
.mdd-f{font-size:11px;padding:4px 10px;border-radius:20px;background:var(--dim2);color:var(--tx2);cursor:pointer;transition:.15s}
.mdd-f:hover{background:var(--dim);color:var(--tx)}
.mdd-f.a{background:var(--dim);color:var(--ac);border:1px solid var(--brd2)}
.mdd-footer{padding:8px 12px;font-size:11px;color:var(--tx3);border-top:1px solid var(--brd)}
.mdd{position:absolute;top:52px;left:56px;background:var(--bg3);border:1px solid var(--brd2);border-radius:12px;padding:4px;min-width:340px;max-height:80vh;overflow-y:auto;box-shadow:0 12px 40px rgba(0,0,0,.6);z-index:30;animation:slideUp .12s}
.mo-auto{border:1px dashed var(--brd2)}
.mo-auto:hover{border-color:var(--ac)}
.mo-auto.a{border-color:var(--ac);background:var(--dim)}

/* Auto-route label in chat */
.auto-route-label{font-size:10px;color:var(--ac);margin-left:8px;opacity:.7}

/* Daily bonus button */
.daily-btn{display:flex;align-items:center;gap:8px;padding:8px 12px;margin:0 8px 8px;border-radius:8px;background:var(--dim);border:1px solid var(--brd2);cursor:pointer;transition:.2s}
.daily-btn:hover{border-color:var(--ac);background:rgba(212,145,92,.06)}
.daily-btn.claimed{opacity:.5;cursor:default}
.daily-btn.claimed:hover{border-color:var(--brd2);background:var(--dim)}
.daily-icon{font-size:16px}
.daily-text{font-size:12px;font-weight:600;color:var(--ac)}

/* Referral section in profile */
.ref-hint{font-size:12px;color:var(--tx2);margin-bottom:10px}
.ref-code-row{display:flex;gap:6px;margin-bottom:8px}
.ref-link{flex:1;font-size:11px;padding:8px 10px;background:var(--bg);border:1px solid var(--brd2);border-radius:6px;color:var(--tx2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--fm)}
.ref-copy{padding:8px 14px;border-radius:6px;background:var(--ac);color:#fff;font-size:11px;font-weight:600;border:none;cursor:pointer;white-space:nowrap;font-family:var(--fb);transition:.15s}
.ref-copy:hover{opacity:.9}
.ref-stat{font-size:12px;color:var(--tx2)}.ref-stat strong{color:var(--ac);font-family:var(--fm)}

/* Account linking */
.link-hint{font-size:12px;color:var(--tx2);margin-bottom:10px;line-height:1.4}
.link-form{display:flex;flex-direction:column;gap:8px}
.link-input{width:100%;padding:10px 12px;background:var(--bg);border:1px solid var(--brd2);border-radius:8px;color:var(--tx);font-family:var(--fb);font-size:13px;outline:none;transition:.15s}
.link-input:focus{border-color:var(--ac)}
.link-input::placeholder{color:var(--tx3)}
.link-btn{padding:10px 16px;border-radius:8px;background:var(--ac);color:#fff;font-size:13px;font-weight:600;font-family:var(--fb);border:none;cursor:pointer;transition:.15s;text-align:center}
.link-btn:hover{opacity:.9}
.link-btn:disabled{opacity:.5;cursor:default}
.link-status{font-size:12px;padding:8px 12px;border-radius:8px;line-height:1.4}
.link-ok{color:#5cb85c;background:rgba(92,184,92,.08);border:1px solid rgba(92,184,92,.2)}

/* Welcome page improvements */
.w-section-label{font-size:12px;color:var(--tx3);margin-bottom:8px;width:100%;text-align:center}
.chips-wrap{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
.rec-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;width:100%}
.rec-card{background:var(--bg3);border:1px solid var(--brd2);border-radius:8px;padding:10px 12px;cursor:pointer;transition:.15s;text-align:left}
.rec-card:hover{border-color:var(--ac);background:var(--dim)}
.rec-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}
.rec-name{font-size:12px;font-weight:600;color:var(--tx)}
.rec-cr{font-size:10px;color:var(--ac);font-family:var(--fm)}
.rec-free{font-size:9px;color:#5cb85c;background:rgba(92,184,92,.1);padding:1px 6px;border-radius:4px;font-family:var(--fm)}
.rec-desc{font-size:11px;color:var(--tx3);margin:0;line-height:1.3}

/* VPN ad banner in sidebar */
.vpn-banner{margin:0 8px 8px;padding:10px 12px;background:var(--bg3);border:1px solid var(--brd2);border-radius:10px;display:flex;flex-direction:column;gap:8px}
.vpn-top{display:flex;align-items:center;gap:10px}
.vpn-logo{width:36px;height:36px;border-radius:8px;object-fit:cover;flex-shrink:0}
.vpn-text{flex:1;min-width:0}
.vpn-title{font-size:13px;font-weight:600;color:var(--tx)}
.vpn-sub{font-size:11px;color:var(--tx2);line-height:1.3}
.vpn-btn{display:block;text-align:center;padding:7px 12px;border-radius:8px;background:var(--ac);color:#fff;font-size:12px;font-weight:600;font-family:var(--fb);text-decoration:none;transition:.15s;cursor:pointer}
.vpn-btn:hover{opacity:.9}

/* ═══ MESSAGE AREA ═══ */
.ma{flex:1;overflow-y:auto;padding:0 16px}
.ml{max-width:960px;margin:0 auto;padding:24px 0}

/* Welcome */
.wel{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;animation:fadeIn .5s}
.w-glow{margin-bottom:24px;opacity:0;animation:reveal .8s ease .1s forwards;width:120px;height:120px;display:flex;align-items:center;justify-content:center;position:relative}
.w-i{width:100%;height:100%;object-fit:contain;display:block;filter:drop-shadow(0 0 30px rgba(212,145,92,.5)) drop-shadow(0 0 60px rgba(212,145,92,.2))}
.w-t{font-family:var(--fd);font-size:20px;font-weight:600;letter-spacing:-.03em;opacity:0;animation:reveal .8s ease .2s forwards;text-align:center;max-width:420px}
.w-sub{font-size:13px;color:var(--tx3);opacity:0;animation:reveal .8s ease .3s forwards;text-align:center;margin-bottom:4px}
.mode-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:28px auto 24px;width:100%;max-width:440px;opacity:0;animation:reveal .8s ease .4s forwards}
.mode-card{display:flex;flex-direction:column;align-items:center;gap:6px;padding:22px 14px 18px;border-radius:12px;background:var(--bg3);border:1px solid var(--brd2);transition:.2s;text-align:center}
.mode-card:hover{border-color:var(--ac);background:var(--dim)}
.mode-card.active{border-color:var(--ac);background:var(--dim);box-shadow:0 0 0 1px var(--ac)}
.mc-icon{font-size:28px;line-height:1}.mc-label{font-size:13px;font-weight:600;color:var(--tx)}.mc-desc{font-size:11px;color:var(--tx3);line-height:1.3}
.w-chips{display:flex;flex-direction:column;align-items:center;flex-wrap:wrap;gap:8px;max-width:540px;width:100%;opacity:0;animation:reveal .8s ease .6s forwards}
.w-recommended{opacity:0;animation:reveal .8s ease .8s forwards}
.chip{background:var(--bg3);border:1px solid var(--brd2);border-radius:8px;padding:8px 18px;font-size:12px;color:var(--tx2);transition:all .15s}.chip:hover{border-color:var(--ac);color:var(--tx);background:var(--dim)}

/* ═══ MESSAGE BUBBLES — left/right aligned with avatars ═══ */
.mr{margin-bottom:20px;animation:fadeIn .25s}
.mr-user{display:flex;justify-content:flex-end;gap:10px}
.mr-ai{display:flex;justify-content:flex-start;gap:10px}
.msg-av{width:32px;height:32px;border-radius:50%;flex-shrink:0;overflow:hidden;display:flex;align-items:center;justify-content:center;margin-top:2px}
.msg-av img{width:100%;height:100%;object-fit:cover}
.msg-av-user{background:linear-gradient(135deg,var(--ac),var(--ac3))}.msg-av-user span{font-weight:700;font-size:12px;color:#fff}
.msg-av-ai{background:var(--bg3);border:1px solid var(--brd2)}.msg-av-ai span{font-size:14px}
.mb{max-width:75%;border-radius:12px;padding:12px 16px;position:relative}
.mu{background:var(--user-bg);border:1px solid var(--user-brd)}
.ma-b{background:var(--bg3);border:1px solid var(--brd2)}
.mh{display:flex;align-items:center;gap:8px;margin-bottom:5px;font-size:11px;color:var(--tx2)}.mrl{font-weight:600;letter-spacing:.02em}
.cp{cursor:pointer;opacity:.4;transition:.15s;font-size:12px}.cp:hover{opacity:1;color:var(--ac)}
/* ═══ COPY BUTTONS — subtle glow ═══ */
.msg-col{display:flex;flex-direction:column;max-width:75%;min-width:0}
.msg-col .mb{max-width:100%}
.msg-actions{display:flex;justify-content:flex-start;gap:8px;margin-top:8px;padding-top:7px;border-top:1px solid var(--brd)}
.msg-action-btn{
    display:inline-flex;align-items:center;gap:6px;padding:5px 14px;border-radius:6px;
    background:transparent;
    border:1px solid var(--ac3);
    color:var(--ac);
    cursor:pointer;font-size:11px;font-weight:600;font-family:var(--fb);letter-spacing:.02em;
    transition:all .2s;
    box-shadow:0 0 4px rgba(212,145,92,.12)
}
.msg-action-btn:hover{
    border-color:var(--ac);
    box-shadow:0 0 10px rgba(212,145,92,.2);
    color:var(--ac2);background:rgba(212,145,92,.06)
}
.msg-action-btn.copied{
    border-color:var(--ac);
    box-shadow:0 0 12px rgba(212,145,92,.25);
    color:var(--ac2);background:rgba(212,145,92,.08)
}
.msg-action-btn svg{flex-shrink:0}
.mc{font-size:14px;line-height:1.7;color:var(--ctx);word-wrap:break-word;overflow-wrap:break-word}
/* Code blocks with copy button */
.code-block{position:relative;margin:8px 0;border-radius:8px;overflow:hidden;background:var(--code-bg, var(--bg))}
.code-head{display:flex;align-items:center;justify-content:space-between;padding:6px 12px;background:var(--code-head, rgba(255,255,255,.03))}
.code-lang{font-family:var(--fm);font-size:11px;color:var(--ac2);font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.code-cp{
    display:inline-flex;align-items:center;gap:5px;padding:3px 12px;border-radius:5px;
    background:transparent;border:1px solid var(--ac3);color:var(--ac);
    cursor:pointer;font-size:11px;font-weight:600;font-family:var(--fb);letter-spacing:.02em;
    transition:all .2s;box-shadow:0 0 4px rgba(212,145,92,.1)
}
.code-cp:hover{border-color:var(--ac);box-shadow:0 0 8px rgba(212,145,92,.18);color:var(--ac2);background:rgba(212,145,92,.06)}
.code-cp.copied{border-color:var(--ac);box-shadow:0 0 10px rgba(212,145,92,.22);color:var(--ac2);background:rgba(212,145,92,.08)}
.code-cp svg{flex-shrink:0}
.code-block pre{margin:0;border:none;border-radius:0;padding:14px;overflow-x:auto;font-family:var(--fm);font-size:12px;color:var(--ctx);line-height:1.6;background:transparent}
.mc pre{background:var(--code-bg, var(--bg));border-radius:8px;padding:14px;margin:8px 0;overflow-x:auto;font-family:var(--fm);font-size:12px;color:var(--ctx);line-height:1.6}
.mc code:not(pre code){background:var(--dim);border:1px solid var(--brd2);border-radius:4px;padding:1px 6px;font-family:var(--fm);font-size:.85em;color:var(--ac2)}
.mc h1,.mc h2,.mc h3{color:var(--hc);margin:12px 0 6px;font-weight:600}.mc strong{color:var(--hc)}.mc p{margin:0 0 6px}.mc ul,.mc ol{margin:6px 0 6px 18px}
.mc a.mc-link{color:var(--ac);text-decoration:underline;text-underline-offset:2px;text-decoration-color:var(--ac3);transition:all .15s;word-break:break-all}.mc a.mc-link:hover{color:var(--ac2);text-decoration-color:var(--ac)}
.mc .katex{font-size:1em}.mc .katex-display{margin:8px 0;overflow-x:auto;overflow-y:hidden}

/* Typing indicator */
.typing{display:inline-flex;align-items:center;gap:4px;padding:4px 0}
.typing span{width:6px;height:6px;border-radius:50%;background:var(--ac);opacity:.3;animation:dot 1.4s ease-in-out infinite}
.typing span:nth-child(2){animation-delay:.2s}.typing span:nth-child(3){animation-delay:.4s}
@keyframes dot{0%,80%,100%{opacity:.3;transform:scale(1)}40%{opacity:1;transform:scale(1.2)}}

/* Images */
.msg-imgs{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0;position:relative}.msg-imgs img{max-width:100%;max-height:480px;border-radius:10px;border:1px solid var(--brd2);object-fit:contain;cursor:pointer;transition:.15s}.msg-imgs img:hover{border-color:var(--ac)}

/* Image Lightbox */
.img-lightbox{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.85);backdrop-filter:blur(8px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;opacity:0;pointer-events:none;transition:opacity .2s}
.img-lightbox.show{opacity:1;pointer-events:auto}
.img-lightbox img{max-width:90vw;max-height:78vh;border-radius:10px;object-fit:contain;box-shadow:0 8px 40px rgba(0,0,0,.5)}
.lb-close{position:absolute;top:16px;right:16px;width:40px;height:40px;border-radius:10px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15);display:flex;align-items:center;justify-content:center;color:#fff;font-size:18px;cursor:pointer;transition:.15s;z-index:1}.lb-close:hover{background:rgba(255,255,255,.2)}
.lb-actions{display:flex;gap:10px}
.lb-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 18px;border-radius:8px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);color:#fff;cursor:pointer;font-size:13px;font-weight:600;font-family:var(--fb);text-decoration:none;transition:.15s}.lb-btn:hover{background:rgba(255,255,255,.15);border-color:var(--ac);color:var(--ac2)}
.lb-btn svg{flex-shrink:0}

/* Attachments */
.att{padding:4px 16px;border-top:1px solid var(--brd);background:var(--bg3);flex-shrink:0}
.attl{max-width:960px;margin:0 auto;display:flex;gap:6px;overflow-x:auto;padding:4px 0;align-items:center}
.atth{position:relative;width:56px;height:56px;border-radius:8px;overflow:hidden;border:1px solid var(--brd2);flex-shrink:0}.atth img{width:100%;height:100%;object-fit:cover}
.attr{position:absolute;top:2px;right:2px;width:18px;height:18px;border-radius:50%;background:rgba(0,0,0,.7);color:#fff;display:flex;align-items:center;justify-content:center;font-size:10px;cursor:pointer}
.att-counter{font-size:11px;font-family:var(--fm);font-weight:600;color:var(--tx2);padding:0 8px;white-space:nowrap;flex-shrink:0}

/* Toast notification */
.toast{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%) scale(.95);background:var(--bg3);border:1px solid var(--ac3);color:var(--tx);padding:14px 28px;border-radius:12px;font-size:13px;font-weight:500;font-family:var(--fb);z-index:300;opacity:0;pointer-events:none;transition:all .3s;box-shadow:0 8px 32px rgba(0,0,0,.5);text-align:center;max-width:90vw}
.toast.show{opacity:1;transform:translate(-50%,-50%) scale(1);pointer-events:auto}

/* ═══ INPUT AREA — aligned with chat bubbles ═══ */
.ina{padding:0 16px 16px;background:var(--bg);flex-shrink:0}
.inw{display:flex;align-items:center;gap:8px;max-width:960px;margin:0 auto;background:var(--bg4);border:1px solid var(--brd2);border-radius:12px;padding:8px 14px;transition:border-color .2s;box-shadow:inset 0 1px 3px rgba(0,0,0,.15)}.inw:focus-within{border-color:var(--ac)}
.btn-att{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:var(--tx3);transition:all .15s;flex-shrink:0}.btn-att:hover{color:var(--ac);background:var(--dim)}
#inp{flex:1;background:none;border:none;outline:none;color:var(--tx);font-family:var(--fb);font-size:14px;line-height:1.5;resize:none;max-height:140px;min-height:22px}#inp::placeholder{color:var(--tx3)}
.bsend,.bstop{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .2s}
.bsend{background:var(--dim);color:var(--tx3)}.bsend.active{background:var(--ac);color:#fff;box-shadow:0 2px 12px rgba(212,145,92,.3)}
.bstop{background:var(--ac3);color:#fff}
.inf{display:flex;justify-content:space-between;max-width:960px;margin:4px auto 0;font-size:10px;color:var(--tx3)}

/* ═══ MODALS ═══ */
.modal-ov{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.6);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;animation:fadeIn .15s}
.modal-box{background:var(--bg3);border:1px solid var(--brd2);border-radius:16px;width:90%;max-width:460px;padding:28px;position:relative;animation:slideUp .2s;max-height:90vh;overflow-y:auto}
.modal-wide{max-width:680px}

/* Templates modal */
.templates-grid{display:flex;flex-direction:column;gap:14px}
.tpl-cat-label{font-size:11px;color:var(--tx2);text-transform:uppercase;letter-spacing:.08em;font-weight:600;margin-top:4px}
.tpl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px}
.tpl-card{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:12px;border-radius:10px;background:var(--bg);border:1px solid var(--brd2);cursor:pointer;transition:.15s;text-align:left}
.tpl-card:hover{border-color:var(--ac);background:var(--dim);transform:translateY(-1px)}
.tpl-icon{font-size:20px;line-height:1}
.tpl-title{font-size:12px;font-weight:600;color:var(--tx);line-height:1.3}

/* Compare mode */
.ml.compare-mode{max-width:960px}
.cmp-header{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:14px;margin-bottom:16px;padding:14px;background:var(--bg3);border:1px solid var(--brd2);border-radius:10px}
.cmp-col{min-width:0}
.cmp-col label{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--tx2);margin-bottom:6px;font-weight:600}
.cmp-col select{width:100%;padding:10px 12px;background:var(--bg);border:1px solid var(--brd2);border-radius:10px;color:var(--tx);font-family:var(--fb);font-size:13px;font-weight:500;outline:none;cursor:pointer;transition:.15s;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%237d756b' stroke-width='3' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:32px}
.cmp-col select:focus,.cmp-col select:hover{border-color:var(--ac);box-shadow:0 0 0 1px var(--ac)}
.cmp-col select option{background:var(--bg3);color:var(--tx);padding:8px 12px;font-size:13px;font-family:var(--fb)}
.cmp-vs{font-family:var(--fd);font-weight:800;font-size:14px;color:var(--ac);display:flex;align-items:center;justify-content:center;padding:0 6px;flex-shrink:0;margin-top:18px;height:36px}
.cmp-results{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;align-items:start}
.cmp-side{background:var(--bg3);border:1px solid var(--brd2);border-radius:12px;padding:14px;min-height:200px;display:flex;flex-direction:column;min-width:0;overflow:hidden}
.cmp-head{font-size:13px;font-weight:600;color:var(--hc);margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid var(--brd);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmp-body{flex:1;font-size:13px;line-height:1.6;color:var(--ctx);word-wrap:break-word;overflow-wrap:break-word;min-width:0}
.cmp-prompt{font-size:11px;color:var(--tx3);padding:8px 10px;background:var(--user-bg);border:1px solid var(--user-brd);border-radius:6px;margin-bottom:10px;font-style:italic;word-wrap:break-word;overflow-wrap:break-word}
.cmp-answer{font-size:13px;line-height:1.65;color:var(--ctx);word-wrap:break-word;overflow-wrap:break-word;min-width:0}
.cmp-answer p{margin-bottom:6px}
.cmp-answer pre{background:var(--code-bg);padding:10px;border-radius:6px;overflow-x:auto;font-size:11px;margin:6px 0;max-width:100%}
.cmp-answer code{background:var(--dim);padding:1px 4px;border-radius:3px;font-family:var(--fm);font-size:.85em;color:var(--ac2);word-break:break-word}
.cmp-answer .code-block{max-width:100%;overflow-x:auto}
.cmp-answer h1,.cmp-answer h2,.cmp-answer h3{font-size:13px;margin:8px 0 4px;color:var(--hc)}
.cmp-answer ul,.cmp-answer ol{margin:4px 0 4px 16px;padding-left:0}
.modal-close{position:absolute;top:12px;right:12px;width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:var(--tx3);font-size:16px;cursor:pointer;transition:.15s}.modal-close:hover{background:var(--dim);color:var(--tx)}
.modal-title{font-family:var(--fd);font-size:18px;font-weight:700;margin-bottom:4px}
.modal-sub{font-size:12px;color:var(--tx2);margin-bottom:20px}
.profile-avatar-wrap{display:flex;align-items:center;gap:16px;margin-bottom:20px}
.profile-av{width:68px;height:68px;border-radius:50%;background:linear-gradient(135deg,var(--ac),var(--ac3));display:flex;align-items:center;justify-content:center;flex-shrink:0;cursor:pointer;overflow:hidden;border:2px solid var(--brd2);transition:.2s}.profile-av:hover{border-color:var(--ac)}
.profile-av span{font-weight:800;font-size:24px;color:#fff}.profile-av img{width:100%;height:100%;object-fit:cover}
.profile-field{margin-bottom:14px}
.profile-field label{display:block;font-size:11px;color:var(--tx2);margin-bottom:5px;font-weight:600;text-transform:uppercase;letter-spacing:.06em}
.profile-field input{width:100%;padding:10px 12px;background:var(--bg);border:1px solid var(--brd2);border-radius:8px;color:var(--tx);font-family:var(--fb);font-size:13px;outline:none;transition:.15s}.profile-field input:focus{border-color:var(--ac)}
.profile-stat{display:flex;justify-content:space-between;padding:8px 0;font-size:12px;border-bottom:1px solid var(--brd)}.profile-stat:last-child{border-bottom:none}
.profile-stat .label{color:var(--tx2)}.profile-stat .val{font-family:var(--fm);font-weight:600;color:var(--tx)}
.profile-save{width:100%;padding:12px;border-radius:10px;background:var(--ac);color:#fff;font-weight:600;font-size:13px;border:none;cursor:pointer;margin-top:14px;transition:.15s;font-family:var(--fb)}.profile-save:hover{opacity:.9}
.credits-balance{text-align:center;margin-bottom:20px}
.credits-amount{font-family:var(--fm);font-size:32px;font-weight:800;color:var(--ac)}
.credits-label{font-size:12px;color:var(--tx2);margin-top:2px}
.free-usage-bar{margin-top:8px;padding:8px 12px;background:var(--dim);border:1px solid var(--brd2);border-radius:8px;text-align:center}
.free-bar-label{font-size:11px;color:var(--tx2);margin-bottom:4px}
.free-bar-track{height:6px;background:var(--bg);border-radius:3px;overflow:hidden;margin-bottom:4px}
.free-bar-fill{height:100%;background:linear-gradient(90deg,#5cb85c,var(--ac));border-radius:3px;transition:width .3s}
.free-bar-count{font-size:11px;font-family:var(--fm);color:var(--tx2)}
.tier-grid{display:grid;grid-template-columns:1fr;gap:10px;margin-bottom:16px}
.tier-card{padding:14px 16px 14px 16px;padding-right:38px;border-radius:12px;background:var(--bg);border:1px solid var(--brd2);cursor:pointer;transition:.2s;display:flex;align-items:center;gap:16px;position:relative;overflow:hidden}
.tier-card:hover{border-color:var(--ac);background:var(--dim);transform:translateX(2px)}
.tier-card.popular{border-color:var(--ac);box-shadow:0 0 0 1px var(--ac)}
.tier-card.popular::before{content:'⭐ ХИТ';position:absolute;top:8px;right:8px;background:var(--ac);color:#fff;font-size:9px;font-weight:700;padding:2px 8px;border-radius:10px;font-family:var(--fm);letter-spacing:.03em}
.tier-card::after{display:none}
.tier-check{position:absolute;bottom:10px;right:10px;width:20px;height:20px;border-radius:50%;background:var(--bg);border:1.5px solid var(--brd2);display:flex;align-items:center;justify-content:center;color:transparent;transition:.2s;flex-shrink:0}
.tier-card.selected{border-color:var(--ac);background:var(--dim);box-shadow:0 0 0 2px var(--ac),0 4px 16px rgba(212,145,92,.18)}
.tier-card.selected .tier-check{background:var(--ac);border-color:var(--ac);color:#fff}
.pm-section{margin:16px 0 4px}
.pm-label{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--tx2);margin-bottom:10px;font-weight:600}
.pm-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pm-card{position:relative;display:flex;align-items:center;gap:12px;padding:14px;background:var(--bg);border:2px solid var(--brd2);border-radius:12px;cursor:pointer;transition:.18s;text-align:left;font-family:var(--fb);color:var(--tx)}
.pm-card:hover{border-color:var(--brd);background:var(--dim)}
.pm-card.selected{border-color:var(--ac);background:rgba(212,145,92,.08);box-shadow:0 0 0 3px rgba(212,145,92,.12),0 4px 16px rgba(212,145,92,.15)}
.pm-icon-box{width:40px;height:40px;border-radius:10px;background:var(--bg3);color:var(--tx2);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:.18s}
.pm-card.selected .pm-icon-box{background:var(--ac);color:#fff;box-shadow:0 2px 10px rgba(212,145,92,.3)}
.pm-text{flex:1;min-width:0;padding-right:18px}
.pm-name{font-size:14px;font-weight:600;color:var(--tx);line-height:1.2}
.pm-sub{font-size:11px;color:var(--tx3);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pm-radio{position:absolute;top:10px;right:10px;width:18px;height:18px;border-radius:50%;background:var(--bg);border:1.5px solid var(--brd2);display:flex;align-items:center;justify-content:center;color:transparent;transition:.18s}
.pm-card.selected .pm-radio{background:var(--ac);border-color:var(--ac);color:#fff}
.buy-confirm-btn{width:100%;margin-top:14px;padding:14px 16px;background:var(--ac);color:#fff;border:none;border-radius:12px;font-family:var(--fb);font-size:14px;font-weight:600;cursor:pointer;transition:.2s;box-shadow:0 4px 16px rgba(212,145,92,.3);letter-spacing:.01em;display:flex;align-items:center;justify-content:center;gap:8px}
.buy-confirm-btn:hover{transform:translateY(-1px);box-shadow:0 6px 22px rgba(212,145,92,.45);filter:brightness(1.08)}
.buy-confirm-btn:hover .buy-btn-arrow{transform:translateX(2px)}
.buy-confirm-btn:active{transform:translateY(0)}
.buy-confirm-btn:disabled{background:var(--dim);color:var(--tx3);cursor:not-allowed;box-shadow:none;transform:none;filter:none}
.buy-btn-arrow{flex-shrink:0;transition:transform .2s}
.tier-price{font-family:var(--fd);font-size:22px;font-weight:800;color:var(--ac);min-width:80px;text-align:center;flex-shrink:0}
.tier-info{flex:1;display:flex;flex-direction:column;gap:3px;min-width:0}
.tier-credits{font-size:14px;font-weight:600;color:var(--tx)}
.tier-bonus{font-size:11px;color:#5cb85c;font-weight:600;background:rgba(92,184,92,.1);padding:2px 8px;border-radius:4px;font-family:var(--fm);align-self:flex-start}
.tier-desc{font-size:11px;color:var(--tx3);line-height:1.3}
.theme-section{margin-top:16px;padding-top:14px;border-top:1px solid var(--brd)}
.theme-section h4,.lang-section h4{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--tx2);margin-bottom:8px;font-weight:600}
.lang-section{margin-top:12px}
.tp{display:flex;gap:8px}.td{width:28px;height:28px;border-radius:50%;border:2px solid transparent;cursor:pointer;transition:.15s}.td:hover{transform:scale(1.1)}
.td-ember{background:#d4915c}.td-sand{background:#b8904c}.td-mono{background:#fff;border:1px solid #333}
[data-theme="ember"] .td-ember,[data-theme="sand"] .td-sand,[data-theme="mono"] .td-mono{border-color:var(--tx)}
.lp{display:flex;gap:5px}.lb{padding:5px 14px;border-radius:6px;font-size:11px;font-weight:600;background:var(--dim);border:1px solid var(--brd2);color:var(--tx2);transition:.15s}.lb.active{background:var(--ac);color:#fff;border-color:var(--ac)}

/* ═══ ANIMATIONS ═══ */
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes slideUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes reveal{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

/* ═══ OVERLAY ═══ */
.sb-ov{display:none}

/* ═══ MOBILE ═══ */
@media(max-width:768px){
    body{overscroll-behavior:none}
    .sb-ov{display:block;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:45;opacity:0;pointer-events:none;transition:opacity .25s}.sb-ov.show{opacity:1;pointer-events:auto}
    .sb{position:fixed;left:0;top:0;bottom:0;z-index:50;width:82vw;max-width:320px;min-width:0;box-shadow:4px 0 32px rgba(0,0,0,.6);transition:transform .3s cubic-bezier(.4,0,.2,1);will-change:transform}
    .sb-inner{width:82vw;max-width:320px;min-width:280px}
    .sb.collapsed{transform:translateX(-105%);box-shadow:none;pointer-events:none}
    .sb:not(.collapsed){transform:translateX(0)}
    .bi-cls{display:flex;width:36px;height:36px}
    .mb{max-width:85%}
    .mc{font-size:15px}
    .w-t{font-size:18px}
    .mode-grid{max-width:320px;gap:8px}
    .mc-icon{font-size:22px}.mc-desc{display:none}
    .bar{padding:8px 12px;gap:8px}
    .msel,.mlk{padding:5px 10px;font-size:12px}
    .ctx{display:none!important}
    .mdd{left:12px;right:12px;min-width:auto;top:48px;max-width:none}
    .ina{padding:0 8px 10px}
    .inw{padding:6px 10px;gap:6px}
    #inp{font-size:16px}
    .bsend,.bstop{width:40px;height:40px}
    .inf span:last-child{display:none}
    .ma{padding:0 8px}
    .msg-imgs img{max-height:300px}
    .pp{left:6px;right:6px}
    .modal-box{padding:22px 16px}
    .msg-av{width:28px;height:28px}
    .rec-grid{grid-template-columns:1fr}
    .cmp-results{grid-template-columns:1fr}
    .cmp-header{grid-template-columns:1fr;gap:8px}
    .cmp-vs{display:none}
    .tpl-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:380px){.sb{width:100vw;max-width:100vw}.sb-inner{width:100vw;max-width:100vw}}
@supports(padding:max(0px)){.ina{padding-bottom:max(10px,env(safe-area-inset-bottom))}.sb{padding-top:max(0px,env(safe-area-inset-top))}.bar{padding-top:max(8px,env(safe-area-inset-top))}}
