:root{
    --brand-1:#00d4a0;      /* mint */
    --brand-2:#ff7a45;      /* coral */
    --ink-900:#0c1116;
    --ink-800:#121a22;
    --ink-700:#18222c;
    --ink-600:#22303c;
    --line:rgba(255,255,255,.08);
    --bs-body-font-family:'Vazirmatn',system-ui,sans-serif;
  }
  [data-bs-theme="dark"]{
    --bs-body-bg:var(--ink-900);
    --bs-body-color:#e6edf3;
    --bs-border-color:var(--line);
    --bs-primary:var(--brand-1);
    --bs-emphasis-color:#fff;
  }
  [data-bs-theme="light"]{
    --ink-900:#f4f7f6; --ink-800:#ffffff; --ink-700:#ffffff; --ink-600:#eef2f1;
    --line:rgba(12,17,22,.10);
    --bs-body-bg:#f4f7f6; --bs-body-color:#16202a; --bs-border-color:var(--line);
  }
  body{font-family:var(--bs-body-font-family);background:var(--bs-body-bg);overflow-x:hidden}
  .btn-brand{background:linear-gradient(135deg,var(--brand-1),#00b489);border:0;color:#04120d;font-weight:700}
  .btn-brand:hover{color:#04120d;filter:brightness(1.07)}
  .btn-ghost{border:1px solid var(--line);color:var(--bs-body-color);background:transparent}
  .btn-ghost:hover{background:var(--ink-600);color:var(--bs-body-color)}
  .text-brand{color:var(--brand-1)!important}
  .surface{background:var(--ink-800);border:1px solid var(--line);border-radius:1.1rem}
  .surface-2{background:var(--ink-700);border:1px solid var(--line);border-radius:.9rem}
  .glow{position:fixed;inset-block-start:-180px;inset-inline-end:-120px;width:520px;height:520px;border-radius:50%;
        background:radial-gradient(circle,rgba(0,212,160,.20),transparent 65%);filter:blur(20px);pointer-events:none;z-index:0}
  .glow.b{inset-block-start:auto;inset-block-end:-220px;inset-inline-end:auto;inset-inline-start:-160px;
        background:radial-gradient(circle,rgba(255,122,69,.16),transparent 65%)}

  /* layout */
  .shell{display:flex;min-height:100vh;position:relative;z-index:1}
  .sidebar{width:264px;flex:0 0 264px;background:var(--ink-800);border-inline-start:1px solid var(--line);
           position:sticky;top:0;height:100vh;display:flex;flex-direction:column;padding:1rem}
  .main{flex:1;min-width:0;display:flex;flex-direction:column}
  .nav-item-link{display:flex;align-items:center;gap:.65rem;padding:.6rem .75rem;border-radius:.75rem;
      color:var(--bs-body-color);opacity:.78;text-decoration:none;font-size:.94rem;transition:.15s}
  .nav-item-link i{font-size:1.1rem;flex:0 0 auto}
  .nav-item-link:hover{background:var(--ink-600);opacity:1}
  .nav-item-link.active{background:linear-gradient(135deg,rgba(0,212,160,.18),rgba(0,212,160,.04));
      color:var(--brand-1);opacity:1;font-weight:700;box-shadow:inset 3px 0 0 var(--brand-1)}
  .topbar{position:sticky;top:0;z-index:5;background:color-mix(in oklab,var(--ink-900) 82%,transparent);
      backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
  @media (max-width:991.98px){ .sidebar{display:none} }

  .stat-ico{width:44px;height:44px;border-radius:.8rem;display:grid;place-items:center;font-size:1.2rem}
  .chip{border:1px solid var(--line);background:var(--ink-700);border-radius:999px;padding:.28rem .7rem;font-size:.8rem}
  .tool-card{transition:.18s;cursor:pointer}
  .tool-card:hover{transform:translateY(-4px);border-color:color-mix(in oklab,var(--brand-1) 45%,transparent)}
  .page{display:none} .page.active{display:block;animation:fade .25s ease}
  @keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

  /* chat */
  .chat-wrap{height:calc(100vh - 132px);display:flex;gap:1rem}
  .chat-side{width:250px;flex:0 0 250px;overflow:auto}
  .chat-main{flex:1;min-width:0;display:flex;flex-direction:column}
  .chat-scroll{flex:1;overflow:auto;padding:1rem}
  .bubble{max-width:82%;padding:.7rem 1rem;border-radius:1rem;font-size:.94rem;line-height:2}
  .bubble.me{background:linear-gradient(135deg,var(--brand-1),#00b489);color:#04120d;margin-inline-start:auto;border-end-end-radius:.25rem}
  .bubble.ai{background:var(--ink-700);border:1px solid var(--line);border-end-start-radius:.25rem}
  .typing span{display:inline-block;width:6px;height:6px;background:var(--brand-1);border-radius:50%;margin:0 2px;animation:bl 1s infinite}
  .typing span:nth-child(2){animation-delay:.15s}.typing span:nth-child(3){animation-delay:.3s}
  @keyframes bl{0%,60%,100%{opacity:.25}30%{opacity:1}}
  @media (max-width:991.98px){.chat-side{display:none}.chat-wrap{height:calc(100vh - 190px)}}

  .ph{aspect-ratio:1;border-radius:.9rem;background:linear-gradient(135deg,var(--ink-600),var(--ink-700));
      display:grid;place-items:center;border:1px solid var(--line);color:rgba(255,255,255,.25);font-size:1.6rem}
  .table>:not(caption)>*>*{background:transparent}
  .form-control,.form-select{background:var(--ink-700);border-color:var(--line);color:var(--bs-body-color)}
  .form-control:focus,.form-select:focus{background:var(--ink-700);color:var(--bs-body-color);
      border-color:var(--brand-1);box-shadow:0 0 0 .2rem rgba(0,212,160,.15)}
  ::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:var(--ink-600);border-radius:8px}
  .plan-pop{border:1.5px solid var(--brand-1)!important;position:relative}
  .plan-pop::after{content:'پیشنهاد ویژه';position:absolute;top:-12px;inset-inline-start:50%;transform:translateX(50%);
      background:var(--brand-1);color:#04120d;font-size:.72rem;font-weight:700;padding:.15rem .7rem;border-radius:999px}
  .bottom-nav{position:fixed;inset-inline:0;bottom:0;z-index:20;background:var(--ink-800);border-top:1px solid var(--line);
      display:none;justify-content:space-around;padding:.4rem}
  .bottom-nav a{color:var(--bs-body-color);opacity:.6;text-decoration:none;font-size:.68rem;text-align:center;padding:.25rem .5rem;border-radius:.6rem}
  .bottom-nav a i{display:block;font-size:1.15rem}
  .bottom-nav a.active{color:var(--brand-1);opacity:1}
  @media (max-width:991.98px){.bottom-nav{display:flex} .main{padding-bottom:64px}}