:root{color-scheme:light;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}html{scroll-padding-top:env(safe-area-inset-top,0px)}body{margin:0;padding:0;font:1rem -apple-system,BlinkMacSystemFont,sans-serif;background:#fff;color:#000}img{max-width:100%}[hidden]:not([hidden=until-found i]){display:none!important}


/* layout: 參照桃園市公文整合資訊系統 — 藍色橫幅 + 青色選單列，左側功能匣，主區為淺藍表格清單；手機時功能匣橫排、表格轉為卡片
   刻意採單一淺色外觀，與公文系統一致 */
:root{
  color-scheme:light;
  --page:#FFFFFF; --gutter:#F1F3F6; --ink:#1E2633; --muted:#5E6B7A; --line:#B9C9D8; --line-soft:#D9E3EC;
  --banner-a:#23466D; --banner-b:#3C6694; --menu-a:#557FA9; --menu-b:#355E88; --tab:#3E7CC0;
  --date:#FFE7A3; --uname:#FFE7A3;
  --side-green:#5E9E4E; --side-slate:#7A8899; --side-blue:#4A78AB;
  --grid-head:#BEDCF3; --grid-alt:#EAF3FB; --qbar:#CFE3F7; --link:#1A3FAA;
  --ribbon-green:#5E9E4E; --ribbon-pink:#C96B84; --ribbon-grey:#C9CED6;
  --btn-a:#6FA2DA; --btn-b:#3D70B2; --btn-ink:#FFFFFF;
  --seal:#B83A24; --seal-soft:#F8E4DF;
  --md:#1C579F; --md-soft:#E1EAF6; --skill:#2B7556; --skill-soft:#DFF0E7; --tpl:#85571C; --tpl-soft:#F2E8D8;
  --warn-bg:#FFE7A0; --warn-ink:#5E4100; --warn-line:#E0B43A; --relief:#E0712B; --relief-soft:#FDEBDD;
  --f-body:"Noto Sans TC","Microsoft JhengHei","PingFang TC",system-ui,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
body{background:var(--page);color:var(--ink);font-family:var(--f-body);font-size:1rem;line-height:1.6}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--banner-a)}
a{color:var(--link)}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--tab);outline-offset:2px}
h1,h2,h3{margin:0;font-weight:700;text-wrap:balance}
.pad{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}

/* banner */
.banner{position:sticky;top:env(safe-area-inset-top,0px);z-index:6}
.btop{background:linear-gradient(90deg,var(--banner-a),var(--banner-b));color:#fff;display:flex;align-items:center;gap:16px;min-height:52px;padding-block:6px;flex-wrap:wrap}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:#fff;flex:none}
.unused-sealmark{width:34px;height:34px;display:grid;place-items:center;background:#fff;border:2px solid var(--seal);color:var(--seal);border-radius:5px;font-weight:900;font-size:1.357143rem;transform:rotate(-6deg)}
.logo b{display:block;font-size:2rem;letter-spacing:.08em;line-height:1.15;font-weight:900}
.logomark{display:block;width:96px;height:96px;flex:none;object-fit:contain;border-radius:6px;filter:drop-shadow(0 1px 1px rgba(0,0,0,.25))}
.logo i{display:block;font-style:normal;font-size:0.892857rem;letter-spacing:.04em;color:#DCE2FF}
.bmid{flex:1;align-self:flex-start;display:flex;align-items:center;justify-content:center;gap:18px;min-width:0;flex-wrap:wrap}
.uname{color:var(--uname);font-weight:700;font-size:0.928571rem;white-space:nowrap}
.pills{display:flex;gap:4px}
.pill{border:1px solid #A9BBD3;background:linear-gradient(#F7F9FC,#D5DFEB);color:#23466D;border-radius:0 0 12px 12px;clip-path:polygon(0 0,100% 0,calc(100% - 8px) 100%,8px 100%);padding:2px 18px;font-size:0.892857rem;text-decoration:none;cursor:pointer;white-space:nowrap}
.pill:hover{background:#fff}
.menubar{background:linear-gradient(var(--menu-a),var(--menu-b));color:#fff;display:flex;align-items:stretch;gap:18px;min-height:32px;overflow-x:auto;border-bottom:3px solid #A8C4E0}
.clock{color:var(--date);font-weight:700;font-size:0.928571rem;white-space:nowrap;align-self:center;font-variant-numeric:tabular-nums}
.menubar nav{display:flex;gap:2px}
.menubar nav a{color:#fff;text-decoration:none;padding:5px 14px;font-size:0.964286rem;letter-spacing:.15em;white-space:nowrap;display:flex;align-items:center}
.menubar nav a:hover{background:rgba(255,255,255,.18)}
.menubar nav a.on{background:var(--tab);box-shadow:inset 0 -3px 0 var(--date)}
@media (max-width:640px){.logo i{font-size:0.75rem}.bmid{justify-content:flex-end}.clock{display:none}}
.proto{background:var(--seal-soft);color:var(--seal);font-size:0.892857rem;padding-block:4px;text-align:center}

/* shell */
.shell{display:grid;grid-template-columns:200px 1fr;min-height:calc(100vh - 120px)}
.sidebar{background:var(--gutter);border-right:1px solid var(--line-soft);padding:12px 10px 32px;display:grid;gap:12px;align-content:start}
main{min-width:0;padding:16px max(16px,env(safe-area-inset-right,0px)) 64px 18px}
@media (max-width:820px){
  .shell{grid-template-columns:1fr}
  .sidebar{border-right:0;border-bottom:1px solid var(--line-soft);grid-auto-flow:column;grid-auto-columns:minmax(190px,1fr);overflow-x:auto;padding:10px max(16px,env(safe-area-inset-left,0px))}
  main{padding-left:max(16px,env(safe-area-inset-left,0px))}
}
.spanel{background:#fff;border:1px solid var(--line);border-radius:5px;box-shadow:0 1px 3px rgba(30,50,80,.12);overflow:hidden}
.spanel h3{font-size:0.928571rem;color:#fff;padding:4px 10px;display:flex;justify-content:space-between;align-items:center}
.spanel h3::after{content:"";width:11px;height:9px;border:1px solid rgba(255,255,255,.8);background:rgba(255,255,255,.25)}
.sp-green h3{background:linear-gradient(var(--side-green),#467F38)}
.sp-slate h3{background:linear-gradient(var(--side-slate),#5C6A7B)}
.sp-blue h3{background:linear-gradient(var(--side-blue),#335C8A)}
.spanel ul{list-style:none;margin:0;padding:6px 8px 8px;display:grid;gap:1px}
.spanel a,.spanel button{display:flex;align-items:center;gap:7px;width:100%;text-align:left;border:0;background:none;padding:2px 4px;font-size:0.928571rem;color:var(--ink);text-decoration:none;cursor:pointer;border-radius:3px}
.spanel a:hover,.spanel button:hover{background:var(--grid-alt);color:var(--link);text-decoration:underline}
.spanel .on{color:#C2185B;text-decoration:underline}
.ico{width:16px;height:12px;flex:none;border-radius:2px;position:relative}
.ico::before{content:"";position:absolute;left:0;top:-3px;width:7px;height:4px;border-radius:2px 2px 0 0;background:inherit}
.i-green{background:#8CCB5E}.i-purple{background:#A788D6}.i-blue{background:#79A7DF}.i-orange{background:#F0A64A}.i-grey{background:#9AA6B4}

/* section titles */
.stitle{display:flex;align-items:center;gap:10px;margin:2px 0 12px;color:#2F5A8A;font-size:1.142857rem;letter-spacing:.2em;font-weight:700}
.stitle::before{content:"";width:28px;height:8px;background:linear-gradient(90deg,#D15B2A 0 8px,transparent 8px 10px,#E39B3F 10px 18px,transparent 18px 20px,#F0C580 20px);flex:none}
.stitle small{font-size:0.857143rem;letter-spacing:0;color:var(--muted);font-weight:400}

/* ribbon boxes (like 承辦公文 / 系統訊息) */
.boxes{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;margin-bottom:18px}
.rbox{border:1px solid var(--line-soft);border-top:2px solid var(--rc,var(--ribbon-green));min-width:0}
.ribbon{display:inline-block;background:var(--rc,var(--ribbon-green));color:#fff;font-weight:700;font-size:1rem;padding:3px 30px 3px 8px;clip-path:polygon(0 0,calc(100% - 16px) 0,100% 100%,0 100%);margin-top:-1px}
.rbox.pink{--rc:var(--ribbon-pink)} .rbox.grey{--rc:#8D98A8} .rbox.blue{--rc:var(--tab)}
.rbody{padding:10px 12px;display:grid;gap:6px}
.bul{display:flex;gap:8px;align-items:baseline}
.bul::before{content:"";width:9px;height:9px;flex:none;border:1px solid #E06A22;background:linear-gradient(#fff 0 2px,#F08A3C 2px);transform:translateY(1px)}
.bul.b2::before{border-color:#2F8FD0;background:linear-gradient(#fff 0 2px,#4BA8E4 2px)}
.big{font-weight:900;color:#1446C8;font-variant-numeric:tabular-nums}
.big.rel{color:var(--relief)}
.dash{display:grid;grid-template-columns:1fr 240px;gap:16px;align-items:start}
@media (max-width:1100px){.dash{grid-template-columns:1fr}}
.help{border-radius:4px;overflow:hidden;border:1px solid var(--line-soft)}
.help h3{background:linear-gradient(90deg,#3E7CC0,#6FA7DB);color:#fff;font-size:1.285714rem;padding:6px 12px}
.help ul{list-style:none;padding:10px 12px;margin:0;display:grid;gap:6px;font-size:0.928571rem}
.help li{border-left:3px solid #F2B630;padding-left:8px}
.help a{color:var(--ink);text-decoration:none}.help a:hover{color:var(--link);text-decoration:underline}

/* tabs + query bar + grid */
.tabs{display:flex;gap:4px;border-bottom:3px solid var(--tab);padding-left:clamp(0px,12vw,180px);overflow-x:auto;margin-bottom:12px}
.tabs button{border:1px solid var(--line);border-bottom:0;background:linear-gradient(#FBFCFE,#E6ECF2);padding:6px 14px;font-weight:700;font-size:0.964286rem;cursor:pointer;border-radius:3px 3px 0 0;white-space:nowrap}
.tabs button.on{background:var(--tab);color:#fff;border-color:var(--tab)}
.qbar{background:var(--qbar);padding:8px 10px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:space-between;font-size:0.928571rem}
.qbar .l{display:flex;gap:8px;align-items:center;flex-wrap:wrap;min-width:0}
.qbar input,.qbar select{border:1px solid #8FA5BC;background:#fff;padding:3px 6px;border-radius:2px;min-width:0}
.qbar input{width:200px;max-width:100%}
.gbtn{border:1px solid #33619C;background:linear-gradient(var(--btn-a),var(--btn-b));color:var(--btn-ink);font-weight:700;padding:4px 14px;border-radius:3px;cursor:pointer;letter-spacing:.2em;white-space:nowrap;text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.gbtn:hover{filter:brightness(1.05)}
.gbtn:disabled{opacity:.45;cursor:not-allowed;filter:none}
.wbtn{border:1px solid #8FA5BC;background:linear-gradient(#fff,#E4EBF2);padding:4px 12px;border-radius:3px;cursor:pointer;white-space:nowrap;font-size:0.928571rem;text-decoration:none;color:var(--ink);display:inline-flex;align-items:center;gap:4px}
.wbtn:hover{border-color:var(--tab)}
.rbtn{border:1px solid #C9581C;background:linear-gradient(#FFB27A,var(--relief));color:#fff;font-weight:700;padding:5px 16px;border-radius:3px;cursor:pointer;white-space:nowrap;letter-spacing:.08em}
.rbtn:hover{filter:brightness(1.05)}
.gridwrap{border:1px solid var(--line);overflow-x:auto}
.pagerow{text-align:right;font-family:Georgia,serif;font-weight:700;font-size:0.857143rem;padding:2px 8px;border-bottom:1px solid var(--line-soft)}
table.grid{width:100%;border-collapse:collapse;font-size:0.964286rem}
.grid th{background:var(--grid-head);font-weight:500;padding:6px 8px;border:1px solid #fff;white-space:nowrap}
.grid th a,.grid th button{color:var(--link);text-decoration:underline;background:none;border:0;cursor:pointer;padding:0}
.grid td{padding:6px 8px;border:1px solid var(--line-soft);vertical-align:middle}
.grid tbody tr:nth-child(even) td{background:var(--grid-alt)}
.grid tbody tr:hover td{background:#FFF8D9}
.grid .c{text-align:center}.grid .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.grid .t{min-width:180px}
.grid .t a{font-weight:500}
.grid .t small{display:block;color:var(--muted);font-size:0.857143rem;line-height:1.4}
.type{font-size:0.821429rem;font-weight:700;padding:1px 6px;border-radius:3px;white-space:nowrap}
.t-md{background:var(--md-soft);color:var(--md)}.t-skill{background:var(--skill-soft);color:var(--skill)}.t-tpl{background:var(--tpl-soft);color:var(--tpl)}
.rel{color:var(--relief);font-weight:700}
.stale{background:var(--warn-bg);color:var(--warn-ink);padding:0 5px;border-radius:3px;font-size:0.857143rem;white-space:nowrap}
.empty{padding:24px;text-align:center;color:var(--muted)}
@media (max-width:700px){
  .gridwrap{border:0;overflow:visible}
  .pagerow{display:none}
  table.grid,.grid tbody,.grid tr,.grid td{display:block}
  .grid thead{display:none}
  .grid tr{border:1px solid var(--line);border-radius:4px;margin-bottom:10px;padding:8px 10px;background:#fff}
  .grid tbody tr:nth-child(even) td,.grid td{background:none;border:0;padding:1px 0}
  .grid td[data-l]::before{content:attr(data-l)"：";color:var(--muted);font-size:0.857143rem}
  .grid .c,.grid .num{text-align:left}
}

/* form table (detail / upload) */
.ftable{width:100%;border-collapse:collapse;font-size:0.964286rem;margin-bottom:12px}
.ftable th{background:var(--grid-head);font-weight:500;text-align:center;width:110px;padding:6px 8px;border:1px solid #fff;white-space:nowrap}
.ftable td{border:1px solid var(--line-soft);padding:6px 10px}
.ftable input,.ftable select{border:1px solid #8FA5BC;padding:4px 6px;border-radius:2px;width:100%;max-width:340px;background:#fff}
@media (max-width:560px){.ftable th{width:84px;white-space:normal}}
.titlebar{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:8px}
.titlebar h1{font-size:clamp(1.428571rem,3vw,1.857143rem)}
.actions{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 14px;padding:8px 10px;background:var(--gutter);border:1px solid var(--line-soft)}
.stamp{display:inline-grid;grid-template-columns:1fr 1fr;width:48px;height:48px;border:2px solid var(--seal);border-radius:4px;color:var(--seal);font-weight:900;font-size:1.071429rem;line-height:1;place-items:center;transform:rotate(-9deg);padding:2px;flex:none;background:#fff}
.two{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;align-items:start}
@media (max-width:980px){.two{grid-template-columns:1fr}}
.doc{border:1px solid var(--line);min-width:0}
.doc .tabs{padding-left:8px;margin-bottom:0;border-bottom-width:2px;background:var(--gutter);padding-top:6px}
.mdbody{padding:6px 18px 18px;max-width:74ch;font-size:1.035714rem;line-height:1.75}
.mdbody h1{font-size:1.428571rem;margin:14px 0 4px}.mdbody h2{font-size:1.178571rem;margin:16px 0 4px;color:#2F5A8A}.mdbody h3{font-size:1.071429rem;margin:12px 0 4px}
.mdbody p,.mdbody ul,.mdbody ol{margin:5px 0}.mdbody ul,.mdbody ol{padding-left:1.4em}
.mdbody code{font-family:var(--f-mono);font-size:.85em;background:var(--gutter);padding:1px 5px;border-radius:3px}
.mdbody pre{background:var(--gutter);border:1px solid var(--line-soft);padding:10px 12px;overflow-x:auto;font-family:var(--f-mono);font-size:0.892857rem;line-height:1.6}
.mdbody pre code{background:none;padding:0}
.ph{font-family:var(--f-mono);font-size:.84em;background:var(--tpl-soft);color:var(--tpl);padding:1px 5px;border-radius:3px;white-space:nowrap}
.tree{list-style:none;padding:12px 18px;margin:0;font-family:var(--f-mono);font-size:0.928571rem;display:grid;gap:3px}
.promptbox{font-family:var(--f-mono);font-size:0.857143rem;background:var(--gutter);border:1px solid var(--line-soft);padding:8px 10px;white-space:pre-wrap;line-height:1.6;margin:6px 0;word-break:break-word}
.note{font-size:0.892857rem;color:var(--muted);margin:0}

/* 我有減壓 */
.relief{border:1px solid #F3B98F;background:var(--relief-soft)}
.relief .head{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;padding:10px 12px 4px}
.relief .head .n{font-size:2rem;font-weight:900;color:var(--relief);line-height:1;font-variant-numeric:tabular-nums}
.relief .rbody{padding:4px 12px 12px}
.hourpick{display:flex;flex-wrap:wrap;gap:6px}
.hourpick button{border:1px solid #F0B48A;background:#fff;border-radius:999px;padding:2px 12px;font-size:0.928571rem;cursor:pointer}
.hourpick button.on{background:var(--relief);color:#fff;border-color:var(--relief)}
.relief input{border:1px solid #F0B48A;padding:5px 8px;border-radius:3px;width:100%;background:#fff}
.voices{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.voices li{background:#fff;border:1px solid #F7D2B6;border-radius:4px;padding:6px 9px;font-size:0.928571rem}
.voices li small{display:block;color:var(--muted);font-size:0.821429rem}
.done{color:var(--relief);font-weight:700;font-size:0.928571rem}

/* calendar */
.cal{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.cal .rbox.now{--rc:var(--tab);box-shadow:0 0 0 2px var(--tab)}
.cal a{font-size:0.964286rem;text-decoration:none;color:var(--ink)}.cal a:hover{color:var(--link);text-decoration:underline}
.dot{width:8px;height:8px;border-radius:2px;flex:none;display:inline-block;margin-right:6px;transform:translateY(-1px)}

/* upload scanner */
.steps{display:grid;gap:16px}
textarea{font-family:var(--f-mono);font-size:0.892857rem;line-height:1.65;min-height:280px;resize:vertical;border:1px solid #8FA5BC;border-radius:2px;padding:8px 10px;width:100%;background:#fff}
.monthpick{display:flex;flex-wrap:wrap;gap:4px}
.monthpick button{border:1px solid var(--line);background:#fff;padding:1px 9px;border-radius:3px;cursor:pointer;font-size:0.892857rem}
.monthpick button.on{background:var(--tab);color:#fff;border-color:var(--tab)}
.scan{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:14px;align-items:start}
@media (max-width:900px){.scan{grid-template-columns:1fr}}
.preview{font-family:var(--f-mono);font-size:0.892857rem;line-height:1.75;white-space:pre-wrap;word-break:break-word;background:#FBFCFD;border:1px solid var(--line-soft);padding:10px 12px;max-height:440px;overflow:auto}
mark.hit{background:var(--warn-bg);color:var(--warn-ink);border-bottom:2px solid var(--warn-line);padding:0 2px}
mark.hit sup{font-size:0.714286rem;font-weight:700}
.hits{display:grid;gap:7px}
.hit-item{border:1px solid var(--warn-line);background:#fff;padding:8px 10px;display:grid;gap:5px;border-radius:3px}
.hit-item .what{display:flex;gap:8px;align-items:baseline;flex-wrap:wrap;font-size:0.928571rem}
.hit-item .num{font-family:var(--f-mono);font-weight:700;color:var(--warn-ink);background:var(--warn-bg);padding:0 6px;border-radius:3px}
.hit-item code{font-family:var(--f-mono);font-size:0.857143rem;word-break:break-all}
.row{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.gate{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:9px 12px;margin-bottom:10px}
.gate.block{background:var(--warn-bg);color:var(--warn-ink)}
.gate.pass{background:var(--skill-soft);color:var(--skill)}
.eyebrow{font-size:0.857143rem;color:var(--muted);font-weight:500;display:block;margin-bottom:4px}

/* modal + toast */
.modal{position:fixed;inset:0;z-index:20;background:rgba(15,22,40,.5);display:grid;place-items:center;padding:16px}
.dialog{background:#fff;width:min(460px,100%);max-height:90vh;overflow:auto;border:1px solid var(--line);box-shadow:0 10px 30px rgba(0,0,0,.25)}
.dialog .dh{background:linear-gradient(90deg,var(--banner-a),var(--banner-b));color:#fff;padding:8px 14px;font-weight:700}
.dialog .db{padding:14px;display:grid;gap:10px}
.err{color:var(--seal);font-size:0.928571rem;margin:0}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:30;background:#1E2633;color:#fff;padding:9px 18px;border-radius:5px;font-size:1rem;max-width:calc(100% - 32px)}
/* 版本與分支（GitHub 概念） */
.vtag{font-family:var(--f-mono);font-size:0.857143rem;font-weight:500;background:#24292F;color:#fff;padding:0 6px;border-radius:3px;white-space:nowrap}
.latest{font-size:0.785714rem;color:var(--skill);border:1px solid var(--skill);border-radius:999px;padding:0 7px;white-space:nowrap}
.brtag{font-size:0.821429rem;font-weight:700;color:#6B3FB8;background:#F1EAFB;border:1px solid #CDB8EE;border-radius:3px;padding:0 6px;white-space:nowrap}
.branchsel{display:inline-flex;gap:6px;align-items:center;font-size:0.928571rem;border:1px solid #8FA5BC;background:linear-gradient(#fff,#E4EBF2);padding:2px 4px 2px 8px;border-radius:3px;max-width:100%}
.branchsel select{border:0;background:transparent;font-weight:700;min-width:0;max-width:100%}
.forkbar{background:#F5F0FC;border:1px solid #CDB8EE;padding:8px 12px;font-size:0.964286rem;display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:10px}
.commits{list-style:none;margin:0;padding:14px 16px 16px 34px;position:relative;display:grid;gap:16px}
.commits::before{content:"";position:absolute;left:21px;top:20px;bottom:24px;width:2px;background:var(--line)}
.commits li{position:relative;min-width:0}
.commits li::before{content:"";position:absolute;left:-18px;top:5px;width:10px;height:10px;border-radius:50%;background:#fff;border:2px solid var(--tab)}
.commits li:first-child::before{background:var(--tab)}
.cm{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.commits summary{cursor:pointer;color:var(--link);font-size:0.892857rem;margin-top:2px}
.diff{font-family:var(--f-mono);font-size:0.892857rem;border:1px solid var(--line-soft);margin-top:6px;border-radius:3px;overflow:hidden}
.diff div{padding:2px 8px;display:flex;gap:8px;word-break:break-word}
.diff .add{background:#E6F6EA;color:#1A5E2A}.diff .del{background:#FBE9E9;color:#8A1F1F}
.diff span{opacity:.7;flex:none}
.graphwrap{overflow-x:auto;padding:12px 14px 4px;border-bottom:1px solid var(--line-soft)}
.graphwrap svg{display:block}



/* repo view：參照 GitHub 的檔案清單 + README 說明框 + 右側 About */
.repohead{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:10px}
.repohead .sp{flex:1}
.counter{font-size:0.892857rem;color:var(--muted);display:inline-flex;gap:4px;align-items:center;background:none;border:0;cursor:pointer;padding:2px 4px}
.counter b{color:var(--ink)}
.counter:hover{color:var(--link)}
.files{border:1px solid var(--line);border-radius:4px;overflow:hidden;background:#fff}
.commitbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;background:#F6F8FA;border-bottom:1px solid var(--line);padding:8px 12px;font-size:0.928571rem}
.commitbar .msg{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.crumbs{display:flex;gap:4px;align-items:center;flex-wrap:wrap;font-size:1rem;padding:8px 12px;border-bottom:1px solid var(--line-soft);background:#fff}
.crumbs button{border:0;background:none;color:var(--link);cursor:pointer;padding:0;font-weight:700}
.crumbs span.sep{color:var(--muted)}
.ftree{width:100%;border-collapse:collapse;font-size:0.964286rem}
.ftree td{padding:6px 12px;border-top:1px solid var(--line-soft);vertical-align:middle}
.ftree tr:first-child td{border-top:0}
.ftree tr:hover td{background:#F6F8FA}
.ftree .nm{display:flex;gap:8px;align-items:center;min-width:0}
.ftree .nm button{border:0;background:none;padding:0;cursor:pointer;color:var(--ink);text-align:left;word-break:break-all}
.ftree .nm button:hover{color:var(--link);text-decoration:underline}
.ftree .cmsg{color:var(--muted);max-width:0;width:50%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ftree .dt{color:var(--muted);text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
@media (max-width:640px){.ftree .cmsg{display:none}}
.fi{width:16px;height:16px;flex:none}
.readmebox{border:1px solid var(--line);border-radius:4px;margin-top:14px;background:#fff}
.readmebox .rh{display:flex;gap:8px;align-items:center;padding:8px 14px;border-bottom:1px solid var(--line-soft);font-weight:700;font-size:0.964286rem;background:#F6F8FA}
.fileview{border:1px solid var(--line);border-radius:4px;background:#fff;min-width:0}
.fileview .fh{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:6px 12px;border-bottom:1px solid var(--line-soft);background:#F6F8FA;font-size:0.928571rem}
.fileview .fh .sp{flex:1}
.seg{display:inline-flex;border:1px solid #8FA5BC;border-radius:3px;overflow:hidden}
.seg button{border:0;background:#fff;padding:2px 10px;font-size:0.892857rem;cursor:pointer}
.seg button.on{background:var(--tab);color:#fff}
.code{overflow-x:auto;font-family:var(--f-mono);font-size:0.892857rem;line-height:1.65}
.code table{border-collapse:collapse;width:100%}
.code td.ln{color:#8C959F;text-align:right;padding:0 10px;user-select:none;width:1%;white-space:nowrap;vertical-align:top}
.code td.lc{white-space:pre-wrap;word-break:break-word;padding:0 12px}
.binbox{padding:28px;text-align:center;color:var(--muted)}
.about{display:grid;gap:14px;align-content:start}
.about .rbody p{margin:0}
.lock{padding:20px;text-align:center;color:var(--muted)}
.mdbody table{border-collapse:collapse;margin:8px 0;font-size:0.964286rem}
.mdbody th,.mdbody td{border:1px solid var(--line);padding:4px 10px;text-align:left}
.mdbody th{background:var(--grid-head);font-weight:500}
.diff .fhd{background:#F6F8FA;color:var(--ink);font-weight:700;border-top:1px solid var(--line-soft)}
.diff .fhd:first-child{border-top:0}

/* upload：拖放區 + 檔案樹 + 每檔掃描 */
.drop{border:2px dashed #8FB4D8;background:#F5F9FD;border-radius:6px;padding:18px;display:grid;gap:8px;justify-items:center;text-align:center}
.drop.over{background:#E3F0FB;border-color:var(--tab)}
.drop b{font-size:1.071429rem}
.upgrid{display:grid;grid-template-columns:270px minmax(0,1fr);gap:14px;align-items:start}
@media (max-width:900px){.upgrid{grid-template-columns:1fr}}
.uptree{border:1px solid var(--line);border-radius:4px;background:#fff;max-height:520px;overflow:auto;font-size:0.928571rem}
.uptree ul{list-style:none;margin:0;padding:0 0 0 14px}
.uptree>ul{padding:6px 6px 8px}
.uptree li{margin:1px 0}
.uptree .dir{display:flex;gap:6px;align-items:center;padding:2px 4px;color:var(--muted);font-weight:700}
.uptree button{display:flex;gap:6px;align-items:center;width:100%;border:0;background:none;text-align:left;padding:3px 4px;border-radius:3px;cursor:pointer;min-width:0}
.uptree button span.n{flex:1;min-width:0;word-break:break-all}
.uptree button:hover{background:var(--grid-alt)}
.uptree button.on{background:var(--qbar);font-weight:700}
.bdg{font-size:0.785714rem;font-weight:700;border-radius:3px;padding:0 5px;white-space:nowrap;flex:none}
.bdg.w{background:var(--warn-bg);color:var(--warn-ink)}
.bdg.ok{background:var(--skill-soft);color:var(--skill)}
.bdg.bin{background:#EDE7F6;color:#5E35B1}
.selpane{display:grid;gap:10px;min-width:0}
.selpane .ph2{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-family:var(--f-mono);font-size:0.928571rem;font-weight:700}
.structure{font-family:var(--f-mono);font-size:0.892857rem;line-height:1.7;background:var(--gutter);border:1px solid var(--line-soft);padding:8px 12px;white-space:pre;overflow-x:auto;margin:0}
.metanote{font-size:0.892857rem;color:var(--skill);background:var(--skill-soft);padding:4px 10px;border-radius:3px}
.chk{display:flex;gap:8px;align-items:flex-start;font-size:0.964286rem;background:#FFF8E1;border:1px solid var(--warn-line);padding:8px 10px;border-radius:3px}
.chk input{margin-top:4px}
.systag{font-size:0.821429rem;color:#7A4A12;background:#FDF1DC;border:1px solid #E9C894;border-radius:3px;padding:0 6px;white-space:nowrap}
.helpq{width:20px;height:20px;border-radius:50%;border:1px solid #8FA5BC;background:linear-gradient(#fff,#E4EBF2);color:var(--link);font-weight:900;font-size:0.857143rem;line-height:1;cursor:pointer;padding:0;display:inline-grid;place-items:center;vertical-align:middle;letter-spacing:0}
.helpq:hover{border-color:var(--tab);background:#fff}
.linkbtn{border:0;background:none;padding:0;color:var(--ink);cursor:pointer;text-align:left;font-size:0.928571rem}.linkbtn:hover{color:var(--link);text-decoration:underline}
.manual{display:grid;gap:14px;min-width:0}
.manual section{scroll-margin-top:110px}
.manual .mdbody{padding:8px 14px 12px;max-width:72ch}
.helpgrid{display:grid;grid-template-columns:220px minmax(0,1fr);gap:16px;align-items:start}
@media (max-width:900px){.helpgrid{grid-template-columns:1fr}}
.toc{position:sticky;top:100px;align-self:start}
@media (max-width:900px){.toc{position:static}}
.fbst{font-size:0.857143rem;font-weight:700;border-radius:3px;padding:1px 7px;white-space:nowrap}
.st-new{background:#FDE2E2;color:#9B1C1C}.st-doing{background:#FFF1C9;color:#6B4A00}.st-replied{background:var(--md-soft);color:var(--md)}.st-closed{background:#ECEFF2;color:#5E6B7A}
.fbreply{margin-top:6px;background:var(--grid-alt);border-left:3px solid var(--tab);padding:4px 8px;font-size:0.928571rem}
.fbact{margin-top:6px}.fbact summary{cursor:pointer;color:var(--link);font-size:0.892857rem}
.fbact textarea{min-height:70px;margin:6px 0;font-family:var(--f-body);font-size:0.964286rem}
/* 許願池 */
.wishdoc{background:#FFFEF8;border:1px solid #D9CFA8;padding:14px 18px;font-size:1rem;line-height:1.8;box-shadow:0 1px 0 #EFE8CF}
.wishdoc p{margin:2px 0}
.wd-h{text-align:center;font-weight:900;font-size:1.285714rem;letter-spacing:.4em;color:#7A2E1F;border-bottom:2px solid #C9A9A0;padding-bottom:4px;margin-bottom:8px}
.wd-ol{margin:0;padding-left:2.2em;list-style:cjk-ideographic}
.meter{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:6px}
.bars{display:inline-flex;gap:3px}.bars i{width:22px;height:8px;border-radius:2px;background:var(--line-soft)}.bars i.on{background:var(--relief)}
.coach{margin:4px 0 0;padding-left:1.3em;font-size:0.928571rem;color:var(--warn-ink)}
.coach li::marker{content:"→ "}
.aiq{background:#F5F0FC;border:1px solid #CDB8EE;padding:8px 12px;border-radius:3px;font-size:0.964286rem;margin-top:6px}
.aiq ul{margin:4px 0;padding-left:1.4em}
.votebtn{display:inline-grid;justify-items:center;gap:0;border:1px solid #F0B48A;background:#fff;border-radius:6px;padding:3px 10px;cursor:pointer;min-width:72px;line-height:1.2}
.votebtn b{font-size:1.285714rem;color:var(--relief);font-variant-numeric:tabular-nums}.votebtn span{font-size:0.821429rem;color:var(--muted)}
.votebtn.on{background:var(--relief-soft);border-color:var(--relief)}
.votebtn:disabled{opacity:.6;cursor:default}
.wtitle{font-weight:700;font-size:1.035714rem;color:var(--link)}
.wishopen{margin-top:8px;max-width:640px}
.ws-open{background:#FDEBDD;color:#9A4A12}.ws-claimed{background:#FFF1C9;color:#6B4A00}.ws-done{background:var(--skill-soft);color:var(--skill)}.ws-closed{background:#ECEFF2;color:#5E6B7A}
#wish-new textarea,.ftable textarea{border:1px solid #8FA5BC;border-radius:2px;padding:4px 6px;width:100%;font-family:var(--f-body);font-size:0.964286rem;min-height:0;background:#fff}
[hidden]{display:none!important}
/* 魔法卡 */
.mcard{--rx:0deg;--ry:0deg;display:block;aspect-ratio:63/88;border-radius:14px;padding:6px;background:linear-gradient(135deg,var(--ra),#fff 45%,var(--rb));box-shadow:0 6px 18px rgba(20,30,50,.25);text-decoration:none;color:#1E2633;position:relative;transform:perspective(700px) rotateX(var(--rx)) rotateY(var(--ry));transition:transform .15s ease-out,box-shadow .2s;max-width:100%}
a.mcard:hover{box-shadow:0 10px 26px rgba(20,30,50,.35);transform:perspective(700px) translateY(-4px)}
.mc-in{height:100%;border-radius:10px;background:#FBF8F1;display:flex;flex-direction:column;gap:5px;padding:8px 9px 7px;overflow:hidden;position:relative}
.mc-top{display:flex;gap:6px;align-items:center;justify-content:space-between}
.mc-name{font-weight:900;font-size:0.928571rem;line-height:1.25;min-width:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mc-el{width:24px;height:24px;border-radius:50%;background:var(--el);color:#fff;font-weight:900;font-size:0.928571rem;display:grid;place-items:center;flex:none}
.mc-art{flex:1;min-height:60px;border-radius:7px;background:radial-gradient(circle at 50% 50%,#fff 0,var(--el) 38%,#10161E 100%);display:grid;place-items:center;position:relative;overflow:hidden}
.mc-art::before{content:"";position:absolute;inset:0;background:repeating-radial-gradient(circle at 50% 50%,transparent 0 16px,rgba(255,255,255,.18) 16px 17px)}
.mc-art span{font-size:clamp(2.857143rem,9vw,4.571429rem);font-weight:900;color:rgba(255,255,255,.95);position:relative;text-shadow:0 2px 8px rgba(0,0,0,.35)}
.mc-art em{position:absolute;left:6px;bottom:5px;font-style:normal;font-size:0.75rem;font-weight:700;background:rgba(255,255,255,.9);color:#6B3FB8;border-radius:3px;padding:0 5px}
.mc-type{background:var(--el);color:#fff;font-size:0.785714rem;font-weight:700;padding:2px 6px;border-radius:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mc-eff{font-size:0.857143rem;line-height:1.5;color:#2D3748;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.mc-foot{display:flex;justify-content:space-between;font-size:0.821429rem;font-weight:900;border-top:1px solid #D8D0BE;padding-top:4px;font-variant-numeric:tabular-nums}
.mc-foot span:first-child{color:#C05621}
.mc-rar{text-align:center;font-size:0.75rem;font-weight:900;color:var(--rb);letter-spacing:.2em}
.mcard.big{width:min(280px,100%);margin:0 auto}
.mcard.big .mc-name{font-size:1.142857rem}.mcard.big .mc-el{width:30px;height:30px;font-size:1.142857rem}.mcard.big .mc-art span{font-size:6.857143rem}.mcard.big .mc-type{font-size:0.892857rem}.mcard.big .mc-foot{font-size:0.928571rem}
.r-legend .mc-in::after,.r-epic .mc-in::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.55) 45%,transparent 60%);background-size:250% 100%;background-position:120% 0;pointer-events:none;mix-blend-mode:overlay}
@media (prefers-reduced-motion:no-preference){.r-legend:hover .mc-in::after,.r-epic:hover .mc-in::after,.mcard.big .mc-in::after{animation:foil 2.4s ease-in-out infinite}}
@keyframes foil{to{background-position:-120% 0}}
.cardbox{display:grid;gap:10px;justify-items:center;padding:12px;background:linear-gradient(#22324A,#16202F);border-radius:6px}
.castbtn{border:0;border-radius:999px;padding:9px 22px;font-weight:900;font-size:1.071429rem;letter-spacing:.1em;color:#2A1A00;background:linear-gradient(#FFE7A3,#F2B630);box-shadow:0 0 0 2px #fff3,0 4px 14px rgba(242,182,48,.5);cursor:pointer}
.castbtn:hover{filter:brightness(1.06)}
.cardnote{color:#C9D6E6;font-size:0.857143rem;text-align:center;margin:0}
.cardgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:16px;padding:6px 2px}
.cast{position:fixed;inset:0;z-index:40;background:radial-gradient(circle at 50% 45%,rgba(30,45,70,.94),rgba(5,8,14,.98));display:grid}
.cast canvas{position:absolute;inset:0;width:100%;height:100%}
.castui{position:absolute;left:0;right:0;bottom:calc(24px + env(safe-area-inset-bottom,0px));display:grid;justify-items:center;gap:10px;padding:0 max(16px,env(safe-area-inset-left,0px));color:#fff;text-align:center}
.cast-title{position:absolute;top:calc(20px + env(safe-area-inset-top,0px));left:0;right:0;text-align:center;color:#FFE7A3;font-weight:900;font-size:1.285714rem;letter-spacing:.1em;padding:0 16px}
.stressbar{display:flex;gap:10px;align-items:center;width:min(420px,100%);font-size:0.928571rem;font-weight:700}
.stressbar i{flex:1;height:14px;border-radius:8px;background:rgba(255,255,255,.15);overflow:hidden;display:block}
.stressbar b{display:block;height:100%;width:92%;background:linear-gradient(90deg,#F56565,#C53030);border-radius:8px}
.stressbar b.calm{background:linear-gradient(90deg,#68D391,#2F855A)}
.cast-msg{font-size:1.142857rem;min-height:1.6em}.cast-msg b{color:#FFE7A3}
.cast-act{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;min-height:36px}
/* 法律聲明 */
.legal{display:grid;gap:14px;max-width:820px}
.legal section{scroll-margin-top:110px}
.legal .mdbody{padding:8px 14px 12px}
.linkbtn.inl{display:inline;color:var(--link);text-decoration:underline;font-size:inherit}
.sitefoot{border-top:1px solid var(--line-soft);background:var(--gutter);padding-block:14px calc(14px + env(safe-area-inset-bottom,0px));font-size:0.892857rem;color:var(--muted);display:flex;gap:6px 16px;flex-wrap:wrap;justify-content:center;text-align:center}
.sitefoot a,.sitefoot .linkbtn{color:var(--muted);font-size:0.892857rem;text-decoration:underline}
.sitefoot{flex-direction:column;align-items:center}
.footlinks{display:flex;gap:6px 16px;flex-wrap:wrap;justify-content:center}
.maker{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);padding:6px 14px 6px 6px;border:1px solid var(--line);border-radius:999px;background:#fff}
.maker:hover{border-color:var(--tab);box-shadow:0 2px 8px rgba(30,60,100,.12)}
.maker-logo{width:44px;height:44px;border-radius:50%;background:#fff;padding:4px;display:grid;place-items:center;overflow:hidden;flex:none;box-shadow:0 0 0 1px var(--line-soft)}
.maker-logo svg{width:100%;height:100%;display:block}
.maker-logo img{width:100%;height:100%;object-fit:cover}
.maker-txt{display:grid;text-align:left;line-height:1.25}.maker-txt b{font-size:1rem}.maker-txt small{font-size:0.821429rem;color:var(--muted)}
#consentForm ul{margin:0;padding-left:1.3em;display:grid;gap:4px;font-size:0.964286rem}
.ws-need{background:#FDE2E2;color:#9B1C1C;margin-left:4px}
.wd-att{font-family:var(--f-mono);font-size:0.892857rem;background:var(--gutter);padding:0 5px;border-radius:3px}
.wsec{margin-top:10px;display:grid;gap:6px;font-size:0.964286rem}
.wfiles{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.wfiles li{display:flex;gap:8px;align-items:center;flex-wrap:wrap;border:1px solid var(--line-soft);background:#fff;border-radius:4px;padding:6px 8px;font-size:0.928571rem}
.wfiles .n{flex:1;min-width:120px;word-break:break-all;font-family:var(--f-mono);font-size:0.892857rem}
.wthread{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.wthread li{border-left:3px solid var(--tab);background:var(--grid-alt);padding:5px 9px;font-size:0.964286rem}
.wthread li.reply{border-left-color:var(--relief);background:var(--relief-soft)}
.wthread .who{display:block;font-size:0.821429rem;color:var(--muted)}
.wask{display:grid;gap:6px}
.wask textarea{border:1px solid #8FA5BC;border-radius:2px;padding:5px 8px;width:100%;font-family:var(--f-body);font-size:0.964286rem;min-height:56px;background:#fff}
.drop.small{padding:12px;gap:6px}
/* Header logo: user-provided image, preserved without cropping. */
@media (max-width:640px){.logomark{width:72px;height:72px}}
.makers{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.sitefoot a.maker{text-decoration:none;color:var(--ink)}
.maker-logo img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
/* 處室顏色標籤 */
.dtag{display:inline-flex;align-items:center;gap:5px;border:1px solid color-mix(in srgb,var(--dc) 45%,#fff);background:color-mix(in srgb,var(--dc) 9%,#fff);color:color-mix(in srgb,var(--dc) 80%,#000);border-radius:999px;padding:1px 9px 1px 2px;font-size:0.892857rem;font-weight:700;white-space:nowrap;line-height:1.5;vertical-align:middle}
.dtag i{font-style:normal;width:19px;height:19px;border-radius:50%;background:var(--dc);color:#fff;display:grid;place-items:center;font-size:0.821429rem;font-weight:900}
.dtag em{font-style:normal;font-weight:500;color:var(--muted);margin-left:2px}
.dtag em::before{content:"・"}
.dico{width:17px;height:17px;border-radius:4px;background:var(--dc);color:#fff;font-size:0.785714rem;font-weight:900;display:grid;place-items:center;flex:none}
.tdot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--dc);margin-right:5px;vertical-align:1px}
.tabs button.on .tdot{box-shadow:0 0 0 2px #fff}



/* Reading preferences: only typography scales, not logo and layout dimensions. */
html{font-size:16px}
html[data-text-size="small"]{font-size:14px}
html[data-text-size="medium"]{font-size:16px}
html[data-text-size="large"]{font-size:18px}
.text-size{display:flex;align-items:center;gap:3px;white-space:nowrap;color:#DCE2FF}
.text-size span{font-size:.857143rem;margin-right:4px}
.text-size button{font-size:1rem;line-height:1.2;min-width:32px;min-height:32px;padding:4px 7px;border:1px solid #A9BBD3;border-radius:3px;background:#E4ECF6;color:#23466D;cursor:pointer;font-weight:700}
.text-size button:hover{background:#fff}
.text-size button[aria-pressed="true"]{background:#FFE7A3;border-color:#FFE7A3;color:#173B60;box-shadow:inset 0 -3px 0 #B98D30}
@media(max-width:640px){
  .btop{gap:8px}
  .logo{max-width:100%;min-width:0}
  .logo>span{min-width:0}
  .logo b{font-size:1.714286rem}
  .bmid{flex-basis:100%;justify-content:space-between;gap:8px}
}

/* Account tabs stay centered in the entire sticky header. */
.btop{position:relative}
.btop>.pills{position:absolute;top:0;left:50%;transform:translateX(-50%);z-index:1;white-space:nowrap}
.logo>span{padding-top:28px}
.bmid{justify-content:flex-end;align-self:flex-end;gap:12px;padding-bottom:6px}
@media(max-width:640px){
  .bmid{justify-content:space-between;align-self:auto;padding-bottom:0}
}
/* Account name sits to the left without shifting the centered tabs. */
.btop>.pills>.uname{position:absolute;right:calc(100% + 18px);top:50%;transform:translateY(-50%);max-width:min(16rem,calc(50vw - 50% - 38px));overflow:hidden;text-overflow:ellipsis}
@media(max-width:640px){.bmid{justify-content:flex-end}}

/* AI example provenance: labels leave original files and sample data intact. */
.proto strong{font-weight:900;color:#8A2B18}
.ai-example-tag{display:inline-block;padding:0 5px;border:1px solid #E0B43A;border-radius:3px;background:#FFF0C2;color:#6C3B00;font-size:.785714rem;line-height:1.5;font-weight:700;vertical-align:middle}
.ai-example-notice{margin:8px 0;padding:8px 12px;border:1px solid #D69D38;border-left:4px solid #B7791F;border-radius:3px;background:#FFF5DC;color:#713B00;font-size:1rem;line-height:1.6;font-weight:700}
.grid .ai-example-notice{margin:5px 0 0;padding:3px 6px;border-left-width:3px;font-size:.857143rem}


/* Illustrated collectible cards; artwork is shared, all data stays live. */
.mcard{aspect-ratio:auto;border:1px solid var(--rb);padding:5px;border-radius:15px;background:linear-gradient(140deg,var(--ra),#FFF8DF 38%,var(--rb) 76%,var(--ra));box-shadow:0 8px 22px #102B4C24,0 1px 2px #102B4C33}
.mc-in{height:100%;padding:10px;gap:8px;background:linear-gradient(160deg,#FFFFFF,#EEF4FB);border:1px solid #FFFFFFB3;border-radius:10px}
.mc-top{background:linear-gradient(110deg,#23466D,#355C87);color:#fff;padding:8px;border-radius:6px;min-height:54px;box-shadow:inset 0 1px #FFFFFF24}
.mc-name{font-size:.928571rem;line-height:1.35;min-height:2.7em;display:-webkit-box;-webkit-line-clamp:2;align-content:center}
.mc-el{width:25px;height:25px;border:1px solid #FFFFFF88;box-shadow:0 1px 4px #0003}
.mc-art{flex:0 0 auto;min-height:0;aspect-ratio:3/2;border:1px solid #AFC7DE;background:#DBE8F5;border-radius:6px;box-shadow:inset 0 0 0 1px #FFFFFF99}
.mc-art::before{display:none}
.mc-art img{display:block;width:100%;height:100%;object-fit:cover}
.mc-art em{z-index:1;max-width:calc(100% - 12px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;box-shadow:0 1px 4px #23466D33}
.mc-type{padding:4px 7px;border-radius:4px;letter-spacing:.04em;line-height:1.4}
.mc-eff{-webkit-line-clamp:3;font-size:.857143rem;line-height:1.65;color:#40546D}
.mc-foot{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:8px 2px 2px;border-top:1px solid #C7D6E5;text-align:center}
.mc-foot>span{display:grid;gap:2px;min-width:0;color:#23466D}
.mc-foot small{font-size:.678571rem;color:#63758B;font-weight:500;white-space:nowrap}
.mc-foot b{font-size:1rem;line-height:1.3;font-weight:900}
.mc-foot i{font-size:.75em;font-style:normal;margin-left:2px}
.mc-foot>span+span{border-left:1px solid #D5E0EC}
.mc-foot span:first-child{color:#AD5A25}
.mc-rar{display:flex;justify-content:center;align-items:center;gap:7px;font-size:.785714rem;line-height:1.5;letter-spacing:.12em;padding:3px 0;border-top:1px solid #D7E2ED;color:var(--rb)}
.mc-rar>span{font-size:.65em}
.mc-example{color:#875421;background:#FFF2D6;border:1px solid #E9D2A4;border-radius:3px;padding:3px 4px;text-align:center;font-size:.714286rem;line-height:1.5;font-weight:700}
.mcard.big .mc-in{padding:11px;gap:9px}
.mcard.big .mc-top{min-height:64px;padding:9px}
.mcard.big .mc-name{font-size:1.071429rem}
.mcard.big .mc-el{width:30px;height:30px;font-size:1.071429rem}
.mcard.big .mc-foot b{font-size:1.142857rem}
.mcard.big .mc-foot small{font-size:.75rem}
.mcard.big .mc-example{font-size:.75rem}
.cardgrid{grid-template-columns:repeat(auto-fill,minmax(min(220px,100%),1fr));gap:20px;padding:14px 3px;align-items:stretch}
.cardbox{padding:16px 13px;background:radial-gradient(ellipse at top,#3A5F89,#1A2F49 72%);border:1px solid #7594B4;border-radius:12px;box-shadow:inset 0 1px #FFFFFF33,0 5px 18px #23466D1A;gap:13px}
.cardbox-label{font-size:.821429rem;letter-spacing:.2em;color:#F3DFB1;font-weight:700}
.castbtn{background:linear-gradient(#FFF0BA,#E5B454);color:#543912;border:1px solid #F6DF9D;box-shadow:0 3px 10px #0003;border-radius:7px;padding:9px 20px}
@media(prefers-reduced-motion:reduce){.mcard,a.mcard:hover{transform:none;transition:none}.mc-in::after{animation:none!important}}

/* Feedback-based card levels: keep the rule visible at every text size. */
.mc-progress{padding:3px 6px 8px;text-align:center;font-size:.75rem;line-height:1.5;color:#52667C;overflow-wrap:anywhere}

/* Expandable department/unit navigation; native buttons retain keyboard access. */
.spanel .dept-toggle{gap:6px;min-height:28px}
.dept-label{flex:1;min-width:0;overflow-wrap:anywhere}
.dept-arrow{font-size:.75rem;color:#708296;flex:none;margin-left:auto}
.spanel .dept-units{margin:2px 0 6px 11px;padding:3px 0 3px 12px;gap:2px;border-left:2px solid #C9D8E8;background:#F6F9FC}
.spanel .dept-units[hidden]{display:none}
.spanel .dept-units button{min-height:28px;padding:3px 6px;gap:4px;font-size:.857143rem;line-height:1.5}
.unit-label{flex:1;min-width:0;overflow-wrap:anywhere}
.unit-count{color:#738297;white-space:nowrap;font-size:.785714rem;font-variant-numeric:tabular-nums}
.spanel .dept-units button.on{background:#E7F0FB;color:#245A8D;font-weight:700;text-decoration:none}
.spanel .dept-toggle:focus-visible,.spanel .dept-units button:focus-visible{outline:2px solid #2B6CB0;outline-offset:-2px}
.unit-filter{display:flex;align-items:center;flex-wrap:wrap;justify-content:space-between;gap:8px;margin:0 0 10px;padding:8px 10px;border:1px solid #C4D7EA;background:#EEF5FC;font-size:.857143rem;color:#315170}

.contact-link{border:0;background:none;padding:0;color:var(--link);font:inherit;text-decoration:underline;cursor:pointer}.contact-link:focus-visible{outline:2px solid #2B6CB0;outline-offset:2px}#messageBody{display:block;width:100%;margin:8px 0 14px;font:inherit}

/* 登入時在視窗內閱讀條款 */
.terms-dialog{width:min(720px,100%)}
.terms-scroll{max-height:55vh;overflow-y:auto;border:1px solid var(--line);padding:12px 16px;background:#fff;overscroll-behavior:contain}
.terms-section h3{font-size:1rem;color:var(--banner-a);margin:12px 0 6px}
.terms-section:first-child h3{margin-top:0}
