@font-face{font-family:"Num";src:local("Arial"),local("ArialMT"),local("Helvetica"),local("Liberation Sans"),local("Roboto");unicode-range:U+0030-0039,U+002C,U+002E,U+0025,U+002B,U+003A,U+002F}
:root{--bg:#0b0a08;--s:#13110d;--s2:#1b1812;--tx:#f3eadb;--mu:#a99d8a;--ok:#4ade80;--bad:#f87171;--warn:#fbbf24;--p:#e9a242;--p2:#f6c36a;--on:#1a1206;--bd:rgba(233,162,66,.22);--bd2:rgba(255,255,255,.08);color-scheme:dark}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--tx);font:16px/1.55 "DM Sans",system-ui,-apple-system,"Segoe UI",Tahoma,sans-serif;-webkit-tap-highlight-color:transparent}
[dir=rtl] body,[dir=rtl] input,[dir=rtl] button,[dir=rtl] select,[dir=rtl] textarea{font-family:"Num","Vazirmatn",Tahoma,system-ui,sans-serif}
.auth{min-height:100dvh;display:grid;place-items:center;padding:24px 16px;background:radial-gradient(800px 420px at 50% 0,rgba(233,162,66,.16),transparent 70%),var(--bg)}
.auth__card{width:min(420px,100%);background:var(--s);border:1px solid var(--bd);border-radius:20px;padding:28px;display:grid;gap:14px;box-shadow:0 40px 80px -30px rgba(0,0,0,.8)}
.auth__brand{display:grid;place-items:center;margin-bottom:4px}.auth__brand img{height:64px;width:auto}
.auth__card h1{margin:0;font-size:1.15rem;text-align:center;font-weight:700;letter-spacing:.02em}
.auth__card label{display:grid;gap:6px;font-size:.9rem;color:#d8ccb8}
.auth__card input:not([type=checkbox]){width:100%;min-height:50px;padding:0 14px;background:var(--bg);color:var(--tx);border:1px solid var(--bd2);border-radius:12px;font:inherit}
.auth__card input:focus{border-color:var(--p);outline:1px solid var(--p)}
.auth__check{display:flex!important;align-items:center;gap:10px;grid-template-columns:none}.auth__check input{width:20px;height:20px;accent-color:var(--p)}
.auth__btn{min-height:52px;border:0;border-radius:999px;background:linear-gradient(135deg,var(--p2),var(--p) 55%,#b47c2f);color:var(--on);font-weight:700;font-size:1rem;font-family:inherit;cursor:pointer;transition:filter .2s,transform .2s}
.auth__btn:hover{filter:brightness(1.1)}.auth__btn:active{transform:scale(.98)}
.auth__err{margin:0;padding:10px 12px;border:1px solid var(--bad);background:rgba(248,113,113,.1);color:#fecaca;border-radius:10px;font-size:.9rem}
.auth__foot{margin:0;text-align:center;font-size:.85rem}.auth__foot a{color:var(--mu)}.auth__foot a:hover{color:var(--p2)}
.auth__hp{position:absolute!important;inset-inline-start:-9999px;width:1px;height:1px;opacity:0}
:focus-visible{outline:2px solid var(--p2);outline-offset:2px}

/* ==========================================================================
   Same typography as the public site: Syne (display), DM Sans (text),
   Fragment Mono (labels), Vazirmatn (Persian).
   ========================================================================== */
:root { --sans: "Num", "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif; --display: "Num", "Syne", "DM Sans", system-ui, sans-serif; --mono: "Num", "Fragment Mono", ui-monospace, "SFMono-Regular", Menlo, monospace; --fa: "Num", "Vazirmatn", Tahoma, system-ui, sans-serif; }
html, body, input, button, select, textarea { font-family: var(--sans); }
html[dir="rtl"], html[dir="rtl"] body, html[dir="rtl"] input, html[dir="rtl"] button, html[dir="rtl"] select, html[dir="rtl"] textarea { font-family: var(--fa); }

/* display headings & big numbers */
.auth__card h1, .pn-bar h2, .kpi b, .modal__box h3, .msgview__sub, .g-stats b, .g-r-msg { font-family: var(--display); font-weight: 800; letter-spacing: -.02em; }
.auth__card h1, .pn-bar h2, .modal__box h3 { text-transform: uppercase; }
.kpi b { font-variant-numeric: tabular-nums; }
html[dir="rtl"] .auth__card h1, html[dir="rtl"] .pn-bar h2, html[dir="rtl"] .kpi b, html[dir="rtl"] .modal__box h3, html[dir="rtl"] .msgview__sub, html[dir="rtl"] .g-stats b, html[dir="rtl"] .g-r-msg { font-family: var(--fa); font-weight: 900; letter-spacing: 0; text-transform: none; }

/* mono labels, like the site's nav / eyebrows */
.pn-tabs button, th, .kpi small, .pn-live, .pn-lang a, .chip, .chart em, .pager, .pn-link, .toast span, .g-stats span, .g-live, .g-langs a, .msg__date { font-family: var(--mono); }
.pn-tabs button { font-size: .74rem; letter-spacing: .14em; text-transform: uppercase; }
html[dir="rtl"] .pn-tabs button, html[dir="rtl"] th, html[dir="rtl"] .kpi small, html[dir="rtl"] .pn-live, html[dir="rtl"] .pn-lang a, html[dir="rtl"] .chip, html[dir="rtl"] .chart em, html[dir="rtl"] .pager, html[dir="rtl"] .pn-link, html[dir="rtl"] .toast span, html[dir="rtl"] .g-stats span, html[dir="rtl"] .g-live, html[dir="rtl"] .g-langs a, html[dir="rtl"] .msg__date { font-family: var(--fa); letter-spacing: 0; text-transform: none; }
html[dir="rtl"] .pn-tabs button { font-size: .92rem; }
th { text-transform: uppercase; letter-spacing: .08em; }
html[dir="rtl"] th { text-transform: none; letter-spacing: 0; font-size: .8rem; }
.btn, .auth__btn, .g-btn { font-family: var(--sans); letter-spacing: .06em; font-weight: 700; }
html[dir="rtl"] .btn, html[dir="rtl"] .auth__btn, html[dir="rtl"] .g-btn { font-family: var(--fa); letter-spacing: 0; }
.auth__back { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-height: 48px; padding: 0 1.4rem; margin-top: 1rem; border: 1px solid var(--bd); border-radius: 999px; color: var(--p2); text-decoration: none; font-size: .9rem; transition: background-color .2s, color .2s, border-color .2s; }
.auth__back:hover { background: var(--p); color: var(--on); border-color: var(--p); }
.auth { align-content: center; justify-items: center; gap: 0; }
.auth__card, .auth__back { width: auto; }
.auth__card { width: min(420px, 100%); }

/* ==========================================================================
   Responsive: phones → ultra-wide
   ========================================================================== */
.pn-top { gap: 10px 14px; }
.pn-tabs { scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.pn-tabs::-webkit-scrollbar { display: none; }
.tbl-wrap { max-width: 100%; -webkit-overflow-scrolling: touch; }
.tbl-wrap table { min-width: 680px; }
@media (min-width: 1500px) { #app { max-width: 1480px; } .kpis { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 1000px) { .pn-right { gap: 6px; } .pn-link { padding: 8px 6px; font-size: .78rem; } }
@media (max-width: 760px) {
  .pn-top { padding: 10px 0; }
  .pn-tabs { order: 3; width: 100%; }
  .pn-tabs button { padding: 11px 16px; }
  .pn-right { order: 2; margin-inline-start: auto; width: auto; flex: 1 1 auto; justify-content: flex-end; }
  .pn-brand img { height: 36px; }
  .pn-bar { flex-direction: column; align-items: stretch; margin: 14px 0; }
  .pn-bar h2 { margin: 0; font-size: 1.15rem; }
  .pn-bar .pn-in, .pn-bar .pn-sel, .pn-bar .btn { width: 100%; }
  .kpis { grid-template-columns: 1fr 1fr; }
  .kpi { padding: 14px; } .kpi b { font-size: 1.45rem; word-break: break-word; }
  .chart { height: 140px; gap: 2px; } .chart em { font-size: .55rem; }
  .modal { padding: 0; align-items: end; }
  .modal__box { width: 100%; max-height: 94dvh; border-radius: 20px 20px 0 0; padding: 18px 16px 22px; }
  .modal .row { grid-template-columns: 1fr 1fr; }
  .types-ed .tr { grid-template-columns: 1fr 1fr; }
  .msg { grid-template-columns: auto minmax(0, 1fr); } .msg > .chip { grid-column: 2; justify-self: start; }
  .msg__snip { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
  .acts { gap: 5px; } .acts .btn--s { min-height: 40px; }
  .toast { inset-inline: 12px; }
  .pn-live { font-size: .7rem; padding: 5px 8px; }
}
@media (max-width: 440px) {
  .kpis { grid-template-columns: 1fr; }
  .modal .row, .types-ed .tr { grid-template-columns: 1fr; }
  .pn-right .pn-lang a { min-width: 34px; min-height: 34px; }
  .pn-link--site { order: -1; }
  .auth__card { padding: 22px 18px; border-radius: 18px; }
}
@media (max-width: 340px) { #app { padding: 0 8px 70px; } .pn-tabs button { padding: 10px 12px; font-size: .68rem; } }

/* gate */
.g-top { grid-template-columns: auto minmax(0, 1fr) auto; }
.g-langs { flex-wrap: nowrap; align-items: center; }
.g-site, .g-out { min-width: 44px; min-height: 44px; display: grid; place-items: center; border-radius: 10px; color: var(--mu); text-decoration: none; font-size: 1.15rem; border: 1px solid var(--bd2); }
.g-site:hover, .g-out:hover { color: var(--p2); border-color: var(--p); }
@media (max-width: 400px) { .g-top { grid-template-columns: 1fr auto; } .g-top select { grid-column: 1 / -1; order: 3; } .g-brand img { height: 28px; } .g-stats b { font-size: 1.5rem; } }
@media (min-width: 900px) { #app { max-width: 760px; } .gate #app { max-width: 760px; } }

/* login: language switch + edge-to-edge on phones */
.auth__langs { display: flex; gap: 6px; justify-content: center; margin-bottom: 14px; }
.auth__langs a { min-width: 48px; min-height: 44px; display: grid; place-items: center; border: 1px solid var(--bd2); border-radius: 12px; color: var(--mu); text-decoration: none; font: .8rem var(--mono); letter-spacing: .08em; transition: background-color .2s, color .2s, border-color .2s; }
.auth__langs a:hover { color: #fff; border-color: var(--bd); }
.auth__langs a[aria-current] { border-color: var(--p); color: var(--p2); background: rgba(233, 162, 66, .12); }
html[dir="rtl"] .auth__langs a { font-family: var(--fa); letter-spacing: 0; }
@media (max-width: 520px) {
  .auth { padding: 0; align-content: start; justify-items: stretch; background: var(--bg); }
  .auth__langs { padding: 14px 12px 6px; margin: 0; }
  .auth__card { width: 100%; border-radius: 0; border-inline: 0; box-shadow: none; padding: 24px 16px; }
  .auth__back { margin: 14px 16px 24px; }
  .auth__card input:not([type=checkbox]) { font-size: 16px; }
}

/* Popups: the page behind never scrolls; long lists scroll inside */
html.is-locked, html.is-locked body { overflow: hidden !important; }
.modal, .modal__box, .pick__list { overscroll-behavior: contain; }
.pick__btn { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; min-height: 48px; padding: 0 14px; background: var(--s); color: var(--tx); border: 1px solid var(--bd); border-radius: 12px; font: inherit; font-size: 1rem; text-align: start; cursor: pointer; }
.pick__btn:focus-visible { outline: 2px solid var(--p); outline-offset: 2px; }
.pick__txt { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; unicode-bidi: plaintext; }
.pick__car { flex: none; width: 9px; height: 9px; border-inline-end: 2px solid var(--mu); border-bottom: 2px solid var(--mu); transform: rotate(45deg) translateY(-2px); }
.pick { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; padding: 16px; background: rgba(0, 0, 0, .72); overscroll-behavior: contain; }
.pick__box { width: min(520px, 100%); max-height: 78dvh; display: flex; flex-direction: column; background: var(--s); border: 1px solid var(--bd); border-radius: 18px; overflow: hidden; animation: pickin .2s ease-out; }
.pick__h { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; border-bottom: 1px solid var(--bd2); }
.pick__h b { font-size: .95rem; color: var(--mu); font-weight: 600; }
.pick__x { width: 40px; height: 40px; border: 0; border-radius: 10px; background: transparent; color: var(--tx); font-size: 1.6rem; line-height: 1; cursor: pointer; }
.pick__list { list-style: none; margin: 0; padding: 6px; overflow-y: auto; -webkit-overflow-scrolling: touch; }
.pick__list li { padding: 14px; border-radius: 12px; cursor: pointer; unicode-bidi: plaintext; line-height: 1.4; }
.pick__list li:hover { background: rgba(255, 255, 255, .06); }
.pick__list li.is-on { background: var(--p); color: var(--on, #1a1206); font-weight: 700; }
@media (max-width: 760px) {
  .pick { padding: 0; place-items: end stretch; }
  .pick__box { width: 100%; max-height: 80dvh; border-radius: 20px 20px 0 0; border-inline: 0; border-bottom: 0; padding-bottom: env(safe-area-inset-bottom); }
}
@keyframes pickin { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .pick__box { animation: none; } }