:root{--text:#1a1a1a;--bg:#fff;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:var(--text);background:var(--bg);font:16px/1.5 system-ui,Segoe UI,PingFang TC,Noto Sans TC,Roboto,sans-serif}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--text:#f3f4f6;--bg:#16171d}}*{box-sizing:border-box}body{margin:0}#root{min-height:100svh}h1,h2{font-weight:600}p{margin:0 0 8px}:root{--color-primary:#6f9650;--color-primary-light:#8cae68;--color-primary-tint:#f3f9e4;--color-text-strong:#1a2731;--color-accent:#0da7af;--color-border:#ddd}.app{max-width:480px;color:var(--color-text-strong);margin:0 auto;padding:16px}.app-logo{border-radius:4px;height:40px;margin:0 0 12px;display:block}.nav{border-bottom:1px solid #ddd;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px 16px;margin-bottom:24px;padding-bottom:12px;display:flex}.nav-group{scrollbar-width:none;flex-wrap:nowrap;gap:16px;display:flex;overflow-x:auto}.nav-group::-webkit-scrollbar{display:none}.nav-admin{border-left:1px solid #ddd;padding-left:16px}.nav a{color:#555;white-space:nowrap;flex-shrink:0;font-weight:500;text-decoration:none}.nav a.active{color:var(--color-primary);border-bottom:2px solid var(--color-primary);padding-bottom:4px}.nav-item{flex-shrink:0;align-items:center;gap:4px;display:inline-flex}.nav-logout{white-space:nowrap;flex-shrink:0}.nav-info{border:1px solid var(--color-accent);width:15px;height:15px;color:var(--color-accent);cursor:pointer;background:0 0;border-radius:50%;flex-shrink:0;padding:0;font-size:.65rem;font-style:italic;font-weight:700;line-height:1}.nav-description{border:1px solid var(--color-primary-light);background:var(--color-primary-tint);color:var(--color-text-strong);border-radius:6px;margin:-16px 0 20px;padding:8px 10px;font-size:.85rem}.page h1{margin-bottom:16px;font-size:1.4rem}.login-logo{border-radius:8px;width:100%;max-width:280px;margin:0 auto 16px;display:block}.page h2{margin-bottom:8px;font-size:1.1rem}.section-title{color:#555;margin:24px 0 8px;font-size:1rem}.field{flex-direction:column;gap:6px;margin-bottom:16px;font-size:.9rem;display:flex}.field select{padding:10px;font-size:1rem}.month-select{gap:8px;display:flex}.button-row{gap:20px;margin-bottom:16px;display:flex}.card{border:1px solid #ddd;border-radius:8px;margin-bottom:16px;padding:16px}.card button:not(.link){background:var(--color-primary);color:#fff;cursor:pointer;border:none;border-radius:6px;width:100%;padding:14px;font-size:1.1rem}.card button:not(.link):disabled{opacity:.5}.card button.collapsible-header{width:100%;color:inherit;text-align:left;cursor:pointer;background:0 0;border:none;justify-content:space-between;align-items:center;padding:0;display:flex}.card button.collapsible-header h2{margin:0}.collapsible-caret{color:var(--color-primary);flex-shrink:0;margin-left:8px;font-size:1.1rem}.list{margin:0 0 12px;padding:0;list-style:none}.list li{border-bottom:1px solid #eee;padding:6px 0}.scroll-list{border:1px solid #eee;border-radius:6px;max-height:240px;padding:0 10px;overflow-y:auto}button.link{color:var(--color-primary);cursor:pointer;background:0 0;border:none;padding:4px 0;font-size:1rem;text-decoration:underline}button.link.active{font-weight:700}.form{flex-direction:column;gap:8px;display:flex}.form input:not([type=checkbox]),.form select{border:1px solid #ccc;border-radius:6px;padding:10px;font-size:1rem}.checkbox-field{align-items:center;gap:8px;font-size:1rem;display:flex}.form button:not(.link){background:var(--color-primary);color:#fff;cursor:pointer;border:none;border-radius:6px;padding:10px;font-size:1rem}.form button.link{align-self:flex-start}.hint{color:#777;font-size:.9rem}.roster-day{margin-bottom:8px}.roster-date{color:#555;margin:12px 0 2px;font-size:.9rem;font-weight:600}.roster-day:first-child .roster-date{margin-top:0}.message{border-radius:6px;margin-top:12px;padding:10px}.message.success{color:#1e7e34;background:#e6f4ea}.message.error{color:#b3261e;background:#fdecea}.month-tabs{gap:8px;margin-bottom:12px;display:flex}.month-tabs button{cursor:pointer;background:#fff;border:1px solid #ccc;border-radius:6px;padding:8px 16px;font-size:.9rem}.month-tabs button.active{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.calendar{border-collapse:collapse;table-layout:fixed;width:100%;margin-bottom:16px}.calendar th{color:#777;padding:4px 0;font-size:.75rem;font-weight:500}.calendar td{vertical-align:top;word-break:break-all;border:1px solid #eee;height:56px;padding:4px;font-size:.7rem}.calendar-empty{border:none}.calendar-past{color:#bbb;background:#fafafa}.calendar-day-number{margin-bottom:2px;font-weight:600}.calendar-dayoff{color:#b3261e}.calendar-past .calendar-dayoff,.calendar-past .calendar-shift{color:#bbb}.calendar-headcount{font-weight:600}.calendar-clickable{cursor:pointer}.calendar-selected{outline:2px solid var(--color-primary);outline-offset:-2px}.roster-unavailable{color:#bbb}.special-day,.link.special-day{color:var(--color-accent);font-weight:700}.table-scroll{margin-bottom:12px;overflow-x:auto}.data-table{border-collapse:collapse;white-space:nowrap;font-size:.75rem}.data-table th,.data-table td{text-align:center;border:1px solid #eee;padding:6px 8px}.data-table th{background:#fafafa;font-weight:600}.data-table td.name-cell{text-align:left;font-weight:600}.data-table td.subtotal-cell{font-weight:700}.data-table input[type=number]{width:60px}.data-table .negative{color:#b3261e}