:root{
    --ink:#1E2A38;
    --ink-soft:#51606f;
    --paper:#ECE8DC;
    --paper-deep:#E1DBC8;
    --card:#F7F4EA;
    --line:#c9c0a6;
    --teal:#2F6F63;
    --teal-deep:#1f4c43;
    --rust:#B5502E;
    --rust-deep:#8f3c21;
    --gold:#C9A15A;
    --ok:#2F6F63;
    --err:#a53d2b;
    --shadow: 0 1px 0 rgba(30,42,56,0.06), 0 8px 24px -12px rgba(30,42,56,0.25);
  }
  *{box-sizing:border-box;}
  html,body{margin:0;padding:0;}
  body{
    background:
      radial-gradient(1200px 600px at 85% -10%, #f2eedf 0%, transparent 60%),
      var(--paper);
    color:var(--ink);
    font-family:'Vazirmatn', sans-serif;
    min-height:100vh;
    line-height:1.7;
  }
  .display{font-family:'Noto Naskh Arabic','Vazirmatn',serif;}
  .mono{font-family:'JetBrains Mono', monospace; direction:ltr; unicode-bidi: plaintext;}

  a{color:var(--teal-deep);}

  /* ===== Header / Hero ===== */
  header.hero{
    padding:56px 24px 40px;
    max-width:1180px;
    margin:0 auto;
    border-bottom:1px solid var(--line);
  }
  .eyebrow{
    display:flex; align-items:center; gap:10px;
    font-size:13px; letter-spacing:.04em; color:var(--ink-soft);
    margin-bottom:18px;
  }
  .eyebrow .dot{width:7px;height:7px;border-radius:50%;background:var(--rust);}
  h1.display{
    font-size:clamp(30px, 4.2vw, 48px);
    font-weight:700;
    margin:0 0 14px;
    color:var(--ink);
  }
  .hero p.lede{
    max-width:640px;
    color:var(--ink-soft);
    font-size:16px;
    margin:0 0 32px;
  }

  .search-card{
    background:var(--card);
    border:1px solid var(--line);
    border-radius:14px;
    box-shadow:var(--shadow);
    padding:24px;
  }
  .field-label{
    display:block; font-size:13px; font-weight:600; color:var(--ink-soft);
    margin-bottom:8px;
  }
  input[type=text], input[type=password], input[type=email], textarea{
    width:100%;
    border:1.5px solid var(--line);
    background:#fff;
    border-radius:9px;
    padding:13px 14px;
    font-family:inherit;
    font-size:15px;
    color:var(--ink);
    outline:none;
    transition:border-color .15s ease, box-shadow .15s ease;
  }
  input[type=text]:focus, input[type=password]:focus, input[type=email]:focus, textarea:focus{
    border-color:var(--teal);
    box-shadow:0 0 0 3px rgba(47,111,99,0.15);
  }
  textarea{resize:vertical; min-height:64px;}

  .row{display:flex; gap:14px; flex-wrap:wrap;}
  .row > *{flex:1 1 260px;}

  .btn{
    appearance:none; border:none; cursor:pointer;
    font-family:inherit; font-weight:600; font-size:14.5px;
    border-radius:9px; padding:12px 20px;
    display:inline-flex; align-items:center; gap:8px;
    transition:transform .1s ease, background .15s ease, opacity .15s ease;
  }
  .btn:active{transform:scale(0.97);}
  .btn-primary{background:var(--rust); color:#fff;}
  .btn-primary:hover{background:var(--rust-deep);}
  .btn-primary:disabled{opacity:.55; cursor:not-allowed;}
  .btn-ghost{background:transparent; color:var(--teal-deep); border:1.5px solid var(--teal);}
  .btn-ghost:hover{background:rgba(47,111,99,0.08);}
  .btn-small{padding:7px 12px; font-size:13px; border-radius:7px;}

  .actions-row{margin-top:18px; display:flex; gap:12px; align-items:center; flex-wrap:wrap;}

  /* ===== Keyword tags ===== */
  .keywords-wrap{margin-top:20px;}
  .tags{display:flex; flex-wrap:wrap; gap:8px; margin-top:10px;}
  .tag{
    background:var(--paper-deep);
    border:1px solid var(--line);
    color:var(--ink);
    border-radius:100px;
    padding:6px 8px 6px 14px;
    font-size:13.5px;
    display:flex; align-items:center; gap:8px;
  }
  .tag button{
    border:none; background:var(--ink); color:var(--paper);
    width:18px; height:18px; border-radius:50%; cursor:pointer;
    font-size:11px; line-height:1; display:flex; align-items:center; justify-content:center;
    flex-shrink:0;
  }
  .tag-add{
    display:flex; gap:8px; align-items:center; margin-top:10px;
  }
  .tag-add input{max-width:220px; padding:8px 12px; font-size:13.5px;}

  /* ===== Layout: results + sidebar ===== */
  .workspace{
    max-width:1180px; margin:0 auto; padding:36px 24px 100px;
    display:grid; grid-template-columns: 1fr 320px; gap:28px;
    align-items:start;
  }
  @media (max-width: 880px){
    .workspace{grid-template-columns: 1fr;}
  }

  .section-title{
    display:flex; align-items:baseline; justify-content:space-between; gap:12px;
    margin-bottom:16px;
  }
  .section-title h2{font-size:17px; margin:0; font-weight:700;}
  .section-title .count{font-size:13px; color:var(--ink-soft);}

  .status-line{
    display:flex; gap:16px; flex-wrap:wrap; margin-bottom:18px; font-size:12.5px;
  }
  .status-pill{
    display:inline-flex; align-items:center; gap:6px;
    padding:4px 10px; border-radius:100px; border:1px solid var(--line);
    background:var(--card);
  }
  .status-pill .led{width:7px;height:7px;border-radius:50%; background:#999;}
  .status-pill.ok .led{background:var(--ok);}
  .status-pill.err .led{background:var(--err);}
  .status-pill.pending .led{background:var(--gold); animation:pulse 1.1s infinite;}
  @keyframes pulse{0%,100%{opacity:1;}50%{opacity:.3;}}

  .empty-state{
    border:1.5px dashed var(--line);
    border-radius:12px;
    padding:44px 20px;
    text-align:center;
    color:var(--ink-soft);
    font-size:14px;
  }

  .spinner{
    width:30px; height:30px; border-radius:50%;
    border:3px solid var(--line); border-top-color:var(--rust);
    animation:spin .8s linear infinite;
    margin:0 auto 14px;
  }
  @keyframes spin{to{transform:rotate(360deg);}}

  /* result cards styled like catalog / index cards */
  .cards-grid{
    display:grid; grid-template-columns: repeat(auto-fill, minmax(280px,1fr));
    gap:16px;
  }
  .card{
    position:relative;
    background:var(--card);
    border:1px solid var(--line);
    border-radius:10px;
    padding:18px 18px 16px;
    box-shadow:var(--shadow);
    display:flex; flex-direction:column; gap:10px;
  }
  .card::before{
    content:"";
    position:absolute; inset-inline-start:0; top:14px; bottom:14px; width:3px;
    background:var(--teal);
    border-radius:0 3px 3px 0;
  }
  .card .stamp{
    position:absolute; top:-10px; inset-inline-end:14px;
    background:var(--gold); color:#fff;
    font-family:'JetBrains Mono',monospace;
    font-weight:600; font-size:12px;
    border-radius:100px;
    padding:5px 11px;
    box-shadow:0 3px 8px -2px rgba(0,0,0,0.35);
    transform:rotate(2deg);
    white-space:nowrap;
  }
  .card h3{
    font-size:15.5px; font-weight:700; margin:2px 0 0; line-height:1.5;
    padding-inline-end:70px;
  }
  .card .meta{font-size:12.5px; color:var(--ink-soft); display:flex; flex-wrap:wrap; gap:6px 10px;}
  .card .meta b{color:var(--ink); font-weight:600;}
  .card .abstract{
    font-size:13px; color:var(--ink-soft);
    display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
  }
  .card .foot{
    margin-top:auto; padding-top:10px; border-top:1px dashed var(--line);
    display:flex; align-items:center; justify-content:space-between; gap:10px;
  }
  .card .doi{font-size:11.5px; color:var(--ink-soft);}
  .card .doi a{color:var(--teal-deep); text-decoration:none; border-bottom:1px dotted var(--teal);}
  .src-badges{display:flex; gap:5px; flex-wrap:wrap;}
  .src-badge{
    font-size:10.5px; font-weight:600; padding:2px 7px; border-radius:5px;
    background:var(--paper-deep); color:var(--ink-soft); letter-spacing:.02em;
  }
  .btn-add{
    background:var(--teal); color:#fff; border:none; border-radius:7px;
    padding:6px 12px; font-size:12.5px; font-weight:600; cursor:pointer;
    display:flex; align-items:center; gap:6px; flex-shrink:0;
  }
  .btn-add.added{background:var(--ink-soft); cursor:default;}
  .btn-add:hover:not(.added){background:var(--teal-deep);}

  .fa-src-card{
    background:var(--card);
    border:1px solid var(--line);
    border-radius:10px;
    padding:16px 16px 14px;
    box-shadow:var(--shadow);
    display:flex; flex-direction:column; gap:8px;
  }
  .fa-src-card .badge-row{display:flex; align-items:center; gap:10px;}
  .fa-src-card .mark{
    width:34px; height:34px; border-radius:8px;
    display:flex; align-items:center; justify-content:center;
    font-family:'JetBrains Mono',monospace; font-weight:700; font-size:13px; color:#fff;
    flex-shrink:0;
  }
  .fa-src-card h4{margin:0; font-size:14.5px;}
  .fa-src-card p{margin:0; font-size:12.5px; color:var(--ink-soft);}
  .fa-src-card .go{
    margin-top:4px; align-self:flex-start;
    background:var(--ink); color:var(--paper);
    border:none; border-radius:7px; padding:7px 14px;
    font-size:12.5px; font-weight:600; cursor:pointer;
    text-decoration:none; display:inline-flex; align-items:center; gap:6px;
  }
  .fa-src-card .go:hover{background:var(--teal-deep);}

  /* ===== Multi-agent pipeline ===== */
  .pipeline-wrap{
    max-width:1180px; margin:0 auto; padding:0 24px 90px;
  }
  .auto-pipeline-box{
    margin-top:18px; padding:16px 18px; border-radius:11px;
    background:linear-gradient(135deg, rgba(47,111,99,0.09), rgba(181,80,46,0.07));
    border:1.5px solid var(--teal);
  }
  .auto-pipeline-head{display:flex; flex-direction:column; gap:4px;}
  .auto-pipeline-head strong{font-size:14.5px;}
  .auto-pipeline-head span{font-size:12px; color:var(--ink-soft); line-height:1.9;}
  .auto-pipeline-status{
    margin-top:10px; font-size:12.5px; color:var(--ink-soft);
    display:flex; flex-direction:column; gap:5px;
  }
  .auto-pipeline-status .step{display:flex; align-items:center; gap:8px;}
  .auto-pipeline-status .step .led{width:8px; height:8px; border-radius:50%; background:#c9c0a6; flex-shrink:0;}
  .auto-pipeline-status .step.done .led{background:var(--ok);}
  .auto-pipeline-status .step.active .led{background:var(--gold); animation:pulse 1.1s infinite;}
  .auto-pipeline-status .step.error .led{background:var(--err);}

  .ai-settings-card{
    background:var(--paper-deep); border:1px dashed var(--line); border-radius:12px;
    padding:16px 18px; margin-bottom:22px;
  }
  .ai-settings-head{display:flex; flex-direction:column; gap:4px; margin-bottom:2px;}
  .ai-settings-head strong{font-size:14px;}
  .ai-settings-head span{font-size:12px; color:var(--ink-soft); line-height:1.9;}
  #apiKeyInput{font-family:'JetBrains Mono',monospace; direction:ltr; text-align:left; font-size:13px;}

  .pipeline-stepper{
    display:flex; gap:8px; margin-bottom:22px; flex-wrap:wrap;
  }
  .step-pill{
    flex:1 1 200px;
    display:flex; align-items:center; gap:10px;
    background:var(--card); border:1px solid var(--line); border-radius:10px;
    padding:10px 14px; font-size:12.5px; color:var(--ink-soft);
  }
  .step-pill .num{
    width:22px; height:22px; border-radius:50%; flex-shrink:0;
    background:var(--paper-deep); color:var(--ink-soft);
    display:flex; align-items:center; justify-content:center;
    font-size:11.5px; font-weight:700;
  }
  .step-pill.done{border-color:var(--teal);}
  .step-pill.done .num{background:var(--teal); color:#fff;}
  .step-pill.active .num{background:var(--gold); color:#fff; animation:pulse 1.1s infinite;}

  .pipeline-columns{
    display:grid; grid-template-columns:1fr 1fr; gap:18px; align-items:start;
  }
  @media (max-width:880px){ .pipeline-columns{grid-template-columns:1fr;} }

  .doc-sections-list{display:flex; flex-direction:column; gap:10px;}
  .doc-section-item{
    border:1px solid var(--line); border-radius:9px; background:#fff;
    padding:10px 14px; display:flex; align-items:center; justify-content:space-between; gap:10px;
  }
  .doc-section-item .name{font-size:13.5px; font-weight:600;}
  .doc-section-item .wc{font-size:11.5px; color:var(--ink-soft); font-family:'JetBrains Mono',monospace; direction:ltr;}
  .doc-section-item .del{
    background:none; border:none; color:var(--err); cursor:pointer; font-size:12px; font-weight:600;
  }

  .agent-card{
    background:var(--card); border:1px solid var(--line); border-radius:12px;
    box-shadow:var(--shadow); padding:20px;
  }
  .agent-head h3{
    font-size:15px; margin:0 0 6px; display:flex; align-items:center; gap:8px; flex-wrap:wrap;
  }
  .agent-tag{
    font-family:'JetBrains Mono',monospace; font-size:10.5px; font-weight:600;
    background:var(--ink); color:var(--paper); border-radius:5px; padding:2px 7px;
  }
  .agent-head p{font-size:12.5px; color:var(--ink-soft); margin:0 0 14px;}

  select{
    width:100%; border:1.5px solid var(--line); background:#fff; border-radius:9px;
    padding:12px 14px; font-family:inherit; font-size:14.5px; color:var(--ink);
  }

  .analysis-progress{margin-top:14px; display:flex; flex-direction:column; gap:8px;}
  .progress-row{
    display:flex; align-items:center; justify-content:space-between; gap:10px;
    background:#fff; border:1px solid var(--line); border-radius:8px; padding:8px 12px;
    font-size:12.5px;
  }
  .progress-row .t{overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:70%;}
  .progress-status{display:flex; align-items:center; gap:6px; flex-shrink:0;}
  .progress-status .led{width:7px;height:7px;border-radius:50%; background:#999;}
  .progress-status.ok .led{background:var(--ok);}
  .progress-status.err .led{background:var(--err);}
  .progress-status.pending .led{background:var(--gold); animation:pulse 1.1s infinite;}
  .retry-mini{
    border:none; background:none; color:var(--err); font-size:11.5px; font-weight:600; cursor:pointer;
    text-decoration:underline;
  }

  .kb-grid{display:flex; flex-direction:column; gap:12px; max-height:520px; overflow:auto;}
  .kb-card{
    background:#fff; border:1px solid var(--line); border-radius:9px; padding:12px 14px;
  }
  .kb-card h4{font-size:13.5px; margin:0 0 8px; line-height:1.5;}
  .kb-field{font-size:12px; margin-bottom:6px; line-height:1.7;}
  .kb-field b{
    color:var(--teal-deep); font-weight:700; display:inline-block;
    margin-inline-end:4px;
  }

  /* ===== Sidebar ===== */
  .sidebar{
    position:sticky; top:20px;
    background:var(--card);
    border:1px solid var(--line);
    border-radius:12px;
    box-shadow:var(--shadow);
    padding:18px;
    max-height:calc(100vh - 40px);
    overflow:auto;
  }
  .sidebar h2{font-size:15px; margin:0 0 4px;}
  .sidebar .sub{font-size:12px; color:var(--ink-soft); margin-bottom:14px;}
  .selected-item{
    border:1px solid var(--line); border-radius:8px; padding:10px 12px;
    margin-bottom:8px; background:#fff;
    font-size:12.5px;
  }
  .selected-item .t{font-weight:600; font-size:13px; margin-bottom:3px; line-height:1.5;}
  .selected-item .y{color:var(--ink-soft); font-size:11.5px;}
  .selected-item .rm{
    float:inline-end; background:none; border:none; color:var(--err);
    cursor:pointer; font-size:12px; font-weight:600;
  }
  .sidebar .empty-mini{font-size:12.5px; color:var(--ink-soft); padding:20px 0; text-align:center;}

  .style-tabs{display:flex; gap:6px; margin:16px 0 8px;}
  .style-tab{
    flex:1; text-align:center; font-size:12.5px; font-weight:600;
    padding:7px 6px; border-radius:7px; border:1px solid var(--line);
    background:var(--paper-deep); color:var(--ink-soft); cursor:pointer;
  }
  .style-tab.active{background:var(--ink); color:var(--paper); border-color:var(--ink);}
  #refOutput{
    width:100%; min-height:150px; font-size:12px;
    font-family:'JetBrains Mono',monospace; direction:ltr; text-align:left;
    background:#fff; margin-top:8px;
  }
  .copy-row{display:flex; gap:8px; margin-top:8px;}

  .section-search-toggle{margin-top:16px; padding-top:14px; border-top:1px dashed var(--line);}
  .section-search-panel{
    margin-top:12px; padding:14px; border-radius:9px;
    background:var(--paper-deep); border:1px solid var(--line);
  }
  .section-search-panel .card{padding:14px 14px 12px; font-size:12.5px;}
  .section-search-panel .card h3{font-size:13.5px;}

  footer{
    text-align:center; font-size:12px; color:var(--ink-soft);
    padding:26px; border-top:1px solid var(--line);
  }

  ::selection{background:var(--gold); color:#fff;}
  @media (prefers-reduced-motion: reduce){
    *{animation-duration:.001ms !important; transition-duration:.001ms !important;}
  }

/* ══════════════════════════════════════════════
   افزوده‌های سایت چندصفحه‌ای — نوار ناوبری، فرم‌ها، کارت‌های محتوا
   ══════════════════════════════════════════════ */

.site-nav{
  max-width:1180px; margin:0 auto; padding:18px 24px 0;
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
}
.site-nav .brand{
  display:flex; align-items:center; gap:10px; font-weight:800; font-size:18px; color:var(--ink);
  text-decoration:none;
}
.site-nav .brand .mark{
  width:34px; height:34px; border-radius:9px; background:var(--teal); color:#fff;
  display:flex; align-items:center; justify-content:center; font-family:'Noto Naskh Arabic',serif; font-size:16px;
}
.site-nav .links{display:flex; gap:6px; flex-wrap:wrap; align-items:center;}
.site-nav .links a{
  text-decoration:none; color:var(--ink-soft); font-size:13.5px; font-weight:600;
  padding:8px 12px; border-radius:8px;
}
.site-nav .links a:hover{background:var(--paper-deep); color:var(--ink);}
.site-nav .links a.active{background:var(--ink); color:var(--paper);}
.site-nav .user-chip{
  display:flex; align-items:center; gap:8px; font-size:13px; color:var(--ink-soft);
}

.page-wrap{max-width:900px; margin:0 auto; padding:44px 24px 90px;}
.page-wrap.wide{max-width:1180px;}

.page-title{font-size:clamp(24px,3.4vw,34px); font-weight:700; margin:0 0 10px;}
.page-lede{color:var(--ink-soft); font-size:15.5px; margin:0 0 30px; max-width:680px;}

.auth-card{
  max-width:420px; margin:60px auto; background:var(--card); border:1px solid var(--line);
  border-radius:14px; box-shadow:var(--shadow); padding:28px;
}
.auth-card h1{font-size:21px; margin:0 0 6px;}
.auth-card p.sub{font-size:13px; color:var(--ink-soft); margin:0 0 22px;}
.auth-card .field{margin-bottom:16px;}
.auth-card .switch{margin-top:16px; font-size:13px; color:var(--ink-soft); text-align:center;}
.auth-card .switch a{font-weight:700;}
.alert{
  border-radius:9px; padding:12px 14px; font-size:13.5px; margin-bottom:16px;
}
.alert-error{background:rgba(165,61,43,0.1); color:var(--err); border:1px solid rgba(165,61,43,0.3);}
.alert-ok{background:rgba(47,111,99,0.1); color:var(--teal-deep); border:1px solid rgba(47,111,99,0.3);}

.guide-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:18px; margin-top:10px;}
.guide-card{
  background:var(--card); border:1px solid var(--line); border-radius:12px; padding:20px;
  box-shadow:var(--shadow); text-decoration:none; color:var(--ink); display:flex; flex-direction:column; gap:8px;
}
.guide-card:hover{border-color:var(--teal);}
.guide-card .tag{
  align-self:flex-start; background:var(--paper-deep); color:var(--ink-soft); font-size:11.5px;
  font-weight:700; padding:3px 9px; border-radius:100px;
}
.guide-card h3{font-size:16px; margin:0;}
.guide-card p{font-size:13px; color:var(--ink-soft); margin:0;}

.content-article{max-width:760px; margin:0 auto;}
.content-article h2{font-size:20px; margin-top:34px;}
.content-article h3{font-size:16.5px; margin-top:24px;}
.content-article p, .content-article li{font-size:15px; color:var(--ink-soft); line-height:1.95;}
.content-article ul, .content-article ol{padding-inline-start:22px;}

.dash-project-list{display:flex; flex-direction:column; gap:12px; margin-top:20px;}
.dash-project{
  display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap;
  background:var(--card); border:1px solid var(--line); border-radius:11px; padding:16px 18px;
  box-shadow:var(--shadow);
}
.dash-project .t{font-weight:700; font-size:14.5px;}
.dash-project .m{font-size:12px; color:var(--ink-soft); margin-top:4px;}
.dash-project .acts{display:flex; gap:8px;}

.hint-box{
  border:1.5px dashed var(--line); border-radius:10px; padding:12px 16px; font-size:12.5px;
  color:var(--ink-soft); line-height:1.9; margin-top:14px;
}

footer.site-footer{
  text-align:center; font-size:12.5px; color:var(--ink-soft); padding:34px 24px; border-top:1px solid var(--line);
  display:flex; flex-direction:column; gap:10px;
}
footer.site-footer .flinks{display:flex; gap:16px; justify-content:center; flex-wrap:wrap;}
footer.site-footer .flinks a{color:var(--ink-soft); text-decoration:none; font-weight:600;}
footer.site-footer .flinks a:hover{color:var(--teal-deep);}

@media (max-width:640px){
  .site-nav{flex-direction:column; align-items:flex-start;}
}