:root{--ink:#222;--muted:#666;--line:#bbb;--bg:#fafafa;--warn:#b00020;--warnbg:#fde7ea;--ok:#2e7d32;--draft:#8a6d00;--draftbg:#fff6cc}
*{box-sizing:border-box}
body{font:14px/1.45 ui-monospace,Menlo,Consolas,monospace;color:var(--ink);background:var(--bg);margin:0}
.banner{background:var(--warnbg);color:var(--warn);border-bottom:3px dashed var(--warn);padding:10px 16px;position:sticky;top:0;z-index:9}
header{padding:12px 16px;border-bottom:1px solid var(--line)}
h1{font-size:18px;margin:0 0 8px}
h2{font-size:16px;margin:0 0 8px}
.tag{font-size:11px;border:1px solid var(--line);padding:1px 6px;margin-left:6px;color:var(--muted)}
nav button{font:inherit;background:#fff;border:1px solid var(--line);padding:6px 10px;margin-right:4px;cursor:pointer}
nav button.active{background:var(--ink);color:#fff}
main{padding:16px}
.tab{display:none}.tab.active{display:block}
.muted{color:var(--muted);font-weight:normal;font-size:12px}
.hint{color:var(--muted);border-left:3px solid var(--line);padding:4px 8px;margin:6px 0 12px}
.hint.important{border-color:var(--warn);color:var(--ink);background:var(--draftbg)}
table{border-collapse:collapse;width:100%;background:#fff;font-size:12px}
th,td{border:1px solid var(--line);padding:4px 6px;text-align:left;vertical-align:top}
th{background:#eee}
.filters label{margin-right:12px}
select,input,textarea{font:inherit}
.pill{display:inline-block;border:1px solid var(--line);border-radius:3px;padding:0 5px;font-size:11px;background:#f3f3f3}
.pill.syn{background:#e8e8ff;border-color:#88a}
.pill.status{background:#eef}
.pill.flag{background:var(--warnbg);color:var(--warn);border-color:var(--warn)}
.pill.draft{background:var(--draftbg);color:var(--draft);border-color:var(--draft)}
.pill.ok{background:#e6f4e6;color:var(--ok);border-color:var(--ok)}
.bar{display:inline-block;height:8px;background:#999;vertical-align:middle;margin-right:4px}
.cols{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.frame{border:2px dashed var(--line);background:#fff;padding:8px;min-height:160px;position:relative}
.frame .ph{height:120px;background:repeating-linear-gradient(45deg,#eee,#eee 10px,#f7f7f7 10px,#f7f7f7 20px);display:flex;align-items:center;justify-content:center;color:var(--muted)}
.track{position:relative;height:18px;background:#eee;border:1px solid var(--line);margin:6px 0}
.seg{position:absolute;top:0;bottom:0;background:#888;opacity:.8}
.seg.cand{background:#c66}
.card{border:1px solid var(--line);background:#fff;padding:10px;margin-bottom:10px}
.tl{list-style:none;padding:0;margin:0;border-left:2px solid var(--line)}
.tl li{padding:4px 0 4px 12px;position:relative}
.tl li::before{content:"";position:absolute;left:-6px;top:10px;width:8px;height:8px;border-radius:50%;background:var(--ink)}
.tl li.deadline::before{background:var(--warn)}
.tl li.notice::before{background:var(--draft)}
.tl li.response::before{background:var(--ok)}
.warnbox{border:2px solid var(--warn);background:var(--warnbg);padding:8px;margin:8px 0}
.big{font-size:28px;font-weight:bold}
button.disabled{opacity:.5;cursor:not-allowed}
textarea{width:100%;min-height:160px}
footer{padding:12px 16px;border-top:1px solid var(--line);color:var(--muted);font-size:12px}
