
:root{
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  color:#17211c;background:#f2f5f3;
  --brand:#0f4c3a;--brand-2:#176b51;--accent:#d5a93c;--ink:#17211c;
  --muted:#66736d;--line:#dbe3df;--surface:#fff;--danger:#b42318;
  --free:#e8f6ed;--busy:#fdeceb;--mine:#e3efff;--shadow:0 8px 28px rgba(21,48,38,.08)
}
*{box-sizing:border-box}body{margin:0;background:linear-gradient(180deg,#eef4f0 0,#f7f9f8 260px);min-height:100vh}
a{color:var(--brand-2)}
.site-header{background:linear-gradient(120deg,#0b3025,#0f4c3a 58%,#176b51);color:white;box-shadow:0 4px 18px #0b30252b;position:sticky;top:0;z-index:20}
.header-inner{max-width:1500px;margin:auto;padding:10px 22px;display:flex;align-items:center;justify-content:space-between;gap:22px}
.brand{display:flex;align-items:center;gap:10px;color:white;text-decoration:none;min-width:max-content}.brand-logo{width:48px;height:48px;border-radius:50%;object-fit:cover;border:2px solid rgba(255,255,255,.8);box-shadow:0 2px 10px #0003}.brand-copy{display:flex;flex-direction:column;line-height:1.05}.brand-copy strong{font-size:1.02rem}.brand-copy small{opacity:.78;margin-top:4px}.version{padding:3px 7px;border-radius:999px;background:#ffffff20;border:1px solid #ffffff32;font-size:.7rem;font-weight:700}
.main-nav{display:flex;align-items:center;gap:4px;flex-wrap:wrap;justify-content:flex-end}.main-nav>a,.nav-more>summary{color:#eef8f3;text-decoration:none;padding:8px 9px;border-radius:8px;font-size:.9rem;cursor:pointer;list-style:none}.main-nav>a:hover,.nav-more>summary:hover{background:#ffffff18}.logout-link{border-left:1px solid #ffffff2c;margin-left:3px}.nav-more{position:relative}.nav-more summary::-webkit-details-marker{display:none}.nav-menu{position:absolute;right:0;top:42px;min-width:190px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:7px;display:grid}.nav-menu a{padding:9px 10px;text-decoration:none;color:var(--ink);border-radius:7px}.nav-menu a:hover{background:#eff5f2}
.page-shell{max-width:1450px;margin:auto;padding:28px 24px 42px}h1{margin:0 0 8px;font-size:clamp(1.65rem,2.5vw,2.35rem);letter-spacing:-.03em}h2{margin-top:28px;font-size:1.2rem}h3{margin-top:0}p{color:#45534d}.titleline{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;flex-wrap:wrap;margin-bottom:18px}
.card,.panel,.stat,.tablewrap{background:rgba(255,255,255,.96);border:1px solid var(--line);box-shadow:var(--shadow)}.card{padding:18px;border-radius:14px}.panel{border-radius:14px;padding:16px;margin:14px 0}.cards{display:flex;gap:14px;flex-wrap:wrap}.cards .card{min-width:230px}.narrow{max-width:440px;margin:70px auto}.statgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px;margin:18px 0}.stat{padding:20px;border-radius:14px}.stat span{display:block;color:var(--muted)}.stat strong{display:block;font-size:2rem;margin-top:6px;color:var(--brand)}
form{margin:0}label{display:flex;flex-direction:column;gap:6px;font-weight:650;color:#34423c}input,select,textarea,button,.button{font:inherit;padding:10px 11px;border:1px solid #bdc9c3;border-radius:9px}input:focus,select:focus,textarea:focus{outline:3px solid #176b5124;border-color:var(--brand-2)}textarea{min-height:90px}button,.button{background:linear-gradient(180deg,#167559,#0f5d46);color:#fff;border:0;cursor:pointer;text-decoration:none;display:inline-block;font-weight:700;box-shadow:0 2px 6px #0f4c3a25}button:hover,.button:hover{filter:brightness(1.05)}.danger{background:linear-gradient(180deg,#c53a2e,#a72b22)}.small{padding:6px 9px;font-size:.8rem}.actions{display:flex;gap:8px;flex-wrap:wrap}
.gridform,.formgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:13px;align-items:end}.wide{grid-column:1/-1}.split{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:14px 0}.inline{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.tiny{width:75px;min-width:75px!important;padding:6px}
.tablewrap{overflow:auto;border-radius:14px}table{width:100%;border-collapse:separate;border-spacing:0}th,td{padding:10px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}th{background:#f5f8f6;color:#30413a;font-size:.88rem}tr:last-child td{border-bottom:0}th:last-child,td:last-child{border-right:0}.matrix th,.matrix td{text-align:center;min-width:110px}.matrix thead th{position:sticky;top:0;z-index:2;background:#eef4f0}.matrix tbody th{font-weight:800;color:var(--brand)}.matrix td.free{background:var(--free)}.matrix td.busy{background:var(--busy)}.matrix td.mine{background:var(--mine);box-shadow:inset 0 0 0 2px #4b82d0}.matrix td small{display:block;margin:4px;color:#5d6964}.matrix td{transition:transform .12s ease,filter .12s ease}.matrix td:hover{filter:brightness(.985)}
.flash{padding:12px 14px;margin-bottom:14px;border-radius:10px;border:1px solid}.flash.ok{background:#e4f7e9;border-color:#a6d8b4}.flash.error{background:#ffe8e6;border-color:#efb2ac}.status{padding:12px;background:#eaf2ff;border-radius:10px;margin-bottom:14px}.toolbar{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:12px}.toolbar form{display:flex;gap:8px}.muted{color:var(--muted)}.live{background:#fff;padding:8px 12px;border-radius:999px;border:1px solid var(--line);box-shadow:0 3px 14px #00000010;font-weight:700}.dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#28a35a;margin-right:5px;box-shadow:0 0 0 4px #28a35a22}.position{position:relative}.pill{position:absolute;right:12px;top:12px;background:#ddf7e5;color:#1d6b3c;padding:4px 8px;border-radius:999px;font-size:.7rem;font-weight:800}
.site-footer{max-width:1450px;margin:0 auto;padding:18px 24px 30px;border-top:1px solid #dce5e0;color:#66736d;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:.82rem}.site-footer strong{color:#415048}
@media(max-width:980px){.site-header{position:static}.header-inner{align-items:flex-start;flex-direction:column}.main-nav{justify-content:flex-start}.logout-link{border-left:0}.nav-menu{left:0;right:auto}.page-shell{padding:18px 14px 36px}}
@media(max-width:700px){.brand-logo{width:42px;height:42px}.main-nav>a,.nav-more>summary{padding:7px 6px;font-size:.82rem}.matrix th,.matrix td{min-width:92px;padding:7px}.small{font-size:.72rem;padding:5px 7px}.split{grid-template-columns:1fr}.site-footer{padding:16px 14px 24px;display:block}.site-footer div+div{margin-top:5px}}
