:root{--bg: #f7f5f0;--surface: #ffffff;--surface-2: #efebe3;--text: #1f2937;--muted: #6b7280;--border: #e3ded3;--accent: #1f2937;--accent-text: #ffffff;--in: #15803d;--in-soft: #dcfce7;--out: #b45309;--out-soft: #fef3c7;--none: #6b7280;--none-soft: #f3f4f6;--danger: #b91c1c;--danger-soft: #fee2e2;--gold: #d69e2e;--radius: 14px;color-scheme:light}@media(prefers-color-scheme:dark){:root{--bg: #121417;--surface: #1b1e22;--surface-2: #24282e;--text: #eef0f2;--muted: #9aa3ad;--border: #2f343b;--accent: #f5f0e6;--accent-text: #121417;--in: #4ade80;--in-soft: #12301d;--out: #fbbf24;--out-soft: #3a2a0a;--none: #9aa3ad;--none-soft: #24282e;--danger: #f87171;--danger-soft: #3b1414;color-scheme:dark}}*{box-sizing:border-box}html,body{margin:0}body{background:var(--bg);color:var(--text);font:16px/1.45 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-text-size-adjust:100%}#root{max-width:680px;margin:0 auto;padding:env(safe-area-inset-top) 16px calc(24px + env(safe-area-inset-bottom))}h1,h2,h3,h4{margin:.6em 0 .4em;line-height:1.2}h2{font-size:1.35rem}h3{font-size:1.05rem}h4{font-size:.95rem}code{background:var(--surface-2);padding:1px 6px;border-radius:6px;font-size:.95em}.muted{color:var(--muted)}.small{font-size:.85rem}.center{min-height:70vh;display:grid;place-content:center;gap:12px;text-align:center}.btn{appearance:none;border:1px solid var(--accent);background:var(--accent);color:var(--accent-text);border-radius:10px;padding:10px 16px;font:inherit;font-weight:600;cursor:pointer;min-height:44px}.btn:disabled{opacity:.55;cursor:default}.btn.ghost{background:transparent;color:var(--text);border-color:var(--border)}.btn.small{padding:6px 10px;min-height:36px;font-size:.9rem}.btn.big{width:100%;padding:14px;font-size:1.05rem}.btn.danger{background:var(--danger);border-color:var(--danger);color:#fff}.btn.huge{width:100%;min-height:120px;font-size:1.7rem;border-radius:22px;margin:8px 0 4px;box-shadow:0 6px 20px #0000001f}.btn.huge.in{background:var(--in);border-color:var(--in);color:#fff}.btn.huge.out{background:var(--out);border-color:var(--out);color:#fff}@media(prefers-color-scheme:dark){.btn.huge.in,.btn.huge.out{color:#121417}}.form{display:grid;gap:12px;margin:12px 0}label{display:grid;gap:4px;font-size:.9rem;color:var(--muted);flex:1;min-width:0}label.check{display:flex;gap:10px;align-items:flex-start;color:var(--text)}label.check input{width:20px;height:20px;margin-top:2px}input,select{font:inherit;color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:10px 12px;min-height:44px;width:100%}input:focus,select:focus,.btn:focus-visible,.board-row:focus-visible{outline:2px solid var(--gold);outline-offset:2px}.row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}.with-btn{display:flex;gap:6px}.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:12px 14px;margin:8px 0}.error{color:var(--danger);background:var(--danger-soft);padding:10px 12px;border-radius:10px;margin:8px 0}.success{color:var(--in);background:var(--in-soft);padding:10px 12px;border-radius:10px;margin:8px 0;font-weight:600}.notice{background:var(--out-soft);border-radius:10px;padding:10px 12px;margin:8px 0}.login{padding-top:12vh}.brand{display:flex;align-items:center;gap:12px}.brand img{border-radius:12px}.top{display:flex;justify-content:space-between;align-items:center;padding:14px 0 8px}.who-am-i{display:grid}.who-am-i .name{font-weight:700}.menu{display:grid;gap:8px;margin-bottom:8px}.tabs{display:flex;gap:4px;background:var(--surface-2);padding:4px;border-radius:12px;position:sticky;top:0;z-index:2}.tabs button{flex:1;border:0;background:transparent;color:var(--text);font:inherit;font-weight:600;padding:10px 4px;border-radius:9px;min-height:44px;cursor:pointer}.tabs button.active{background:var(--surface);box-shadow:0 1px 3px #0000001f}.clock{text-align:center;margin:18px 0 10px}.clock-time{font-size:2.4rem;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.02em}.clock-date{color:var(--muted)}.status-card{display:flex;gap:12px;align-items:center;padding:14px 16px;border-radius:var(--radius);margin:10px 0}.status-card.none{background:var(--none-soft)}.status-card.in{background:var(--in-soft)}.status-card.out{background:var(--out-soft)}.status-dot{width:14px;height:14px;border-radius:50%;flex:none;background:var(--none)}.status-card.in .status-dot{background:var(--in)}.status-card.out .status-dot{background:var(--out)}.status-text{font-weight:700;font-size:1.1rem}.status-sub{color:var(--muted);font-size:.9rem}.confirm{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:12px}.confirm p{margin:0 0 10px;font-weight:600}.confirm .btn{flex:1}.entries{list-style:none;padding:0;margin:0;display:grid;gap:6px}.entries li{display:flex;flex-wrap:wrap;gap:8px;align-items:baseline}.entries li.cancelled .t,.entries li.cancelled .pill{text-decoration:line-through;opacity:.6}.entries .t{font-variant-numeric:tabular-nums;font-weight:600}.entries .note{flex-basis:100%;color:var(--muted);font-size:.85rem;padding-left:44px}.pill{display:inline-block;min-width:36px;text-align:center;font-size:.75rem;font-weight:700;padding:2px 6px;border-radius:999px}.pill.in{background:var(--in-soft);color:var(--in)}.pill.out{background:var(--out-soft);color:var(--out)}.toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;justify-content:space-between}.toolbar input[type=date]{width:auto}.counts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:8px 0}.count{border-radius:12px;padding:10px;display:grid;text-align:center}.count b{font-size:1.6rem}.count span{font-size:.8rem;color:var(--muted)}.count.in{background:var(--in-soft)}.count.out{background:var(--out-soft)}.count.none{background:var(--none-soft)}.group h3{margin-top:18px}.board,.staff-list{list-style:none;padding:0;margin:0;display:grid;gap:6px}.board>li,.staff-list>li{background:var(--surface);border:1px solid var(--border);border-radius:12px;overflow:hidden}.staff-list>li.inactive{opacity:.65}.board-row{width:100%;display:flex;gap:10px;align-items:center;text-align:left;background:transparent;border:0;color:inherit;font:inherit;padding:12px 14px;cursor:pointer;min-height:52px}.board-row .who{display:grid;flex:1;min-width:0}.board-row .name{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.board-row .times{display:grid;text-align:right;font-size:.85rem;font-variant-numeric:tabular-nums;color:var(--muted)}.badge{font-size:.7rem;font-weight:700;background:var(--out-soft);color:var(--out);padding:2px 6px;border-radius:999px}.board>li .panel,.staff-list>li .panel{margin:0;border:0;border-top:1px solid var(--border);border-radius:0}.cancel-list{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:10px}