:root{--bg:#f6f7f4;--card:#fff;--ink:#1f2a24;--muted:#5d6b63;--line:#dfe4de;--accent:#2f6b4f;--accent-2:#e8f1ec;--warn:#9a5b00;--warn-bg:#fff4e0;--bad:#a12c2c;--bad-bg:#fbeaea;--ok-bg:#e6f3ea}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.65 "PingFang TC","Noto Sans TC","Microsoft JhengHei",sans-serif}
a{color:var(--accent)}
header.top{background:var(--accent);color:#fff}
header.top .wrap{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:12px 16px}
header.top a{color:#fff;text-decoration:none}
header.top .brand{font-weight:700;font-size:18px;margin-right:auto}
header.top nav a{opacity:.9;margin-left:12px}
.wrap{max-width:1080px;margin:0 auto;padding:0 16px}
main.wrap{padding-top:20px;padding-bottom:48px}
h1{font-size:24px;margin:8px 0 16px}h2{font-size:19px;margin:28px 0 10px}h3{font-size:16px;margin:16px 0 6px}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:16px 18px;margin-bottom:14px}
.grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.route-card h3{margin:0 0 4px}.route-card .meta{color:var(--muted);font-size:14px}
.tag{display:inline-block;font-size:12px;padding:1px 8px;border-radius:999px;background:var(--accent-2);color:var(--accent);margin-right:4px;white-space:nowrap}
.tag.warn{background:var(--warn-bg);color:var(--warn)}.tag.bad{background:var(--bad-bg);color:var(--bad)}.tag.gray{background:#eef0ee;color:var(--muted)}
.btn{display:inline-block;border:1px solid var(--accent);background:var(--accent);color:#fff;border-radius:8px;padding:7px 14px;font:inherit;font-size:15px;cursor:pointer;text-decoration:none}
.btn.ghost{background:#fff;color:var(--accent)}.btn.small{padding:3px 10px;font-size:13px}.btn.danger{background:#fff;color:var(--bad);border-color:var(--bad)}
.muted{color:var(--muted)}.small{font-size:13px}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{border-bottom:1px solid var(--line);padding:7px 6px;text-align:left;vertical-align:top}
th{color:var(--muted);font-weight:600;white-space:nowrap}
.table-wrap{overflow-x:auto}
.messages{list-style:none;padding:0;margin:0 0 14px}
.messages li{padding:9px 14px;border-radius:8px;margin-bottom:6px;background:var(--ok-bg)}
.messages li.error{background:var(--bad-bg);color:var(--bad)}
form p{margin:0 0 12px}
label{font-weight:600;display:block;margin-bottom:3px}
input[type=text],input[type=email],input[type=number],input[type=date],input[type=url],select,textarea{width:100%;padding:7px 9px;border:1px solid #c9d1ca;border-radius:7px;font:inherit;background:#fff}
input[type=checkbox]{transform:scale(1.2);margin-right:6px}
.helptext{display:block;color:var(--muted);font-size:13px;font-weight:400}
ul.errorlist{color:var(--bad);margin:2px 0;padding-left:18px;font-size:14px}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.stat{background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px 14px}
.stat b{display:block;font-size:22px}.stat span{color:var(--muted);font-size:13px}
.formgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0 16px}
.inline-form{display:inline}
.tree{margin:4px 0 0 18px;padding-left:12px;border-left:2px solid var(--line)}
@media print{header.top,.noprint{display:none!important}body{background:#fff}}
/* 學習單 */
.ws-q{background:#fff;border:1px solid var(--line);border-radius:10px;padding:14px 16px;margin-bottom:12px}
.ws-qtext{margin-bottom:8px}
.ws-intro{background:var(--accent-2);border-radius:10px;padding:10px 16px;margin-bottom:12px}
.ws-intro h3{margin:4px 0}.ws-intro p{margin:4px 0}
.ws-reading{background:#fffdf6;border:1px solid #eadfbf;border-radius:10px;padding:10px 16px;margin-bottom:12px}
.ws-reading summary{font-weight:700;cursor:pointer}.ws-reading p{text-indent:2em;margin:8px 0}
.ws-opt{display:block;font-weight:400;margin:4px 0}
.ws-table td,.ws-table th{border:1px solid var(--line)}.ws-table textarea{min-width:120px}
.ws-ans{background:#f7f9f7;border-left:3px solid var(--accent);padding:6px 10px;white-space:normal}
.ws-thumb{display:inline-block;margin:6px 8px 6px 0;vertical-align:top}.ws-thumb img{max-width:220px;max-height:220px;border-radius:6px;border:1px solid var(--line);display:block}
.ws-scale label{display:inline-block;margin:0 8px;font-weight:400}
.ws-lines div{border-bottom:1px solid #bbb;height:28px}
.ws-boxarea{border:1px dashed #bbb;border-radius:6px;padding:20px;text-align:center}
.sticky-bar{position:sticky;bottom:0;background:rgba(246,247,244,.96);padding:10px 0;border-top:1px solid var(--line);margin-top:10px}
.status-dot{display:inline-block;min-width:54px;text-align:center;border-radius:6px;font-size:12px;padding:1px 6px}
.status-dot.ok{background:var(--ok-bg);color:var(--accent)}.status-dot.draft{background:var(--warn-bg);color:var(--warn)}.status-dot.none{background:#eef0ee;color:#999}
@media (max-width:600px){
  .ws-table tr:first-child{display:none}
  .ws-table,.ws-table tbody,.ws-table tr,.ws-table td{display:block;width:100%}
  .ws-table tr{border:1px solid var(--line);border-radius:8px;margin-bottom:8px;padding:4px 8px}
  .ws-table td{border:0;padding:4px 0}
  .ws-table td::before{content:attr(data-label);display:block;font-size:12px;color:var(--muted)}
  .ws-table td.pre{font-weight:700}.ws-table td.pre::before{display:none}
  .ws-table textarea{min-width:0}
}
.acting-bar{background:#fff4e0;border-bottom:1px solid #f0d7a6;color:#7a4a00;font-size:14px}
.acting-bar .wrap{padding:8px 16px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
header.top nav a{white-space:nowrap}
.kv{display:grid;grid-template-columns:160px 1fr;gap:4px 12px}.kv dt{color:var(--muted)}.kv dd{margin:0}
@media (max-width:600px){.kv{grid-template-columns:1fr}}
.photo-grid{display:flex;flex-wrap:wrap;gap:8px}.photo-grid figure{margin:0;width:150px}.photo-grid img{width:150px;height:110px;object-fit:cover;border-radius:6px;border:1px solid var(--line)}
.photo-grid figcaption{font-size:12px;color:var(--muted)}
.ok{color:var(--accent)}.ng{color:var(--bad)}
/* 學習單文件（線上作答／預覽） */
.ws-doc{line-height:1.75}
.ws-doc h3{margin:18px 0 6px}.ws-doc p{margin:6px 0}
.ws-doc table{width:100%;border-collapse:collapse;margin:6px 0}.ws-doc td,.ws-doc th{border:1px solid #c9d1ca;padding:6px;vertical-align:top}
.ws-doc th{background:#f0f4f1}.ws-doc figure{margin:8px 0;overflow-x:auto}.ws-doc img{max-width:100%;height:auto}
.ws-doc textarea.ws-text,.ws-doc textarea.ws-cell{width:100%;display:block}
.ws-doc input.ws-text{width:100%;margin-top:4px}
.ws-doc input.ws-blank{width:auto;min-width:8em;display:inline-block;padding:2px 6px}
.ws-doc input.ws-check{transform:scale(1.4);margin:0 8px 0 2px;vertical-align:middle}
.ws-doc .ws-lines{display:block}.ws-doc .ws-lines span{display:block;border-bottom:1px solid #bbb;height:26px}
.ws-doc .ws-ans.block{display:block}
.ws-doc .ws-photo{display:block;border:1px dashed #c9a46b;border-radius:8px;padding:8px;background:#fffaf0}
.ws-doc .ws-scale label{display:inline-block;margin:0 6px;font-weight:400}
.ws-doc .ws-blankline{letter-spacing:-2px;color:#888}
@media (max-width:600px){
  .ws-doc figure.table table thead{display:none}
  .ws-doc figure.table table,.ws-doc figure.table tbody,.ws-doc figure.table tr,.ws-doc figure.table td,.ws-doc figure.table th{display:block;width:100%}
  .ws-doc figure.table tr{border:1px solid var(--line);border-radius:8px;margin-bottom:8px;padding:4px 8px}
  .ws-doc figure.table td,.ws-doc figure.table th{border:0;padding:4px 0}
  .ws-doc figure.table td[data-label]::before{content:attr(data-label);display:block;font-size:12px;color:var(--muted)}
}
.tabs{display:flex;gap:6px;margin:6px 0 10px;flex-wrap:wrap}
.tab{border:1px solid var(--accent);background:#fff;color:var(--accent);border-radius:999px;padding:6px 16px;font:inherit;font-size:15px;cursor:pointer}
.tab.active{background:var(--accent);color:#fff}
.ws-demo textarea,.ws-demo input{background:#fff}
/* 管理頁 */
.todo-item{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:8px 12px;border-radius:8px;margin-bottom:6px;background:#f4f6f4}
.todo-item span{flex:1 1 260px}
.todo-item.do{background:var(--accent-2);border-left:4px solid var(--accent)}
.todo-item.warn{background:var(--warn-bg);border-left:4px solid var(--warn)}
.budget-bar{display:flex;height:16px;border-radius:999px;background:#e3ebe5;overflow:hidden;margin:6px 0}
.budget-bar .used{background:var(--accent)}.budget-bar .reserve{background:#d9b26b}
.budget-legend{display:flex;gap:16px;flex-wrap:wrap;font-size:14px}
.sw{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:4px;vertical-align:middle}
.sw.used{background:var(--accent)}.sw.reserve{background:#d9b26b}.sw.free{background:#e3ebe5;border:1px solid #c9d1ca}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.tile{display:block;background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px 14px;text-decoration:none;color:var(--ink)}
.tile:hover{border-color:var(--accent)}.tile b{display:block;margin-bottom:2px}.tile span{font-size:13px;color:var(--muted)}
.fld{margin:1em 0}.fld .errorlist{margin:4px 0 0}