:root{
  --bg:#f3f2ee;--surface:#fff;--ink:#1b1b1a;--mut:#5f5e5a;--line:#e3e1da;--line2:#edebe5;--ctrl:#cfcdc5;
  --side:#1e2126;--side-on:#2f343b;--side-txt:#d9d8d2;--side-mut:#9a9b96;
  --red:#8c1d16;--red-bg:#fbe9e7;--red-line:#f0b6b0;--orange:#8a3d05;--orange-bg:#fdf1e3;--orange-line:#f2cfa4;
  --blue:#1a4a8f;--blue-bg:#e7eefb;--green:#1f5e3a;--green-bg:#e6f3ec;--gray:#4a4945;--gray-bg:#ebeae5;
  --mono:'IBM Plex Mono',Menlo,Consolas,monospace;--sans:'IBM Plex Sans',-apple-system,Helvetica,sans-serif;
}
@media (prefers-color-scheme:dark){:root{
  --bg:#17181a;--surface:#1f2124;--ink:#ecebe6;--mut:#a4a39d;--line:#2f3135;--line2:#2a2c30;--ctrl:#44464b;
  --red:#f2a59d;--red-bg:#3a1f1c;--red-line:#5c2b26;--orange:#f2c78f;--orange-bg:#3a2a16;--orange-line:#5c4222;
  --blue:#9dbdf0;--blue-bg:#1c2a42;--green:#9dd6b3;--green-bg:#1c3326;--gray:#c9c8c2;--gray-bg:#2f3135;
}}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:14px;line-height:1.4}
a{color:var(--blue)}
.app{display:flex;min-height:100vh}
.side{width:232px;flex-shrink:0;background:var(--side);padding:24px 16px;display:flex;flex-direction:column;gap:4px;position:sticky;top:0;height:100vh}
.brand{padding:4px 14px 20px}.brand small{display:block;font-size:12px;letter-spacing:.12em;color:var(--side-mut);font-weight:600}.brand b{font-size:18px;color:#fff}
.nav{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-radius:8px;text-decoration:none;color:var(--side-txt);font-weight:500}
.nav:hover{background:#2a2e34;color:#fff}.nav.on{background:var(--side-on);color:#fff}
.nav .cnt{font-family:var(--mono);font-size:12px;color:var(--side-mut)}.nav .cnt.warn{color:#f2a59d}.nav .cnt.amber{color:#f2c78f}
.side .foot{margin-top:auto;padding:12px 14px;border-top:1px solid var(--side-on);font-size:12px;color:var(--side-mut);line-height:18px}
main{flex-grow:1;min-width:0;display:flex;flex-direction:column}
header.top{height:64px;padding:0 32px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:16px}
header.top h1{margin:0;font-size:20px;font-weight:600}header.top .sub{color:var(--mut);font-size:13px;margin-left:14px}
.content{padding:24px 32px 40px;display:flex;flex-direction:column;gap:24px}
.tiles{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.tile{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:18px 20px;display:flex;flex-direction:column;gap:6px;text-decoration:none;color:inherit}
.tile:hover{border-color:var(--ctrl)}.tile.red{border-color:var(--red-line)}.tile.orange{border-color:var(--orange-line)}
.tile .n{font-size:32px;font-weight:600;line-height:36px;font-family:var(--mono)}.tile .l{font-size:13px;font-weight:600}.tile .s{font-size:12px;color:var(--mut)}
.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.card-h{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid var(--line)}
.card-h h2{margin:0;font-size:15px;font-weight:600}.card-h .s{font-size:12px;color:var(--mut)}
.row{display:flex;align-items:center;gap:16px;padding:12px 20px;border-top:1px solid var(--line2)}.row:first-child{border-top:0}
.row .id{font-family:var(--mono);font-size:12px;color:var(--mut);width:36px;flex-shrink:0}
.row .t{flex-grow:1;min-width:0}.row .t a{color:var(--ink);text-decoration:none;font-weight:500}.row .t a:hover{text-decoration:underline}
.row .who{width:72px;flex-shrink:0}.row .r{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.sub{font-size:12px;color:var(--mut);margin-top:2px}
.chip{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:600;line-height:16px;white-space:nowrap}
.c-red{background:var(--red-bg);color:var(--red)}.c-orange{background:var(--orange-bg);color:var(--orange)}.c-blue{background:var(--blue-bg);color:var(--blue)}
.c-green{background:var(--green-bg);color:var(--green)}.c-gray{background:var(--gray-bg);color:var(--gray)}
.mono{font-family:var(--mono);font-size:12px}.mut{color:var(--mut)}
.empty{padding:24px 20px;color:var(--mut)}
.tabs{display:flex;gap:4px;flex-wrap:wrap}
.tab{font:inherit;font-size:13px;font-weight:600;padding:8px 14px;border-radius:8px;border:1px solid transparent;background:transparent;color:var(--mut);text-decoration:none;min-height:36px;display:inline-flex;align-items:center}
.tab.on{background:var(--surface);border-color:var(--ctrl);color:var(--ink)}
.filters{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.filters label{font-size:12px;color:var(--mut);font-weight:600}
.sel,.inp{font:inherit;font-size:13px;padding:8px 10px;border:1px solid var(--ctrl);border-radius:8px;background:var(--surface);color:var(--ink);min-height:36px}
.btn{font:inherit;font-size:13px;font-weight:600;padding:8px 14px;border-radius:8px;border:1px solid var(--ctrl);background:var(--surface);color:var(--ink);cursor:pointer;min-height:36px;text-decoration:none;display:inline-flex;align-items:center}
table{border-collapse:collapse;width:100%}
th{text-align:left;font-size:12px;font-weight:600;color:var(--mut);padding:10px 14px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--surface) 92%,var(--bg));white-space:nowrap}
td{padding:11px 14px;border-bottom:1px solid var(--line2);vertical-align:top}
td .t{font-weight:500;color:var(--ink);text-decoration:none}td .t:hover{text-decoration:underline}
.dot{display:inline-block;width:8px;height:8px;border-radius:999px;margin-right:6px;vertical-align:middle}
.legend{display:flex;gap:20px;flex-wrap:wrap;padding:12px 4px 0;font-size:12px;color:var(--mut)}
.crumbs{display:flex;align-items:center;gap:10px;font-size:13px}
.detail{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:24px;align-items:start}
.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.fact{padding:16px 20px;display:flex;flex-direction:column;gap:6px;border-top:1px solid var(--line2);border-right:1px solid var(--line2)}
.fact:nth-child(-n+3){border-top:0}.fact:nth-child(3n){border-right:0}
.fact .l{font-size:12px;color:var(--mut);font-weight:600}.fact .v{font-size:16px;font-weight:600}.fact .s{font-size:12px;color:var(--mut)}
.fact.red{background:color-mix(in srgb,var(--red-bg) 50%,var(--surface))}.fact.orange{background:color-mix(in srgb,var(--orange-bg) 50%,var(--surface))}
.ev{display:flex;gap:16px;padding:12px 20px;border-top:1px solid var(--line2);align-items:flex-start}
.ev .tm{font-family:var(--mono);font-size:12px;color:var(--mut);width:110px;flex-shrink:0;padding-top:2px}
.ev .w{font-size:12px;font-weight:600;width:64px;flex-shrink:0;padding-top:2px}.ev .b{flex-grow:1;line-height:19px}
.q{margin:6px 0 0;padding:8px 12px;background:var(--bg);border:1px solid var(--line);border-radius:8px;font-style:italic}
.tg{font-size:13px;line-height:20px;background:var(--blue-bg);border:1px solid var(--line);border-radius:12px;padding:12px 14px;white-space:pre-line;font-family:var(--sans)}
h2.h{font-size:13px;font-weight:600;color:var(--mut);margin:0 0 8px;letter-spacing:.04em;text-transform:uppercase}
.pad{padding:20px}
@media (max-width:900px){
  .app{flex-direction:column}
  .side{width:auto;height:auto;position:static;flex-direction:row;flex-wrap:wrap;padding:12px;gap:2px}
  .brand{width:100%;padding:4px 10px 8px}.side .foot{display:none}
  .nav{padding:8px 10px;font-size:13px}.nav .cnt{margin-left:6px}
  header.top{height:auto;padding:16px;flex-wrap:wrap}.content{padding:16px;gap:16px}
  .tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.two{grid-template-columns:1fr}.detail{grid-template-columns:1fr}.facts{grid-template-columns:1fr}
  .fact{border-right:0}.fact:nth-child(-n+3){border-top:1px solid var(--line2)}.fact:first-child{border-top:0}
  .row{flex-wrap:wrap}.row .r{align-items:flex-start}
  table,thead,tbody,tr,td,th{display:block}thead{display:none}
  tr{border-bottom:1px solid var(--line);padding:10px 14px}td{padding:3px 0;border:0}
  td[data-l]::before{content:attr(data-l) " ";color:var(--mut);font-size:12px}
}

/* ---- doplněné proměnné (dřív se na ně odkazovalo, ale nebyly definované) ---- */
:root{--card:var(--surface);--chip:var(--ctrl);--accent:var(--blue)}

/* ---- přihlašovací stránka (magic link z Telegramu) ---- */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}
.login-card{max-width:420px;width:100%;background:var(--card);border:1px solid var(--line);
  border-radius:14px;padding:28px}
.login-card h1{margin:18px 0 10px;font-size:22px}
.login-card p{margin:0 0 12px;color:var(--mut);line-height:1.55}
.login-card code{font-family:"IBM Plex Mono",monospace;background:var(--chip);padding:2px 6px;border-radius:5px}
.login-warn{color:var(--red)!important}
.login-foot{margin-top:18px;padding-top:14px;border-top:1px solid var(--line);font-size:13px;color:var(--mut)}

/* ---- akce na detailu úkolu ---- */
.actions,.reply,.edit{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 14px}
.reply{flex-direction:column;align-items:stretch}
.reply textarea{width:100%;font:inherit;padding:9px 11px;border-radius:8px;
  border:1px solid var(--line);background:var(--card);color:inherit;resize:vertical}
.reply button{align-self:flex-start}
.btn.primary{background:var(--accent,#2f6feb);color:#fff;border-color:transparent}
.btn.danger{color:var(--red);border-color:var(--red)}
.confirm-box{border:1px solid var(--red);border-radius:10px;padding:12px;margin:0 0 14px;
  display:flex;gap:8px;align-items:center;flex-wrap:wrap}

/* ---- rozbalovací rychlý panel v seznamu ---- */
.exp-btn{font:inherit;color:inherit;background:none;border:1px solid transparent;border-radius:6px;
  padding:2px 6px;cursor:pointer}
.exp-btn:hover{border-color:var(--line);background:var(--ctrl)}
.exp-btn[aria-expanded="true"]{background:var(--ctrl);border-color:var(--line)}
tr.exp>td{background:var(--ctrl);border-top:0;padding:12px 14px 16px}
.quick{display:flex;flex-direction:column;gap:10px}
.quick-acts{display:flex;flex-wrap:wrap;gap:8px;margin:0}
.quick-reply{display:flex;gap:8px;margin:0}
.quick-reply .inp{flex:1;min-width:0}
.quick-meta{display:flex;flex-wrap:wrap;gap:14px;font-size:13px;color:var(--mut);align-items:center}
@media(max-width:760px){.quick-reply{flex-direction:column}}

/* hidden musí přebít i rozpad tabulky na karty pod 900 px */
[hidden]{display:none!important}

/* řádek je klikací – ať je to vidět */
tr.rowt{cursor:pointer}
tr.rowt:hover{background:var(--ctrl)}
.exp-btn{display:inline-flex;align-items:center;gap:4px}
.caret{display:inline-block;transition:transform .12s;color:var(--mut)}
.exp-btn[aria-expanded="true"] .caret{transform:rotate(90deg)}

/* ---- hláška po akci ---- */
.flash{margin:14px 24px -6px;padding:11px 14px;border-radius:9px;font-size:14px;line-height:1.5;
  border:1px solid var(--line);background:var(--surface);white-space:pre-line}
.flash.ok{border-color:var(--green);}
.flash.warn{border-color:var(--orange)}
@media(max-width:900px){.flash{margin:12px 16px -4px}}
