:root { color-scheme:light; --brand-700:#075e54; --brand-600:#087567; --brand-500:#12927f; --brand-100:#ddf5ee; --ink:#172b24; --text:#31423c; --muted:#66756f; --surface:#fff; --canvas:#f3f7f5; --line:#dbe6e1; --shadow:0 8px 24px #0f352b14; font-family:system-ui,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo",sans-serif; color:var(--ink); background:var(--canvas); }
* { box-sizing: border-box; }
body { margin:0; min-width:320px; background:var(--canvas); color:var(--ink); font-size:16px; line-height:1.5; letter-spacing:-.01em; }
button { min-height:44px; padding:10px 14px; border:0; border-radius:12px; background:var(--brand-600); color:#fff; font:inherit; font-weight:750; cursor:pointer; transition:transform .12s,background .12s,box-shadow .12s; }
button:active { transform:scale(.98); }
.boot-message, .clean-shell { width:min(100% - 32px,720px); margin:0 auto; }
.clean-shell { min-height:100svh; padding:20px 0 calc(88px + env(safe-area-inset-bottom)); }
.boot-message { max-width: 480px; min-height: 100vh; display: grid; align-content: center; }
.clean-shell > header { position:sticky; z-index:3; top:0; display:flex; align-items:center; justify-content:space-between; gap:16px; margin:-20px -16px 18px; padding:20px 16px 14px; background:linear-gradient(to bottom,var(--canvas) 78%,transparent); }
.clean-title { display:grid; gap:1px; }
.clean-title > span { color:var(--brand-700); font-size:13px; font-weight:800; letter-spacing:.03em; }
.clean-title h1 { margin:0; font-size:28px; line-height:1.24; letter-spacing:-.045em; }
.clean-placeholder { margin-top:24px; padding:24px; border:1px solid var(--line); border-radius:18px; background:var(--surface); box-shadow:var(--shadow); }
.clean-nav { position:fixed; z-index:40; right:0; bottom:0; left:0; display:flex; justify-content:space-around; gap:2px; margin:0; padding:7px 6px calc(7px + env(safe-area-inset-bottom)); border-top:1px solid var(--line); background:#fffffff5; backdrop-filter:blur(14px); }
.clean-nav button { display:grid; min-width:58px; min-height:52px; place-items:center; gap:2px; padding:5px 7px; border-radius:12px; background:transparent; color:#6c7b75; font-size:12px; line-height:1.1; white-space:nowrap; }.clean-nav button svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }.clean-nav button.selected { background:var(--brand-100); color:var(--brand-700); }.clean-nav button:disabled { opacity:.55; cursor:default; }.clean-nav small { font-size:11px; }
.clean-workspace { padding-bottom:20px; }.clean-page-head { display:none; }.clean-page-head.notification-head { display:flex; justify-content:flex-end; align-items:end; gap:16px; margin:0 0 14px; }.clean-page-head.notification-head > div:first-child { display:none; }
.clean-filters { display:flex; gap:8px; overflow-x:auto; margin:0 -16px 14px; padding:0 16px 4px; scrollbar-width:none; }.clean-filters::-webkit-scrollbar { display:none; }.clean-filters button { flex:0 0 auto; min-height:38px; padding:7px 12px; border-radius:999px; background:#e9f0ed; color:#52645d; font-size:14px; }.clean-filters button.selected { background:var(--ink); color:#fff; }
.clean-task-list { overflow:hidden; border:1px solid #d8e5df; border-radius:18px; background:#fff; }.clean-task { padding:15px; border-bottom:1px solid #e3ece8; }.clean-task:last-child { border-bottom:0; }.clean-task-head { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }.clean-task-head b { overflow-wrap:anywhere; font-size:16px; }.task-status { flex:0 0 auto; padding:4px 8px; border-radius:20px; background:#edf1ef; color:#486058; font-size:12px; font-weight:700; }.task-status.completed { background:#e1f6ea; color:#087567; }.task-status.submitted { background:#fff2d9; color:#8d5900; }.task-status.rejected { background:#fce9e7; color:#b42318; }.clean-task-meta,.clean-task-description,.clean-task-reject { margin:8px 0 0; color:#5f746d; font-size:14px; line-height:1.45; }.clean-task-reject { color:#b42318; }.clean-task-actions { display:flex; align-items:center; gap:10px; margin-top:13px; }.clean-task-actions button { min-height:38px; padding:7px 11px; font-size:14px; }.text-button { background:transparent; color:#087567; text-decoration:underline; }
.manager-task-tools { display:flex; align-items:center; justify-content:flex-end; gap:8px; margin:-48px 0 12px; }.manager-task-tools > button:first-child { display:grid; width:42px; min-height:42px; place-items:center; padding:0; border-radius:50%; font-size:24px; }.clean-folder { margin:9px; border:1px solid #d8e5df; border-radius:14px; background:#fff; overflow:hidden; }.clean-folder > summary { display:flex; align-items:center; justify-content:space-between; gap:10px; min-height:52px; padding:11px 13px; cursor:pointer; list-style:none; }.clean-folder > summary::-webkit-details-marker { display:none; }.clean-folder summary span:first-child { display:grid; gap:2px; }.clean-folder summary small,.clean-folder-empty { color:#6b8178; font-size:12px; }.clean-folder-empty { margin:0; padding:14px; border-top:1px solid #e3ece8; }.clean-folder .clean-folder { margin:8px 12px 12px; }.clean-folder .clean-task { border-top:1px solid #e3ece8; border-bottom:0; }.person-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }.person-check,.day-check { display:flex!important; align-items:center; gap:6px; min-height:38px; padding:8px; border:1px solid #d7e5df; border-radius:10px; font-weight:500!important; }.person-check input,.day-check input,.check-line input { width:auto!important; min-height:auto!important; margin:0; }.check-line { display:flex!important; align-items:center; gap:8px; min-height:42px; }.clean-dialog fieldset { display:flex; flex-wrap:wrap; gap:6px; margin:13px 0 0; padding:10px; border:1px solid #d7e5df; border-radius:12px; }.clean-dialog legend { padding:0 5px; color:#34564b; font-size:14px; font-weight:700; }.date-grid { display:grid; grid-template-columns:1fr 1fr; gap:9px; }.manager-action-list { display:grid; gap:8px; }.manager-action-list button { text-align:left; }.template-list { display:grid; gap:10px; }.template-list article { padding:13px; border:1px solid #d8e5df; border-radius:13px; }.template-list article p { margin:5px 0 10px; color:#5f746d; font-size:14px; }.template-list .text-button { padding:7px 8px; min-height:36px; margin-left:4px; }
.clean-history-caption { margin:0 0 10px; padding:10px 12px; border-radius:11px; background:#eef6f3; color:#46645a; font-size:13px; }.clean-personal-folder > summary,.clean-task { -webkit-touch-callout:none; user-select:none; }.task-head-tools { display:flex!important; grid-auto-flow:column; align-items:center; gap:6px!important; }.task-drag-handle,.folder-drag-handle { display:grid; width:34px; min-height:34px; place-items:center; padding:0; border-radius:10px; background:#edf4f1; color:#587068; font-size:19px; line-height:1; touch-action:none; cursor:grab; }.folder-drag-handle { flex:0 0 auto; }.clean-task.is-dragging,.clean-folder.is-dragging { opacity:.28; transform:scale(.985); }.drag-target { outline:3px solid #32a48e!important; outline-offset:-3px; background:#ecfaf5!important; }.clean-drag-ghost { position:fixed; z-index:60; top:0; left:0; max-height:110px; overflow:hidden; margin:0; padding:12px; border:2px solid #087567; border-radius:15px; background:#fff; box-shadow:0 18px 42px #0f3b2f45; pointer-events:none; opacity:.94; transform:translate3d(-999px,-999px,0); }.clean-drag-ghost .clean-task-actions,.clean-drag-ghost .task-drag-handle,.clean-drag-ghost .folder-drag-handle { display:none; }.dragging-task { overflow:hidden; }
.attendance-summary,.attendance-record-summary { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; padding:16px; border-radius:17px; background:#e7f6f0; }.attendance-summary p,.attendance-summary h2,.attendance-summary span { margin:0; }.attendance-summary p { color:#087567; font-size:13px; font-weight:700; }.attendance-summary h2 { margin:3px 0; font-size:24px; }.attendance-summary span { color:#527067; font-size:14px; }.attendance-summary b { padding:6px 9px; border-radius:20px; background:#fff; color:#087567; font-size:12px; }.attendance-actions { display:flex; gap:9px; margin-top:13px; }.attendance-actions button { min-height:38px; padding:7px 11px; font-size:14px; }.attendance-record-summary { background:#fff; border:1px solid #d8e5df; }.attendance-record-summary span { color:#087567; font-weight:800; }
.plus-small { display:grid; width:38px; min-height:38px; place-items:center; padding:0; border-radius:50%; font-size:22px; }.notice-item { display:block; width:100%; padding:15px; border:0; border-bottom:1px solid #e3ece8; border-radius:0; background:#fff; color:#18362e; text-align:left; }.notice-item:last-child { border-bottom:0; }.notice-item > div { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }.notice-item b { overflow-wrap:anywhere; }.notice-item span,.notice-item small,.notice-date { color:#6b8178; font-size:12px; }.notice-item p { display:-webkit-box; overflow:hidden; margin:7px 0 0; color:#5f746d; font-size:14px; line-height:1.45; -webkit-box-orient:vertical; -webkit-line-clamp:2; }.notice-full { white-space:pre-wrap; color:#36564b; line-height:1.65; }.reply-box { margin-top:16px; padding:12px; border-radius:12px; background:#edf7f3; }.reply-box p { margin:7px 0 0; color:#36564b; white-space:pre-wrap; }
.communication-tabs { display:flex; gap:8px; overflow-x:auto; margin:0 0 14px; padding-bottom:3px; scrollbar-width:none; }.communication-tabs::-webkit-scrollbar { display:none; }.communication-tabs > button:not(.plus-small) { flex:0 0 auto; min-height:38px; padding:7px 12px; border-radius:12px; background:#e6f2ee; color:#315449; font-size:14px; }.communication-tabs > button.selected { background:var(--brand-600); color:#fff; }.communication-tabs .plus-small { flex:0 0 auto; margin-left:auto; }.communication-heading { display:flex; align-items:end; justify-content:space-between; gap:12px; margin:2px 0 9px; }.communication-heading > div { display:grid; gap:2px; }.communication-heading span,.communication-card-title span { color:var(--brand-700); font-size:13px; font-weight:800; }.communication-heading h2,.communication-card-title h2 { margin:0; font-size:19px; }.communication-card { overflow:hidden; margin:0 0 14px; padding:0 16px; border:1px solid var(--line); border-radius:16px; background:#fff; box-shadow:var(--shadow); }.communication-card-title { padding:16px 0 8px; }.communication-card-title span + h2 { margin-top:2px; }.communication-card .notice-item { padding:13px 0; }.communication-row > small { display:block; margin-top:5px; }.communication-row .task-status { flex:0 0 auto; padding:4px 8px; }.communication-row .reply-present { margin-top:8px; color:var(--brand-700); font-weight:700; }
.clean-empty,.clean-loading,.clean-error { margin:0; padding:24px 15px; text-align:center; color:#5f746d; }.clean-error { color:#b42318; }.clean-backdrop { position:fixed; z-index:45; inset:0; display:grid; align-items:end; background:#0e2d2538; }.clean-dialog { max-height:88svh; overflow:auto; padding:20px 20px calc(20px + env(safe-area-inset-bottom)); border-radius:22px 22px 0 0; background:#fff; box-shadow:0 -14px 40px #153a2f26; }.clean-dialog header { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:16px; }.clean-dialog h2 { margin:0; font-size:20px; }.clean-dialog label { display:grid; gap:7px; margin-top:13px; color:#34564b; font-size:14px; font-weight:700; }.clean-dialog input,.clean-dialog textarea { width:100%; min-height:46px; padding:10px; border:1px solid #cbdcd5; border-radius:12px; font:inherit; }.clean-dialog textarea { min-height:96px; resize:vertical; }.clean-dialog [type="submit"],.review-controls { margin-top:16px; }.icon-button { display:grid; width:38px; min-height:38px; place-items:center; padding:0; border-radius:50%; background:#edf4f1; color:#315449; font-size:22px; }.photo-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:8px; }.photo-grid img { display:block; width:100%; aspect-ratio:1; object-fit:cover; border-radius:12px; }.review-controls { display:flex; gap:8px; flex-wrap:wrap; }.soft-danger { background:#fdebea; color:#b42318; }.clean-toast { position:fixed; z-index:50; right:16px; bottom:20px; max-width:calc(100vw - 32px); padding:12px 14px; border-radius:12px; background:#173c30; color:#fff; box-shadow:0 12px 28px #173c3033; opacity:0; pointer-events:none; transform:translateY(12px); transition:.18s ease; }.clean-toast.show { opacity:1; transform:translateY(0); }
.auth-shell { min-height: 100svh; display: grid; place-items: center; padding: 24px; background: linear-gradient(145deg, #e9f6f1 0%, #f7faf8 58%, #e1f1ec 100%); }
.auth-panel { width: min(100%, 520px); }
.auth-brand { margin-bottom: 22px; text-align: center; }
.auth-brand p { margin: 8px 0; color: #087567; font-weight: 700; }
.auth-brand h1 { margin: 8px 0 10px; font-size: clamp(27px, 6vw, 38px); line-height: 1.18; letter-spacing: -0.04em; }
.auth-brand > span:last-child, .auth-card > p { color: #5f746d; line-height: 1.5; }
.auth-mark { display: inline-grid; width: 46px; height: 46px; place-items: center; border-radius: 16px; background: #087567; color: #fff; font-size: 24px; box-shadow: 0 12px 30px #08756733; }
.auth-card { display: grid; gap: 12px; padding: 20px; border: 1px solid #dce9e4; border-radius: 20px; background: #fff; box-shadow: 0 14px 32px #214c3d14; }
.auth-card h1, .auth-card h2, .auth-card p { margin: 0; }
.auth-card h2 { font-size: 20px; }
.auth-card label { display: grid; gap: 6px; color: #34564b; font-size: 14px; font-weight: 700; }
.auth-card input { width: 100%; min-height: 46px; padding: 10px 12px; border: 1px solid #cbdcd5; border-radius: 12px; background: #fff; color: #18362e; font: inherit; }
.auth-card input:focus { outline: 3px solid #c9eee3; border-color: #087567; }
.auth-primary, .auth-secondary { width: 100%; margin-top: 4px; }
.auth-secondary { background: #e0f5ee; color: #075a4f; }
.auth-divider { display: flex; align-items: center; gap: 12px; margin: 18px 0; color: #71847d; font-size: 13px; }
.auth-divider::before, .auth-divider::after { content: ''; flex: 1; height: 1px; background: #dbe7e2; }
.auth-signup { box-shadow: none; }
.auth-notice { display: grid; gap: 4px; margin-top: 14px; padding: 14px; border-radius: 14px; background: #edf8f4; color: #376257; font-size: 14px; line-height: 1.45; }
.auth-notice b { color: #075a4f; }
.auth-message { min-height: 22px; margin: 14px 2px 0; font-size: 14px; line-height: 1.45; text-align: center; }
.auth-message.success { color: #087567; }.auth-message.error { color: #b42318; }
@media (min-width: 840px) { .auth-panel { width: min(100%, 600px); }.auth-card { padding: 24px; } }
@media (min-width: 720px) { .clean-dialog { width:min(100%,680px); margin:0 auto; padding:20px; border-radius:22px; }.clean-backdrop { place-items:center; padding:24px; } }

.dialog-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:18px; }
.secondary { background:#e6f2ee; color:#315449; }
.danger { background:#fcebea; color:#ae2f27; }
.suggestion-photo-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:14px; }
.suggestion-photo-grid img { display:block; width:100%; aspect-ratio:1; object-fit:cover; border-radius:11px; background:#edf4f1; }
.reader-list { overflow:hidden; margin-top:14px; border:1px solid #d8e5df; border-radius:13px; }.reader-list > div { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:12px; border-bottom:1px solid #e3ece8; }.reader-list > div:last-child { border-bottom:0; }.reader-list span { flex:0 0 auto; font-size:12px; }.reader-done { color:#087567; }.reader-waiting { color:#788780; }
.clean-dialog select { width:100%; min-height:46px; padding:10px; border:1px solid #cbdcd5; border-radius:12px; background:#fff; font:inherit; }
.staff-list { overflow:hidden; border:1px solid var(--line); border-radius:17px; background:var(--surface); box-shadow:var(--shadow); }.staff-row { display:flex; width:100%; align-items:center; justify-content:space-between; gap:12px; min-height:72px; padding:13px 14px; border-bottom:1px solid var(--line); border-radius:0; background:var(--surface); color:var(--ink); text-align:left; }.staff-row:last-child { border-bottom:0; }.staff-row > div { display:grid; flex:1; gap:5px; min-width:0; }.staff-row > div span { color:var(--muted); font-size:13px; }.staff-progress { display:block; width:100%; height:7px; overflow:hidden; border-radius:999px; background:#e7efeb; }.staff-progress em { display:block; height:100%; border-radius:inherit; background:var(--brand-500); }.staff-state-dot { flex:0 0 auto; width:8px; height:8px; border-radius:50%; background:var(--brand-500); }.all-staff { margin-top:14px; border:1px solid var(--line); border-radius:17px; background:var(--surface); overflow:hidden; box-shadow:var(--shadow); }.all-staff > summary { display:flex; align-items:center; justify-content:space-between; min-height:52px; padding:12px 14px; cursor:pointer; list-style:none; }.all-staff > summary::-webkit-details-marker { display:none; }.all-staff > summary span { color:#687d75; font-size:13px; }.all-staff .staff-list { border-width:1px 0 0; border-radius:0; box-shadow:none; }.staff-dialog header > div { display:grid; gap:4px; }.staff-dialog header span { color:#687d75; font-size:13px; }.staff-detail-summary { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px; padding:12px; border-radius:13px; background:#e8f6f0; }.staff-detail-summary button { min-height:36px; padding:6px 10px; font-size:13px; }.staff-detail-list { overflow:hidden; border:1px solid #d8e5df; border-radius:14px; }.staff-detail-list > div { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding:12px; border-bottom:1px solid #e3ece8; }.staff-detail-list > div:last-child { border-bottom:0; }.staff-detail-list > div > span:not(.task-status) { color:#667c74; font-size:12px; line-height:1.5; text-align:right; }.staff-period { display:grid; grid-template-columns:1fr 1fr auto; align-items:end; gap:7px; margin-bottom:10px; }.staff-period label { margin:0; }.staff-period button { min-height:46px; }.staff-period + .attendance-record-summary { margin-top:0; }
@media (max-width:520px) { .staff-period { grid-template-columns:1fr 1fr; }.staff-period button { grid-column:1/-1; } }
.account-list { overflow:hidden; border:1px solid #d8e5df; border-radius:18px; background:#fff; }.account-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; padding:14px; border-bottom:1px solid #e3ece8; }.account-row:last-child { border-bottom:0; }.account-row > div:first-child { display:grid; gap:5px; min-width:0; }.account-row > div:first-child span { color:#667c74; font-size:13px; overflow-wrap:anywhere; }.account-state { display:flex; align-items:center; gap:7px; }.account-edit { min-height:34px; padding:5px 9px; font-size:13px; }.account-actions { grid-column:1/-1; display:flex; justify-content:flex-end; gap:8px; }.account-actions button { min-height:38px; padding:7px 14px; }.form-note { margin:14px 0 0; color:#667c74; font-size:13px; line-height:1.5; }
.home-attendance { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:17px; border:1px solid var(--line); border-radius:16px; background:var(--surface); box-shadow:var(--shadow); }.home-attendance span,.home-section-head span,.home-card-heading > div > span { color:var(--brand-700); font-size:13px; font-weight:800; }.home-attendance h2,.home-attendance p { margin:4px 0 0; }.home-attendance p { color:#567269; font-size:14px; }.home-attendance button { flex:0 0 auto; }.home-section { margin-top:18px; }.home-section-head { display:flex; align-items:end; justify-content:space-between; gap:12px; margin-bottom:9px; }.home-section-head h2 { margin:3px 0 0; font-size:20px; }.home-section-head button { min-height:36px; padding:6px 10px; font-size:13px; }.home-list { overflow:hidden; border:1px solid var(--line); border-radius:16px; background:var(--surface); box-shadow:var(--shadow); }.home-list > button { display:flex; width:100%; align-items:center; justify-content:space-between; gap:12px; min-height:54px; padding:12px 14px; border-bottom:1px solid var(--line); border-radius:0; background:var(--surface); color:var(--ink); text-align:left; }.home-list > button:last-child { border-bottom:0; }.home-list > button b { min-width:0; overflow-wrap:anywhere; }.home-list > button > span { flex:0 0 auto; color:#657b73; font-size:13px; }.home-card { margin:14px 0; padding:16px; border:1px solid var(--line); border-radius:16px; background:var(--surface); box-shadow:var(--shadow); }.home-card-heading,.home-ok { display:flex; align-items:center; justify-content:space-between; gap:12px; }.home-card-heading h2,.home-ok h2 { margin:0; font-size:18px; }.home-card-heading > div h2 { margin-top:3px; }.home-card-heading > button { min-height:36px; padding:6px 10px; font-size:13px; }.home-urgent { border-color:#f1cf9d; background:#fffaf4; }.home-urgent-list { display:grid; margin-top:8px; }.home-urgent-row { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:9px 0; border-bottom:1px solid #f1ddc1; }.home-urgent-row:last-child { border-bottom:0; }.home-urgent-row button { flex:0 0 auto; min-height:36px; padding:7px 10px; font-size:13px; white-space:nowrap; }.home-ok { color:var(--ink); }.home-staff-list { margin-top:8px; }.home-staff-list > button { display:flex; width:100%; align-items:center; justify-content:space-between; gap:12px; min-height:68px; padding:11px 0; border-bottom:1px solid var(--line); border-radius:0; background:transparent; color:var(--ink); text-align:left; }.home-staff-list > button:last-child { border-bottom:0; }.home-staff-main { display:grid!important; flex:1!important; gap:4px; min-width:0; color:var(--ink)!important; }.home-staff-main small { color:var(--muted); font-size:13px; }.home-staff-main i { display:block; width:100%; height:7px; overflow:hidden; border-radius:999px; background:#e7efeb; }.home-staff-main em { display:block; height:100%; border-radius:inherit; background:var(--brand-500); }
.home-staff-dialog header { align-items:flex-start; }.home-staff-dialog header > div { min-width:0; }.home-staff-dialog header p { margin:5px 0 0; color:var(--muted); font-size:14px; }.home-staff-task-list { overflow:visible; }.home-preview-folder { margin:0 0 9px; }.home-preview-folder > summary { padding-inline:12px; }.home-preview-folder .clean-task { border-top:1px solid #e3ece8; border-bottom:0; }.home-preview-task { padding:0; background:#fff; }.home-preview-task > summary { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:10px; min-height:50px; padding:10px 12px; cursor:pointer; list-style:none; }.home-preview-task > summary::-webkit-details-marker { display:none; }.home-preview-task .clean-task-detail { padding:0 12px 12px; }.home-staff-task-list > .home-preview-task { border-bottom:1px solid var(--line); }.home-staff-dialog-close { width:100%; margin-top:16px; }

/* 근태 새 구조: 주간표·날짜 예외·기간 기록 */
.schedule-toolbar,.record-toolbar { display:flex; align-items:flex-end; justify-content:space-between; gap:10px; margin-bottom:11px; }.schedule-toolbar span,.record-toolbar span { color:#087567; font-size:13px; font-weight:800; }.schedule-toolbar h2,.record-toolbar h2 { margin:3px 0 0; font-size:19px; }.schedule-toolbar > div:last-child { display:flex; gap:5px; }.schedule-toolbar button,.record-toolbar button { min-height:36px; padding:6px 9px; font-size:12px; }
.week-board { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:5px; }.week-board > article { min-width:0; overflow:hidden; border:1px solid #d8e5df; border-radius:12px; background:#fff; }.week-board article > header { display:grid; gap:1px; padding:8px 3px; background:#e8f5f0; text-align:center; }.week-board article > header b { font-size:14px; }.week-board article > header span { color:#678078; font-size:9px; }.week-board article > div { display:grid; align-content:start; gap:4px; min-height:96px; padding:4px; }.week-board article > div > p { margin:auto 0; color:#94a59f; font-size:9px; text-align:center; }.week-board article > div > button { display:grid; gap:2px; width:100%; min-height:42px; padding:5px 3px; border-radius:8px; background:#f0f8f5; color:#18362e; text-align:center; }.week-board article button b { min-width:0; overflow:hidden; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }.week-board article button small { color:#557169; font-size:8px; line-height:1.25; }.week-board article button em { color:#b54708; font-size:8px; font-style:normal; font-weight:800; }.schedule-actions { display:flex; gap:8px; margin-top:12px; }.schedule-actions button { flex:1; }
.schedule-group { display:grid!important; gap:9px!important; }.schedule-time-row { display:grid; grid-template-columns:1fr 1fr; align-items:end; gap:8px; }.schedule-time-row label { margin:0; }.schedule-time-row .overnight-check { grid-column:1/-1; display:flex; flex-direction:row; align-items:center; justify-content:space-between; min-height:46px; padding:9px 11px; border:1px solid #cbdcd5; border-radius:12px; }.overnight-check input { width:auto!important; min-height:auto!important; }.weekday-checks { display:grid; grid-template-columns:repeat(7,1fr); gap:5px; }.weekday-checks label { display:grid; justify-items:center; gap:5px; min-width:0; margin:0; padding:7px 1px; border:1px solid #d7e5df; border-radius:9px; }.weekday-checks label span { font-size:13px; }.weekday-checks input { width:auto!important; min-height:auto!important; margin:0; }.schedule-group > .text-button { justify-self:end; min-height:32px; padding:4px 7px; }
.period-presets { display:grid; grid-template-columns:repeat(4,1fr); gap:6px; margin-bottom:9px; }.period-presets button { min-height:38px; padding:6px 2px; border-radius:10px; background:#e8f1ed; color:#315449; font-size:12px; }.period-presets button.selected { background:#173c30; color:#fff; }.period-form { display:grid; grid-template-columns:1fr 1fr auto; align-items:end; gap:7px; margin-bottom:12px; }.period-form label { display:grid; gap:5px; color:#526e65; font-size:11px; font-weight:700; }.period-form input { width:100%; min-width:0; min-height:42px; padding:7px; border:1px solid #cbdcd5; border-radius:10px; font:inherit; }.period-form button { min-height:42px; padding:7px 10px; }
.attendance-people,.attendance-detail-list,.today-attendance-list { overflow:hidden; border:1px solid #d8e5df; border-radius:16px; background:#fff; }.attendance-people > button { display:flex; width:100%; align-items:center; justify-content:space-between; gap:10px; min-height:58px; padding:11px 13px; border-bottom:1px solid #e3ece8; border-radius:0; background:#fff; color:#18362e; text-align:left; }.attendance-people > button:last-child { border-bottom:0; }.attendance-people button span { display:grid; gap:3px; }.attendance-people button small { color:#687d75; font-size:12px; }.attendance-people button strong { flex:0 0 auto; font-size:14px; }.attendance-record-row,.today-attendance-list article { padding:12px 13px; border-bottom:1px solid #e3ece8; background:#fff; }.attendance-record-row:last-child,.today-attendance-list article:last-child { border-bottom:0; }.attendance-record-row > div,.today-attendance-list article { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:5px 10px; }.attendance-record-row > div span,.attendance-record-row p,.today-attendance-list article span,.today-attendance-list article p { color:#687d75; font-size:12px; }.attendance-record-row p,.today-attendance-list article p { grid-column:1/-1; margin:5px 0 0; line-height:1.55; }.attendance-record-row.editable { cursor:context-menu; }.longpress-hint { margin:9px 2px 0; color:#73877f; font-size:12px; text-align:center; }
.attendance-today-list { overflow:hidden; margin-top:2px; border:1px solid var(--line); border-radius:16px; background:#fff; }.attendance-today-row { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:64px; padding:12px 14px; border-bottom:1px solid var(--line); }.attendance-today-row:last-child { border-bottom:0; }.attendance-today-row > div:first-child { min-width:0; }.attendance-today-row b { display:block; }.attendance-today-row > div:first-child span { display:block; overflow-wrap:anywhere; color:var(--muted); font-size:13px; }.attendance-today-state { flex:0 0 auto; text-align:right; }.attendance-today-state small { display:block; margin-top:4px; color:var(--muted); font-size:11px; white-space:nowrap; }.week-summary { overflow:hidden; border:1px solid var(--line); border-radius:15px; background:#fff; }.week-summary-day { display:grid; grid-template-columns:55px minmax(0,1fr); gap:8px; padding:10px 12px; border-bottom:1px solid var(--line); }.week-summary-day:last-child { border-bottom:0; }.week-summary-date b,.week-summary-date span { display:block; }.week-summary-date b { color:var(--brand-700); }.week-summary-date span { color:var(--muted); font-size:12px; }.week-summary-shifts { display:flex; flex-wrap:wrap; align-content:center; gap:6px; }.week-summary-shift { min-height:30px; padding:5px 7px; border-radius:9px; background:var(--brand-100); color:var(--brand-700); font-size:13px; line-height:1.25; text-align:left; }.week-summary-shift.exception { background:#fff3df; color:#a85b00; }.week-summary-empty { align-self:center; color:var(--muted); font-size:13px; }
@media (min-width:720px) { .week-board { gap:8px; }.week-board article > div { min-height:160px; padding:7px; }.week-board article > div > button { min-height:56px; padding:7px 5px; }.week-board article button b { font-size:13px; }.week-board article button small,.week-board article button em { font-size:10px; } }

/* 알림센터와 휴대폰 푸시 */
.clean-head-actions { display:flex; align-items:center; gap:8px; }.clean-head-actions .icon-button { position:relative; min-width:44px; min-height:44px; border:1px solid var(--line); border-radius:12px; background:var(--surface); color:var(--brand-700); }.clean-head-actions svg { width:22px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }.clean-head-actions [data-notification-count] { position:absolute; top:-5px; right:-5px; min-width:19px; height:19px; padding:1px 5px; border:2px solid #f7faf8; border-radius:12px; background:#c43c32; color:#fff; font-size:10px; font-weight:800; line-height:15px; text-align:center; }
.clean-drawer { position:fixed; z-index:52; top:0; right:0; width:min(86vw,340px); height:100svh; padding:calc(24px + env(safe-area-inset-top)) 20px calc(24px + env(safe-area-inset-bottom)); background:#fff; box-shadow:-18px 0 46px #123a3030; transform:translateX(105%); transition:transform .22s ease; }.clean-drawer.open { transform:translateX(0); }.clean-drawer > div { display:grid; gap:4px; margin:28px 4px 22px; }.clean-drawer > div span { color:#687d75; font-size:13px; }.clean-drawer nav { display:grid; border-top:1px solid #e0eae6; }.clean-drawer nav button { min-height:54px; padding:13px 4px; border-bottom:1px solid #e0eae6; border-radius:0; background:#fff; color:#18362e; text-align:left; }.clean-drawer .drawer-logout { color:#a13b34; }.drawer-close { position:absolute; top:calc(14px + env(safe-area-inset-top)); right:14px; display:grid; width:40px; min-height:40px; place-items:center; padding:0; border-radius:50%; background:#edf4f1; color:#315449; font-size:24px; }.clean-drawer-shade { position:fixed; z-index:51; inset:0; width:100%; height:100%; padding:0; border-radius:0; background:#102e263d; }
.clean-menu-backdrop { align-items:center; background:#102e262d; }.clean-context-menu { position:absolute; top:50%; width:min(78vw,310px); padding:14px; border:1px solid #d8e5df; border-radius:17px; background:#fff; box-shadow:0 18px 42px #123a3033; transform:translateY(-50%); }.clean-context-menu.side-right { right:16px; }.clean-context-menu.side-left { left:16px; }.clean-context-menu header { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px; }.clean-context-menu h2 { min-width:0; margin:0; overflow:hidden; font-size:16px; text-overflow:ellipsis; white-space:nowrap; }.clean-context-menu .manager-action-list button { min-height:45px; }
.guide-intro { padding:16px; border-radius:17px; background:#e5f5ef; }.guide-intro p { margin:6px 0 0; color:#557169; font-size:14px; line-height:1.55; }.guide-list { margin-top:14px; overflow:hidden; border:1px solid #d8e5df; border-radius:17px; background:#fff; }.guide-list details { border-bottom:1px solid #e3ece8; }.guide-list details:last-child { border-bottom:0; }.guide-list summary { display:flex; align-items:center; gap:10px; min-height:54px; padding:12px 14px; cursor:pointer; list-style:none; }.guide-list summary::-webkit-details-marker { display:none; }.guide-list summary span { display:grid; width:28px; height:28px; place-items:center; border-radius:50%; background:#e7f4ef; color:#087567; font-size:12px; font-weight:800; }.guide-list p { margin:0; padding:0 14px 15px 52px; color:#587169; font-size:14px; line-height:1.65; }.guide-tips { margin-top:14px; padding:16px; border:1px solid #d8e5df; border-radius:17px; background:#fff; }.guide-tips h2 { margin:0 0 9px; font-size:18px; }.guide-tips ul { margin:0; padding-left:20px; }.guide-tips li { margin-top:7px; color:#587169; font-size:14px; line-height:1.5; }
.notification-head { align-items:flex-end; }.notification-head-actions { display:flex; gap:5px; }.notification-head .text-button { min-height:34px; padding:5px 7px; border-radius:10px; background:#e8f2ee; color:#315449; font-size:12px; }.notification-head .danger-text { background:#f6e9e7; color:#a13b34; }.push-card { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:18px; padding:14px; border-radius:16px; background:#e6f5f0; }.push-card div { display:grid; gap:4px; }.push-card p { margin:0; color:#58736a; font-size:13px; line-height:1.45; }.push-card button { flex:0 0 auto; min-height:38px; padding:6px 11px; font-size:13px; }
.notification-group { margin-top:17px; }.notification-group > h2 { margin:0 0 7px 4px; color:#60766e; font-size:13px; }.notification-swipe { position:relative; overflow:hidden; margin-bottom:7px; border-radius:16px; background:#f2d6d3; touch-action:pan-y; transition:height .18s,opacity .18s,margin .18s,transform .18s; }.notification-delete { position:absolute; inset:0 0 0 auto; width:78px; border-radius:16px; background:#efcbc7; color:#9c3029; font-size:13px; }.notification-card { position:relative; z-index:1; display:grid; grid-template-columns:auto minmax(0,1fr); gap:10px; min-height:74px; padding:13px; border:1px solid #d8e5df; border-radius:16px; background:#fff; color:#18362e; transition:transform .2s ease,opacity .18s ease; }.notification-card.unread { border-color:#9fc9bb; background:#f5fbf8; }.notification-swipe.open .notification-card { transform:translateX(-78px); }.notification-swipe.removing { opacity:0; transform:translateX(-24px); }.notification-kind { display:grid; place-items:center; align-self:start; min-width:38px; min-height:30px; padding:4px 6px; border-radius:10px; background:#e6f2ee; color:#087567; font-size:11px; font-weight:800; }.notification-card > div { min-width:0; }.notification-card header { display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }.notification-card header b { min-width:0; overflow-wrap:anywhere; font-size:14px; }.notification-card time { flex:0 0 auto; color:#82928c; font-size:10px; }.notification-card p { margin:5px 0 0; color:#61776f; font-size:13px; line-height:1.45; }

@media (min-width:760px) {
  .clean-shell { width:min(calc(100% - 220px),1160px); margin-right:24px; margin-left:max(196px,calc(50% - 424px)); padding:34px 34px 40px; }
  .clean-shell > header { margin:-34px -34px 26px; padding:28px 34px 18px; }
  .clean-nav { top:0; right:auto; bottom:0; left:max(0px,calc(50% - 620px)); flex-direction:column; justify-content:flex-start; width:172px; padding:28px 14px; border:0; border-right:1px solid var(--line); background:var(--surface); }
  .clean-nav button { grid-template-columns:22px 1fr; justify-items:start; gap:9px; width:100%; min-height:46px; padding:10px; font-size:14px; }
  .clean-nav button svg { width:19px; height:19px; }
}

@media (max-width:390px) {
  .clean-shell { width:calc(100% - 26px); }
  .clean-shell > header { margin-inline:-13px; padding-inline:13px; }
  .clean-title h1 { font-size:25px; }
  .clean-nav button { min-width:52px; font-size:11px; }
  .attendance-today-row { padding:11px; }.attendance-today-state small { max-width:104px; overflow:hidden; text-overflow:ellipsis; }
}
@media (max-width:430px) { .schedule-toolbar { align-items:flex-start; flex-direction:column; }.schedule-toolbar > div:last-child { justify-content:flex-start; flex-wrap:wrap; } }

/* 운영 앱과 같은 업무 화면: 검정 선택 탭 + 파일형 접이식 업무 목록 */
.clean-task-screen { padding-top:0; }
.clean-task-view-tabs { display:flex; align-items:center; gap:7px; margin:4px 0 10px; }
.clean-task-view-tabs > button:not(.clean-task-add) { flex:0 0 auto; min-height:38px; padding:7px 11px; border-radius:12px; background:#ddf5ee; color:#075e54; font-size:14px; font-weight:750; }
.clean-task-view-tabs > button.selected { background:#172b24; color:#fff; }
.clean-task-add,.clean-personal-folder-head button { display:grid; width:40px; min-width:40px; min-height:40px; place-items:center; margin-left:auto; padding:0; border-radius:50%; font-size:26px; line-height:1; }
.clean-task-add:disabled { opacity:.45; }
.clean-task-person { margin:-4px 0 10px; color:#075e54; }
.clean-task-screen .clean-filters { gap:8px; margin:0 -16px 14px; padding:0 16px 4px; scrollbar-width:none; }
.clean-task-screen .clean-filters::-webkit-scrollbar { display:none; }
.clean-task-screen .clean-filters button { min-height:38px; padding:7px 12px; border-radius:999px; background:#e9f0ed; color:#52645d; font-size:14px; }
.clean-task-screen .clean-filters button.selected { background:#172b24; color:#fff; }
.clean-personal-folder-head { display:flex; align-items:center; justify-content:space-between; margin:10px 0 7px; }
.clean-personal-folder-head button { width:34px; min-width:34px; min-height:34px; margin:0; font-size:22px; }
.clean-task-screen .clean-history-caption { margin:-2px 0 10px; padding:0; background:transparent; color:#66756f; font-size:13px; }
.clean-task-screen .clean-task-list { overflow:visible; border:0; border-radius:0; background:transparent; }
.clean-task-screen .clean-task { display:block; margin:0; padding:0; border:0; border-bottom:1px solid #dbe6e1; background:#fff; }
.clean-task-screen .clean-task:last-child { border-bottom:0; }
.clean-task-screen .clean-task > summary { display:flex; align-items:center; justify-content:space-between; gap:7px; min-height:48px; padding:10px 13px; cursor:pointer; list-style:none; touch-action:manipulation; }
.clean-task-screen .clean-task > summary::-webkit-details-marker { display:none; }
.clean-task-name { flex:1; min-width:0; overflow:hidden; color:#172b24; font-size:15px; font-weight:650; text-overflow:ellipsis; white-space:nowrap; }
.clean-task-screen .task-drag-handle,.clean-task-screen .folder-drag-handle { flex:0 0 28px; width:28px; min-height:32px; padding:0; border-radius:0; background:transparent; color:#729187; font-size:17px; letter-spacing:-3px; }
.clean-task-detail { padding:0 13px 12px 48px; background:#fff; }
.clean-task-detail .clean-task-meta { margin:0; color:#66756f; font-size:14px; }
.clean-task-badges { display:flex; flex-wrap:wrap; gap:6px; margin:9px 0; }
.task-info-badge { display:inline-flex; align-items:center; min-height:24px; padding:4px 8px; border:0; border-radius:999px; background:#edf2f0; color:#42544d; font-size:13px; line-height:1.1; font-weight:750; white-space:nowrap; }
button.task-info-badge { cursor:pointer; }
.task-info-badge.photo { background:#eaf1ff; color:#235aa6; }
.task-info-badge.high { background:#fff0dd; color:#a84a00; }
.clean-task-detail .clean-task-description,.clean-task-detail .clean-task-reject { margin:7px 0; color:#66756f; font-size:14px; line-height:1.5; }
.clean-task-detail .clean-task-reject { color:#b42318; }
.clean-task-screen .clean-task-actions { justify-content:flex-end; margin-top:12px; }
.clean-task-screen .clean-task-actions button { min-height:40px; }
.clean-task-screen .clean-folder { margin:0 0 9px; border:1px solid #dbe6e1; border-radius:14px; background:#fff; overflow:hidden; }
.clean-task-screen .clean-folder > summary { display:flex; min-height:48px; padding:10px 13px; background:#fff; }
.clean-task-screen .clean-folder > summary .clean-folder-name { display:block; flex:1; min-width:0; overflow:hidden; color:#172b24; font-weight:800; text-overflow:ellipsis; white-space:nowrap; }
.clean-task-screen .clean-folder > summary small { flex:0 0 auto; color:#66756f; font-size:12px; }
.clean-folder-children { border-top:1px solid #dbe6e1; background:#fff; }
.clean-folder-children:empty { display:none; }
.clean-task-screen .clean-folder-children > .clean-task > summary { padding-left:13px; }
.clean-task-screen .clean-folder .clean-folder { margin:7px 9px 9px 15px; }
.clean-folder-drop,.clean-root-drop { display:grid; min-height:38px; place-items:center; padding:7px 10px; border-top:1px dashed #afd5c6; background:#f8fcfa; color:#6f9587; font-size:12px; font-weight:700; }
.clean-root-drop { margin-top:8px; border:1px dashed #afd5c6; border-radius:12px; }
.clean-task-screen .clean-folder-empty { margin:0; padding:12px 14px; border-top:1px solid #dbe6e1; color:#66756f; font-size:13px; }
.clean-task-screen .drag-target { outline:3px solid #71c9a8!important; outline-offset:2px; background:#effbf6!important; }
@media (max-width:430px) { .clean-task-screen .clean-task > summary,.clean-task-screen .clean-folder > summary { padding-inline:11px; }.clean-task-detail { padding-left:42px; }.clean-task-name { font-size:14px; }.clean-task-screen .task-drag-handle,.clean-task-screen .folder-drag-handle { flex-basis:24px; width:24px; } }