:root{
  --bg:#F4F5F8; --paper:#FFFFFF; --ink:#0B1220; --text:#0B1220; --muted:#5A6275; --line:#DADDE6;
  --blue:#3B5BFD; --blue-soft:#E8ECFF; --on-blue:#FFFFFF; --warn:#B4231A; --ok:#1F7A4D;
  --serif:"Instrument Serif", Georgia, serif; --sans:"Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root{ --bg:#0B1220; --paper:#121A2C; --ink:#070C17; --text:#E9ECF3; --muted:#9AA2B4; --line:#232C42;
         --blue:#6F86FF; --blue-soft:#1A2547; --on-blue:#FFFFFF; --warn:#FF8A80; --ok:#6FD3A0; color-scheme:dark; }
}
html[lang="ar"]{ --serif:"Noto Naskh Arabic", Georgia, serif; --sans:"IBM Plex Sans Arabic", system-ui, sans-serif; }
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:400 .98rem/1.55 var(--sans);-webkit-font-smoothing:antialiased;
  padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
a{color:var(--blue)}
:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.wrap{max-width:1200px;margin:0 auto;padding:0 clamp(16px,4vw,40px)}
header.bar{display:flex;align-items:center;gap:18px;padding:18px 0;border-bottom:1px solid var(--line);flex-wrap:wrap}
header.bar .brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--text);margin-inline-end:auto}
header.bar .logo{height:44px;width:auto;display:block}
header.bar .tag{font:500 .78rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);border-inline-start:1px solid var(--line);padding-inline-start:12px}
header.bar nav{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
h1,h2,h3{font-family:var(--serif);font-weight:400;margin:0}
html[lang="ar"] h1, html[lang="ar"] h2, html[lang="ar"] h3{font-weight:600}
h1{font-size:clamp(2rem,4vw,2.8rem);line-height:1.1}
h2{font-size:1.6rem;line-height:1.2}
h3{font-size:1.25rem}
.muted{color:var(--muted)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:500 .92rem/1 var(--sans);border-radius:999px;padding:11px 18px;cursor:pointer;border:1px solid var(--line);background:var(--paper);color:var(--text);text-decoration:none}
.btn:hover{border-color:var(--text)}
.btn.primary{background:var(--blue);border-color:var(--blue);color:var(--on-blue)}
.btn.danger{color:var(--warn);border-color:var(--warn);background:transparent}
.btn.small{padding:7px 12px;font-size:.82rem}
.btn[aria-pressed="true"]{background:var(--ink);color:#F4F5F8;border-color:var(--ink)}
@media (prefers-color-scheme: dark){.btn[aria-pressed="true"]{background:var(--blue);border-color:var(--blue)}}
.btn:disabled{opacity:.5;cursor:default}
input,select,textarea{font:400 .95rem/1.4 var(--sans);color:var(--text);background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:10px 12px;width:100%}
label{display:block;font-size:.8rem;color:var(--muted);margin:0 0 5px;font-weight:500}
.card{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:clamp(18px,3vw,28px)}
.center{min-height:70vh;display:grid;place-items:center;padding:40px 0}
.narrow{max-width:440px;width:100%}
.stack>*+*{margin-top:14px}
.pill{display:inline-block;font:500 .74rem/1 var(--sans);padding:6px 10px;border-radius:999px;white-space:nowrap;background:var(--blue-soft);color:var(--blue)}
.pill.s-new{background:#FFF1D6;color:#8A5A00}
.pill.s-in_progress{background:var(--blue-soft);color:var(--blue)}
.pill.s-waiting_client{background:#F3E8FF;color:#6B2FB3}
.pill.s-published{background:#DDF5E8;color:#1F7A4D}
.pill.s-closed{background:#ECEEF2;color:#5A6275}
@media (prefers-color-scheme: dark){
  .pill.s-new{background:#3A2E12;color:#F5C66B}.pill.s-waiting_client{background:#2E1E45;color:#C9A2FF}
  .pill.s-published{background:#123426;color:#6FD3A0}.pill.s-closed{background:#1E2638;color:#9AA2B4}
}
.msg{padding:10px 14px;border-radius:12px;background:var(--blue-soft);color:var(--text);font-size:.92rem}
.msg.err{background:transparent;border:1px solid var(--warn);color:var(--warn)}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.scroll-x{overflow-x:auto}
.pill.s-building{background:var(--blue-soft);color:var(--blue)}
.pill.s-waiting_you{background:#FFE4E1;color:#B4231A}
@media (prefers-color-scheme: dark){.pill.s-waiting_you{background:#3A1A1A;color:#FF8A80}}