:root{color:#152222;background:#f5f7f7;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Microsoft YaHei,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;--bg: #f5f7f7;--surface: #ffffff;--surface-2: #eef3f2;--ink: #152222;--muted: #637170;--line: #dbe3e2;--teal: #0f8a80;--teal-dark: #0c635d;--coral: #d8644a;--coral-soft: #fff0ec;--amber: #ba7a12;--amber-soft: #fff5dc;--blue-soft: #eaf0ff;--shadow: 0 18px 45px rgba(35, 54, 54, .08)}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:linear-gradient(180deg,#ffffffb8,#f5f7f700 240px),var(--bg)}button,input,select,textarea{font:inherit}button{cursor:pointer}.app-shell{min-height:100vh;padding:24px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:0 auto 18px;max-width:1540px}.topbar h1,.calendar-toolbar h2,.detail-heading h2,.employee-hero h2{margin:0;letter-spacing:0}.topbar h1{font-size:clamp(26px,2vw,34px);line-height:1.12}.topbar p,.calendar-toolbar p,.detail-heading p,.employee-hero p{margin:6px 0 0;color:var(--muted);font-size:14px}.topbar-actions,.month-controls,.form-tabs,.view-tabs{display:flex;align-items:center;gap:8px}.user-pill{min-height:40px;border:1px solid var(--line);border-radius:8px;padding:0 12px;display:inline-flex;align-items:center;gap:8px;color:var(--teal-dark);background:#e4f5f2;font-weight:800;font-size:13px}.primary-button,.ghost-button,.month-controls button,.view-tabs button,.form-tabs button{min-height:40px;border-radius:8px;border:1px solid var(--line);display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 14px;color:var(--ink);background:var(--surface)}.primary-button{background:var(--teal);border-color:var(--teal);color:#fff;font-weight:700}.primary-button:hover{background:var(--teal-dark)}.login-shell{min-height:100vh;padding:24px;display:grid;place-items:center}.login-card{width:min(460px,100%);border:1px solid var(--line);border-radius:8px;padding:24px;background:#fffffff5;box-shadow:var(--shadow)}.login-card h1{margin:18px 0 6px;font-size:30px;line-height:1.12}.login-card p{margin:0 0 18px;color:var(--muted);font-size:14px;line-height:1.55}.login-form{display:grid;gap:12px}.login-form label{color:var(--muted);font-weight:800;font-size:12px;display:grid;gap:6px}.login-form input{width:100%;border:1px solid var(--line);border-radius:8px;color:var(--ink);background:#fff;outline:0;min-height:44px;padding:10px 11px;font-size:15px;font-weight:600}.login-form input:focus{border-color:var(--teal);box-shadow:0 0 0 3px #0f8a8024}.login-error{border:1px solid #ffd2c8;background:var(--coral-soft);color:#8a2e1f;border-radius:8px;padding:10px 12px;font-size:13px;font-weight:800}.account-hint{display:flex;flex-wrap:wrap;gap:7px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}.account-hint span{border-radius:8px;padding:7px 9px;color:var(--muted);background:var(--surface-2);font-size:12px;font-weight:800}.ghost-button:hover,.month-controls button:hover{background:var(--surface-2)}.workspace-grid{display:grid;grid-template-columns:280px minmax(540px,1fr) 360px;gap:18px;max-width:1540px;margin:0 auto;align-items:start}.sidebar,.calendar-panel,.employee-panel,.detail-card,.form-card{border:1px solid var(--line);border-radius:8px;background:#fffffff0;box-shadow:var(--shadow)}.sidebar{padding:16px;position:sticky;top:18px}.brand-line{display:flex;align-items:center;gap:10px;font-weight:800;margin-bottom:16px}.brand-mark{width:34px;height:34px;border-radius:8px;display:grid;place-items:center;background:#dff3f0;color:var(--teal)}.view-tabs{padding:4px;background:var(--surface-2);border-radius:8px;margin-bottom:18px}.view-tabs button{width:50%;border:0;min-height:36px;background:transparent;color:var(--muted);padding:0 8px;font-size:13px}.view-tabs button.active{background:var(--surface);color:var(--ink);box-shadow:0 5px 16px #2c3d3d14}.sidebar-section{border-top:1px solid var(--line);padding-top:15px;margin-top:15px}.section-title{font-size:12px;color:var(--muted);font-weight:800;text-transform:uppercase;margin-bottom:10px}.employee-list{display:grid;gap:8px}.employee-row{border:1px solid transparent;border-radius:8px;background:transparent;padding:9px;display:grid;grid-template-columns:36px 1fr;text-align:left;gap:10px;align-items:center}.employee-row:hover,.employee-row.active{background:#f4faf9;border-color:#c7e3df}.avatar,.large-avatar{color:#fff;font-weight:800;display:grid;place-items:center}.avatar{width:34px;height:34px;border-radius:8px;font-size:14px}.employee-row strong,.employee-row small{display:block}.employee-row strong{font-size:14px}.employee-row small{color:var(--muted);font-size:12px;margin-top:2px}.compact-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px}.compact-summary div{background:var(--surface-2);border-radius:8px;padding:12px}.compact-summary span,.metric-card span{color:var(--muted);font-size:12px;display:block}.compact-summary strong,.metric-card strong{font-size:24px;line-height:1.1;margin-top:4px;display:block}.calendar-panel,.employee-panel{padding:18px;min-height:calc(100vh - 112px)}.calendar-toolbar{display:flex;justify-content:space-between;align-items:center;gap:14px;padding-bottom:16px}.calendar-toolbar h2,.detail-heading h2,.employee-hero h2{font-size:24px}.month-controls button{min-width:42px;padding:0 10px}.weekday-row,.month-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}.mobile-agenda{display:none}.weekday-row{border:1px solid var(--line);border-bottom:0;border-radius:8px 8px 0 0;overflow:hidden}.weekday-row span{min-height:36px;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:12px;font-weight:800;background:#fbfcfc;border-right:1px solid var(--line)}.weekday-row span:last-child{border-right:0}.month-grid{border-left:1px solid var(--line);border-top:1px solid var(--line)}.day-cell{min-height:126px;border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--surface);padding:9px;text-align:left;display:flex;flex-direction:column;gap:8px;overflow:hidden}.day-cell:hover{background:#f8fbfb}.day-cell.muted{background:#f8f9f9;color:#9aa5a4}.day-cell.selected{outline:2px solid var(--teal);outline-offset:-2px;background:#f2fbfa}.day-number{width:28px;height:28px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:13px}.day-number.today{background:var(--teal);color:#fff}.event-stack{display:grid;gap:5px;min-width:0}.event-chip,.more-chip{min-height:24px;border-radius:6px;padding:4px 7px;font-size:12px;line-height:1.3;white-space:normal;overflow:hidden;text-overflow:ellipsis;border:1px solid transparent}.event-chip{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.event-chip.leave{color:#8a2e1f;background:var(--coral-soft);border-color:#ffd2c8}.event-chip.appointment{color:#7d520a;background:var(--amber-soft);border-color:#f0d893}.event-chip.holiday{color:#214f90;background:var(--blue-soft);border-color:#cbd8ff}.event-chip.offday{color:#285b62;background:#e8f5f7;border-color:#bfe0e5}.more-chip{color:var(--muted);background:var(--surface-2)}.detail-panel{display:grid;gap:18px;position:sticky;top:18px}.detail-card,.form-card{padding:16px}.detail-heading{display:flex;justify-content:space-between;gap:12px;align-items:start;padding-bottom:14px;border-bottom:1px solid var(--line)}.status-dot{min-width:34px;height:34px;padding:0 9px;border-radius:8px;display:grid;place-items:center;background:#e4f5f2;color:var(--teal);font-weight:800}.detail-list,.timeline-block{display:grid;gap:10px}.detail-list{padding-top:12px}.event-line{border:1px solid var(--line);border-radius:8px;padding:11px;display:grid;grid-template-columns:30px 1fr;gap:10px;background:#fff}.event-line.leave{border-color:#f3cfc8;background:#fff9f7}.event-line.appointment{border-color:#ead9a1;background:#fffbef}.event-line.holiday{border-color:#cbd8ff;background:#f7f9ff}.event-line.offday{border-color:#bfe0e5;background:#f3fbfc}.event-icon{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;background:#fffc;color:var(--teal)}.event-line strong,.event-line p,.event-line small{display:block}.event-line strong{font-size:14px;line-height:1.35}.event-line p{margin:3px 0 0;color:var(--muted);font-size:12px;line-height:1.35}.event-line small{margin-top:5px;color:#7d8988;font-size:12px;line-height:1.35}.empty-state{min-height:74px;display:grid;place-items:center;border-radius:8px;border:1px dashed var(--line);color:var(--muted);font-size:13px;background:#fbfcfc}.form-tabs{padding:4px;background:var(--surface-2);border-radius:8px;margin-bottom:14px}.form-tabs button{flex:1;min-height:35px;background:transparent;border:0;color:var(--muted);font-size:13px;padding:0 8px}.form-tabs button.active{background:#fff;color:var(--ink);box-shadow:0 5px 16px #2c3d3d14}.entry-form{display:grid;gap:11px}.entry-form label{color:var(--muted);font-weight:800;font-size:12px;display:grid;gap:6px}.entry-form input,.entry-form select,.entry-form textarea{width:100%;border:1px solid var(--line);border-radius:8px;color:var(--ink);background:#fff;outline:0;min-height:40px;padding:9px 10px;font-size:14px;font-weight:500}.entry-form textarea{resize:vertical;min-height:76px}.entry-form input:focus,.entry-form select:focus,.entry-form textarea:focus{border-color:var(--teal);box-shadow:0 0 0 3px #0f8a8024}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.full{width:100%}.save-toast{margin-top:12px;border:1px solid #b8dfd5;background:#effaf7;color:#0c635d;border-radius:8px;padding:10px 12px;font-size:13px;font-weight:700}.employee-hero{display:flex;align-items:center;gap:14px;padding-bottom:18px;border-bottom:1px solid var(--line)}.large-avatar{width:58px;height:58px;border-radius:8px;font-size:22px}.balance-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin:18px 0}.metric-card{border:1px solid var(--line);border-radius:8px;padding:14px;background:#fff}.metric-card.good{border-color:#b8dfd5;background:#f1fbf8}.metric-card.good strong{color:var(--teal-dark)}.employee-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}.timeline-block{border:1px solid var(--line);border-radius:8px;background:#fbfcfc;padding:14px;align-content:start}.timeline-block h3{margin:0 0 10px;font-size:16px}@media(max-width:1220px){.workspace-grid{grid-template-columns:240px minmax(560px,1fr)}.detail-panel{grid-column:1 / -1;position:static;grid-template-columns:1fr 1fr}.sidebar{position:static}}@media(max-width:900px){.app-shell{padding:14px}.topbar{align-items:stretch;flex-direction:column}.topbar-actions{justify-content:stretch}.topbar-actions button{flex:1}.workspace-grid,.detail-panel,.employee-content{grid-template-columns:1fr}.calendar-panel,.employee-panel{order:1}.detail-panel{order:2}.sidebar{order:3}.calendar-panel,.employee-panel{min-height:auto}.calendar-toolbar{align-items:flex-start;flex-direction:column}.mobile-agenda{display:grid;gap:10px;padding:12px;border:1px solid var(--line);border-radius:8px;background:#fbfcfc;margin-bottom:12px}.mobile-agenda-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.mobile-agenda-heading strong{font-size:14px}.mobile-agenda-heading span{min-width:30px;height:28px;display:grid;place-items:center;border-radius:8px;color:var(--teal);background:#e4f5f2;font-weight:800;font-size:12px}.mobile-agenda-list{display:grid;gap:8px}.month-grid,.weekday-row{min-width:760px}.calendar-panel{overflow-x:auto}.balance-grid{grid-template-columns:1fr 1fr}}@media(max-width:540px){.topbar h1{font-size:24px}.form-row,.balance-grid,.compact-summary{grid-template-columns:1fr}.day-cell{min-height:112px}}