/* Warm, playful school workspace. Category colors retain text labels. */
:root{color:#49362c;background:#fffaf5;--muted:#806e61;--line:#eedfd2;--accent:#bd4e16}
body{background:radial-gradient(ellipse at 95% 0%,#fff0d5 0,transparent 38%),#fffaf5}
button,input,select,textarea{border-radius:12px}
button{transition:background .18s,box-shadow .18s,transform .18s}
button:hover:not(:disabled){filter:none;box-shadow:0 4px 12px #97451614}
button:active:not(:disabled){transform:translateY(1px)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #d58a29;outline-offset:3px}
input,select,textarea{border-color:#e7d6c8}
.sidebar{background:#ffead7;color:#713e23;border-right:1px solid #f0cfb3;padding-top:32px}
.brand{font-weight:700;letter-spacing:-.5px}.brand small{color:#926c50;letter-spacing:.5px}
.logo{background:#c45218;color:#fff;border:0;border-radius:14px 14px 6px 14px;box-shadow:3px 4px 0 #f3bb8c;flex-shrink:0}
.logo span{color:#ffd584}.nav-label{color:#966d50;font-weight:600}
.nav{color:#805436;border-radius:13px;font-weight:500;min-height:46px}
.nav:hover{background:#ffddbd}.nav.active{background:#bd4e16;color:#fff;box-shadow:0 5px 12px #bd4e1624}
.nav b{background:#ffd6b2;color:#88421c;border-radius:8px}.nav.active b{background:#ffffff24;color:white}
.side-note{border-color:#eac5a8;color:#865939}.side-note p{color:#926f54}.status-dot{background:#418b57}.text-btn{color:#a74d20}
header{background:#fffdf8;border-color:#efdfd0}.breadcrumb{color:#825b40}.breadcrumb span{color:#806e61}
.avatar{background:#ffe5aa;color:#70531d;border:3px solid white;font-weight:700;box-shadow:0 2px 6px #70531d10}
.page{padding-top:32px}.page-heading{margin-bottom:26px}.eyebrow{color:#b65b28;letter-spacing:2px}
h1{font-weight:700;letter-spacing:.5px;font-size:31px;color:#633d27}.page-heading p{font-size:13px;color:#806e61}
.date-control{background:#fffefb;padding:11px 14px;border:1px solid #eedbc8;border-radius:16px;color:#86634c}.date-control input{background:#fff8f0;border-color:#ecd8c4}
.welcome{position:relative;background:#ffe7cd;border:1px solid #f5cda6;border-radius:20px;padding:23px 25px;overflow:hidden}
.welcome-icon{background:#ffc080;color:#8c4217;border-radius:50%;width:48px;height:48px;line-height:48px;font-size:28px;flex:none;transform:rotate(-8deg)}
.welcome strong{color:#7b431f;font-size:15px}.welcome p{color:#916341;font-size:12px}
.primary{background:#bd4e16;border-color:#bd4e16;font-weight:600;box-shadow:0 3px 0 #94370d20}.primary:hover:not(:disabled){background:#a44010}
.secondary{background:#fffefb;border-color:#e9ccb4;color:#8d4c27}.secondary:hover:not(:disabled){background:#fff0e0}
.metrics{gap:16px}.metric{--tile:#ffe5cc;--ink:#a34c1b;position:relative;background:var(--tile);border:1px solid #ffffff;border-radius:19px;padding:20px 22px;box-shadow:0 4px 14px #9d5a2808}
.metric:nth-child(2){--tile:#fff0e4;--ink:#91572f}.metric:nth-child(3){--tile:#e8f2fb;--ink:#386a91}.metric:nth-child(4){--tile:#f1ebfa;--ink:#7952a1}
.metric-label{color:var(--ink);font-size:12px;font-weight:500;align-items:center}.metric-label span{display:grid;place-items:center;background:#ffffffa8;width:28px;height:28px;border-radius:10px;font-size:17px}
.metric strong{font-size:35px;font-weight:700;color:var(--ink);margin-top:7px}.metric strong small{color:var(--ink)}.metric-foot{color:#806b59;font-size:11px}
.section-heading h2{color:#734627;font-size:17px;display:flex;align-items:center;gap:9px}.section-heading h2::before{content:'';display:block;width:7px;height:20px;background:#ef8a35;border-radius:5px}.section-heading span{color:#89725f}
.card{--category:#43715d;--tint:#edf5ee;border-color:#eddfd2;border-radius:19px;box-shadow:0 5px 18px #975a2908;min-height:255px}
.card[data-category=leaves]{--category:#946037;--tint:#fff1e3}.card[data-category=pickup]{--category:#426e96;--tint:#eaf3fb}.card[data-category=meals]{--category:#8b701e;--tint:#fff7d9}.card[data-category=incidents]{--category:#a25563;--tint:#fcedef}.card[data-category=todos]{--category:#477447;--tint:#edf5e6}.card[data-category=notes]{--category:#7c5c9c;--tint:#f2edfa}
.card-heading{background:var(--tint);border-bottom:1px solid #ffffff;padding:16px 18px;min-height:73px}.card-icon{background:white;color:var(--category);width:34px;height:34px;border-radius:11px;font-size:19px}.card h3{color:var(--category);font-size:14px;font-weight:700}.card-count{color:var(--category)}
.add{border:1px solid #ffffff;background:#ffffffbd;color:var(--category);border-radius:11px;width:34px;height:34px;flex:none}.add:hover:not(:disabled){background:white;box-shadow:0 3px 8px #33433315}
.empty{color:#806c5d;padding:30px 16px 34px}.empty small{color:#8b7869;font-size:11px}.empty-symbol{width:44px;height:44px;display:grid;place-items:center;background:var(--tint,#f0f5e9);color:var(--category,#57745b);border-radius:16px;margin:0 auto 12px;font-size:24px;transform:rotate(-5deg)}
.record{border-color:#f1e6dc;padding:16px 19px}.record strong{font-weight:600}.record p{color:#846f60}.badge{background:var(--tint,#edf5ee);color:var(--category,#43715d);border-radius:7px}.record button{background:#fff0df;color:#a15324;border-radius:8px;padding:6px 10px;white-space:nowrap}
.table-wrap{border-radius:18px;border-color:#ead8c7;box-shadow:0 5px 18px #975a2908}th{background:#fff0df;color:#96603b}th,td{border-color:#f0e1d4}tbody tr:hover{background:#fffaf4}td button{background:#ffe5cc;color:#a45425;border-radius:9px}
dialog{border-radius:22px;border-color:#ecd7c4;background:#fffefb;color:#49362c;box-shadow:0 24px 90px #63381830}dialog::backdrop{background:#4931235c}.modal-heading h2{color:#854821}.modal-heading .close{background:#fff0e0;width:36px;height:36px;border-radius:50%}.hint{color:#86715f}.check-row span,.teacher-picker small{color:#877463}
.notification-days input:checked+span{background:var(--accent);border-color:var(--accent)}.notification-status{background:#fff0df;color:#a45122;padding:12px 14px;border-radius:12px}
footer{color:#8e7b67}#toast{background:#9b461f;border-radius:14px;box-shadow:0 6px 22px #7d3b1b24;max-width:calc(100% - 32px);width:max-content}
@media(max-width:1150px){.metric{padding:17px}.page{padding-top:28px}}
@media(max-width:720px){.sidebar{padding:18px 20px;border-right:0;border-bottom:1px solid #f0cfb3;border-radius:0 0 22px 22px}.brand{font-size:17px}.brand small{font-size:10px}.logo{width:36px;height:38px}.sidebar .nav{min-height:42px;font-size:12px}.page{padding:25px 18px}header{background:transparent}.breadcrumb{font-size:11px}.local-label{font-size:10px}h1{font-size:27px}.page-heading p{font-size:12px}.date-control{padding:9px 12px;margin-top:3px}.welcome{padding:19px;gap:13px;border-radius:17px}.welcome strong{font-size:14px}.welcome p{font-size:11px}.welcome button{width:100%;padding:12px}.metric{padding:15px;border-radius:16px}.metric strong{font-size:30px}.metric-label{font-size:11px}.metric-label span{width:24px;height:24px}.metric-foot{font-size:10px}.card{min-height:230px}.card-heading{padding:14px 17px}.empty{padding:26px 16px}.section-heading span{font-size:10px}.form-grid{gap:0}.student-toolbar button{padding:12px}.avatar{padding:8px}}
/* Hover feedback for both summary tiles and work cards. */
.metric,.card{transition:transform .24s cubic-bezier(.2,.8,.2,1),box-shadow .24s ease,border-color .24s ease}
@media(hover:hover) and (pointer:fine){
 .metric:hover,.card:hover{transform:translateY(-6px);box-shadow:0 12px 26px #a35d2b24}
 .metric:hover{border-color:var(--ink)}
 .card:hover{border-color:var(--category)}
}
.card:focus-within{box-shadow:0 8px 22px #a35d2b20;border-color:var(--category)}
@media(prefers-reduced-motion:reduce){button,.metric,.card{transition:none}button:active:not(:disabled),.metric:hover,.card:hover{transform:none}}

/* Shared controls inherit the orange brand, including notification forms. */
input,select,textarea{outline-color:var(--accent)}
.teacher-picker input[type=checkbox],.notification-section input[type=checkbox]{accent-color:var(--accent)}
.teacher-picker-tools .text-btn{color:var(--accent)}

/* Readable Traditional Chinese typography across cards and form controls. */
:root{font-family:'Noto Sans TC','PingFang TC','Microsoft JhengHei','Heiti TC',system-ui,-apple-system,BlinkMacSystemFont,sans-serif}
body,button,input,select,textarea{font-family:inherit}
.card h3{font-size:18px;font-weight:700;line-height:1.5}
.card-count{font-size:14px;font-weight:600}
.record{padding:20px}
.record-top{flex-wrap:wrap;justify-content:flex-start;gap:10px}
.record-top strong{flex:1;min-width:100px;overflow-wrap:anywhere;font-size:17px;font-weight:700;line-height:1.6}
.record p{font-size:16px;font-weight:500;line-height:1.85;color:#675345;margin-top:8px}
.badge{font-size:13px;font-weight:600;padding:5px 9px}
.record button{font-size:14px;font-weight:600;padding:8px 12px;min-height:36px}
.empty{font-size:16px;font-weight:500;color:#675345;line-height:1.8}
.empty small{display:inline-block;font-size:14px;font-weight:500;color:#786353;margin-top:6px}
.meal-summary{font-size:16px;font-weight:500;color:#675345;line-height:1.8}
.meal-summary strong{font-size:40px;font-weight:700;color:#92501f}
.meal-summary p{font-size:16px;font-weight:500;line-height:1.85;color:#675345}
.notification-delivery,.notification-delivery summary{font-size:14px;font-weight:500;line-height:1.7;color:#786353}
.metric-label{font-size:15px;font-weight:600}.metric-foot{font-size:13px;font-weight:500;color:#786353}.metric strong small{font-size:14px;font-weight:500}
@media(max-width:720px){.card-heading{gap:8px}.card h3{font-size:17px}.record{padding:18px}.metric-label{font-size:14px;gap:6px}.metric-label span{flex:none}.metric-foot{font-size:12px}}
/* 快速模式：從 LINE 圖文選單直接開單一表單 */
.quick-mode .sidebar,.quick-mode main{visibility:hidden}
.quick-mode dialog::backdrop{background:#fffaf5}
#quick-done{position:fixed;inset:0;z-index:5;display:grid;place-items:center;padding:24px;background:#fffaf5}
#quick-done[hidden]{display:none}
.quick-done-card{width:min(420px,100%);display:grid;gap:12px;justify-items:center;text-align:center}
.quick-done-card h2{margin:6px 0 0;font-size:24px}
.quick-done-card p{margin:0 0 10px;color:var(--muted);line-height:1.7}
.quick-done-card button,.quick-choices button{width:100%;min-height:52px;font-size:16px;justify-content:center}
.quick-choices{display:grid;gap:12px;margin:16px 0}
@media(max-width:720px){.quick-mode dialog{width:100vw;max-width:100vw;min-height:100dvh;max-height:100dvh;margin:0;border-radius:0;border:0}}
.quick-check{width:72px;height:72px;border-radius:50%;display:grid;place-items:center;background:#fde5d2;color:#bd4e16;font-size:34px;font-weight:700}
#quick-loading{display:none}
.quick-mode #quick-loading:not([hidden]){position:fixed;inset:0;z-index:4;display:grid;place-content:center;justify-items:center;gap:14px;background:#fffaf5;color:#806e61;font-size:15px}
.quick-spinner{width:38px;height:38px;border-radius:50%;border:4px solid #fde5d2;border-top-color:#bd4e16;animation:quick-spin .8s linear infinite}
@keyframes quick-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.quick-spinner{animation:none}}
/* 事件照片 */
.photo-preview{display:flex;gap:8px;flex-wrap:wrap;margin:-4px 0 10px}
.photo-preview img{width:84px;height:84px;object-fit:cover;border-radius:12px;border:1px solid var(--line)}
.photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.photo-grid figure{margin:0}
.photo-frame{display:grid;place-items:center;min-height:160px;border-radius:14px;border:1px solid var(--line);background:#fff6ee;color:var(--muted);overflow:hidden}
.photo-frame img{display:block;width:100%;height:auto}
.photo-grid figcaption{margin-top:6px;font-size:12px;color:var(--muted)}
input[type=file]{padding:10px 0;border:0;background:none}
/* 學生搜尋 */
.student-results{display:grid;gap:8px;margin:-4px 0 14px}
.student-results button{display:block;width:100%;min-height:48px;padding:10px 14px;text-align:left;font-size:15px;border-radius:14px;border:1px solid var(--line);background:#fff;color:inherit;cursor:pointer}
.student-results button.first{border-color:#e9b694;background:#fff6ee}
.student-results button:hover,.student-results button:focus-visible{border-color:var(--accent);outline:none}
.student-results .hint{margin:0}
.student-chosen{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 14px;padding:12px 14px;border-radius:14px;border:1px solid #e9b694;background:#fff6ee}
.student-chosen[hidden],label.field[hidden],.check-row[hidden]{display:none}
.health-metrics{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));margin:0 0 10px}
.health-metrics .metric strong{font-size:26px}

/* Collapsible workspace navigation; the toggle remains in the page header. */
.header-start{display:flex;align-items:center;gap:16px;min-width:0}
.sidebar-toggle{display:grid;place-items:center;width:36px;height:36px;flex:none;padding:0;background:#fff3e6;border:1px solid #eacdb5;color:#945124;font-size:20px;border-radius:10px}
@media(min-width:721px){
 .sidebar-collapsed .sidebar{width:76px;padding:32px 12px 20px;align-items:center}
 .sidebar-collapsed main{margin-left:76px}
 .sidebar-collapsed .sidebar .brand>div,.sidebar-collapsed .sidebar .nav-label,.sidebar-collapsed .sidebar .side-note{display:none}
 .sidebar-collapsed .sidebar nav{width:100%;margin-top:38px}
 .sidebar-collapsed .sidebar .nav{justify-content:center;padding:12px 0;gap:0;width:100%;font-size:19px}
 .sidebar-collapsed .sidebar .nav span,.sidebar-collapsed .sidebar .nav b{display:none}
 .sidebar-collapsed .sidebar .brand{justify-content:center}
}
@media(max-width:720px){
 .sidebar-collapsed .sidebar nav{display:none}
 .header-start{gap:9px}.sidebar-toggle{width:32px;height:32px;font-size:18px}
 .header-start .breadcrumb{font-size:11px}.header-start .breadcrumb span{margin-left:6px}
}