:root{--brand:#0e7c86;--brand-dark:#0a5c63;--brand-soft:#e8f4f5;--bg:#f6f8f8;--card:#ffffff;--text:#1f2a2e;--muted:#6b7c80;--line:#dce6e7;--ok:#1e8e3e;--ok-soft:#e6f4ea;--warn:#b26a00;--warn-soft:#fff4e0;--bad:#c5221f;--bad-soft:#fde8e7;--grey-soft:#eef1f2;--radius:10px}*{box-sizing:border-box}body,html{margin:0}body{font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text);font-size:15px;line-height:1.45}a{color:var(--brand-dark)}h1{font-size:1.35rem;margin:0 0 4px}h2{font-size:1.1rem;margin:0 0 12px}h3{font-size:1rem;margin:0 0 8px}.muted{color:var(--muted)}.small{font-size:.85rem}.topbar{background:var(--brand);color:#fff}.topbar .in{max-width:1100px;margin:0 auto;padding:12px 16px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}.topbar .brand{font-weight:700;color:#fff;text-decoration:none}.topbar nav{display:flex;gap:4px;flex:1 1;flex-wrap:wrap}.topbar nav a{color:#dff3f4;text-decoration:none;padding:6px 12px;border-radius:8px}.topbar nav a.on{background:rgba(255,255,255,.18);color:#fff;font-weight:600}.topbar .who{font-size:.85rem;color:#dff3f4;display:flex;gap:10px;align-items:center}.wrap{max-width:1100px;margin:0 auto;padding:20px 16px 48px}.narrow{max-width:420px;margin:48px auto;padding:0 16px}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:18px;margin-bottom:16px}.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));grid-gap:16px;gap:16px}.row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}.row>*{flex:1 1 160px}.spacer{flex:1 1}label{display:block;font-size:.85rem;color:var(--muted);margin:10px 0 4px}input,select,textarea{width:100%;padding:9px 10px;border:1px solid var(--line);border-radius:8px;font:inherit;background:#fff;color:var(--text)}input:focus,select:focus,textarea:focus{outline:2px solid var(--brand-soft);border-color:var(--brand)}textarea{min-height:64px;resize:vertical}.check{display:flex;gap:6px;align-items:center;margin:4px 12px 4px 0;color:var(--text);font-size:.9rem}.check input{width:auto}.checks{display:flex;flex-wrap:wrap}.btn,button{display:inline-block;padding:9px 14px;border-radius:8px;border:1px solid var(--brand);background:var(--brand);color:#fff;font:inherit;font-weight:600;cursor:pointer;text-decoration:none;text-align:center}.btn:hover,button:hover{background:var(--brand-dark)}.btn.ghost,button.ghost{background:#fff;color:var(--brand-dark)}button.ghost:hover{background:var(--brand-soft)}button.sm{padding:4px 10px;font-size:.82rem;font-weight:500}button.danger{background:#fff;color:var(--bad);border-color:var(--bad)}button.full{width:100%;margin-top:16px}button:disabled{opacity:.5;cursor:not-allowed}.flash{padding:10px 14px;border-radius:8px;margin-bottom:16px;font-size:.92rem;white-space:pre-line}.flash.ok{background:var(--ok-soft);color:#145c29;border:1px solid #b7dfc3}.flash.err{background:var(--bad-soft);color:#8a1714;border:1px solid #f3c1bf}.flash.info{background:var(--brand-soft);color:var(--brand-dark);border:1px solid #c4e2e4}.badge{display:inline-block;padding:2px 8px;border-radius:999px;font-size:.75rem;font-weight:600;background:var(--grey-soft);color:var(--muted);white-space:nowrap}.badge.ok{background:var(--ok-soft);color:var(--ok)}.badge.warn{background:var(--warn-soft);color:var(--warn)}.badge.bad{background:var(--bad-soft);color:var(--bad)}.badge.brand{background:var(--brand-soft);color:var(--brand-dark)}.tbl{width:100%;border-collapse:collapse;font-size:.9rem}.tbl th{text-align:left;font-weight:600;color:var(--muted);font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;padding:8px}.tbl td,.tbl th{border-bottom:1px solid var(--line)}.tbl td{padding:10px 8px;vertical-align:top}.scroll{overflow-x:auto}.slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(78px,1fr));grid-gap:6px;gap:6px}.slot{padding:8px 4px;border-radius:8px;text-align:center;font-size:.9rem;border:1px solid var(--line)}.slot.tersedia{padding:0;border:none}.slot.tersedia button{width:100%;padding:8px 4px;font-weight:600;background:#fff;color:var(--brand-dark);border:1px solid var(--brand)}.slot.tersedia button:hover{background:var(--brand);color:#fff}.slot.off{background:var(--grey-soft);color:#a8b4b6;text-decoration:line-through}.slot.short{background:var(--warn-soft);color:var(--warn);font-size:.8rem}.doc-block{margin-bottom:18px}.doc-block h3{display:flex;gap:8px;align-items:center}.cal{border-collapse:separate;border-spacing:4px;width:100%;min-width:760px;table-layout:fixed}.cal th{font-size:.8rem;color:var(--muted);font-weight:600;padding:4px}.cal th.today{color:var(--brand-dark)}.cal td{height:58px;border-radius:8px;padding:4px 6px;font-size:.78rem;vertical-align:top}.cal td.jam{width:52px;color:var(--muted);font-weight:600;text-align:right;background:none}.cal td.tersedia{background:#fff;border:1px dashed var(--line)}.cal td.diblokir{background:repeating-linear-gradient(45deg,#eef1f2,#eef1f2 6px,#e4e8e9 0,#e4e8e9 12px);color:var(--muted)}.cal td.terisi{background:var(--brand-soft);border-left:3px solid var(--brand)}.cal td.selesai{background:var(--ok-soft);border-left:3px solid var(--ok)}.cal td.noshow{background:var(--bad-soft);border-left:3px solid var(--bad)}.cal td.lanjut{background:var(--brand-soft);opacity:.7}.cal td.past{opacity:.55}.cal td.kosong{background:none}.cal .nm{font-weight:600;display:block;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cal form{display:inline}.cal button.sm{padding:2px 6px;font-size:.72rem;margin-top:2px}.legend{display:flex;gap:12px;flex-wrap:wrap;font-size:.8rem;color:var(--muted);margin-top:8px}.legend i{display:inline-block;width:12px;height:12px;border-radius:3px;vertical-align:-2px;margin-right:4px}details>summary{cursor:pointer;list-style:none}details>summary::-webkit-details-marker{display:none}details[open]>summary{margin-bottom:8px}.box{background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:12px;margin-top:8px}.tabs{display:flex;gap:6px;margin-bottom:16px;flex-wrap:wrap}.tabs a{padding:7px 14px;border-radius:8px;text-decoration:none;background:#fff;border:1px solid var(--line);color:var(--text)}.tabs a.on{background:var(--brand);color:#fff;border-color:var(--brand)}.stat{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:16px}.stat div{background:#fff;border:1px solid var(--line);border-radius:8px;padding:10px 14px;min-width:110px}.stat b{display:block;font-size:1.3rem}.stat span{font-size:.78rem;color:var(--muted)}.code{font-family:ui-monospace,monospace;font-size:1.8rem;letter-spacing:.3em;font-weight:700;color:var(--brand-dark)}