:root{--bg:#eaf0e9;--surface:#f8faf6;--ink:#16231e;--muted:#65756b;--line:#cbd6c6;--green:#234a39;--gold:#96742a;--red:#a23e2e;--white:#fff;--shadow:0 14px 40px rgba(22,35,30,.10)}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:"Noto Sans TC","Microsoft JhengHei",sans-serif}.topbar{height:68px;background:#16231e;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 24px;position:sticky;top:0;z-index:10}.brand{display:flex;gap:10px;align-items:center;color:#fff;text-decoration:none}.brand span{border:1px solid #d9c48c;color:#d9c48c;padding:5px 7px;border-radius:8px}.brand strong{font-size:18px}.userbox{display:flex;align-items:center;gap:10px;font-size:14px}.badge{background:#d9c48c;color:#16231e;padding:4px 8px;border-radius:999px;font-size:12px}.shell{display:grid;grid-template-columns:210px 1fr;min-height:calc(100vh - 68px)}.sidebar{background:#1e312a;padding:20px 12px;display:flex;flex-direction:column;gap:6px}.sidebar a{color:#dce8df;text-decoration:none;padding:11px 14px;border-radius:9px}.sidebar a:hover,.sidebar a.active{background:#345846;color:#fff}main{padding:30px;max-width:1280px;width:100%;margin:0 auto}.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:22px}.page-head h1{margin:0 0 6px;font-family:"Noto Serif TC",serif}.page-head p{margin:0;color:var(--muted)}.actions{display:flex;gap:10px;flex-wrap:wrap}button,.button{border:0;border-radius:9px;padding:10px 14px;background:var(--green);color:#fff;font-weight:700;cursor:pointer;text-decoration:none;font-size:14px}button.secondary,.button.secondary{background:#fff;color:var(--green);border:1px solid var(--line)}button.danger{background:var(--red)}button:disabled{opacity:.5;cursor:not-allowed}.stats{display:grid;grid-template-columns:repeat(5,minmax(120px,1fr));gap:14px;margin-bottom:22px}.stat,.card{background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow)}.stat{padding:18px}.stat span{font-size:13px;color:var(--muted)}.stat strong{display:block;font-size:27px;margin-top:6px}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.card{padding:20px}.card h2,.card h3{margin-top:0}.table-wrap{overflow:auto;background:#fff;border:1px solid var(--line);border-radius:14px}table{width:100%;border-collapse:collapse;min-width:720px}th,td{text-align:left;padding:13px 14px;border-bottom:1px solid #e5ebe3;font-size:14px}th{background:#f2f6f0;color:#536258;position:sticky;top:0}tr:last-child td{border-bottom:0}.pill{display:inline-flex;padding:4px 9px;border-radius:999px;background:#e4eee6;color:#29503a;font-size:12px}.pill.warn{background:#f1e6c9;color:#735619}.pill.off{background:#eee;color:#666}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.field{display:flex;flex-direction:column;gap:6px}.field.full{grid-column:1/-1}.field label{font-size:13px;font-weight:700}.field input,.field select,.field textarea{width:100%;border:1px solid var(--line);border-radius:8px;padding:10px;background:#fff;color:var(--ink);font:inherit}.field textarea{min-height:110px}.search{width:min(380px,100%);padding:11px 13px;border:1px solid var(--line);border-radius:10px}.empty{text-align:center;color:var(--muted);padding:42px}.notice{padding:13px 15px;border-left:4px solid var(--gold);background:#f7f0de;border-radius:6px;margin-bottom:16px}.checkin-list{display:grid;gap:10px}.checkin-item{display:flex;align-items:center;justify-content:space-between;background:#fff;border:1px solid var(--line);padding:14px;border-radius:10px}.checkin-item small{display:block;color:var(--muted);margin-top:3px}dialog{border:0;border-radius:16px;width:min(660px,calc(100% - 24px));padding:0;box-shadow:0 30px 80px rgba(0,0,0,.3)}dialog::backdrop{background:rgba(10,20,15,.58)}dialog form{padding:26px;position:relative}.dialog-close{position:absolute;right:12px;top:10px;background:transparent;color:#333;font-size:25px;padding:4px 9px}#toast{position:fixed;right:18px;bottom:18px;background:#16231e;color:#fff;padding:12px 16px;border-radius:10px;opacity:0;transform:translateY(8px);transition:.2s;pointer-events:none}#toast.show{opacity:1;transform:none}.muted{color:var(--muted)}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:20px}.kpi-line{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--line)}
@media(max-width:820px){.shell{display:block}.sidebar{position:fixed;bottom:0;left:0;right:0;z-index:20;display:flex;flex-direction:row;padding:7px;overflow-x:auto}.sidebar a{white-space:nowrap;font-size:12px;padding:9px 11px}main{padding:20px 14px 82px}.topbar{padding:0 14px}.userbox #userLabel{display:none}.stats{grid-template-columns:repeat(2,1fr)}.grid,.two-col,.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.page-head{flex-direction:column}.actions{width:100%}.actions button{flex:1}.stats .stat:last-child{grid-column:1/-1}}
dialog #modalBody{padding:26px;position:relative}
#qr svg{width:150px;height:150px;background:#fff;padding:6px;border:1px solid var(--line);border-radius:8px}
[hidden]{display:none!important}
#demoUser{background:#2b4438;color:#fff;border:1px solid #4f6f5e;border-radius:8px;padding:6px 8px;font:inherit;font-size:13px;max-width:210px}
.toolbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.toolbar select{padding:11px 13px;border:1px solid var(--line);border-radius:10px;background:#fff;font:inherit}
tr.clickable{cursor:pointer}tr.clickable:hover td{background:#f5f9f3}
.profile-head{display:flex;gap:14px;align-items:center;margin-bottom:10px}.profile-head h2{margin:0}.profile-head p{margin:2px 0 0}
.avatar{width:56px;height:56px;border-radius:50%;background:var(--green);color:#fff;display:grid;place-items:center;font-size:24px;font-weight:700;flex:none}
button.link{background:none;color:var(--green);padding:0 4px;text-decoration:underline;font-weight:700}
ul.plain{padding-left:18px;margin:6px 0 14px}ul.plain li{margin:4px 0}
@media(max-width:820px){#demoUser{max-width:150px}}
body.student-view .sidebar,body.student-view #demoUser{display:none!important}body.student-view .shell{display:block}body.student-view main{max-width:640px;padding:20px 14px 40px}
.student-card{margin-bottom:16px}.student-card h1{margin:0 0 4px;font-size:24px}.student-card h2{font-size:18px}
.student-list{list-style:none;padding:0;margin:0}.student-item{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}.student-item:last-child{border-bottom:0}.student-item small{display:block;color:var(--muted);margin-top:3px}
.result-card{text-align:center;margin-top:20px;padding:32px 20px}.result-card h1{font-size:30px;margin:12px 0}.result-name{font-size:22px;font-weight:700}
.result-icon{width:84px;height:84px;border-radius:50%;margin:0 auto;display:grid;place-items:center;font-size:48px;color:#fff;background:var(--green)}.result-card.fail .result-icon{background:var(--red)}
.qr-big{display:grid;place-items:center;margin:12px 0}.qr-big svg{width:260px;height:260px;background:#fff;padding:10px;border:1px solid var(--line);border-radius:10px}
.demo-line select{font:inherit;padding:4px 6px;border-radius:6px;border:1px solid var(--line)}
button.big{font-size:18px;padding:14px}
body.student-view .field input,body.student-view .field select{font-size:17px;padding:12px}
.map-grid{grid-template-columns:repeat(3,minmax(0,1fr))}@media(max-width:820px){.map-grid{grid-template-columns:1fr 1fr}}#importFile{margin:10px 0;font:inherit}
.tag-box{margin:10px 0}.tag-box summary{cursor:pointer;font-weight:700;color:var(--green);padding:6px 0}.tag-box div{display:flex;flex-wrap:wrap;gap:6px;max-height:240px;overflow:auto;padding:6px 0}
body.signed-out .sidebar{display:none!important}body.signed-out .shell{display:block}
#logoutBtn{padding:6px 10px;font-size:13px}
.link-box{display:flex;gap:8px;margin:12px 0}.link-box input{flex:1;padding:10px;border:1px solid var(--line);border-radius:8px;font:inherit;font-size:13px}.row-actions{display:flex;gap:6px;flex-wrap:wrap}.row-actions button{padding:6px 10px;font-size:13px}
