:root{--brand:#0f766e;--brand2:#14b8a6;--bg:#f4f7f6;--card:#fff;--text:#1f2933;--muted:#6b7a86;--line:#e3e8ea;--err:#c0392b;--warn:#b7791f;--ok:#15803d}
*{box-sizing:border-box}body{margin:0;font:15px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:var(--bg);color:var(--text)}
a{color:var(--brand)}h1{font-size:1.5rem;margin:0 0 1rem}h2{font-size:1.1rem;margin:0 0 .8rem}
.top{display:flex;align-items:center;gap:1rem;padding:.6rem 1rem;background:var(--brand);color:#fff;position:sticky;top:0;z-index:10}
.top a{color:#fff;text-decoration:none}.top .company{opacity:.8;margin-right:auto}
.brand{display:flex;align-items:center;gap:.5rem;font-weight:700;font-size:1.1rem}.brand.big{font-size:1.6rem;justify-content:center;color:var(--brand);margin-bottom:1rem}
.logo{display:inline-grid;place-items:center;width:1.8em;height:1.8em;border-radius:.5em;background:linear-gradient(135deg,var(--brand2),#0b4f4a);color:#fff;font-weight:800}
.bell{position:relative}.bell b{position:absolute;top:-.5em;right:-.8em;background:#f59e0b;border-radius:1em;padding:0 .4em;font-size:.7rem}
.menu-btn{display:none;background:none;border:0;color:#fff;font-size:1.4rem}
.wrap{display:flex;min-height:calc(100vh - 52px)}
.side{width:210px;background:#fff;border-right:1px solid var(--line);padding:1rem 0;flex-shrink:0}
.side a{display:block;padding:.55rem 1.2rem;color:var(--text);text-decoration:none}.side a.on,.side a:hover{background:#e6f4f1;color:var(--brand);font-weight:600}
main{flex:1;padding:1.5rem;min-width:0}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:1.1rem;margin-bottom:1rem;overflow-x:auto}
.grid4{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem}.two{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.stat small{display:block;color:var(--muted)}.stat b{display:block;font-size:1.4rem;margin:.2rem 0}
table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:.5rem;border-bottom:1px solid var(--line);vertical-align:top}th{font-size:.8rem;color:var(--muted);text-transform:uppercase}
tr.total td{font-weight:700}
.form{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.8rem 1rem;align-items:end}.form h2,.form .wide,.form .actions,.form fieldset{grid-column:1/-1}
label{display:flex;flex-direction:column;gap:.25rem;font-size:.85rem;color:var(--muted)}label.check{flex-direction:row;align-items:center;gap:.4rem;color:var(--text)}
input,select{font:inherit;padding:.5rem .6rem;border:1px solid #cfd8dc;border-radius:8px;background:#fff;color:var(--text)}input[type=checkbox]{width:auto}input[type=color]{padding:0;width:3rem;height:2.3rem}
fieldset{border:1px solid var(--line);border-radius:8px;display:flex;flex-wrap:wrap;gap:.5rem 1.2rem}
.btn{display:inline-block;font:inherit;padding:.5rem .9rem;border-radius:8px;border:1px solid #cfd8dc;background:#fff;color:var(--text);cursor:pointer;text-decoration:none}
.btn.primary{background:var(--brand);border-color:var(--brand);color:#fff}.btn.danger{background:var(--err);border-color:var(--err);color:#fff}.btn.big{font-size:1.2rem;padding:1rem 1.6rem}.btn:disabled{opacity:.5}
button.link{background:none;border:0;color:var(--brand);cursor:pointer;padding:0;text-decoration:underline}
.bar{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;margin-bottom:1rem}.bar h1{margin:0 auto 0 0}.bar label{flex-direction:row;align-items:center}
.inline{display:inline-flex;gap:.4rem;align-items:center;flex-wrap:wrap}.actions{display:flex;gap:.5rem;flex-wrap:wrap}
.row{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin-bottom:.5rem}.row.indent{margin-left:2rem}.row.perms{padding:.5rem 0;border-bottom:1px solid var(--line)}
.flash{padding:.7rem 1rem;border-radius:8px;margin-bottom:1rem;background:#dcfce7;color:var(--ok)}.flash.err{background:#fde2e1;color:var(--err)}.flash.warn{background:#fef3c7;color:var(--warn)}
.muted{color:var(--muted)}.warn-text{color:var(--warn)}
.badge{display:inline-block;padding:.1rem .5rem;border-radius:1em;background:#e5e7eb;font-size:.8rem}.s-approved{background:#dcfce7;color:var(--ok)}.s-pending{background:#fef3c7;color:var(--warn)}.s-declined{background:#fde2e1;color:var(--err)}.s-open{background:#dbeafe}
.sched-wrap{overflow-x:auto;background:#fff;border:1px solid var(--line);border-radius:12px}
.sched{min-width:1000px}.sched th:first-child{width:160px}.sched td.cell{min-height:60px;height:60px;border-left:1px solid var(--line);width:12%}
.sched td.cell.over{background:#e6f4f1}.sched tr.openrow{background:#fffbeb}.sched .tot{font-weight:600;white-space:nowrap}
.shift{--c:#3b82f6;border-left:4px solid var(--c);background:color-mix(in srgb,var(--c) 14%,#fff);border-radius:6px;padding:.25rem .4rem;margin-bottom:.3rem;font-size:.8rem;display:flex;flex-direction:column}
.shift[draggable=true]{cursor:grab}.shift.draft{background-image:repeating-linear-gradient(45deg,transparent 0 6px,rgba(0,0,0,.05) 6px 12px)}.shift i{color:var(--muted)}.shift a{font-size:.7rem}
.absence{background:#fde2e1;color:var(--err);font-size:.75rem;border-radius:4px;padding:.1rem .3rem;margin-bottom:.2rem}
.avail{font-size:.7rem;border-radius:4px;padding:0 .3rem;margin-bottom:.2rem}.avail.available{background:#dcfce7}.avail.unavailable{background:#e5e7eb;text-decoration:line-through}.avail.partial{background:#fef3c7}
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:.4rem}.cal .day{border:1px solid var(--line);border-radius:8px;padding:.4rem;min-height:70px;font-size:.85rem;display:flex;flex-direction:column}
.cal .available{background:#dcfce7}.cal .unavailable{background:#f1f1f1}.cal .partial{background:#fef3c7}.cal i{font-size:.75rem;color:var(--muted)}
.clock{text-align:center}.clock-now{font-size:4rem;font-weight:700;color:var(--brand)}.clock-btns{display:flex;flex-direction:column;align-items:center;gap:1rem}
.notes{list-style:none;margin:0;padding:0}.notes li{padding:.6rem 0;border-bottom:1px solid var(--line)}.notes li.unread{font-weight:600}
.todo li{margin:.3rem 0}.details{font-family:monospace;font-size:.75rem;max-width:380px;word-break:break-all}
body.login{display:grid;place-items:center;min-height:100vh;background:linear-gradient(135deg,#0f766e,#134e4a)}.login-card{width:min(380px,92vw);display:flex;flex-direction:column;gap:1rem}
@media (max-width:800px){.menu-btn{display:block}.top .company,.top .me{display:none}.side{position:fixed;left:-230px;top:52px;bottom:0;z-index:9;transition:left .2s;box-shadow:2px 0 10px rgba(0,0,0,.1)}body.nav-open .side{left:0}
main{padding:1rem}.two{grid-template-columns:1fr}.cal{grid-template-columns:repeat(2,1fr)}table{font-size:.85rem}}