/* הסטודיו — שפת העיצוב.
   מיתוג ג'מעה (פונטים, צבעים, יד) · פלטת הנייר של יוש · דקדוק נקי בסגנון JPW.
   שלוש הידיים מהלוגו הן מערכת המצבים: כתום=מחכה לך · ענבר=רץ · כחול=נמסר. */

@font-face{font-family:"JBeit";src:url("fonts/JamaaBeitHaam-Regular.otf") format("opentype");font-display:swap}
@font-face{font-family:"JNews";src:url("fonts/JamaaNewspaper-Regular.otf") format("opentype");font-display:swap}
@font-face{font-family:"JTypist";src:url("fonts/JamaaCourtTypist-Regular.otf") format("opentype");font-display:swap}
@font-face{font-family:"Suez";src:url("fonts/SuezOne-Regular.ttf") format("truetype");font-display:swap}
@font-face{font-family:"Assist";src:url("fonts/Assistant.ttf") format("truetype");font-display:swap}
/* הפיסוק של ג'מעה נחתך מכרזות ומצויר זעיר — נעלם בגודל ממשק.
   לכן סימני הפיסוק בלבד נשאבים מ-Assistant; האותיות והספרות נשארות ג'מעה. */
@font-face{font-family:"JPunct";src:url("fonts/Assistant.ttf") format("truetype");font-display:swap;
  unicode-range:U+0021-002F,U+003A-0040,U+005B-0060,U+007B-007E,U+00B7,U+05F3-05F4,U+2010-2027,U+2030-205E}

:root{
  --paper:#E9E2D2; --paper-deep:#DDD3BC; --card:#F4EFE2;
  --ink:#05161E; --ink-soft:#0B2836; --muted:#6B7479;
  --line:#D8CEB8; --line-soft:#E2DAC7;
  --orange:#CF5119; --orange-txt:#CF5119; --orange-soft:#F6E0D3; --orange-bd:rgba(207,81,25,.28);
  --amber:#EFA42C; --amber-txt:#8A5D0B; --amber-soft:#FAEACD; --amber-bd:rgba(239,164,44,.45);
  --blue:#114054; --blue-txt:#114054; --blue-soft:#DBE6EB; --blue-bd:rgba(17,64,84,.22);
  --dot:rgba(5,22,30,.14); --dot-op:.35;
  --shadow:0 1px 2px rgba(5,22,30,.05), 0 8px 24px rgba(5,22,30,.05);
  --print:rgba(207,81,25,.16); --onsolid:#FFF6EF;
  --display:"JPunct","JBeit","Suez",serif;
  --kick:"JPunct","JNews",serif;
  --body:"JPunct","JTypist","Assist",sans-serif;
  --r-card:16px; --r-in:12px; --r-btn:11px;
}
html[data-mode="dark"]{
  --paper:#05161E; --paper-deep:#04121A; --card:#0B2836;
  --ink:#E9E2D2; --ink-soft:#CFC6B4; --muted:#8A9299;
  --line:rgba(233,226,210,.16); --line-soft:rgba(233,226,210,.09);
  --orange-txt:#E06B33; --orange-soft:rgba(207,81,25,.16); --orange-bd:rgba(224,107,51,.45);
  --amber-txt:#EFA42C; --amber-soft:rgba(239,164,44,.14); --amber-bd:rgba(239,164,44,.4);
  --blue:#4E97BC; --blue-txt:#7CB6D4; --blue-soft:rgba(78,151,188,.15); --blue-bd:rgba(78,151,188,.35);
  --dot:rgba(233,226,210,.10); --dot-op:.5;
  --shadow:0 1px 2px rgba(0,0,0,.3), 0 12px 34px rgba(0,0,0,.34);
  --print:rgba(224,107,51,.22); --onsolid:#0A1B22;
}

*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);
     font-size:16px;line-height:1.6;direction:rtl;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background-image:radial-gradient(var(--dot) 1px,transparent 1px);background-size:5px 5px;opacity:var(--dot-op)}
h1,h2,h3{font-family:var(--display);font-weight:400;margin:0;line-height:1.1}
a{color:inherit}
button{font-family:var(--body)}

.kicker{font-family:var(--kick);font-size:12px;letter-spacing:.26em;color:var(--orange-txt);
        display:inline-block;padding-bottom:5px;border-bottom:2px solid var(--orange)}
.label{font-family:var(--kick);font-size:10.5px;letter-spacing:.2em;color:var(--muted)}

/* ---- מעטפת ---- */
.shell{position:relative;z-index:1;display:grid;grid-template-columns:214px 1fr;
       min-height:100vh;max-width:1320px;margin:0 auto}
.side{padding:22px 16px;display:flex;flex-direction:column;gap:6px;border-inline-end:1px solid var(--line-soft)}
.brand{display:flex;align-items:center;gap:11px;padding:0 12px 18px}
.brand img{width:26px;height:36px;object-fit:contain;transform:rotate(-6deg)}
.brand b{font-family:var(--display);font-size:20px;font-weight:400}
.side nav{display:flex;flex-direction:column;gap:4px}
.side nav button{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:9px 15px;border-radius:999px;color:var(--ink-soft);background:transparent;
  border:1px solid transparent;font-size:15px;cursor:pointer;text-align:start;
  transition:background .15s,border-color .15s,color .15s}
.side nav button .n{font-size:12.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.side nav button:hover{border-color:var(--line);background:var(--card)}
.side nav button.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.side nav button.on .n{color:var(--paper);opacity:.7}
.side .gap{height:14px}
.side .nl{font-family:var(--kick);font-size:10.5px;letter-spacing:.2em;color:var(--muted);padding:0 15px 6px}
.side .foot{margin-top:auto;display:flex;flex-direction:column;gap:8px;padding:14px 12px 0;border-top:1px solid var(--line-soft)}
.side .foot .st{font-size:12.5px;color:var(--muted);display:flex;align-items:center;gap:7px}
.side .foot .st i{width:7px;height:7px;border-radius:50%;background:var(--muted);flex:none}
.side .foot .st.ok i{background:var(--blue)}
.side .foot .st.off i{background:var(--muted);opacity:.5}
.modes{display:inline-flex;border:1px solid var(--line);border-radius:999px;padding:3px;gap:2px;background:var(--card)}
.modes button{flex:1;font-size:12.5px;border:0;background:transparent;color:var(--muted);
  padding:5px 10px;border-radius:999px;cursor:pointer}
.modes button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}

main{padding:30px 34px 70px;min-width:0;display:flex;flex-direction:column;gap:30px}
.head{display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.head h1{font-size:clamp(34px,4.6vw,52px)}
.head .meta{color:var(--muted);font-size:14.5px;margin:0}

/* ---- גלולות מצב ---- */
.pill{display:inline-flex;align-items:center;gap:7px;border-radius:999px;padding:5px 14px;
      font-size:13px;border:1px solid transparent;white-space:nowrap}
.pill::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;flex:none}
.pill.tal{color:var(--orange-txt);background:var(--orange-soft);border-color:var(--orange-bd)}
.pill.engine,.pill.machine{color:var(--amber-txt);background:var(--amber-soft);border-color:var(--amber-bd)}
.pill.done{color:var(--blue-txt);background:var(--blue-soft);border-color:var(--blue-bd)}
.pill.blocked{color:var(--muted);background:transparent;border-color:var(--line)}
.pill.open{color:var(--ink-soft);background:transparent;border-color:var(--line)}
.pill.archive{color:var(--muted);background:transparent;border-color:var(--line-soft);opacity:.8}
.pill.plain{border-color:var(--line);color:var(--muted)}
.pill.plain::before{display:none}

/* ---- הבלוק שמחכה לאוזן ---- */
.feat{background:var(--card);border:1px solid var(--orange-bd);border-radius:var(--r-card);
      padding:4px 20px 6px;box-shadow:5px 5px 0 var(--print)}
.fi{display:flex;align-items:center;gap:18px;padding:16px 0;border-bottom:1px solid var(--line-soft)}
.fi:last-child{border-bottom:0}
.fnum{font-family:var(--display);font-size:28px;color:var(--orange-txt);width:30px;flex:none;text-align:center}
.ftxt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.ftxt b{font-family:var(--display);font-size:21px;font-weight:400}
.ftxt span{color:var(--muted);font-size:14px}

/* ---- תוכן עניינים ---- */
.toc{display:flex;flex-direction:column}
.toc .row{display:grid;grid-template-columns:1fr auto auto;gap:20px;align-items:center;
  padding:15px 14px;border-radius:var(--r-in);border:1px solid transparent;cursor:pointer;
  background:transparent;color:var(--ink);text-align:start;font-size:16px;
  transition:border-color .15s,background .15s}
.toc .row:focus-visible{outline:2px solid var(--orange);outline-offset:2px}
/* מספרים ולטינית בתוך משפט עברי — מבודדים כדי שהמינוס לא יקפוץ לסוף */
bdi,.num{unicode-bidi:isolate;direction:ltr}
.toc .row:hover{border-color:var(--line);background:var(--card)}
.toc .t{min-width:0;display:flex;flex-direction:column;gap:2px}
.toc .t b{font-family:var(--display);font-size:22px;font-weight:400}
.toc .t span{font-family:var(--kick);font-size:11.5px;letter-spacing:.12em;color:var(--muted)}
.toc .w{font-size:13.5px;color:var(--muted);white-space:nowrap}
.toc .div{height:1px;background:var(--line-soft);margin:0 14px}

/* ---- כרטיסים ---- */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);
      padding:18px 20px;display:flex;flex-direction:column;gap:12px}
.card .ch{display:flex;align-items:center;gap:11px;flex-wrap:wrap}
.card .ch b{font-family:var(--display);font-size:20px;font-weight:400}
.sp{flex:1}
.two{display:grid;grid-template-columns:1.25fr 1fr;gap:26px;align-items:start}
.col{display:flex;flex-direction:column;gap:14px;align-items:stretch}
.col > .kicker{align-self:flex-start}

.btn{font-size:14.5px;border-radius:var(--r-btn);padding:10px 20px;cursor:pointer;
     border:1px solid var(--line);background:var(--card);color:var(--ink);
     transition:border-color .15s,background .15s}
.btn:hover{border-color:var(--orange);background:var(--orange-soft)}
.btn:focus-visible{outline:2px solid var(--orange);outline-offset:2px}
.btn.solid{background:var(--orange);border-color:var(--orange);color:var(--onsolid)}
.btn.solid:hover{background:#B84714;border-color:#B84714}
.btn.sm{padding:7px 14px;font-size:13px;border-radius:9px}

input,select{font-family:var(--body);font-size:14.5px;padding:10px 13px;border-radius:var(--r-btn);
  border:1px solid var(--line);background:var(--paper);color:var(--ink);min-width:0}
input:focus,select:focus{outline:2px solid var(--orange);outline-offset:1px}

/* ---- צורת גל ---- */
.wave{position:relative;width:100%;height:96px;border-radius:var(--r-in);
      background:var(--paper);border:1px solid var(--line);overflow:hidden;cursor:pointer}
.wave canvas{display:block;width:100%;height:100%}
.wave .ph{position:absolute;top:0;bottom:0;width:2px;background:var(--orange);
          pointer-events:none;transform:translateX(-1px)}
.wave .mk{position:absolute;top:0;bottom:0;width:0;pointer-events:none}
.wave .mk::before{content:"";position:absolute;top:0;bottom:0;width:1px;
                  background:var(--blue);opacity:.75}
.wave .mk::after{content:"";position:absolute;top:2px;inset-inline-start:-3px;
                 width:7px;height:7px;border-radius:50%;background:var(--blue)}
.wave .loading{position:absolute;inset:0;display:grid;place-items:center;
               color:var(--muted);font-size:13px}

/* ---- חדר מכונות ---- */
.job{display:grid;grid-template-columns:1fr 170px 54px;gap:16px;align-items:center;
     padding:13px 0;border-bottom:1px solid var(--line-soft)}
.job:last-child{border-bottom:0}
.job .jt{font-size:15px}
.job .jt span{color:var(--muted);font-size:13.5px;display:block}
.bar{height:6px;border-radius:999px;background:var(--paper-deep);overflow:hidden;border:1px solid var(--line-soft)}
.bar i{display:block;height:100%;background:var(--amber);border-radius:999px;transition:width .4s ease}
.job .pc{font-size:13.5px;color:var(--muted);text-align:end;font-variant-numeric:tabular-nums}
.drop{border:1px dashed var(--line);border-radius:var(--r-card);padding:22px;display:flex;
      flex-direction:column;gap:12px;align-items:flex-start;background:var(--card)}
.drop.over{border-color:var(--orange);background:var(--orange-soft)}
.drop .rowf{display:flex;gap:10px;width:100%;flex-wrap:wrap}
.drop .rowf input{flex:1}

/* ---- דוח קליטה ---- */
.meas{display:grid;grid-template-columns:repeat(auto-fit,minmax(184px,1fr));gap:13px}
.mc{background:var(--card);border:1px solid var(--line);border-radius:var(--r-in);
    padding:14px 16px;display:flex;flex-direction:column;gap:6px}
.mc.bad{border-color:var(--orange-bd);background:var(--orange-soft)}
.mc .mn{font-family:var(--kick);font-size:10.5px;letter-spacing:.16em;color:var(--muted)}
.mc .val{font-family:var(--display);font-size:26px;font-variant-numeric:tabular-nums}
.mc.ok .val{color:var(--blue-txt)}
.mc.bad .val{color:var(--orange-txt)}
.mc .tg{font-size:12.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.f2{display:grid;grid-template-columns:120px 1fr;gap:18px;align-items:start;background:var(--card);
    border:1px solid var(--line);border-radius:var(--r-card);padding:16px 18px}
.f2 .band{font-family:var(--display);font-size:19px;color:var(--orange-txt);font-variant-numeric:tabular-nums}
.f2 .ftx b{font-family:var(--display);font-size:19px;font-weight:400;display:block;margin-bottom:4px}
.f2 .ftx p{margin:0;font-size:14.5px;color:var(--ink-soft)}
.f2 .fix{margin-top:10px;font-size:13.5px;background:var(--paper);border:1px solid var(--line);
         border-radius:999px;padding:6px 14px;display:inline-block}

/* ---- אדם ---- */
.person{display:flex;align-items:flex-start;gap:20px;flex-wrap:wrap}
.ava{width:70px;height:70px;border-radius:50%;background:var(--orange-soft);border:1px solid var(--orange-bd);
     display:grid;place-items:center;font-family:var(--display);font-size:29px;color:var(--orange-txt);flex:none}
.figs{display:flex;gap:26px}
.figs div{display:flex;flex-direction:column}
.figs b{font-family:var(--display);font-size:30px;font-weight:400;font-variant-numeric:tabular-nums}
.figs span{font-family:var(--kick);font-size:10.5px;letter-spacing:.16em;color:var(--muted)}
.dl{display:flex;flex-direction:column}
.dl div{display:flex;justify-content:space-between;gap:16px;padding:9px 0;
        border-bottom:1px solid var(--line-soft);font-size:14.5px}
.dl div:last-child{border-bottom:0}
.dl .k{color:var(--muted)}
.notes{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:12px}
.notes li{font-size:14.5px;line-height:1.55}
.notes li span{display:block;font-family:var(--kick);font-size:10.5px;letter-spacing:.14em;
               color:var(--muted);margin-top:4px}

.empty{border:1px dashed var(--line);border-radius:var(--r-card);padding:26px;color:var(--muted);
       display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.empty b{font-family:var(--display);font-size:20px;font-weight:400;color:var(--ink)}
.err{background:var(--orange-soft);border:1px solid var(--orange-bd);border-radius:var(--r-in);
     padding:12px 16px;color:var(--orange-txt);font-size:14.5px}

.toast{position:fixed;inset-inline-start:50%;transform:translateX(-50%);bottom:26px;z-index:50;
  background:var(--ink);color:var(--paper);padding:12px 22px;border-radius:999px;font-size:14.5px;
  box-shadow:0 12px 30px rgba(0,0,0,.25);opacity:0;pointer-events:none;transition:opacity .2s,bottom .2s}
.toast.show{opacity:1;bottom:34px}

@media (max-width:900px){
  .shell{grid-template-columns:1fr}
  .side{border-inline-end:0;border-bottom:1px solid var(--line-soft)}
  .side nav{flex-direction:row;overflow-x:auto}
  .side nav button{white-space:nowrap}
  .side .gap,.side .nl{display:none}
  .side .foot{margin-top:14px}
  main{padding:22px 18px 60px}
  .two{grid-template-columns:1fr}
  .toc .row{grid-template-columns:1fr;gap:8px}
  .job{grid-template-columns:1fr;gap:6px}
  .f2{grid-template-columns:1fr;gap:10px}
}
@media (prefers-reduced-motion:reduce){*{transition:none !important}}