@font-face{font-family:'Vazirmatn';src:url('/fonts/Vazirmatn-Regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Vazirmatn';src:url('/fonts/Vazirmatn-Medium.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Vazirmatn';src:url('/fonts/Vazirmatn-Bold.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Vazirmatn';src:url('/fonts/Vazirmatn-Black.woff2') format('woff2');font-weight:900;font-style:normal;font-display:swap}
:root{
  --bg:#050505; --panel:rgba(255,255,255,.04); --panel2:rgba(255,255,255,.07);
  --line:rgba(255,255,255,.12); --txt:#f5f5f5; --muted:#a3a3a3;
  --glow:rgba(255,255,255,.55); --accent:#ffffff;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--txt);font-family:'Vazirmatn','Segoe UI',Tahoma,system-ui,sans-serif;min-height:100vh;overflow-x:hidden}
button,input,textarea,select{font-family:'Vazirmatn',Tahoma,sans-serif}
.hidden{display:none!important}
.muted{color:var(--muted);font-size:.88rem;line-height:1.7}
.center{text-align:center}
b,strong{font-weight:700}

/* background fx */
.bg-orbs{position:fixed;inset:0;z-index:-1;overflow:hidden;background:radial-gradient(1200px 600px at 80% -10%,#1c1c1e 0%,#050505 55%)}
.orb{position:absolute;border-radius:50%;filter:blur(90px);opacity:.5;animation:float 14s ease-in-out infinite}
.orb1{width:480px;height:480px;background:#3f3f46;top:-140px;left:-100px}
.orb2{width:380px;height:380px;background:#27272a;bottom:-120px;right:8%;animation-delay:-6s}
.orb3{width:240px;height:240px;background:#52525b;top:42%;left:55%;opacity:.28;animation-delay:-3s}
@keyframes float{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-36px) scale(1.06)}}
.grid-overlay{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:56px 56px;mask-image:radial-gradient(ellipse 90% 60% at 50% 0%,#000 30%,transparent 75%)}

.glass{background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(14px);border-radius:18px}
.shine{background:linear-gradient(110deg,#fff 20%,#8e8e93 40%,#fff 60%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shine 4.5s linear infinite}
@keyframes shine{to{background-position:-200% 0}}

/* buttons */
.btn{border:1px solid var(--line);background:transparent;color:var(--txt);padding:.55rem 1.15rem;border-radius:12px;cursor:pointer;font-family:inherit;font-size:.95rem;transition:.22s}
.btn:hover{border-color:rgba(255,255,255,.45);transform:translateY(-1px)}
.btn.primary{background:#fff;color:#000;border-color:#fff;font-weight:700}
.btn.primary:hover{background:#e4e4e7}
.btn.glow{box-shadow:0 0 22px rgba(255,255,255,.28),0 0 60px rgba(255,255,255,.10)}
.btn.glow:hover{box-shadow:0 0 34px rgba(255,255,255,.45),0 0 90px rgba(255,255,255,.16)}
.btn.big{padding:.85rem 1.9rem;font-size:1.05rem;border-radius:14px}
.btn.small{padding:.38rem .8rem;font-size:.85rem;border-radius:10px}
.btn.block{width:100%}
.btn.danger{background:#2a0d0d;border-color:#7f1d1d;color:#fca5a5}
.btn.danger:hover{border-color:#ef4444}
.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}
.select{background:#111;border:1px solid var(--line);color:var(--txt);border-radius:10px;padding:.5rem .7rem;width:100%;font-family:inherit}
input,textarea,select{outline:none}
input,textarea{background:rgba(0,0,0,.45)!important;border:1px solid var(--line);color:var(--txt);border-radius:10px;padding:.6rem .8rem;width:100%;font-family:inherit;font-size:.95rem;transition:.2s}
input:focus,textarea:focus{border-color:rgba(255,255,255,.6);box-shadow:0 0 0 3px rgba(255,255,255,.12)}
label{display:block;font-size:.88rem;color:#d4d4d8;margin:.55rem 0}
label input,label textarea{margin-top:.35rem}
label.check{display:flex;align-items:center;gap:.5rem;cursor:pointer}
label.check input{width:auto}
.form-err{color:#f87171;font-size:.88rem;min-height:1.1em;margin-top:.5rem}
.form-ok{color:#4ade80;font-size:.88rem;min-height:1.1em;margin-top:.5rem}
.form-row{display:flex;gap:.8rem;flex-wrap:wrap}
.form-row>label{flex:1;min-width:180px}

/* nav + landing */
.nav{display:flex;align-items:center;justify-content:space-between;padding:1.1rem 4vw;position:sticky;top:0;z-index:5;background:rgba(5,5,5,.55);backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.06)}
.logo{font-weight:800;font-size:1.3rem;letter-spacing:.3px;display:flex;align-items:center;gap:.5rem}
.logo-mark{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:11px;background:#fff;color:#000;font-size:1.25rem;box-shadow:0 0 24px var(--glow)}
.big-logo{font-size:1.7rem;justify-content:center;margin-bottom:1rem}
.nav-links{display:flex;gap:1.8rem}
.nav-links a{color:var(--muted);text-decoration:none;font-size:.95rem;transition:.2s}
.nav-links a:hover{color:#fff}
.nav-actions{display:flex;gap:.6rem}
.hero{text-align:center;padding:5.5rem 5vw 3.5rem;max-width:1000px;margin:auto}
.hero-badge{display:inline-block;border:1px solid var(--line);border-radius:99px;padding:.35rem 1rem;font-size:.85rem;color:#d4d4d8;background:rgba(255,255,255,.04);box-shadow:0 0 30px rgba(255,255,255,.08)}
.hero-title{font-size:clamp(2.2rem,6vw,4rem);line-height:1.25;margin:1.4rem 0 .8rem;font-weight:900}
.hero-sub{color:var(--muted);font-size:1.15rem;margin-bottom:2rem}
.hero-cta{display:flex;gap:.8rem;justify-content:center;flex-wrap:wrap}
.hero-stats{display:flex;gap:3rem;justify-content:center;margin:2.6rem 0;flex-wrap:wrap}
.hero-stats div{display:flex;flex-direction:column}
.hero-stats b{font-size:1.7rem}
.hero-stats span{color:var(--muted);font-size:.85rem}
.hero-chat-mock{max-width:560px;margin:1rem auto 0;padding:1rem;text-align:right;box-shadow:0 30px 80px rgba(0,0,0,.6),0 0 60px rgba(255,255,255,.06)}
.mock-head{display:flex;align-items:center;gap:.4rem;border-bottom:1px solid var(--line);padding-bottom:.6rem;margin-bottom:.8rem}
.mock-head em{margin-right:auto;color:var(--muted);font-style:normal;font-size:.85rem}
.dot{width:11px;height:11px;border-radius:50%;background:#3f3f46}
.mock-msg{padding:.7rem 1rem;border-radius:14px;margin:.5rem 0;line-height:1.8;width:fit-content;max-width:90%}
.mock-msg.user{background:#fff;color:#000;margin-inline-start:auto}
.mock-msg.bot{background:rgba(255,255,255,.08);border:1px solid var(--line)}
.cursor{display:inline-block;width:8px;height:1.05em;background:#fff;vertical-align:text-bottom;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.section{padding:4rem 5vw;max-width:1150px;margin:auto}
.section-title{text-align:center;font-size:2rem;margin-bottom:2.2rem;font-weight:800}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.1rem}
.card{padding:1.6rem;transition:.25s}
.card:hover{transform:translateY(-4px);border-color:rgba(255,255,255,.35);box-shadow:0 18px 50px rgba(0,0,0,.5),0 0 40px rgba(255,255,255,.07)}
.card-ico{font-size:1.8rem;margin-bottom:.7rem}
.card h3{margin-bottom:.5rem}
.card p{color:var(--muted);line-height:1.9;font-size:.93rem}
.steps{display:flex;align-items:stretch;justify-content:center;gap:1rem;flex-wrap:wrap}
.step{padding:1.5rem;width:250px;text-align:center}
.step b{font-size:1.7rem;display:block;margin-bottom:.5rem}
.step p{color:var(--muted);line-height:1.9;font-size:.92rem}
.step-arrow{align-self:center;font-size:1.5rem;color:var(--muted)}
.footer{text-align:center;color:var(--muted);padding:2.5rem 1rem;border-top:1px solid rgba(255,255,255,.07);font-size:.9rem}

/* auth */
.auth-wrap{min-height:100vh;display:grid;place-items:center;padding:2rem 1rem;position:relative}
.back-home{position:absolute;top:1.2rem;right:4vw}
.auth-card{width:min(480px,94vw);padding:2.2rem}
.tabs{display:flex;gap:.4rem;background:rgba(0,0,0,.4);border:1px solid var(--line);border-radius:12px;padding:.3rem;margin-bottom:1.2rem}
.tab{flex:1;background:transparent;border:none;color:var(--muted);padding:.55rem;border-radius:9px;cursor:pointer;font-family:inherit;font-size:.92rem;transition:.2s}
.tab.active{background:#fff;color:#000;font-weight:700}
.auth-form .btn{margin-top:.8rem}

/* app layout */
#view-app{display:grid;grid-template-columns:300px 1fr;height:100vh}
.sidebar{border-radius:0;border-top:none;border-bottom:none;border-left:none;padding:1.1rem;display:flex;flex-direction:column;gap:.7rem;overflow:hidden}
.side-label{font-size:.78rem;color:var(--muted);margin-top:.4rem}
.conv-list{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:.35rem;padding-left:.2rem}
.conv-item{display:flex;align-items:center;gap:.5rem;padding:.55rem .7rem;border-radius:10px;border:1px solid transparent;cursor:pointer;font-size:.9rem;transition:.15s}
.conv-item:hover{background:rgba(255,255,255,.06)}
.conv-item.active{background:rgba(255,255,255,.1);border-color:var(--line)}
.conv-item .t{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.conv-item .del{opacity:0;background:none;border:none;color:#f87171;cursor:pointer;font-size:.95rem}
.conv-item:hover .del{opacity:1}
.side-footer{border-top:1px solid var(--line);padding-top:.8rem;display:flex;flex-direction:column;gap:.6rem}
.user-chip{display:flex;align-items:center;gap:.6rem}
.avatar{width:38px;height:38px;border-radius:50%;background:#fff;color:#000;display:grid;place-items:center;font-weight:800}
.user-chip small{display:block;color:var(--muted);direction:ltr;text-align:right}
.side-btns{display:flex;gap:.4rem;flex-wrap:wrap}
.chat-main{display:flex;flex-direction:column;height:100vh;position:relative}
.announcement{background:linear-gradient(90deg,rgba(255,255,255,.14),rgba(255,255,255,.05));border-bottom:1px solid var(--line);padding:.55rem 1rem;text-align:center;font-size:.9rem}
.chat-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.8rem;padding:2rem;text-align:center}
.empty-logo{font-size:3.4rem;width:92px;height:92px;display:grid;place-items:center;background:#fff;color:#000;border-radius:26px;box-shadow:0 0 60px rgba(255,255,255,.35)}
.suggestions{display:flex;gap:.6rem;flex-wrap:wrap;justify-content:center;margin-top:1rem;max-width:720px}
.sugg{padding:.7rem 1rem;border-radius:14px;color:var(--txt);cursor:pointer;font-family:inherit;font-size:.92rem;transition:.2s}
.sugg:hover{border-color:rgba(255,255,255,.45);transform:translateY(-2px)}
.chat-messages{flex:1;overflow-y:auto;padding:1.6rem max(4vw,1rem);display:flex;flex-direction:column;gap:1.1rem}
.msg{display:flex;gap:.7rem;max-width:860px;width:100%;margin-inline:auto;animation:fadeUp .3s ease}
@keyframes fadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.msg .avatar{flex-shrink:0;width:32px;height:32px;font-size:.85rem}
.msg.user .avatar{background:#3f3f46;color:#fff}
.msg .bubble{line-height:2;font-size:.97rem;white-space:pre-wrap;word-break:break-word;padding-top:.2rem}
.msg .bubble p{margin:.3rem 0}
.msg .bubble pre{background:#0a0a0a;border:1px solid var(--line);border-radius:12px;padding:.9rem;overflow-x:auto;direction:ltr;text-align:left;margin:.6rem 0}
.msg .bubble code{background:rgba(255,255,255,.1);padding:.1rem .4rem;border-radius:6px;font-size:.88em;direction:ltr;unicode-bidi:embed}
.msg .bubble pre code{background:none;padding:0}
.msg .bubble ul{padding-inline-start:1.3rem}
.msg .bubble h1,.msg .bubble h2,.msg .bubble h3{margin:.6rem 0 .3rem}
.typing::after{content:'▍';animation:blink 1s steps(1) infinite}
.composer{display:flex;gap:.6rem;align-items:flex-end;margin:0 max(4vw,1rem) .4rem;padding:.6rem;border-radius:16px}
.composer textarea{resize:none;max-height:170px;border:none;background:transparent!important;box-shadow:none!important;padding:.55rem}
.composer-hint{text-align:center;color:var(--muted);font-size:.78rem;margin-bottom:.7rem}

/* modals */
.modal{position:fixed;inset:0;background:rgba(0,0,0,.72);backdrop-filter:blur(6px);display:grid;place-items:center;z-index:50;padding:1rem;overflow-y:auto}
.modal-card{width:min(560px,96vw);padding:1.7rem;max-height:94vh;overflow-y:auto;box-shadow:0 40px 100px rgba(0,0,0,.7),0 0 70px rgba(255,255,255,.05)}
.modal-card.wide{width:min(920px,97vw)}
.modal-card.xwide{width:min(1080px,98vw)}
.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}
.panel-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.1rem}
.p-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.8rem;grid-column:1/-1;margin-bottom:.4rem}
.p-stat{background:rgba(0,0,0,.4);border:1px solid var(--line);border-radius:14px;padding:1rem;text-align:center}
.p-stat b{font-size:1.5rem;display:block}
.p-stat span{color:var(--muted);font-size:.8rem}
.mini-form{background:rgba(0,0,0,.3);border:1px solid var(--line);border-radius:14px;padding:1.1rem}
.mini-form h4{margin-bottom:.5rem}
.danger-zone{border-color:rgba(127,29,29,.6)}
.token-box{display:flex;gap:.6rem;align-items:center;background:#000;border:1px dashed rgba(255,255,255,.4);border-radius:12px;padding:.9rem;margin:1rem 0;box-shadow:0 0 30px rgba(255,255,255,.08)}
.token-box code{flex:1;font-size:1.02rem;letter-spacing:1px;text-align:center;word-break:break-all}
.admintab{margin-top:1rem}
.table-wrap{overflow-x:auto}
.tbl{width:100%;border-collapse:collapse;font-size:.88rem}
.tbl th,.tbl td{border-bottom:1px solid var(--line);padding:.55rem .5rem;text-align:right;vertical-align:middle}
.tbl th{color:var(--muted);font-weight:600}
.tbl .row-btns{display:flex;gap:.3rem;flex-wrap:wrap}
.pill{display:inline-block;padding:.12rem .6rem;border-radius:99px;font-size:.75rem;border:1px solid var(--line)}
.pill.admin{background:#fff;color:#000;font-weight:700}
.pill.off{color:#f87171;border-color:#7f1d1d}
.pill.on{color:#4ade80;border-color:#14532d}
.model-card{background:rgba(0,0,0,.3);border:1px solid var(--line);border-radius:14px;padding:1rem;margin-bottom:.8rem}
.model-card .mc-head{display:flex;justify-content:space-between;align-items:center;gap:.6rem;flex-wrap:wrap}
.model-card .mc-meta{color:var(--muted);font-size:.82rem;line-height:1.9;word-break:break-all}
.model-form{margin-top:1.2rem}
.toast{position:fixed;bottom:1.4rem;left:50%;transform:translateX(-50%);background:#fff;color:#000;padding:.7rem 1.3rem;border-radius:12px;font-weight:600;z-index:99;box-shadow:0 10px 40px rgba(0,0,0,.5)}
.price-cards{display:flex;gap:1.1rem;justify-content:center;flex-wrap:wrap}
.price-card{width:320px;padding:2rem;text-align:center;position:relative}
.price-card.premium{border-color:rgba(255,255,255,.55);box-shadow:0 0 60px rgba(255,255,255,.13)}
.price-card .amount{font-size:2.3rem;font-weight:900;margin:.6rem 0}
.price-card .amount small{font-size:.95rem;color:var(--muted);font-weight:400}
.price-card ul{list-style:none;color:var(--muted);line-height:2.2;font-size:.93rem;margin:0 0 1.2rem}
.pill.premium{background:linear-gradient(110deg,#fff,#a1a1aa);color:#000;font-weight:800;border:none}
.sub-price{font-size:2rem;font-weight:900;text-align:center;margin:.6rem 0}
.attach-preview{display:flex;gap:.5rem;flex-wrap:wrap;margin:0 max(4vw,1rem) .5rem}
.att-chip{display:flex;align-items:center;gap:.5rem;background:rgba(255,255,255,.07);border:1px solid var(--line);border-radius:12px;padding:.35rem .6rem;font-size:.82rem}
.att-chip img{width:38px;height:38px;object-fit:cover;border-radius:8px}
.att-chip .rm{background:none;border:none;color:#f87171;cursor:pointer;font-size:1rem}
.msg .bubble .att-img{max-width:340px;width:100%;border-radius:14px;border:1px solid var(--line);margin:.4rem 0;display:block}
.msg .bubble .att-file{display:inline-flex;gap:.4rem;align-items:center;background:rgba(255,255,255,.07);border:1px solid var(--line);border-radius:10px;padding:.35rem .7rem;font-size:.83rem;margin:.3rem 0}

/* support desk (standalone) */
#view-supportdesk{height:100vh;height:100dvh;display:flex;flex-direction:column}
.desk-head{display:flex;align-items:center;gap:.8rem;padding:.8rem 1.2rem;border-bottom:1px solid var(--line);background:rgba(8,8,10,.8);flex-wrap:wrap}
.desk-head .logo{font-size:1.1rem}
.desk-grid{flex:1;display:grid;grid-template-columns:310px 1fr 280px;gap:1rem;padding:1rem;min-height:0}
.desk-list{padding:1rem;display:flex;flex-direction:column;gap:.7rem;min-height:0}
.desk-filters{display:flex;gap:.35rem;flex-wrap:wrap}
.desk-filter.active{background:#fff;color:#000;font-weight:700}
.desk-threads{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:.45rem}
.desk-thread{padding:.65rem .75rem;border:1px solid var(--line);border-radius:12px;cursor:pointer;background:rgba(0,0,0,.3);transition:.15s}
.desk-thread:hover{border-color:rgba(255,255,255,.4)}
.desk-thread.active{border-color:#fff;background:rgba(255,255,255,.09);box-shadow:0 0 24px rgba(255,255,255,.07)}
.desk-thread .lm{color:var(--muted);font-size:.8rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:.15rem}
.desk-chat{padding:1rem;display:flex;flex-direction:column;gap:.6rem;min-height:0}
.desk-chat-head{border-bottom:1px solid var(--line);padding-bottom:.55rem}
.desk-messages{flex:1;max-height:none;border:1px solid var(--line);border-radius:12px;background:rgba(0,0,0,.25);padding:.8rem}
.desk-quick{display:flex;gap:.4rem;flex-wrap:wrap}
.desk-composer input{padding:.75rem .9rem}
.desk-user{padding:1.1rem;height:fit-content}
.desk-user h3{margin-bottom:.4rem}
.desk-user .du-row{display:flex;justify-content:space-between;gap:.5rem;padding:.42rem 0;border-bottom:1px dashed rgba(255,255,255,.09);font-size:.9rem}
.desk-user .du-row span{color:var(--muted)}
.desk-user .btn{margin-top:.55rem}
@media(max-width:1100px){.desk-grid{grid-template-columns:280px 1fr}.desk-user{display:none}}
@media(max-width:820px){
  .desk-grid{grid-template-columns:minmax(0,1fr);padding:.6rem;gap:.6rem}
  .desk-grid>*{min-width:0}
  .desk-list{max-height:38dvh;min-width:0}
  .desk-chat{min-width:0}
  .desk-head{padding:.6rem .8rem}
  .desk-head .logo{font-size:.98rem}
  .desk-composer input{min-width:0;flex:1}
  .desk-thread .lm{max-width:100%}
}
#support-fab{position:fixed;bottom:1.3rem;inset-inline-start:1.3rem;z-index:60;width:58px;height:58px;border-radius:50%;border:1px solid rgba(255,255,255,.5);background:#fff;color:#000;font-size:1.5rem;cursor:pointer;box-shadow:0 0 30px rgba(255,255,255,.35),0 14px 34px rgba(0,0,0,.5);transition:.2s}
#support-fab:hover{transform:scale(1.07)}
.fab-badge{position:absolute;top:-4px;inset-inline-end:-4px;background:#ef4444;color:#fff;font-size:.72rem;min-width:20px;height:20px;border-radius:99px;display:grid;place-items:center;padding:0 5px;font-weight:700}
#support-panel{position:fixed;bottom:5.4rem;inset-inline-start:1.3rem;z-index:60;width:min(360px,92vw);padding:1rem;display:flex;flex-direction:column;gap:.6rem;background:rgba(12,12,14,.92);box-shadow:0 30px 70px rgba(0,0,0,.65),0 0 50px rgba(255,255,255,.06)}
.sup-head{display:flex;justify-content:space-between;align-items:center}
.sup-messages{display:flex;flex-direction:column;gap:.45rem;max-height:330px;overflow-y:auto;padding:.3rem}
.sup-msg{padding:.55rem .8rem;border-radius:13px;line-height:1.9;font-size:.9rem;max-width:88%;width:fit-content;white-space:pre-wrap;word-break:break-word}
.sup-msg.them{background:rgba(255,255,255,.09);border:1px solid var(--line);align-self:flex-start}
.sup-msg.mine{background:#fff;color:#000;align-self:flex-end}
.sup-msg small{display:block;opacity:.6;font-size:.7rem;margin-top:.15rem}
.sup-composer{display:flex;gap:.45rem}
.sup-composer input{flex:1}
.sup-admin{display:grid;grid-template-columns:280px 1fr;gap:1rem}
.sup-threads{display:flex;flex-direction:column;gap:.4rem;max-height:480px;overflow-y:auto}
.sup-thread{padding:.6rem .7rem;border:1px solid var(--line);border-radius:12px;cursor:pointer;background:rgba(0,0,0,.3)}
.sup-thread:hover,.sup-thread.active{border-color:rgba(255,255,255,.45)}
.sup-thread .lm{color:var(--muted);font-size:.8rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sup-chat{display:flex;flex-direction:column;gap:.5rem}
.sup-chat .sup-messages{max-height:380px;border:1px solid var(--line);border-radius:12px;background:rgba(0,0,0,.25)}
@media(max-width:820px){.sup-admin{grid-template-columns:1fr}}

/* ============ responsive & cross-device fixes ============ */
.glass{backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
#view-app{display:grid;grid-template-columns:300px 1fr;height:100vh;height:100dvh}
.auth-wrap{min-height:100vh;min-height:100dvh}
.chat-main{height:100vh;height:100dvh;min-width:0}
.msg .bubble{overflow-wrap:anywhere}
.tbl{min-width:660px}
.tabs{overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tab{white-space:nowrap}
.mobile-bar{display:none}
#sidebar-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:39;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}
.composer{padding-bottom:calc(.6rem + env(safe-area-inset-bottom, 0px))}
#support-fab{bottom:calc(1.3rem + env(safe-area-inset-bottom, 0px))}
img,video,canvas{max-width:100%}
.hero-chat-mock{width:100%}

@media(max-width:1100px){
  .modal-card.xwide{width:98vw;padding:1.2rem}
  .modal-card.wide{width:97vw}
  .sup-admin{grid-template-columns:230px 1fr}
}

@media(max-width:820px){
  #view-app{grid-template-columns:1fr}
  .sidebar{position:fixed;inset-inline-start:0;top:0;bottom:0;width:min(300px,86vw);z-index:40;transform:translateX(-110%);transition:transform .3s ease;background:rgba(9,9,11,.98);box-shadow:0 0 60px rgba(0,0,0,.6)}
  [dir=rtl] .sidebar{transform:translateX(110%)}
  .sidebar.open{transform:none!important}
  .mobile-bar{display:flex;align-items:center;gap:.6rem;padding:.55rem .8rem;border-bottom:1px solid var(--line);background:rgba(8,8,10,.85);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);position:sticky;top:0;z-index:30}
  .mobile-bar .logo{font-size:1.05rem}
  .mobile-bar .logo-mark{width:30px;height:30px;font-size:1rem;border-radius:9px}
  .nav-links{display:none}
  .nav{padding:.8rem 4vw}
  .nav .btn{padding:.45rem .8rem;font-size:.88rem}
  .hero{padding:3.2rem 5vw 2.4rem}
  .hero-stats{gap:1.6rem}
  .section{padding:2.6rem 5vw}
  .chat-messages{padding:1rem .8rem}
  .composer{margin:0 .6rem .3rem;padding:.5rem}
  .attach-preview{margin:0 .6rem .5rem}
  input,textarea,select{font-size:16px} /* prevents iOS Safari auto-zoom on focus */
  .modal{padding:.5rem;place-items:start center}
  .modal-card{padding:1.1rem;width:96vw;max-height:96dvh;border-radius:14px}
  .panel-grid{grid-template-columns:1fr}
  .form-row{flex-direction:column;gap:0}
  .form-row>label{min-width:0}
  .price-card{width:100%;max-width:360px}
  .step{width:100%;max-width:340px}
  .step-arrow{transform:rotate(-90deg)}
  .sup-threads{max-height:220px}
  #support-panel{inset-inline-start:.6rem;bottom:5.6rem;width:min(350px,94vw)}
  #support-fab{inset-inline-start:.8rem;width:52px;height:52px;font-size:1.3rem}
  .token-box{flex-direction:column;align-items:stretch;text-align:center}
  .auth-card{padding:1.4rem 1.1rem}
  .back-home{top:.7rem}
  .suggestions{gap:.45rem}
  .sugg{font-size:.85rem;padding:.55rem .8rem}
  .chat-empty{padding:1.2rem .8rem}
  .chat-empty h2{font-size:1.25rem}
  .empty-logo{width:70px;height:70px;font-size:2.5rem;border-radius:20px}
  .msg{gap:.5rem}
  .msg .bubble .att-img{max-width:78vw}
}

@media(max-width:400px){
  .hero-title{font-size:1.85rem}
  .hero-cta .btn{width:100%}
  .nav-actions .btn.ghost{display:none}
  .side-btns .btn{flex:1}
}

@media(hover:none){
  .card:hover{transform:none}
  .btn:hover{transform:none}
}

/* ============ rendered markdown in chat bubbles (v4 final) ============ */
.msg .bubble{white-space:normal;flex:1;min-width:0}
.chat-messages{overflow-x:hidden}
.bubble [dir=auto]{text-align:start;unicode-bidi:plaintext}
.bubble p{margin:.45rem 0;line-height:2.05}
.bubble p:first-child{margin-top:0}
.bubble p:last-child{margin-bottom:0}
.bubble h2{font-size:1.22rem;margin:.9rem 0 .4rem}
.bubble h3{font-size:1.08rem;margin:.8rem 0 .35rem}
.bubble h4{font-size:1rem;margin:.7rem 0 .3rem}
.bubble ul,.bubble ol{margin:.45rem 0;padding-inline-start:1.5rem;line-height:2}
.bubble li{margin:.15rem 0}
.bubble li::marker{color:#a1a1aa}
.bubble blockquote{border-inline-start:3px solid rgba(255,255,255,.55);background:rgba(255,255,255,.05);padding:.55rem .9rem;margin:.6rem 0;border-radius:0 10px 10px 0;line-height:2}
.bubble hr{border:none;border-top:1px solid var(--line);margin:.9rem 0}
.bubble a{color:#7dd3fc;text-decoration:underline;text-underline-offset:3px}
.bubble strong{color:#fff}
.bubble del{opacity:.65}
.codeblock{margin:.65rem 0;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#0a0a0b}
.cb-head{display:flex;justify-content:space-between;align-items:center;background:rgba(255,255,255,.06);padding:.32rem .7rem;font-size:.76rem;color:var(--muted);direction:ltr}
.copy-code{background:rgba(255,255,255,.08);border:1px solid var(--line);color:var(--txt);border-radius:7px;padding:.14rem .55rem;cursor:pointer;font-size:.74rem;font-family:inherit}
.copy-code:hover{border-color:rgba(255,255,255,.5)}
.codeblock pre{border:none!important;border-radius:0!important;margin:0!important;background:transparent!important}
.codeblock code{font-family:ui-monospace,'Cascadia Code',Consolas,monospace;font-size:.86rem;line-height:1.75}
.bubble code{font-family:ui-monospace,'Cascadia Code',Consolas,monospace}
.md-table-wrap{overflow-x:auto;margin:.65rem 0;border:1px solid var(--line);border-radius:12px}
.md-table{border-collapse:collapse;width:100%;font-size:.9rem}
.md-table th,.md-table td{overflow-wrap:anywhere}
.md-table th,.md-table td{border-bottom:1px solid var(--line);padding:.5rem .75rem;text-align:start}
.md-table thead th{background:rgba(255,255,255,.07);font-weight:700}
.md-table tbody tr:nth-child(even){background:rgba(255,255,255,.03)}
.md-table tbody tr:last-child td{border-bottom:none}
body.in-app #support-fab{display:none}
body.in-app #support-panel{bottom:1.2rem}
.icon-btn{display:inline-grid;place-items:center;padding:.55rem .6rem;flex-shrink:0}
