*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0}[hidden]{display:none!important}
/* Layout: nástroj — vlevo zápis práce, vpravo měsíční vyhodnocení minima, pod tím rozpis po lidech a záznamy */
:root{
  --bg:#f3f6f5; --surface:#ffffff; --sunk:#e8eeec; --line:#d5dfdc;
  --fg:#18231f; --muted:#5b6b66; --accent:#1f7a6a; --accent-ink:#ffffff; --accent-soft:#d8ece7;
  --ok:#2c7a3f; --ok-soft:#dcefe0; --bad:#b4372b; --bad-soft:#f6dedb; --wait:#8a6a12; --wait-soft:#f3ead0;
  --display:"Bricolage Grotesque", "Segoe UI", system-ui, sans-serif;
  --body:"Figtree", "Segoe UI", system-ui, -apple-system, sans-serif;
  --r:10px;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#111816; --surface:#18211e; --sunk:#202b28; --line:#2e3c38;
  --fg:#e5ece9; --muted:#9aaba6; --accent:#5cc2ad; --accent-ink:#0d1714; --accent-soft:#1d3833;
  --ok:#7fd093; --ok-soft:#1f3526; --bad:#f08a7e; --bad-soft:#3d2320; --wait:#e2c264; --wait-soft:#3a3220;
  color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#111816; --surface:#18211e; --sunk:#202b28; --line:#2e3c38;
  --fg:#e5ece9; --muted:#9aaba6; --accent:#5cc2ad; --accent-ink:#0d1714; --accent-soft:#1d3833;
  --ok:#7fd093; --ok-soft:#1f3526; --bad:#f08a7e; --bad-soft:#3d2320; --wait:#e2c264; --wait-soft:#3a3220;
  color-scheme:dark}
body{background:var(--bg);color:var(--fg);font-family:var(--body);font-size:15px;line-height:1.5}
.wrap{max-width:1120px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:20px 48px;display:grid;gap:20px}
h1,h2,h3{font-family:var(--display);margin:0;text-wrap:balance;letter-spacing:-.01em}
h1{font-size:1.9rem;line-height:1.1}
h2{font-size:1.2rem}
h3{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-family:var(--body);font-weight:600}
button,input,textarea,select{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.top{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:12px}
.top p{margin:4px 0 0;color:var(--muted)}
.month{display:flex;align-items:center;gap:6px;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:4px}
.month span{min-width:9.5em;text-align:center;font-weight:600}
.icon-btn{border:0;background:transparent;border-radius:999px;width:34px;height:34px;cursor:pointer;font-size:1.1rem}
.icon-btn:hover{background:var(--sunk)}
.grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:20px;align-items:start}
@media (max-width:820px){.grid{grid-template-columns:1fr}}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:18px;display:grid;gap:16px;min-width:0}
.panel-head{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
.link-btn{border:0;background:none;color:var(--accent);cursor:pointer;font-weight:600;padding:2px 0}
.people{display:flex;flex-wrap:wrap;gap:8px}
.chip{border:1px solid var(--line);background:var(--bg);border-radius:999px;padding:7px 14px;cursor:pointer;font-weight:500}
.chip[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.field{display:grid;gap:6px}
.field label,.lbl{font-size:.85rem;font-weight:600;color:var(--muted)}
input[type=date],input[type=text],textarea{background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:8px 10px;width:100%;box-sizing:border-box}
textarea{resize:vertical;min-height:2.6em}
.group{display:grid;gap:6px}
.tasks{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:6px}
.task{display:flex;align-items:center;gap:8px;padding:7px 10px;border:1px solid var(--line);border-radius:8px;cursor:pointer;background:var(--bg)}
.task:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}
.task input{accent-color:var(--accent);width:16px;height:16px;margin:0}
.primary{background:var(--accent);color:var(--accent-ink);border:0;border-radius:8px;padding:11px 16px;font-weight:600;cursor:pointer}
.primary:disabled{opacity:.5;cursor:not-allowed}
.msg{font-size:.9rem;color:var(--muted);min-height:1.3em;margin:0}
.msg.err{color:var(--bad)}
.verdict{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:8px;font-weight:600}
.verdict .dot{width:12px;height:12px;border-radius:50%;background:currentColor;flex:none}
.v-ok{background:var(--ok-soft);color:var(--ok)}
.v-bad{background:var(--bad-soft);color:var(--bad)}
.v-wait{background:var(--wait-soft);color:var(--wait)}
.req{display:grid;gap:4px}
.req-row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 10px;align-items:center;padding:8px 0;border-top:1px solid var(--line)}
.req-row>div:first-child{flex:1 1 10em;min-width:10em}
.req-row:first-child{border-top:0}
.req-name{font-weight:500}
.req-sub{font-size:.8rem;color:var(--muted)}
.slots{display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-end}
.slot{font-size:.75rem;font-weight:600;padding:3px 8px;border-radius:6px;white-space:nowrap;font-variant-numeric:tabular-nums}
.s-ok{background:var(--ok-soft);color:var(--ok)}
.s-bad{background:var(--bad-soft);color:var(--bad)}
.s-wait{background:var(--wait-soft);color:var(--wait)}
.s-future{background:var(--sunk);color:var(--muted)}
.tablewrap{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-variant-numeric:tabular-nums;font-size:.92rem}
th,td{padding:7px 10px;text-align:right;border-bottom:1px solid var(--line);white-space:nowrap}
th:first-child,td:first-child{text-align:left;white-space:normal;min-width:11em}
thead th{font-size:.8rem;color:var(--muted);font-weight:600}
tr.sec td{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:600;padding-top:14px;border-bottom:0}
td.zero{color:var(--line)}
tfoot td{font-weight:600;border-bottom:0}
.log{display:grid;gap:0}
.entry{display:grid;grid-template-columns:5.5em minmax(0,1fr) auto;gap:12px;padding:10px 0;border-top:1px solid var(--line);align-items:start}
.entry:first-child{border-top:0}
.e-date{font-variant-numeric:tabular-nums;color:var(--muted);font-size:.9rem}
.e-who{font-weight:600}
.e-tasks{font-size:.9rem}
.e-note{font-size:.85rem;color:var(--muted);font-style:italic}
.del{border:1px solid transparent;background:none;color:var(--muted);border-radius:6px;padding:3px 8px;cursor:pointer;font-size:.8rem}
.del:hover{border-color:var(--line)}
.del.arm{color:var(--bad);border-color:var(--bad)}
.empty{color:var(--muted);padding:8px 0}
.names{display:grid;gap:8px}
.names-row{display:flex;gap:8px;flex-wrap:wrap}
.names-row input{flex:1 1 120px}
.ghost{background:var(--sunk);border:0;border-radius:8px;padding:9px 14px;cursor:pointer;font-weight:600}
.status-note{font-size:.85rem;color:var(--muted)}
.dur{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.dur input{width:7em;flex:none}
.dur .chip{padding:5px 11px;font-size:.88rem}
tr.time td{color:var(--accent);font-weight:700}
.e-min{font-size:.85rem;color:var(--accent);font-weight:600;font-variant-numeric:tabular-nums}
@media (prefers-reduced-motion:no-preference){.chip,.task,.primary{transition:background .15s,border-color .15s}}
table.audit td{vertical-align:top;text-align:left;white-space:normal}
table.audit td.when{white-space:nowrap;color:var(--muted);min-width:0;font-size:.85rem}
table.audit td.what{min-width:14em}
table.audit td.dev{font-size:.82rem;color:var(--muted);min-width:11em}
.act{display:inline-block;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:2px 7px;border-radius:5px;margin-right:6px}
.a-create{background:var(--ok-soft);color:var(--ok)}
.a-delete{background:var(--bad-soft);color:var(--bad)}
.a-people,.a-login{background:var(--sunk);color:var(--muted)}
.a-login_failed{background:var(--wait-soft);color:var(--wait)}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.8rem}
@media (max-width:640px){
  table.audit,table.audit tbody{display:block}
  table.audit thead{display:none}
  table.audit tr{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;padding:10px 0;border-bottom:1px solid var(--line)}
  table.audit td{border:0;padding:0;min-width:0}
  table.audit td.what,table.audit td.dev{grid-column:1 / -1;min-width:0}
  table.audit td.when{order:0}
}

/* ---------- device tuning ---------- */
/* iPhone home-screen app: content clears the notch / home indicator */
body{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);-webkit-tap-highlight-color:transparent}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);background:var(--bg);z-index:10}
button,.chip,.task,a{touch-action:manipulation}
input[type=number]{background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:8px 10px;box-sizing:border-box}
/* iOS zooms into fields under 16px; keep form text at 16px */
input,textarea,select{font-size:16px}
input[type=date]{min-height:44px;-webkit-appearance:none;appearance:none;display:flex;align-items:center}
input[type=date]::-webkit-date-and-time-value{text-align:left}
.submit-bar{display:grid}
.primary{min-height:48px;font-size:1rem}

/* touch screens: 44px tap targets */
@media (pointer:coarse){
  body{font-size:16px}
  .chip{min-height:44px;padding:9px 16px}
  .dur .chip{min-height:40px;padding:7px 12px}
  .task{min-height:48px;padding:10px 12px}
  .task input{width:20px;height:20px}
  .icon-btn{width:44px;height:44px}
  .link-btn{min-height:40px}
  .del{min-height:40px;padding:8px 12px}
  #editNames,.panel-head a.link-btn{display:inline-flex;align-items:center}
}

/* phones */
@media (max-width:640px){
  .wrap{padding-block:12px 32px;gap:14px}
  h1{font-size:1.6rem}
  .top p{font-size:.92rem}
  .top{align-items:center}
  .month{width:100%;justify-content:space-between}
  .panel{padding:16px 14px;border-radius:12px}
  .tasks{grid-template-columns:1fr}
  /* keep the save button reachable while scrolling the form */
  .submit-bar{position:sticky;bottom:calc(10px + env(safe-area-inset-bottom,0px));z-index:5;padding-top:8px;background:linear-gradient(transparent,var(--surface) 40%)}
  .entry{grid-template-columns:3.6em minmax(0,1fr);row-gap:4px}
  .entry .del{grid-column:2;justify-self:start;margin-left:-12px}
}

/* desktop */
@media (hover:hover){
  .chip:hover{border-color:var(--accent)}
  .task:hover{border-color:var(--accent)}
  .primary:hover:not(:disabled){filter:brightness(1.08)}
  .del:hover{color:var(--bad)}
}
@media (min-width:821px){
  .eval-panel{position:sticky;top:16px}
}
.pair{display:grid;gap:20px}
@media (min-width:1100px){
  .wrap{max-width:1320px}
  .pair{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}
  table.audit td.what{min-width:0}
}

#noteLabel.need{color:var(--accent)}
textarea.need{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
