:root{color:#172019;background:#eef3ef;font-family:Inter,Noto Sans TC,PingFang TC,Microsoft JhengHei,system-ui,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input{font:inherit}button{cursor:pointer}.login-shell{display:grid;grid-template-columns:minmax(320px,520px) 1fr;min-height:100vh;background:linear-gradient(135deg,#164934e6,#132121db),url(https://images.unsplash.com/photo-1497366754035-f200968a6e72?auto=format&fit=crop&w=1800&q=80) center / cover}.login-panel{display:flex;flex-direction:column;justify-content:center;gap:26px;min-height:100vh;padding:clamp(28px,8vw,76px);background:#f8faf7f5;box-shadow:26px 0 70px #050f0c38}.brand-mark{display:grid;place-items:center;width:56px;height:56px;border-radius:8px;color:#f8fbf7;background:#184e3a}.eyebrow{margin:0 0 8px;color:#547164;font-size:.82rem;font-weight:800;letter-spacing:0}h1,h2,p{margin-top:0}h1{margin-bottom:12px;font-size:clamp(2.2rem,5vw,4.8rem);line-height:.96}.login-copy{max-width:29rem;margin-bottom:0;color:#5d6d66;line-height:1.8}.login-form{display:grid;gap:13px;max-width:390px}.login-form label{font-weight:800;color:#2a3d33}.password-row{display:grid;grid-template-columns:22px 1fr;align-items:center;gap:12px;height:56px;padding:0 16px;border:1px solid #ccd8cf;border-radius:8px;background:#fff}.password-row input{width:100%;border:0;outline:0;color:#19251d;background:transparent}.form-error{margin:0;color:#b22a2a;font-size:.92rem}.primary-button,.clock-button,.ghost-button,.icon-button{display:inline-flex;align-items:center;justify-content:center;gap:9px;border:0;border-radius:8px;font-weight:900}.primary-button{min-height:56px;color:#fff;background:#184e3a;box-shadow:0 14px 30px #184e3a38}.login-visual{position:relative;display:grid;place-items:center;overflow:hidden}.glass-clock{display:grid;gap:18px;justify-items:center;color:#fff}.glass-clock span{font-size:clamp(3.2rem,8vw,8rem);font-weight:950;line-height:1}.app-shell{min-height:100vh;padding:clamp(18px,4vw,44px);background:linear-gradient(120deg,#eef3eff0,#f7f9f6fa),url(https://images.unsplash.com/photo-1518005020951-eccb494ad742?auto=format&fit=crop&w=1800&q=80) center / cover fixed}.topbar,.hero-band,.dashboard-grid,.history-panel,.supplement-alert{width:min(1120px,100%);margin-inline:auto}.topbar{display:flex;align-items:center;justify-content:space-between;gap:18px}.topbar h1{margin:0;font-size:clamp(2rem,6vw,4.2rem)}.top-actions{display:flex;align-items:center;gap:10px}.ghost-button,.icon-button{width:44px;height:44px;color:#183126;background:#fffc;border:1px solid rgba(24,49,38,.12)}button:disabled{cursor:not-allowed;opacity:.54}.hero-band{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;min-height:210px;margin-top:28px;padding:clamp(22px,4vw,38px);border-radius:8px;color:#fff;background:linear-gradient(135deg,#184e3af5,#273533cc),url(https://images.unsplash.com/photo-1497366811353-6870744d04b2?auto=format&fit=crop&w=1600&q=80) center / cover;box-shadow:0 26px 70px #202f282e}.time-block p{margin-bottom:12px;color:#ffffffc2;font-weight:800}.time-block strong{display:block;font-size:clamp(3rem,12vw,8rem);line-height:.88}.network-pill{display:inline-flex;align-items:center;gap:9px;min-height:42px;padding:0 15px;border-radius:8px;white-space:nowrap;font-weight:900}.network-pill.ok{color:#173f2f;background:#bff3d7}.network-pill.blocked{color:#6e1f1f;background:#ffd9d4}.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr);gap:18px;margin-top:18px}.supplement-alert{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:18px;padding:14px 16px;border:1px solid #f0a79c;border-radius:8px;color:#6e221d;background:#fff1ee;box-shadow:0 14px 38px #5e251b1a}.supplement-alert>div{display:flex;align-items:center;gap:10px}.supplement-alert strong,.supplement-alert span{display:block}.supplement-alert span{margin-top:3px;font-weight:800}.alert-action{width:auto;min-width:132px}.policy-strip,.calendar-panel,.calendar-note{width:min(1120px,100%);margin-inline:auto}.policy-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:18px}.policy-strip div{display:grid;gap:6px;min-height:92px;padding:16px;border:1px solid rgba(28,60,45,.1);border-radius:8px;background:#ffffffeb;box-shadow:0 14px 38px #1f332a17}.policy-strip span,.policy-strip small{color:#66796f;font-weight:800}.policy-strip strong{color:#1c2c23;font-size:clamp(1.15rem,3vw,1.6rem);word-break:break-word}.work-panel,.status-panel,.history-panel,.calendar-panel{padding:clamp(18px,3vw,28px);border:1px solid rgba(28,60,45,.1);border-radius:8px;background:#ffffffeb;box-shadow:0 18px 55px #1f332a1f}.employee-line{display:flex;align-items:center;justify-content:space-between;gap:18px}.employee-line span,.record-summary span,.network-card span{color:#6a7b72;font-size:.88rem;font-weight:800}.employee-line h2{margin:6px 0 0;font-size:clamp(2rem,6vw,4rem);line-height:1}.clock-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:28px}.clock-button{min-height:106px;padding:18px;color:#fff;font-size:clamp(1.05rem,3vw,1.3rem)}.clock-button.start{background:#176c47}.clock-button.end{background:#2f3d56}.sync-line{display:flex;align-items:center;gap:9px;min-height:44px;margin-top:18px;padding:0 13px;border-radius:8px;color:#365044;background:#edf4ef;font-weight:800}.sync-line.failed{color:#862424;background:#ffe2de}.sync-line.synced{color:#155a3b;background:#ddf5e7}.spin{animation:spin 1s linear infinite}.panel-title{display:flex;align-items:center;gap:9px;margin-bottom:18px;color:#28382f;font-weight:950}.record-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.record-summary div{display:grid;gap:8px;min-height:104px;padding:16px;border-radius:8px;background:#f3f6f3}.record-summary div.late-box{background:#fff2dc}.record-summary strong{font-size:clamp(1.25rem,4vw,2rem)}.record-summary small{color:#996010;font-weight:900}.network-card{display:grid;grid-template-columns:24px 1fr 44px;align-items:center;gap:12px;margin-top:14px;padding:14px;border-radius:8px;background:#f7f9f7}.network-card strong{display:block;margin-top:4px;word-break:break-word}.network-card small{display:block;margin-top:6px;color:#9a2c2c}.history-panel,.calendar-panel{margin-top:18px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:14px}.section-heading .panel-title{margin-bottom:0}.text-button,.mini-button,.seg-button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:36px;border:0;border-radius:8px;color:#173d2e;background:#e6f2eb;font-weight:900}.text-button{padding:0 12px}.top-record-button{min-height:44px;color:#fff;background:#184e3a;box-shadow:0 12px 28px #184e3a2e}.record-toolbar{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:8px}.seg-button{min-width:64px;padding:0 12px;color:#50675c;background:#f0f5f1}.seg-button[aria-pressed=true]{color:#fff;background:#184e3a}.mini-button{width:100%;padding:0 10px;font-size:.88rem}.mini-button.approve{color:#243653;background:#e0e7f5}.workday-list{display:grid;gap:10px}.workday-row{display:grid;grid-template-columns:minmax(150px,1fr) minmax(160px,1fr) minmax(148px,.8fr);align-items:center;gap:12px;min-height:68px;padding:12px;border:1px solid transparent;border-radius:8px;background:#f7f9f7}.workday-row.late{border-color:#f0c06b;background:#fff8eb}.workday-row.missing{border-color:#f0a79c;background:#fff1ee}.date-cell{display:grid;gap:4px}.date-cell strong{font-size:1.04rem}.date-cell small,.history-item small,.day-times span{color:#687970}.day-times{display:flex;flex-wrap:wrap;gap:8px;font-weight:850}.day-times span{min-width:96px}.day-status{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-start}.status-chip{display:inline-flex;align-items:center;justify-content:center;min-height:30px;padding:0 10px;border-radius:8px;font-size:.84rem;font-weight:950}.status-chip.ok{color:#15573b;background:#d8f2e3}.status-chip.late{color:#865511;background:#ffe6b7}.status-chip.missing{color:#8a2822;background:#ffd8d2}.status-chip.pending{color:#243653;background:#e0e7f5}.status-chip.rest{color:#586b62;background:#e7ece8}.request-actions{display:grid;gap:8px;justify-items:stretch}.calendar-note{display:grid;gap:6px;margin-top:12px;padding:14px 16px;border-left:4px solid #547164;border-radius:8px;color:#52655c;background:#ffffffd1}.calendar-note strong{color:#26382f}.history-list{display:grid;gap:10px}.history-item{display:grid;grid-template-columns:72px 1fr;align-items:center;gap:12px;min-height:58px;padding:10px 12px;border-radius:8px;background:#f7f9f7}.history-item small{display:block;margin-top:4px}.badge{display:inline-flex;align-items:center;justify-content:center;min-height:32px;border-radius:8px;font-weight:950}.badge.start{color:#15573b;background:#d8f2e3}.badge.end{color:#243653;background:#e0e7f5}.empty-text{margin:0;color:#687970}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:840px){.login-shell{grid-template-columns:1fr}.login-panel{min-height:68vh}.login-visual{display:none}.hero-band{align-items:stretch;flex-direction:column;min-height:260px}.network-pill{justify-content:center;white-space:normal}.supplement-alert{align-items:stretch;flex-direction:column}.dashboard-grid,.clock-actions,.policy-strip,.workday-row{grid-template-columns:1fr}.topbar{align-items:flex-start}.top-actions,.record-toolbar{justify-content:flex-start}}@media(max-width:520px){.app-shell{padding:14px}.hero-band{padding:20px}.clock-button{min-height:86px}.record-summary{grid-template-columns:1fr}}