:root{--bg: #0b1020;--bg-soft: #141a2e;--card: #182036;--card-2: #1e2740;--text: #e8ecf6;--muted: #8b93ab;--brand: #14b8a6;--brand-600: #0f766e;--danger: #ef4444;--warn: #f59e0b;--ok: #22c55e;--border: #263050;--radius: 18px;--shadow: 0 10px 30px rgba(0, 0, 0, .35)}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:radial-gradient(1200px 600px at 50% -10%,#16233f 0%,var(--bg) 60%);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased}button{font-family:inherit;cursor:pointer}.loading,.empty{display:grid;place-content:center;gap:6px;height:100%;text-align:center;color:var(--muted)}.muted{color:var(--muted)}.app{display:flex;flex-direction:column;height:100%;max-width:520px;margin:0 auto}.topbar{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;padding-top:max(14px,env(safe-area-inset-top))}.brand{font-weight:800;font-size:1.15rem;letter-spacing:.3px}.logo{color:var(--brand)}.logo.big{font-size:2.6rem;display:block}.topbar-right{display:flex;align-items:center;gap:12px}.conn{display:inline-flex;align-items:center;gap:6px;font-size:.78rem;color:var(--muted)}.conn .dot{width:8px;height:8px;border-radius:50%;background:var(--muted)}.conn.on .dot{background:var(--ok);box-shadow:0 0 8px var(--ok)}.conn.off .dot{background:var(--warn)}.link-btn{background:none;border:none;color:var(--brand);font-size:.9rem;padding:4px}.content{flex:1;overflow-y:auto;padding:8px 18px 24px}.tabbar{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:8px 14px;padding-bottom:max(10px,env(safe-area-inset-bottom));background:var(--bg-soft);border-top:1px solid var(--border)}.tabbar[data-cols="3"]{grid-template-columns:repeat(3,1fr)}.tabbar[data-cols="4"]{grid-template-columns:repeat(4,1fr)}.tabbar[data-cols="4"] button{font-size:.66rem}.tabbar button{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px;background:none;border:none;border-radius:12px;color:var(--muted);font-size:.75rem}.tabbar button span{font-size:1.3rem}.tabbar button.active{color:var(--brand);background:#14b8a61a}.clock{display:flex;flex-direction:column;gap:16px}.status-card{border-radius:var(--radius);padding:26px 20px;text-align:center;box-shadow:var(--shadow);border:1px solid var(--border);transition:background .4s}.st-out{background:linear-gradient(160deg,#1a2138,#141a2e)}.st-in{background:linear-gradient(160deg,#0f5a52,#0c3f3a);border-color:#157a6e}.st-break{background:linear-gradient(160deg,#7a5a12,#4a3a10);border-color:#a97c1e}.status-top{display:flex;align-items:center;justify-content:center;gap:8px;font-weight:600;opacity:.95}.status-icon{font-size:1.3rem}.big-timer{font-size:3.2rem;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:1px;margin:10px 0 4px}.status-sub{font-size:.85rem;opacity:.75}.actions{display:flex;flex-direction:column;gap:10px}.big-btn{width:100%;padding:16px;font-size:1.05rem;font-weight:700;border-radius:14px;border:none;color:#fff;transition:transform .05s,filter .15s}.big-btn:active{transform:scale(.98)}.primary{background:linear-gradient(180deg,var(--brand),var(--brand-600))}.danger-btn{background:linear-gradient(180deg,#f05252,var(--danger))}.warn-btn{background:linear-gradient(180deg,#fbbf24,var(--warn));color:#3a2a00}.ghost-btn{background:transparent;border:1px solid var(--border);color:var(--text)}.confirm-out{display:flex;flex-direction:column;gap:10px;background:var(--card);border:1px solid var(--border);border-radius:16px;padding:16px}.confirm-q{text-align:center;margin:4px 0 8px;font-weight:600;line-height:1.5}.stat-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.stat{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:14px;display:flex;flex-direction:column;align-items:center;gap:2px}.stat-value{font-size:1.3rem;font-weight:800}.stat-label{font-size:.75rem;color:var(--muted)}.sync-note{text-align:center;font-size:.8rem;color:var(--warn);background:#f59e0b14;border:1px solid rgba(245,158,11,.25);border-radius:12px;padding:8px}.timeline h3,.history-head h2{margin:6px 0}.timeline ul,.day-events{list-style:none;margin:0;padding:0}.timeline li,.day-events li{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--border)}.tl-time,.ev-time{font-variant-numeric:tabular-nums;color:var(--muted);font-size:.9rem;width:52px}.tl-badge{font-size:.78rem;padding:3px 10px;border-radius:999px;border:1px solid var(--border);background:var(--card-2)}.b-in{color:#7ee0d3;border-color:#1f7a6e}.b-out{color:#ffb0b0;border-color:#7a2a2a}.b-break_start{color:#ffd79a;border-color:#7a5a1e}.b-break_end{color:#a9d5ff;border-color:#2a4d7a}.tl-pending{color:var(--warn);font-size:1.4rem;line-height:0;margin-left:auto}.history{display:flex;flex-direction:column;gap:14px}.history-head{display:flex;align-items:center;justify-content:space-between}.day-card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:14px}.day-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px}.day-label{text-transform:capitalize;font-weight:600}.day-total{color:var(--brand);font-weight:700}.day-events li:last-child{border-bottom:none}.auth{display:grid;place-content:center;min-height:100%;padding:24px}.auth-card{width:min(400px,92vw);background:var(--card);border:1px solid var(--border);border-radius:22px;padding:28px 24px;box-shadow:var(--shadow)}.auth-logo{text-align:center;margin-bottom:20px}.auth-logo h1{margin:6px 0 2px}.segmented{display:grid;grid-template-columns:1fr 1fr;background:var(--bg-soft);border-radius:12px;padding:4px;margin-bottom:18px}.segmented button{padding:10px;border:none;background:none;color:var(--muted);font-weight:600;border-radius:9px}.segmented button.active{background:var(--card-2);color:var(--text)}form{display:flex;flex-direction:column;gap:14px}label{display:flex;flex-direction:column;gap:6px;font-size:.85rem;color:var(--muted)}input{padding:13px 14px;border-radius:12px;border:1px solid var(--border);background:var(--bg-soft);color:var(--text);font-size:1rem}input:focus{outline:2px solid var(--brand);border-color:var(--brand)}.hint{font-size:.82rem;margin:0}.hint.error{color:var(--danger)}.hint.warn{color:var(--warn)}.hint.ok-msg{color:var(--ok)}.auth-foot{text-align:center;margin-top:16px}button[disabled]{opacity:.6}select{padding:13px 14px;border-radius:12px;border:1px solid var(--border);background:var(--bg-soft);color:var(--text);font-size:1rem}select:focus{outline:2px solid var(--brand);border-color:var(--brand)}.admin{display:flex;flex-direction:column;gap:18px}.admin h2{margin:6px 0}.admin h3{margin:0 0 4px;font-size:1rem}.admin-form{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:16px}.admin-list ul{list-style:none;margin:0;padding:0}.admin-list li{display:flex;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid var(--border)}.admin-list li:last-child{border-bottom:none}.u-info{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}.u-name{font-weight:600;display:flex;align-items:center;gap:8px}.u-email{font-size:.82rem;color:var(--muted);overflow:hidden;text-overflow:ellipsis}.u-tag{font-size:.65rem;text-transform:uppercase;letter-spacing:.5px;padding:2px 7px;border-radius:999px;background:#14b8a626;color:var(--brand);font-weight:700}.u-tag.you{background:#8b93ab33;color:var(--muted)}.del-btn,.react-btn{border-radius:10px;width:34px;height:34px;font-size:1rem;flex-shrink:0}.del-btn{background:#ef44441f;color:var(--danger);border:1px solid rgba(239,68,68,.3)}.react-btn{background:#14b8a61f;color:var(--brand);border:1px solid rgba(20,184,166,.3)}.admin-list li.inactive{opacity:.55}.u-tag.off{background:#ef444426;color:#ff9a9a}.records{display:flex;flex-direction:column;gap:14px}.records h2{margin:6px 0}.filters{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:12px}.filters-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.records-actions{display:flex;gap:16px}.records-actions .link-btn:disabled{opacity:.4}.integrity{font-size:.85rem;padding:10px 12px;border-radius:12px;text-align:center;background:var(--card-2);border:1px solid var(--border)}.integrity.ok{color:var(--ok);border-color:#22c55e66;background:#22c55e14}.integrity.bad{color:var(--danger);border-color:#ef444466;background:#ef444414}.rec-user{display:flex;flex-direction:column;gap:10px}.rec-user-head{display:flex;align-items:baseline;gap:10px;padding-top:6px;border-top:1px solid var(--border)}.rec-user-head .u-name{font-size:1.05rem}.insp-banner{display:flex;flex-direction:column;gap:2px;background:#14b8a61a;border:1px solid rgba(20,184,166,.3);border-radius:12px;padding:12px 14px;font-size:.85rem}.insp-banner span{color:var(--muted)}.insp-section{margin-top:4px}.insp-url{margin-top:12px;background:var(--bg-soft);border:1px solid var(--border);border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:8px}.insp-url code{font-size:.72rem;word-break:break-all;color:var(--brand);background:#00000040;padding:8px;border-radius:8px}.insp-list{list-style:none;margin:14px 0 0;padding:0}.insp-list li{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--border)}