html{-webkit-text-size-adjust:100%}
body{margin:0}
:root{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
:root{
--bg:#EDF0F2; --panel:#FFFFFF; --ink:#16212B; --muted:#5C6B78; --line:#D5DCE2;
--accent:#1E5A96; --accent-soft:#E2ECF6; --warn:#B4610E; --warn-soft:#FBEEDD; --ok:#2D7A4B; --ok-soft:#E1F1E7; --danger:#B3261E;
--field:#F6F8F9;
--f-display:"Secular One","Assistant",system-ui,sans-serif;
--f-body:"Assistant",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
--f-mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
--r:8px;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
--bg:#0F161C; --panel:#17212A; --ink:#E6ECF1; --muted:#93A3B1; --line:#2A3743;
--accent:#6FA8E0; --accent-soft:#1B2D3F; --warn:#E8A35A; --warn-soft:#3A2A17; --ok:#6CC490; --ok-soft:#173326; --danger:#F08A82;
--field:#1D2832; color-scheme:dark}}
:root[data-theme="dark"]{
--bg:#0F161C; --panel:#17212A; --ink:#E6ECF1; --muted:#93A3B1; --line:#2A3743;
--accent:#6FA8E0; --accent-soft:#1B2D3F; --warn:#E8A35A; --warn-soft:#3A2A17; --ok:#6CC490; --ok-soft:#173326; --danger:#F08A82;
--field:#1D2832; color-scheme:dark}
*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:16px;line-height:1.45;direction:rtl}
button,input,textarea,select{font:inherit;color:inherit}
.wrap{max-width:1180px;margin:0 auto;padding-block:16px 48px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
header.top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.brand{display:flex;flex-direction:column}
.brand h1{font-family:var(--f-display);font-weight:400;font-size:1.6rem;margin:0;line-height:1.1}
.brand span{color:var(--muted);font-size:.88rem}
.tools{display:flex;gap:8px;flex-wrap:wrap}
.btn{border:1px solid var(--line);background:var(--panel);border-radius:var(--r);padding:8px 14px;cursor:pointer;font-weight:600;display:inline-flex;align-items:center;gap:6px;min-height:40px}
.btn:hover{border-color:var(--accent)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--panel)}
.btn.ghost{background:transparent;border-color:transparent;color:var(--accent);padding:6px 8px;min-height:32px}
.btn.danger{color:var(--danger)}
.btn.danger.arm{background:var(--danger);color:var(--panel);border-color:var(--danger)}
.btn:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,.row-item:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
svg.i{width:18px;height:18px;flex:none}
/* Lock */
.lock{max-width:420px;margin:8vh auto 0;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:28px 24px;display:flex;flex-direction:column;gap:14px}
.lock h2{font-family:var(--f-display);font-weight:400;margin:0;font-size:1.4rem}
.lock p{margin:0;color:var(--muted)}
.lock .err{color:var(--danger);font-weight:600;min-height:1.2em}
.note{font-size:.88rem;background:var(--warn-soft);color:var(--ink);border-radius:var(--r);padding:10px 12px}
/* App layout */
.app{display:grid;grid-template-columns:340px minmax(0,1fr);gap:16px;align-items:start}
@media (max-width:900px){.app{grid-template-columns:minmax(0,1fr)} .app.has-open .index{display:none} .app:not(.has-open) .file{display:none}}
.index{background:var(--panel);border:1px solid var(--line);border-radius:12px;overflow:hidden;position:sticky;top:calc(env(safe-area-inset-top,0px) + 12px)}
@media (max-width:900px){.index{position:static}}
.index .head{padding:12px;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:10px}
.search{width:100%;border:1px solid var(--line);background:var(--field);border-radius:var(--r);padding:9px 12px}
.list{max-height:70vh;overflow:auto}
@media (max-width:900px){.list{max-height:none}}
.row-item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;padding:12px;border-bottom:1px solid var(--line);cursor:pointer;background:none;border-inline:0;border-top:0;width:100%;text-align:right}
.row-item:hover{background:var(--field)}
.row-item.active{background:var(--accent-soft)}
.row-item .n{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.row-item .s{color:var(--muted);font-size:.86rem;grid-column:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.row-item .pill{grid-row:1/3;grid-column:2;align-self:center}
.pill{font-size:.78rem;font-weight:700;border-radius:999px;padding:2px 9px;white-space:nowrap;font-variant-numeric:tabular-nums}
.pill.open{background:var(--warn-soft);color:var(--warn)}
.pill.paid{background:var(--ok-soft);color:var(--ok)}
.empty{padding:28px 16px;color:var(--muted);text-align:center}
.count{color:var(--muted);font-size:.85rem}
/* Client file */
.file{display:flex;flex-direction:column;gap:14px;min-width:0}
.file-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.file-head h2{font-family:var(--f-display);font-weight:400;font-size:1.5rem;margin:0;flex:1;min-width:0;text-wrap:balance}
.saved{font-size:.85rem;color:var(--muted)}
.sec{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px;display:flex;flex-direction:column;gap:12px;min-width:0}
.sec h3{margin:0;font-size:.82rem;letter-spacing:.06em;color:var(--muted);font-weight:700;display:flex;align-items:center;justify-content:space-between;gap:8px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
label.f{display:flex;flex-direction:column;gap:4px;font-size:.85rem;color:var(--muted);font-weight:600;min-width:0}
label.f input,label.f textarea,.cell input,.cell select{border:1px solid var(--line);background:var(--field);border-radius:6px;padding:8px 10px;color:var(--ink);font-weight:400;font-size:1rem;width:100%;min-width:0}
textarea{resize:vertical;min-height:90px}
.mono{font-family:var(--f-mono);direction:ltr;text-align:left;font-size:.95rem}
.with-copy{display:flex;gap:6px}
.with-copy input{flex:1}
.icon-btn{border:1px solid var(--line);background:var(--panel);border-radius:6px;width:38px;min-width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:var(--muted)}
.icon-btn:hover{color:var(--accent);border-color:var(--accent)}
.icon-btn.del:hover{color:var(--danger);border-color:var(--danger)}
/* Repeating rows */
.rows{display:flex;flex-direction:column;gap:8px}
.r{display:grid;gap:8px;align-items:end;padding:10px;border:1px solid var(--line);border-radius:var(--r);background:var(--field)}
.r .cell{display:flex;flex-direction:column;gap:3px;min-width:0}
.r .cell span{font-size:.75rem;color:var(--muted);font-weight:600}
.r .cell input,.r .cell select{background:var(--panel)}
.r .acts{display:flex;gap:6px}
.r.eq{grid-template-columns:1.1fr 1.1fr .5fr 1fr 1.4fr auto}
.r.cam{grid-template-columns:1.2fr 1.3fr .7fr 1.4fr auto}
.r.port{grid-template-columns:.8fr .8fr 1.6fr auto}
.r.cred{grid-template-columns:1.2fr 1.2fr 1.4fr auto}
.r.pay{grid-template-columns:1fr 1.8fr 1fr .9fr auto}
@media (max-width:700px){
.r.eq,.r.cam,.r.port,.r.cred,.r.pay{grid-template-columns:1fr 1fr}
.r .wide{grid-column:1/-1}
.r .acts{grid-column:1/-1;justify-content:flex-end}
}
.add{align-self:flex-start}
.totals{display:flex;gap:10px;flex-wrap:wrap}
.tot{flex:1;min-width:120px;border:1px solid var(--line);border-radius:var(--r);padding:10px 12px}
.tot b{display:block;font-size:1.25rem;font-variant-numeric:tabular-nums;font-family:var(--f-mono);direction:ltr;text-align:right}
.tot small{color:var(--muted);font-weight:600}
.tot.warn{background:var(--warn-soft);border-color:transparent}
.tot.warn b{color:var(--warn)}
.devs{display:flex;flex-direction:column;gap:12px}
.dev{border:1px solid var(--line);border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:10px;background:var(--field)}
.dev .cell{display:flex;flex-direction:column;gap:3px;min-width:0}
.dev .cell span{font-size:.75rem;color:var(--muted);font-weight:600}
.dev .cell input{border:1px solid var(--line);background:var(--panel);border-radius:6px;padding:8px 10px;color:var(--ink);font-size:1rem;width:100%;min-width:0}
.dev-top{display:flex;align-items:center;gap:8px}
.dev-top h4{margin:0;flex:1;min-width:0;font-size:1.05rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dev-n{font-family:var(--f-mono);font-size:.8rem;color:var(--accent);background:var(--accent-soft);border-radius:6px;padding:2px 7px;font-variant-numeric:tabular-nums}
.dev-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.dev-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.dev-sub{border-top:1px dashed var(--line);border-bottom:1px dashed var(--line);padding-block:8px;display:flex;flex-direction:column;gap:6px}
.sub-l{font-size:.75rem;letter-spacing:.06em;color:var(--muted);font-weight:700}
.prow{display:grid;grid-template-columns:110px minmax(0,1fr) auto;gap:8px;align-items:end}
.prow .acts{display:flex;gap:6px}
@media (max-width:700px){.dev-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dev-grid.two{grid-template-columns:minmax(0,1fr)}.prow{grid-template-columns:90px minmax(0,1fr)}.prow .acts{grid-column:1/-1;justify-content:flex-end}}
.toast{position:fixed;bottom:calc(16px + env(safe-area-inset-bottom,0px));left:50%;transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:var(--r);font-weight:600;z-index:20;max-width:calc(100% - 32px)}
.placeholder{background:var(--panel);border:1px dashed var(--line);border-radius:12px;padding:40px 20px;text-align:center;color:var(--muted)}
.hint{font-size:.82rem;color:var(--muted)}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}