:root{
 --color-brand-primary:#1D4ED8;--color-brand-secondary:#334155;--color-bg-page:#F8FAFC;--color-bg-subtle:#F1F5F9;--color-surface:#FFFFFF;--color-text-primary:#0F172A;--color-text-secondary:#475569;--color-text-muted:#64748B;--color-border:#CBD5E1;--color-border-soft:#E2E8F0;
 --color-interactive-default:#1D4ED8;--color-interactive-hover:#1E40AF;--color-interactive-active:#1E3A8A;--color-interactive-disabled-bg:#E2E8F0;--color-interactive-disabled-text:#64748B;
 --color-action-clockin:#166534;--color-action-clockin-hover:#14532D;--color-action-clockout:#B91C1C;--color-action-clockout-hover:#991B1B;--color-action-break-start:#92400E;--color-action-break-end:#0F766E;
 --color-status-approved-text:#166534;--color-status-approved-bg:#DCFCE7;--color-status-pending-text:#92400E;--color-status-pending-bg:#FEF3C7;--color-status-rejected-text:#991B1B;--color-status-rejected-bg:#FEE2E2;--color-status-draft-text:#475569;--color-status-draft-bg:#F1F5F9;
 --bg:var(--color-bg-page);--surface:var(--color-surface);--surface-subtle:var(--color-bg-subtle);--ink:var(--color-text-primary);--ink-soft:var(--color-text-secondary);--muted:var(--color-text-muted);--line:var(--color-border-soft);--line-strong:var(--color-border);--accent:var(--color-brand-primary);--accent-hover:var(--color-interactive-hover);--accent-soft:#EFF6FF;--ok:var(--color-status-approved-text);--ok-soft:var(--color-status-approved-bg);--warn:var(--color-status-pending-text);--warn-soft:var(--color-status-pending-bg);--danger:var(--color-status-rejected-text);--danger-soft:var(--color-status-rejected-bg)
}
body{background:var(--color-bg-page);color:var(--color-text-primary)}
.primary{background:var(--color-interactive-default);border-color:var(--color-interactive-default);color:#fff}.primary:hover{background:var(--color-interactive-hover);border-color:var(--color-interactive-hover)}.primary:active{background:var(--color-interactive-active);border-color:var(--color-interactive-active)}
.btn:disabled,.btn[disabled]{background:var(--color-interactive-disabled-bg)!important;border-color:var(--color-interactive-disabled-bg)!important;color:var(--color-interactive-disabled-text)!important;cursor:not-allowed;transform:none}
.clockInAction{background:var(--color-action-clockin)!important;border-color:var(--color-action-clockin)!important;color:#fff!important}.clockInAction:hover{background:var(--color-action-clockin-hover)!important;border-color:var(--color-action-clockin-hover)!important}.clockOutAction{background:var(--color-action-clockout)!important;border-color:var(--color-action-clockout)!important;color:#fff!important}.clockOutAction:hover{background:var(--color-action-clockout-hover)!important;border-color:var(--color-action-clockout-hover)!important}.breakStartAction{background:var(--color-action-break-start)!important;color:#fff!important}.breakEndAction{background:var(--color-action-break-end)!important;color:#fff!important}
.statusApproved{background:var(--color-status-approved-bg);color:var(--color-status-approved-text)}.statusPending{background:var(--color-status-pending-bg);color:var(--color-status-pending-text)}.statusRejected{background:var(--color-status-rejected-bg);color:var(--color-status-rejected-text)}.statusDraft{background:var(--color-status-draft-bg);color:var(--color-status-draft-text)}
.credentialPanel{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}.credentialPanel>div,.scheduleContext>div{border:1px solid var(--line);background:var(--surface-subtle);border-radius:12px;padding:14px}.credentialPanel span,.scheduleContext span{display:block;color:var(--muted);font-size:12px;font-weight:600}.credentialPanel strong{display:block;margin-top:5px;font-size:25px;letter-spacing:.04em}.scheduleContext{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}.scheduleContext strong{display:block;margin-top:4px;font-size:13px}.scheduleContext .statusPending{grid-column:1/-1;border-color:#FDE68A}
.notice{border-color:#FDE68A;background:var(--color-status-pending-bg);color:var(--color-status-pending-text)}
@media(max-width:720px){.credentialPanel,.scheduleContext{grid-template-columns:1fr}.scheduleContext .statusPending{grid-column:auto}}