:root{--bg: #0b0d10;--surface: #14181d;--surface-2: #1b2027;--surface-3: #242b34;--border: #2b323c;--text: #f2f5f8;--text-dim: #98a3b1;--text-faint: #6b7684;--accent: #e63946;--accent-dim: #b32d38;--gold: #f2c14e;--success: #3ddc84;--warning: #ffb020;--danger: #ff5c5c;--tap: 44px;--radius: 14px;--radius-sm: 9px;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--nav-height: 62px;color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,sans-serif;font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;overscroll-behavior-y:none}button,input,select,textarea{font:inherit;color:inherit}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}.app{min-height:100%;display:flex;flex-direction:column;padding-bottom:calc(var(--nav-height) + var(--safe-bottom))}.topbar{position:sticky;top:0;z-index:20;padding:calc(var(--safe-top) + 14px) 16px 14px;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);display:flex;align-items:center;gap:12px}.topbar h1{font-size:19px;font-weight:700;margin:0;letter-spacing:-.01em}.topbar .sub{font-size:13px;color:var(--text-dim);margin:0}.content{flex:1;padding:16px;max-width:720px;width:100%;margin:0 auto}.bottomnav{position:fixed;bottom:0;left:0;right:0;z-index:30;display:flex;background:color-mix(in srgb,var(--surface) 96%,transparent);backdrop-filter:blur(14px);border-top:1px solid var(--border);padding-bottom:var(--safe-bottom)}.bottomnav a{flex:1;min-height:var(--tap);padding:9px 4px 8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;text-decoration:none;color:var(--text-faint);font-size:11px;font-weight:600;transition:color .15s}.bottomnav a[aria-current=page]{color:var(--accent)}.bottomnav .icon{font-size:21px;line-height:1}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:16px;margin-bottom:12px}.card h2{margin:0 0 12px;font-size:15px;font-weight:700;letter-spacing:.01em}.card h2 .count{color:var(--text-faint);font-weight:500;margin-left:6px}.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:12px}@media (min-width: 480px){.stats{grid-template-columns:repeat(3,1fr)}}.stat{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:13px 14px}.stat .label{font-size:11px;color:var(--text-dim);text-transform:uppercase;letter-spacing:.06em;font-weight:600}.stat .value{font-size:23px;font-weight:700;margin-top:5px;letter-spacing:-.02em;font-variant-numeric:tabular-nums}.stat .value.money{color:var(--gold);font-size:20px}.stat .value.alert{color:var(--danger)}.stat .value.good{color:var(--success)}.stat .hint{font-size:11px;color:var(--text-faint);margin-top:3px}.list{display:flex;flex-direction:column;gap:8px}.row{display:flex;align-items:center;gap:12px;min-height:var(--tap);padding:12px 14px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm);text-decoration:none;color:inherit}.row .grow{flex:1;min-width:0}.row .title{font-weight:600;font-size:15px}.row .meta{font-size:12.5px;color:var(--text-dim);margin-top:2px}.row .trail{text-align:right;font-size:13px;white-space:nowrap;font-variant-numeric:tabular-nums}.time-chip{min-width:52px;text-align:center;padding:6px 8px;border-radius:8px;background:var(--surface-3);font-weight:700;font-size:14px;font-variant-numeric:tabular-nums}.avatar{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--accent-dim),var(--surface-3));display:grid;place-items:center;font-weight:700;font-size:14px;flex-shrink:0}.badge{display:inline-block;padding:3px 9px;border-radius:999px;font-size:11px;font-weight:700;letter-spacing:.02em;background:var(--surface-3);color:var(--text-dim)}.badge.ok{background:color-mix(in srgb,var(--success) 18%,transparent);color:var(--success)}.badge.warn{background:color-mix(in srgb,var(--warning) 18%,transparent);color:var(--warning)}.badge.bad{background:color-mix(in srgb,var(--danger) 18%,transparent);color:var(--danger)}.badge.info{background:color-mix(in srgb,var(--accent) 20%,transparent);color:#ff8b93}.field{margin-bottom:14px}.field label{display:block;font-size:13px;font-weight:600;color:var(--text-dim);margin-bottom:6px}.input{width:100%;min-height:var(--tap);padding:11px 14px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);font-size:16px}.input:focus{border-color:var(--accent);outline:none}.input::placeholder{color:var(--text-faint)}.btn{width:100%;min-height:var(--tap);padding:12px 18px;border:1px solid transparent;border-radius:var(--radius-sm);background:var(--accent);color:#fff;font-weight:700;font-size:15px;cursor:pointer;transition:filter .15s,opacity .15s}.btn:hover:not(:disabled){filter:brightness(1.08)}.btn:active:not(:disabled){filter:brightness(.92)}.btn:disabled{opacity:.55;cursor:not-allowed}.btn.ghost{background:transparent;border-color:var(--border);color:var(--text-dim)}.btn.inline{width:auto}.alert{padding:12px 14px;border-radius:var(--radius-sm);font-size:14px;margin-bottom:14px;border:1px solid}.alert.error{background:color-mix(in srgb,var(--danger) 12%,transparent);border-color:color-mix(in srgb,var(--danger) 35%,transparent);color:#ffc4c4}.alert.info{background:color-mix(in srgb,var(--accent) 10%,transparent);border-color:color-mix(in srgb,var(--accent) 30%,transparent)}.empty{padding:34px 18px;text-align:center;color:var(--text-faint);font-size:14px}.empty .icon{font-size:34px;display:block;margin-bottom:10px;opacity:.55}.skeleton{background:linear-gradient(90deg,var(--surface-2) 25%,var(--surface-3) 50%,var(--surface-2) 75%);background-size:200% 100%;animation:shimmer 1.4s infinite;border-radius:var(--radius-sm)}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.skeleton.row-sk{height:64px;margin-bottom:8px}.skeleton.stat-sk{height:82px}.offline-banner{position:fixed;top:0;left:0;right:0;z-index:60;padding:calc(var(--safe-top) + 8px) 16px 8px;background:var(--warning);color:#2a1d00;font-size:13px;font-weight:700;text-align:center}.login-wrap{min-height:100%;display:flex;flex-direction:column;justify-content:center;padding:24px 20px calc(24px + var(--safe-bottom));max-width:420px;margin:0 auto;width:100%}.brand{text-align:center;margin-bottom:30px}.brand .mark{font-size:44px;line-height:1}.brand h1{font-size:25px;margin:12px 0 4px;letter-spacing:-.02em}.brand p{color:var(--text-dim);font-size:14px;margin:0}.muted{color:var(--text-dim);font-size:13px}.center{text-align:center}.mt{margin-top:14px}.row-between{display:flex;align-items:center;justify-content:space-between;gap:12px}.sheet-backdrop{position:fixed;inset:0;z-index:50;background:#0000009e;backdrop-filter:blur(3px);display:flex;align-items:flex-end;animation:fade-in .16s ease-out}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.sheet{width:100%;max-width:560px;margin:0 auto;background:var(--surface);border-top-left-radius:20px;border-top-right-radius:20px;border:1px solid var(--border);border-bottom:none;max-height:92vh;display:flex;flex-direction:column;animation:slide-up .22s cubic-bezier(.22,1,.36,1);padding-bottom:var(--safe-bottom)}@keyframes slide-up{0%{transform:translateY(100%)}to{transform:translateY(0)}}.sheet-grip{width:38px;height:4px;background:var(--surface-3);border-radius:2px;margin:9px auto 2px}.sheet-head{display:flex;align-items:center;justify-content:space-between;padding:8px 16px 12px;border-bottom:1px solid var(--border)}.sheet-head h2{margin:0;font-size:17px;font-weight:700}.sheet-body{padding:16px;overflow-y:auto;flex:1;-webkit-overflow-scrolling:touch}.sheet-foot{padding:12px 16px 16px;border-top:1px solid var(--border);display:flex;gap:10px;background:var(--surface)}.sheet-foot .btn{flex:1}.icon-btn{min-width:var(--tap);min-height:var(--tap);display:grid;place-items:center;background:transparent;border:none;color:var(--text-dim);font-size:18px;cursor:pointer;border-radius:8px}.icon-btn:hover{background:var(--surface-2);color:var(--text)}.fab{position:fixed;right:16px;bottom:calc(var(--nav-height) + var(--safe-bottom) + 16px);z-index:25;min-width:56px;height:56px;padding:0 20px;border-radius:28px;border:none;background:var(--accent);color:#fff;font-weight:700;font-size:15px;display:flex;align-items:center;gap:8px;box-shadow:0 6px 20px #e639465c;cursor:pointer}.fab:active{transform:scale(.97)}.daypicker{display:flex;gap:6px;flex-wrap:wrap}.daypicker button{min-width:44px;min-height:var(--tap);border-radius:10px;border:1px solid var(--border);background:var(--surface-2);color:var(--text-dim);font-weight:700;font-size:13px;cursor:pointer}.daypicker button[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:#fff}.att-row{display:flex;align-items:center;gap:10px;padding:10px 12px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm);margin-bottom:8px}.att-row .name{flex:1;font-weight:600;font-size:14.5px;min-width:0}.att-buttons{display:flex;gap:4px}.att-buttons button{min-width:42px;min-height:40px;border-radius:8px;border:1px solid var(--border);background:var(--surface-3);color:var(--text-dim);font-size:12px;font-weight:700;cursor:pointer}.att-buttons button[aria-pressed=true][data-status=PRESENT]{background:var(--success);border-color:var(--success);color:#04240f}.att-buttons button[aria-pressed=true][data-status=LATE]{background:var(--warning);border-color:var(--warning);color:#2a1d00}.att-buttons button[aria-pressed=true][data-status=ABSENT]{background:var(--danger);border-color:var(--danger);color:#2a0000}.att-buttons button[aria-pressed=true][data-status=EXCUSED]{background:var(--surface-3);border-color:var(--text-dim);color:var(--text)}.sticky-actions{position:sticky;bottom:calc(var(--nav-height) + var(--safe-bottom));padding:12px 0;background:linear-gradient(to top,var(--bg) 68%,transparent)}.conflict-list{margin:0;padding-left:18px;font-size:13px}.conflict-list li{margin-bottom:5px}.seg{display:flex;gap:0;border:1px solid var(--border);border-radius:10px;overflow:hidden;margin-bottom:14px}.seg button{flex:1;min-height:var(--tap);background:var(--surface-2);border:none;color:var(--text-dim);font-weight:600;font-size:13.5px;cursor:pointer}.seg button[aria-pressed=true]{background:var(--accent);color:#fff}
