:root{--g:#2f6b3a;--ink:#1f2937;--mut:#5b6472;--line:#d9dee5;--bad:#b42318;--ok:#1d6b34;--bg:#f6f7f9}
*{box-sizing:border-box}
body{margin:0;font:16px/1.5 "Noto Sans TC","Microsoft JhengHei","Segoe UI",Arial,sans-serif;color:var(--ink);background:var(--bg)}
.top{background:#fff;border-bottom:1px solid var(--line);padding:10px 16px;display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between}
.top .vi,.vi{color:var(--mut);font-weight:400;font-size:.85em}
.who{display:flex;gap:8px;align-items:center;font-size:14px}.inline{display:inline;margin:0}
.trial{background:#fff4e5;color:#7a3e00;border-top:1px solid #f3c78b;padding:6px 16px;font-size:13px;margin-top:24px}
main{max-width:1100px;margin:0 auto;padding:12px 16px 40px}
.card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:14px;margin-bottom:12px}
.card.center{text-align:center}
h2,h3{margin:0 0 10px;font-size:18px}h3{font-size:16px}
.stack{display:grid;gap:10px;max-width:420px}.stack label{display:grid;gap:4px;font-size:14px}
select{max-width:100%}input,select,button,.btn{font:inherit;border:1px solid var(--line);border-radius:8px;padding:8px 10px;min-height:44px;background:#fff;color:var(--ink)}
button,.btn{border-color:var(--g);color:var(--g);cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center}
button.pri,.pri{background:var(--g);color:#fff}button:disabled{opacity:.5;cursor:wait}
.row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:12px 0}
.punch{min-height:96px;font-size:22px;font-weight:700;line-height:1.2;flex-direction:column}.punch small{font-size:14px;font-weight:400}
.big{font-size:40px;font-weight:700;margin:4px 0;font-variant-numeric:tabular-nums}
.muted{color:var(--mut);font-size:14px}
.err{background:#fdecec;color:var(--bad);border-left:4px solid var(--bad);padding:8px 12px;border-radius:6px}
.warn{background:#fff4e5;border-left:4px solid #e08a00;padding:8px 12px;border-radius:6px;font-size:14px}
.remind{background:#e8f1ff;border-left:4px solid #2563eb;padding:10px 12px;border-radius:6px;font-weight:600}
.ok-box{background:#ecf8ef;border-left:4px solid var(--ok);padding:8px 12px;border-radius:6px;text-align:left}
.pill{display:inline-block;padding:0 8px;border-radius:999px;font-size:12px;border:1px solid;white-space:nowrap}
.pill.bad{color:var(--bad);border-color:#f2b8b5;background:#fdecec}.pill.ok{color:var(--ok);border-color:#9fd3ad;background:#ecf8ef}.pill.mut{color:var(--mut);border-color:var(--line);background:#f2f4f7}
.tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}.tabs button{min-height:40px;font-size:14px}.tabs button[aria-selected=true]{background:var(--g);color:#fff}
.tbl{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:14px}th,td{border:1px solid var(--line);padding:5px 7px;text-align:left;vertical-align:top}th{background:#f2f4f7;white-space:nowrap}
.plist{padding-left:18px;margin:0;text-align:left}
.site{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}.site input{width:130px}.site .sn{width:160px}
code{font-size:15px;background:#f2f4f7;padding:1px 6px;border-radius:4px}
@media (max-width:480px){.big{font-size:34px}.punch{font-size:20px}}
.note{background:#eef6ff;border-left:4px solid #2563eb;padding:8px 12px;border-radius:6px;font-size:14px}
.row4{grid-template-columns:1fr 1fr}.row4 .punch{min-height:78px;font-size:19px}
details.ref{border-top:1px solid #e3e8e3;padding:8px 0}details.ref summary{cursor:pointer;padding:4px 0;font-size:17px}details.ref p{margin:8px 0}
.edays{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px;margin:8px 0}.eday{border:1px solid #cfd8cf;border-radius:8px;padding:8px;display:block}.eday.wkend{background:#f6f6f2;color:#777}.eday small{display:block;color:#2d6a3a}
.ulist{display:flex;flex-direction:column;gap:6px}.urow{display:flex;gap:10px;justify-content:space-between;align-items:center;border:1px solid #dfe6df;border-radius:8px;padding:8px 10px}.urow.off{background:#f5f5f2}.uinfo{min-width:0;line-height:1.45}.uact{display:flex;flex-wrap:wrap;gap:4px;justify-content:flex-end;flex:0 0 auto;max-width:46%}.uact button{padding:4px 8px;font-size:13px}@media(min-width:1000px){.ugrid{display:grid;grid-template-columns:3fr 2fr;gap:14px;align-items:start}.ugrid>section:last-child{position:sticky;top:8px}}@media(max-width:560px){.urow{flex-direction:column;align-items:stretch}.uact{max-width:none;justify-content:flex-start}}
.uact{flex-direction:column;align-items:stretch;max-width:none}.uact button{white-space:nowrap}#uf label:has(input[type=checkbox]){display:flex;gap:8px;align-items:flex-start}#uf input[type=checkbox]{width:20px;height:20px;min-height:0;flex:0 0 20px;margin-top:3px}
.uact{flex-direction:row;flex-wrap:nowrap;align-items:center}.uact button{min-height:30px;height:auto;padding:3px 8px;font-size:13px;line-height:1.3}
.urow{flex-direction:column;align-items:stretch;gap:6px}.uact{justify-content:flex-start;flex-wrap:wrap}@media(min-width:1000px){.ugrid{grid-template-columns:5fr 3fr}}
.uact button.danger{color:#a33;border-color:#d9a5a5}
.uhead{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between}.usort{font-size:13px;font-weight:400;display:flex;flex-wrap:wrap;gap:4px;align-items:center}.usort button{min-height:28px;padding:2px 8px;font-size:13px}.usort button[aria-pressed=true]{background:#2d6a3a;color:#fff}
.sched{margin:8px 0;border:1px solid #dfe6df;border-radius:8px;padding:6px 10px}.schedf{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:flex-end;margin-top:8px}.schedf select[multiple]{min-width:180px}
.punch.done,.punch.done:disabled{background:#e9ece9;color:#7a857a;border-color:#cfd6cf;cursor:not-allowed;opacity:1}.punch .pdone{display:block;font-size:13px;margin-top:2px}
#viewer{position:fixed;inset:0;z-index:1000;background:rgba(20,24,20,.92);display:flex;flex-direction:column}#viewer .vbar{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:10px 12px;padding-top:max(10px,env(safe-area-inset-top));background:#1f2a1f}#viewer .vbar a{color:#fff}#viewer .vclose{min-height:44px;font-size:18px;padding:6px 16px;background:#fff;color:#1f2a1f;border-radius:22px}#viewer .vbody{flex:1;overflow:auto;-webkit-overflow-scrolling:touch;padding:8px}#viewer .vbody img{width:100%;max-width:1100px;display:block;margin:0 auto;background:#fff}#viewer .vbar{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right));position:sticky;top:0;z-index:1}#viewer .vdl{font-size:16px;text-decoration:underline;padding:10px 4px}#viewer.v-pdf .vbody,#viewer.v-page .vbody{padding:0;display:flex}#viewer iframe{flex:1;width:100%;min-height:0;border:0;background:#fff}
.cyear{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}.cmon{border:1px solid #dfe6df;border-radius:8px;padding:8px}.cmon.cnow{border-color:#2d6a3a;box-shadow:0 0 0 2px #2d6a3a33}.cmon h4{margin:0 0 6px}.cgrid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;text-align:center;font-size:13px}.cgrid i{font-style:normal;font-size:10px;color:#777}.cgrid span{padding:4px 0;border-radius:4px}.c-wk{color:#999}.c-off{background:#fde2e2;color:#a32}.c-work{background:#ffe8c7;color:#8a4b00}.c-coff{background:#f7c9c9;color:#811}.c-cwork{background:#d8ecff;color:#124}.c-today{outline:2px solid #2d6a3a}.clegend span{display:inline-block;padding:2px 8px;border-radius:4px;font-size:13px;margin:2px}.cnotes{margin:6px 0 0;padding-left:16px;font-size:13px}
.cpast{margin-top:12px}.cpast summary{cursor:pointer;padding:6px 0}
.cgrid span.c-wk{background:#fde2e2;color:#a32}.cgrid span.c-cwork{background:none;color:inherit}.cgrid span.c-today,.clegend .c-today{background:#2b6cb0;color:#fff;outline:none;font-weight:700}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:8px}@media(max-width:480px){.row2{grid-template-columns:1fr}}
.edays.wk{grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}.edays.wk>i{font-style:normal;font-size:11px;text-align:center;color:#666;line-height:1.2}.edays.wk .eday{padding:6px 2px;text-align:center;font-size:14px;display:flex;flex-direction:column;align-items:center;gap:2px;min-height:58px;justify-content:center}.edays.wk .eday small{font-size:10px;color:#2d6a3a}.eday.past{background:#eee;color:#aaa;border:1px solid #e3e3e3;border-radius:8px}.eday.etoday{border-color:#2b6cb0;border-width:2px}
.stack label:has(>input[type=checkbox]){display:flex;gap:8px;align-items:flex-start}.stack input[type=checkbox]{width:20px;height:20px;min-height:0;flex:0 0 20px;margin-top:3px}.stack,.stack label{min-width:0;max-width:100%}.stack input,.stack select,.stack button{max-width:100%;min-width:0;box-sizing:border-box}
.board .bnums{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;text-align:center}.board .bnums div{border:1px solid #dfe6df;border-radius:10px;padding:8px 2px}.board .bnums b{display:block;font-size:30px;line-height:1.1}.board .bnums span{font-size:12px;color:#555}.board .g b{color:#2d6a3a}.board .y b{color:#9a6b00}.board .r b,.board p.r{color:#b22}
#latecard .bnums{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;text-align:center}#latecard .bnums div{border:1px solid #dfe6df;border-radius:10px;padding:6px 2px}#latecard .bnums b{display:block;font-size:24px}#latecard .bnums span{font-size:12px;color:#555}#latecard .g b{color:#2d6a3a}#latecard .r b{color:#b22}
.ott th,.ott td{font-size:12px;text-align:center;vertical-align:top;min-width:58px}.ott td:first-child,.ott th:first-child{text-align:left;min-width:110px;position:sticky;left:0;background:#fff}.ott .off{background:#fbecec}.ott .tdy{outline:2px solid #2b6cb0}.ott .fut{background:#f4f8ff}.ott span{display:block;border-radius:4px;margin:1px 0;padding:0 2px}.otp{background:#e8f1ea;color:#2d6a3a}.ota{background:#2d6a3a;color:#fff}.otn{background:#eee;color:#888}.otu{background:#ffe1e1;color:#a22}.oth{font-weight:700}
#companyrules mark{background:#fff3a3;color:inherit;padding:0 2px;border-radius:3px;font-weight:700}
@media print{header,#tabs,.trial,#otview p,#otview button,#otview select,.remind{display:none!important}#otview{box-shadow:none;border:0}.ott{font-size:10px}.tbl{overflow:visible}}
#printdoc{display:none}
@media print{@page{size:A4 landscape;margin:8mm}
 body.printing>*:not(#printdoc){display:none!important}body.printing{background:#fff}
 body.printing #printdoc{display:block;font-family:inherit;color:#000}
 .pd-head{text-align:center;margin-bottom:3mm}.pd-head h1{font-size:15pt;margin:1mm 0}.pd-head b{font-size:10pt}.pd-head div{font-size:9pt}
 table.pd{width:100%;border-collapse:collapse;table-layout:fixed;font-size:9pt}table.pd th,table.pd td{border:.3pt solid #555;text-align:center;padding:.6mm .2mm;line-height:1.15;word-break:keep-all}
 table.pd .nm{width:27mm;text-align:left;font-size:9pt}table.pd th:last-child,table.pd td.tt{width:13mm}table.pd .off{background:#e6e6e6;-webkit-print-color-adjust:exact;print-color-adjust:exact}
 table.pd tr{page-break-inside:avoid}.pd .pe{font-weight:700}.pd .pp{font-weight:700}
 .pd-foot{margin-top:3mm;font-size:7.5pt;display:flex;justify-content:space-between;gap:8mm}.pd-foot .sig{white-space:nowrap;align-self:flex-end;font-size:9pt}}
.pick{position:relative;display:flex;flex-direction:column;gap:2px}#supanel{position:absolute;top:100%;left:0;z-index:20;background:#fff;border:1px solid #cfd8cf;border-radius:8px;padding:8px 10px;box-shadow:0 6px 18px #0002;min-width:240px;max-height:60vh;overflow:auto}#supanel fieldset{border:0;border-top:1px solid #eee;padding:4px 0;margin:0}#supanel legend{font-weight:700;padding:0}#supanel label{display:flex;gap:6px;align-items:center;padding:3px 0}#supanel input[type=checkbox]{width:18px;height:18px}
.stiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px;margin:8px 0}.stile{border:1px solid #dfe6df;border-radius:10px;padding:8px;text-align:center;background:#fff}.stile b{display:block;font-size:26px;line-height:1.15}.stile b small{font-size:12px;font-weight:400;margin:0 1px}.stile span{display:block;font-size:12px;color:#444}.stile>small{display:block;font-size:11px;color:#777}.stile.g b{color:#2d6a3a}.stile.r b{color:#b22}
.sgrid{border-collapse:collapse;font-size:10px}.sgrid th,.sgrid td{border:1px solid #e3e6e3;padding:2px 0;min-width:20px;text-align:center}.sgrid th:first-child{min-width:34px}
.st-ok{background:#cfe9d4}.st-late{background:#ffe08a}.st-partial{background:#ffd1a6}.st-absent{background:#f6b4b4}.st-off{background:#eee;color:#aaa}.st-nodata{background:#fafafa;color:#ccc}.st-today{outline:2px solid #2b6cb0}.st-future{color:#bbb}.st-none{background:#fff;border-color:#fff!important}
[class*=st-lv-]{background:#d9c8f0}.st-lv-annual{background:#9fd3f0}.st-lv-sick{background:#a9c6f5}.st-lv-personal{background:#e9b8f0}.st-lv-other{background:#ddd0c0}
.slegend span{display:inline-block;padding:1px 6px;margin:2px;border-radius:4px;font-size:12px}.sall tr[data-su]{cursor:pointer}.sall tr.sel{background:#eef6ef}
.stile .up{color:#b22}.stile .dn{color:#2d6a3a}.stile .eq{color:#888}.stile>small{line-height:1.3;margin-top:2px}.sty{font-size:15px;padding:2px 6px}
.lvt th[data-ls]{cursor:pointer;white-space:nowrap}.lvt tr.pend{background:#fff8e1}
.stile.c-ok{background:#cfe9d4;border-color:#9cd0a7}.stile.c-late{background:#ffe08a;border-color:#e8c45a}.stile.c-absent{background:#f6b4b4;border-color:#e08a8a}.stile.c-off{background:#eee}.stile.c-work{background:#dfe8f5;border-color:#b8c9e3}.stile.st-lv-annual{background:#9fd3f0;border-color:#78b9de}.stile.st-lv-sick{background:#a9c6f5}.stile.st-lv-personal{background:#e9b8f0}.stile.st-lv-bereavement{background:#c9d6c0}.stile.st-lv-menstrual{background:#f7c9c9}.stile[class*=st-lv-] b,.stile.c-ok b,.stile.c-late b,.stile.c-absent b{color:#222}
.stile.c-off b,.stile.c-work b{color:#222}
.st-awol{background:#b33;color:#fff}.stile.c-awol{background:#f3c2c2;border-color:#c66}.stile.c-awol b{color:#a11}.abst td,.abst th{font-size:13px}.abst tr.ab-suspected{background:#ffe2e2}.abst tr.ab-confirmed{background:#f2c4c4}.abst select{max-width:150px}
.board .bnums div{background:#dfe8f5;border-color:#b8c9e3}.board .bnums div.g{background:#cfe9d4;border-color:#9cd0a7}.board .bnums div.y{background:#ffe08a;border-color:#e8c45a}.board .bnums div.r{background:#f6b4b4;border-color:#e08a8a}.board .bnums b{color:#1d2a1d!important}.board .bnums span{color:#333}#latecard .bnums div{background:#dfe8f5;border-color:#b8c9e3}#latecard .bnums div.g{background:#cfe9d4;border-color:#9cd0a7}#latecard .bnums div.r{background:#f6b4b4;border-color:#e08a8a}#latecard .bnums b{color:#1d2a1d}
.punch.wait,.punch.wait:disabled{background:#f4f4f2;color:#9a9a9a;border-style:dashed;cursor:not-allowed;opacity:1}
.pthumb{width:56px;height:56px;object-fit:cover;border-radius:6px;border:1px solid #ccc;margin:3px 4px 0 0;vertical-align:top}.proofdue{margin:6px 0;padding:6px 8px}.proofadd{margin:4px 0}label.up{display:inline-block;padding:6px 10px;border:1px dashed #2d6a3a;border-radius:8px;color:#2d6a3a;cursor:pointer;font-size:14px;margin-top:4px}
.top .brand{font-size:1.15em;letter-spacing:1px;color:#1f3d2a}
.stiles.small .stile b{font-size:17px}.stiles.small{grid-template-columns:repeat(auto-fill,minmax(110px,1fr))}
.board .bup{margin-top:8px;padding:8px 10px;border:1px dashed #e8c45a;border-radius:10px;background:#fffaf0}.board .bup ul{margin:4px 0 0;padding-left:1.2em}.board .bup li{margin:2px 0}
.board .bup .pend{font-size:.85em;color:#8a5a00;background:#ffe9b0;border-radius:8px;padding:0 6px}
.rqcancel.warn{background:#b3261e;color:#fff;border-color:#b3261e}
button.warn[data-ok]{background:#b3261e;color:#fff;border-color:#b3261e}
/* menu by category: on top on a phone, a left column on a wide screen (Green 2026-10-05) */
.tabs .tgrp{display:flex;flex-wrap:wrap;gap:6px;align-items:center;width:100%}.tabs .tgrp h4{margin:0;width:100%;font-size:12px;font-weight:600;color:var(--mut);letter-spacing:.02em}
@media (min-width:900px){main.app{max-width:1400px;display:grid;grid-template-columns:230px minmax(0,1fr);gap:18px;align-items:start}main.app>.err{grid-column:1/-1}
  main.app>.tabs{position:sticky;top:8px;flex-direction:column;flex-wrap:nowrap;gap:14px;margin:0;background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px 8px;max-height:calc(100vh - 16px);overflow:auto}
  main.app>.tabs .tgrp{flex-direction:column;flex-wrap:nowrap;align-items:stretch;gap:2px}main.app>.tabs .tgrp+.tgrp{border-top:1px solid var(--line);padding-top:12px}main.app>.tabs .tgrp h4{padding:0 8px 4px}
  main.app>.tabs button{display:block;text-align:left !important;justify-content:flex-start;border:0;background:transparent;border-radius:8px;padding:8px 10px;min-height:38px;width:100%;color:var(--ink)}main.app>.tabs button:hover{background:#eef3ee}
  main.app>.tabs button[aria-selected=true]{background:#e3efe5;color:var(--g);font-weight:700}
  main.app>.tabs a.erplink{border:0;background:#e8f1f5;color:#084f66;border-radius:8px;padding:8px 10px;min-height:38px;width:100%}main.app>.tabs a.erplink:hover{background:#d7e8ef}}
@media print{main.app{display:block}}
.sreview{margin-top:12px;border:2px solid #e8c45a;border-radius:10px;padding:12px;background:#fffdf5}.sreview.done{border-color:#9cd0a7;background:#f4fbf5}.sreview h3{margin:0 0 6px}.sreview .snew{background:#cfe9d4;color:#1d6b34;font-weight:700}.sreview .schg{background:#ffe08a;color:#7a3e00;font-weight:700}.sreview .sact{margin:12px 0 0}
.sreview .exn{color:var(--bad);font-weight:600}

.dayp { color: #555; }
.dayp.bad { color: #b00020; font-weight: 600; }

.askbox { border: 2px solid #b26a00; background: #fff8e8; }
.askbox h3 { color: #8a4b00; }
.asknote { font-weight: 600; white-space: pre-wrap; }
.askst { color: #555; }
.askst.open { color: #8a4b00; }
button.askbtn { font-size: .85em; padding: .2em .5em; }

.corr { color: #8a4b00; }

.todobox ul { margin: .3em 0 0 1.1em; padding: 0; }
.todobox li { margin: .35em 0; }
.todobox .vi { color: #555; font-size: .92em; }

/* phone: menu folded behind the ☰ button at the top right (Green 2026-10-05 17:12) */
#navbtn{font-weight:700}
.navcur{margin:0 0 8px;font-size:13px;color:var(--mut)}
@media (max-width:899px){main.app:not(.navopen)>.tabs{display:none}main.app.navopen>.navcur{display:none}}
@media (min-width:900px){#navbtn,.navcur{display:none}}
@media print{#navbtn,.navcur{display:none!important}}

.todobox .todogo{display:block;width:100%;text-align:left;background:transparent;border:0;padding:6px 4px;font:inherit;color:inherit;min-height:44px;border-radius:8px;white-space:normal;font-weight:400}
.todobox .todogo:hover,.todobox .todogo:focus-visible{background:#fdeccb}
.todobox .lateack{margin:2px 0 6px 4px;min-height:40px;padding:6px 12px;font-size:.92em}
.todobox .todogo .go{color:#8a4b00;font-weight:700;white-space:nowrap}
#fixf.flash{outline:3px solid #b26a00;outline-offset:6px;border-radius:8px}

.askbox .askcancel.warn{background:#b3261e;color:#fff;border-color:#b3261e}

/* 申請審核 on a phone: one card per request, fields under each other (Green 2026-10-05 19:15) */
@media (max-width:700px){
  #apend .tbl,#adone .tbl{overflow:visible}
  #apend table,#adone table,#apend tbody,#adone tbody{display:block;width:100%;border:0}
  #apend tr,#adone tr{display:block;border:1px solid var(--line);border-radius:10px;padding:8px 10px;margin:0 0 10px;background:#fff}
  #apend tr:has(th),#adone tr:has(th){display:none}
  #apend td,#adone td{display:block;border:0;padding:4px 0;white-space:normal}
  #apend td[data-l]::before,#adone td[data-l]::before{content:attr(data-l);display:block;font-size:12px;color:var(--mut)}
  #apend td.act,#adone td.act{display:flex;flex-wrap:wrap;gap:8px;padding-top:8px}
  #apend td.act button,#adone td.act button{flex:1 1 30%;min-height:44px}
}

.fixnote{display:block;color:#8a4b00;font-weight:600;margin-top:4px}

#lvf.flash{outline:3px solid #b26a00;outline-offset:6px;border-radius:8px}

.eday.pastok{background:#fff8e8;border-color:#e2c27a}.eday .bk{display:block;color:#8a4b00;font-size:11px}
.otpost{display:block;background:#fff4e5;color:#7a3e00;border-radius:6px;padding:2px 6px;margin-top:2px;font-size:12px}
#plancard.flash{outline:3px solid #b26a00;outline-offset:6px;border-radius:8px}

.otsum{display:block;font-size:15px;color:#1f3a24}.otl{display:block;background:#eaf1fb;color:#1f4f8a;border-radius:6px;padding:2px 6px;margin-top:2px;font-size:12px}
.ottot span{display:block;margin-bottom:3px}.ottot b{white-space:nowrap}

/* lunch buttons: smaller than 上班 / 下班, with the rule under them (Green 2026-10-05 22:49) */
.row4 .punch.lunchb{min-height:44px;font-size:14px;font-weight:600;padding:4px 8px;line-height:1.15;flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:baseline;column-gap:6px}.row4 .punch.lunchb br{display:none}.row4 .punch.lunchb small{font-size:12px}.row4 .punch.lunchb .pdone{font-size:11px;margin:1px 0 0;flex-basis:100%}
.lunchrule{margin:8px 0 0;padding:8px 12px;background:#f6f8f6;border:1px solid var(--line);border-radius:8px;font-size:13px;color:#445}
.lunchrule ul{margin:4px 0 6px 1.1em;padding:0}.lunchrule li{margin:3px 0}.lunchrule p{margin:4px 0 0}.lunchrule .vi{color:#667;font-size:12px}

.chanbox{margin:10px 0;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:#fafcfa}.chanbox p{margin:6px 0}.chanbox input[type=email]{max-width:260px}
.lcode{font-size:26px;letter-spacing:4px;font-family:ui-monospace,monospace}

/* 電子考勤表 */
.sht td,.sht th{padding:6px 8px;vertical-align:top}.sht tr.off td{background:#f7f7f3;color:#777}.sht tr.na td{color:#aaa}.sht td:nth-child(4){white-space:nowrap}
.shtot{margin:10px 0;padding:8px 10px;background:#f6f8f6;border-radius:8px}.shconf{border-top:1px solid var(--line);margin-top:10px;padding-top:8px}
@media print{#shstat,.shconf,#shym,#shprint,#shme,#navbtn,.navcur{display:none!important}.sht{font-size:11px}}

/* 薪資 (2026-10-06) */
.num{text-align:right;white-space:nowrap}.slip{border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin:10px 0}.slip h4{margin:0 0 6px}.slip2{display:grid;grid-template-columns:1fr 1fr;gap:12px}.slip2 table{width:100%}.slip tr.sum td,.payt tr.sum td{border-top:2px solid var(--line);font-weight:600}.slip .net{font-size:1.1em;margin:10px 0 0}
.payt input,.payp input{width:6.5em}.payt .pn{width:10em}.payp .pbt{width:4.5em}.payact{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
@media (max-width:700px){.slip2{grid-template-columns:1fr}}
/* print (Green 2026-10-06 12:08): the company's paper 薪資明細 -- admin / accountant: every person, two copies a page; an employee: the own slip */
.printonly{display:none}.payp .pdp,.payp .ptl{width:7em}
@media print{@page{size:A4 portrait;margin:9mm}
#payme,#payflow,#payprof,.trial{display:none!important}.printonly{display:block}
.ppage{break-after:page;page-break-after:always}.ppage:last-child{break-after:auto;page-break-after:auto}.pcut{border-top:1px dashed #666;margin:7mm 0}
.pslip{font-size:10px;color:#000;break-inside:avoid;page-break-inside:avoid}.pslip table{width:100%;border-collapse:collapse}.pslip th,.pslip td{border:1px solid #000;padding:3px 5px;vertical-align:middle;font-weight:400;text-align:left;height:19px}
.pslip th{text-align:center;background:#f2f2f2}.pslip td.num{text-align:right;font-size:12px}.pco{font-size:16px;font-weight:700;text-align:center;border:1px solid #000;border-bottom:0;padding:3px}.pti{font-size:13px;text-align:center;border:1px solid #000;border-bottom:0;padding:2px}
.pslip table{table-layout:fixed}.phead td{text-align:center}.phead th{line-height:1.25}.pmain{margin-top:-1px}.pmain .pnote{font-size:9px}.pmain .pnet{font-size:17px;font-weight:700}.pmain .psig{vertical-align:top;height:34px;line-height:1.35}.pmain .psig small{font-size:8.5px}}
.preg{margin:8px 0}.preg .pco{font-weight:700;text-align:center}.preg .pti{text-align:center;margin-bottom:4px}.preg table{border-collapse:collapse;font-size:12.5px}.preg th,.preg td{border:1px solid #999;padding:4px 6px}.preg th{font-weight:400;background:#f6f6f2;white-space:normal;word-break:break-word;min-width:4.2em;line-height:1.25}.preg th small{font-size:.8em;color:#555}.preg td{white-space:nowrap}.preg td.pb1{font-weight:700}.preg tr.sum td{font-weight:700;border-top:2px solid #333}.psign{display:flex;gap:18%;margin-top:8px;font-size:13px}
@page reg{size:A4 landscape;margin:8mm}
@media print{body[data-print=reg] #paypaper{display:none!important}body:not([data-print=reg]) #payregp{display:none!important}#payregp{page:reg}#payregp .preg table{width:100%;font-size:9.5px;table-layout:fixed}#payregp .preg th{min-width:0;font-size:8.5px}#payregp .preg td:first-child{white-space:normal}#payregp .preg th,#payregp .preg td{border:1px solid #000;padding:3px 4px}#payregp .tbl{overflow:visible}#payregp .pco{font-size:16px;border:0}#payregp .pti{font-size:13px;border:0}}
.inst{border-collapse:collapse;font-size:14px}.inst th,.inst td{border:1px solid #cfd6dd;padding:4px 9px;text-align:right;white-space:nowrap}.inst th{text-align:center;font-weight:600;background:#eef4fb}.inst th.hc{background:#1f5fa8;color:#fff}.inst th.he{background:#c62828;color:#fff}.inst td.g{font-weight:700;background:#fff8e6;text-align:left}.inst td.t{color:#1f5fa8;font-weight:600;background:#f3f8fe}.inst td.e{background:#fff5f5}.inst td.t.e{color:#c62828}
/* 薪資調整表: the open-items column was so narrow that its pills wrapped and made every row very tall (Green 2026-10-06 12:26) */
.payt td{vertical-align:middle;padding-top:4px;padding-bottom:4px}.payt td:nth-last-child(2){min-width:26em}.payt td:nth-last-child(2) .pill{display:inline-block;margin:1px 2px 1px 0}.payt td:last-child{white-space:nowrap}
/* 訂便當 (2026-10-06) */
.bday{border:1px solid var(--line);border-radius:10px;padding:8px 12px;margin:8px 0}.bday.now{border-color:#2f6b3a;box-shadow:0 0 0 2px #dfeee2}.bday h4{margin:0 0 6px}.bopts{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0}.bpick small{opacity:.75}.bman{margin-top:6px}.bmenu p{margin:4px 0}.bmenu .bn{width:14em}.bmenu .bp{width:6em}
.bclose{background:#f6f8f6;border-radius:8px;padding:8px 10px;margin:8px 0;line-height:1.9}
.bpic{margin:8px 0}.bpic img{max-width:100%;width:520px;border:1px solid var(--line);border-radius:8px;margin-top:6px}
.bup{margin:8px 0}
/* 訂便當 calendar (Green 2026-10-06 13:11) */
.btoday{border:2px solid #2f6b3a;border-radius:12px;padding:10px 14px;margin:8px 0 14px;background:#f6fbf7}.btoday h4{margin:0 0 6px;font-size:1.1em}.bnav{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.bcal{border-collapse:collapse;width:100%;table-layout:fixed;min-width:560px}.bcal th{background:#eef4ee;padding:5px;border:1px solid var(--line);font-weight:600}.bcell{border:1px solid var(--line);padding:6px 8px;vertical-align:top;height:78px;cursor:pointer;line-height:1.5}
.bcell.past,.bcell.none{background:#f4f4f1;color:#b5b5ae;cursor:default}.bcell.nomenu{color:#999}.bcell.now{background:#f1f8f2;box-shadow:inset 0 0 0 2px #2f6b3a}.bcell.sel{box-shadow:inset 0 0 0 2px #1f5fa8;background:#f2f7fd}.bcell:not(.past):not(.none):hover{background:#f7faf7}.bsp{font-weight:600}
@media (max-width:600px){.bcal{min-width:0;font-size:.82em}.bcal th{padding:3px 1px;font-size:.9em}.bcell{padding:4px 3px;height:86px;word-break:break-all}.bcell .pill{padding:0 4px;font-size:.9em;white-space:normal;display:inline-block;line-height:1.3}}
/* the month's specials and the standing menu side by side (Green 2026-10-06 13:34) */
.bpics{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-start}.bpics figure{margin:0;flex:1 1 280px;max-width:520px}.bpics figcaption{font-weight:600;margin-top:6px}.bpics img{width:100%}
/* fold arrows on long content (Green 2026-10-06 13:56) */
.fhead{cursor:pointer;user-select:none}.fhead::before{content:'▾';display:inline-block;width:1.1em;color:#2f6b3a;transition:transform .15s}.folded>.fhead::before{transform:rotate(-90deg)}@media print{.fhead::before{content:none}}.folded>.fhead{margin-bottom:0}
@media screen{.folded>:not(.fhead){display:none!important}}
/* the smaller open/close blocks inside a card use the same arrow as the card headings (Green 2026-10-12 16:09) */
details>summary{list-style:none;cursor:pointer}details>summary::-webkit-details-marker{display:none}details>summary::before{content:'▾';display:inline-block;width:1.1em;color:#2f6b3a;transition:transform .15s;transform:rotate(-90deg)}details[open]>summary::before{transform:none}@media print{details>summary::before{content:none}}
/* in-page text box and message instead of prompt() / alert() (Green 2026-10-06 15:43) */
.askdlg{position:fixed;inset:0;background:rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center;z-index:50;padding:14px}.askin{background:#fff;border-radius:12px;padding:16px;width:100%;max-width:440px}.askin textarea{width:100%;font:inherit;padding:8px;border:1px solid var(--line);border-radius:8px}
.toast{position:fixed;left:12px;right:12px;top:12px;z-index:60;padding:12px 14px;border-radius:10px;box-shadow:0 4px 16px rgba(0,0,0,.25);font-weight:600;max-width:640px;margin:0 auto}.toast.good{background:#e9f6ec;border:1px solid #58a868;color:#1d4d27}.toast.bad{background:#fdecea;border:1px solid #d9534f;color:#8a1f1b}
/* 人資 (2026-10-12) */
.hrset{border:1px solid #dfe6df;border-radius:8px;margin:0 0 12px;padding:8px 12px 12px;min-width:0}.hrset legend{font-weight:600;padding:0 6px}.hrgrid{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.hrgrid label{display:grid;gap:4px;font-size:14px;align-content:start}.hrgrid input,.hrgrid select,.hrgrid textarea{width:100%;min-width:0}.vi{color:var(--mut);font-size:.9em}.req{color:var(--bad)}
.hrgrid label.miss input,.hrgrid label.miss select{border-color:var(--bad);background:#fff8f7}.hrdeps{width:100%;min-width:560px;border-collapse:collapse}.hrdeps th{font-size:13px;text-align:left;padding:2px 4px}.hrdeps td{padding:2px 4px}.hrdeps input{width:100%;min-width:0}
.hrdoc{border:1px solid #dfe6df;border-radius:8px;padding:8px 10px;margin:0 0 8px}.hrdoc.miss{border-color:#f2b8b5;background:#fffafa}.hrfiles{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0}.hrfile{display:grid;gap:2px;justify-items:start;font-size:12px}
.hrfile .pthumb{width:84px;height:84px;margin:0}.pdfico{display:grid;place-items:center;width:84px;height:84px;border:1px solid #ccc;border-radius:6px;background:#fdecec;color:#b3261e;font-weight:700}.hrrm{font-size:12px;padding:2px 8px;min-height:0}
.hrda{display:flex;flex-wrap:wrap;gap:10px;align-items:center}.hrna{display:inline-flex;gap:6px;align-items:center;font-size:14px}.hrna input{width:20px;height:20px;min-height:0}
.btnlink{display:inline-block;margin-top:6px;padding:8px 14px;border-radius:8px;background:#2d6a3a;color:#fff;text-decoration:none;font-weight:600}.hrgrid input:disabled,.hrgrid select:disabled,.hrgrid textarea:disabled,.hrdeps input:disabled{background:#f1f3f1;color:#333}
/* 假期額度 (2026-10-12) */
.qline{margin:6px 0;padding:6px 10px;border-left:4px solid #2d6a3a;background:#f1f7f2;border-radius:6px;font-size:14px;text-align:left}.qline.over,.qline.need{border-left-color:var(--bad);background:#fdecec;color:#8c1d18}.qtbl{margin:0 0 12px}.qtbl summary{cursor:pointer;font-weight:600;padding:6px 0}.qtbl tr.over td{background:#fdecec}.evform{margin:6px 0;padding:8px;border:1px dashed #b3261e;border-radius:8px;background:#fff}.evfix{font-size:13px;padding:2px 10px;min-height:0}
/* 人資 parts 2 / 3 / 5 */
.hrnav button[aria-pressed=true]{background:#2d6a3a;color:#fff;border-color:#2d6a3a}.voided td{text-decoration:line-through;color:var(--mut)}.voided td small{text-decoration:none;display:inline-block}.insform{margin-top:10px;align-items:end}.insform p{margin:0}
.chk{display:flex;gap:10px;align-items:flex-start;padding:6px 0;border-bottom:1px solid #eef1ee}.chk input{width:22px;height:22px;min-height:0;flex:0 0 22px;margin-top:2px}.chkbox{flex:0 0 22px;font-size:20px;line-height:1.1;color:var(--mut)}.chk.done .chkbox{color:var(--ok)}.chk.done .chkt{color:#3b5a41}
/* 鼓勵 (2026-10-12) */
#cheer{position:fixed;inset:0;z-index:1000;display:grid;grid-template-columns:minmax(0,1fr);place-items:center;padding:16px;overflow:auto;box-sizing:border-box;background:radial-gradient(circle at 50% 30%,rgba(60,20,90,.86),rgba(8,10,30,.94))}#cheerfx{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.cheercard{position:relative;box-sizing:border-box;width:100%;max-width:420px;text-align:center;color:#fff;border-radius:22px;padding:22px 20px 20px;background:linear-gradient(160deg,#d9480f,#c2255c 55%,#862e9c);box-shadow:0 18px 60px rgba(0,0,0,.5),inset 0 0 0 2px rgba(255,255,255,.25);animation:cheerpop .5s cubic-bezier(.2,1.5,.4,1)}
.cheercard.k-ontime{background:linear-gradient(160deg,#1971c2,#0c8599 55%,#2b8a3e)}.cheercard.k-week{background:linear-gradient(160deg,#e67700,#d9480f 60%,#c92a2a)}.cheercard.k-month{background:linear-gradient(160deg,#e8a400,#e67700 50%,#c2255c)}
@keyframes cheerpop{0%{transform:scale(.4);opacity:0}100%{transform:scale(1);opacity:1}}@media (prefers-reduced-motion:reduce){.cheercard{animation:none}}
.cheerico{font-size:54px;line-height:1.1}.cheernum{font-size:96px;font-weight:900;line-height:1;letter-spacing:2px;text-shadow:0 4px 0 rgba(0,0,0,.25),0 0 28px rgba(255,235,150,.75);color:#fff7d6}
.cheercard h2{margin:8px 0 2px;font-size:26px}.cheervi{margin:0 0 10px;font-size:17px;opacity:.95}.cheersub{margin:0 0 12px;font-size:15px;line-height:1.5}.cheersub span,.cheernext span{opacity:.9;font-size:.92em}
.cheernext{margin:0 0 14px;padding:8px 10px;border-radius:12px;background:rgba(255,255,255,.16);font-size:15px}.cheerok{width:100%;min-height:52px;border:0;border-radius:14px;background:#fff;color:#c2255c;font-size:18px;font-weight:800;cursor:pointer}
.bdgrow h4{margin:10px 0 6px;font-size:15px}.bdgs{display:flex;flex-wrap:wrap;gap:6px}.bdg{display:grid;place-items:center;min-width:44px;height:44px;padding:0 6px;border-radius:50%;border:2px dashed #c9cfc9;color:#9aa39a;font-weight:700;font-size:14px;background:#f6f8f6}
.bdg.got{border:2px solid #e8a400;background:linear-gradient(160deg,#ffe066,#ffa94d);color:#7a3d00;box-shadow:0 2px 6px rgba(230,119,0,.35)}.bdg.next{border-color:#2d6a3a;color:#2d6a3a}.bdgmisc{margin:12px 0 6px}
.cheerpic{background:#fff;border-radius:16px;padding:6px;margin:0 auto 10px;max-width:260px;box-shadow:0 4px 14px rgba(0,0,0,.25)}.cheerpic img{display:block;width:100%;height:auto;border-radius:12px}.cheernum{font-size:84px}.cheerok{white-space:normal;line-height:1.3;padding:8px 10px}
@media (max-height:700px){.cheerpic{max-width:190px}.cheernum{font-size:64px}.cheersub{display:none}}
.bdgdemo{margin:12px 0 6px;line-height:2.4}.bdgdemo button{font-size:13px;padding:4px 10px;min-height:36px}
.cheernow{font-size:14px;padding:4px 12px;min-height:36px;margin-left:8px;border-color:#e67700;color:#c2410c;background:#fff7e6;font-weight:700}

/* 加班總覽: the 合計 column keeps its lines whole -- in the month view it was squeezed to a few characters a line and made every row ~240px tall (Green 2026-10-13 「間距很大...我要看很多人時怎麼辦」) */
.ott td.ottc{min-width:190px;text-align:left;white-space:nowrap}.ott td.ottc .ottot span{margin:0 0 1px;padding:0}.ott td.ottc .ottp{white-space:nowrap}
/* 加班排班公告 prints landscape (Green 2026-10-13 「不能橫式列印嗎?」): the salary slip's later "@page portrait" had taken over the unnamed page, so the notice gets its own named page */
@page notice{size:A4 landscape;margin:8mm}
@media print{body.printing #printdoc{page:notice}}
/* Printing a page with the browser (Green 2026-10-13 「該橫就橫...該直就直」): pages whose table has many columns (a month / a year across, 8+ columns) print on
   A4 landscape, everything else stays A4 portrait (the unnamed @page above). 薪資: slips portrait, 清冊 landscape (page reg); 公告: landscape (page notice). */
@page wide{size:A4 landscape;margin:8mm}
@media print{body[data-page=ins],body[data-page=ot],body[data-page=sched],body[data-page=roster],body[data-page=stats],body[data-page=mine],body[data-page=leaves],body[data-page=month],body[data-page=day]{page:wide}
 #view .tbl{overflow:visible}}
@media print{#view table:not(.phead):not(.pmain) th,#view table:not(.phead):not(.pmain) td{padding:2px 3px;font-size:12px}
 table.ott{table-layout:fixed;width:100%}.ott th,.ott td{min-width:0!important;font-size:12px!important;padding:1px 0;overflow-wrap:anywhere;line-height:1.1}.ott small,.ott span{font-size:12px!important}.ott th:first-child{width:78px}.ott th:last-child{width:128px}.ott td.ottc{white-space:normal}.ott .otsum{font-size:12px}.ott td:first-child,.ott th:first-child{position:static}}
/* 薪資明細 on paper, two copies a page: every size is 12px or more, because Chrome in Chinese has a minimum font size of 12 and enlarged the 10px / 8.5px text,
   which wrapped the item names and pushed the second copy onto a second page (Green 2026-10-13 09:47 「怎麼分兩頁」). Wider name columns, lower rows. */
@media print{.pslip{font-size:12px}.pslip th,.pslip td{padding:1px 4px;height:17px;line-height:1.15;font-size:12px}.pslip td.num{font-size:12px}.pmain .pnote{font-size:12px;line-height:1.1}
 .pmain .psig small{font-size:12px}.pmain .psig{height:30px;line-height:1.15}.pmain .pnet{font-size:15px}.pco{font-size:15px;padding:2px}.pti{font-size:12px;padding:1px}.phead th{line-height:1.1}.pcut{margin:5mm 0}}
/* 排班頁: what is already registered this month (screen) */
.scurh{margin:14px 0 4px}.scur{border-collapse:collapse;font-size:12px}.scur th,.scur td{border:1px solid #cfd6df;padding:2px 3px;text-align:center;min-width:30px;line-height:1.15}.scur th small{font-weight:400}
.scur .off{background:#f3eaea}.scur .tdy{outline:2px solid #2b6cb0;outline-offset:-2px}.scur .nm{text-align:left;white-space:nowrap;position:sticky;left:0;background:#fff}.scur b{display:block;white-space:nowrap;color:#1f3a24}
/* 實際工時月表 + 考勤卡 (paper) */
@page card{size:A4 portrait;margin:9mm 10mm}
@media print{body.printing #printdoc.tall{page:card}.pd .pl{font-size:9pt;white-space:nowrap}
 .kc{break-after:page;page-break-after:always;color:#000;font-size:12px}.kc:last-child{break-after:auto;page-break-after:auto}.kc .kco{text-align:center;font-weight:700;font-size:13px}.kc h1{font-size:16px;text-align:center;margin:1mm 0 2mm}
 .kc table{width:100%;border-collapse:collapse;table-layout:fixed}.kc th,.kc td{border:.3pt solid #333;padding:0 3px;height:6.3mm;text-align:center;font-size:12px;line-height:1.1;font-weight:400;overflow:hidden}.kc th{background:#f2f2f2;-webkit-print-color-adjust:exact;print-color-adjust:exact}
 .kc .ksum{margin-bottom:2mm}.kc .ksum th,.kc .ksum td{height:8mm}.kc b{font-weight:700;font-size:13px}.kc tr.off td{background:#e9e9e9;-webkit-print-color-adjust:exact;print-color-adjust:exact}.kc td.nt{text-align:left;white-space:nowrap}
 .kc .kfoot{display:flex;justify-content:space-between;gap:6mm;margin-top:2mm;font-size:12px}.kc .kfoot span:last-child{white-space:nowrap;align-self:flex-end}}

.ufilt{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;margin:6px 0 10px}.ufilt select{max-width:100%}.urow[hidden]{display:none}
.extbl{border-collapse:collapse;width:100%;min-width:560px;font-size:14px}.extbl th,.extbl td{border:1px solid #cfd6df;padding:4px 6px;vertical-align:top;text-align:left}.extbl textarea,.extbl select{width:100%;min-width:110px;font:inherit}.exwhy{margin-top:4px}.exwhy input{width:100%;margin-bottom:4px}#exitcard h4,#exittake h4{margin:14px 0 6px}
@media screen and (max-width:700px){.extbl{min-width:0;border:0}.extbl tr:first-child{display:none}.extbl tr{display:block;border:1px solid #cfd6df;border-radius:8px;margin:0 0 8px;padding:4px 8px}.extbl td{display:block;border:0;padding:3px 0}.extbl td::before{display:block;font-size:12px;color:#5b6770}
.extbl td:nth-child(1)::before{content:"工作內容 Công việc"}.extbl td:nth-child(2)::before{content:"進度 Tiến độ"}.extbl td:nth-child(3)::before{content:"文件／檔案在哪 Tài liệu ở đâu"}#exitcard .extbl td:nth-child(4)::before{content:"接手人 Người nhận"}.extbl td:empty{display:none}}
/* 離職單 / 離職證明書 on paper: A4 portrait (#printdoc.tall), every size 12px or more (Green's browser enlarges anything smaller) */
.xp{color:#000;font-size:12px;line-height:1.35}.xp .xco{text-align:center;font-weight:700;font-size:14px}.xp h1{font-size:18px;text-align:center;margin:1mm 0 3mm}.xp h2{font-size:13px;margin:3mm 0 1mm}
.xp table{width:100%;border-collapse:collapse;table-layout:fixed}.xp th,.xp td{border:.4pt solid #333;padding:2px 4px;font-size:12px;text-align:center;vertical-align:top;word-break:break-word}.xp th{background:#f2f2f2;font-weight:700;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.xp td.l{text-align:left}.xp .v{font-size:12px;color:#333}.xp .xal{margin:3mm 0;font-size:13px}.xp .xsig td{height:20mm}.xp .xsig tr.d td{height:auto;text-align:left}.xp tr{break-inside:avoid}
.xc{color:#000;padding:18mm 14mm 0;font-size:16px}.xc h1{text-align:center;font-size:30px;letter-spacing:.4em;margin:0}.xc .sub{text-align:center;margin:2mm 0 12mm;font-size:15px}.xc table{width:100%;border-collapse:collapse}.xc th,.xc td{border:.6pt solid #000;padding:5mm 4mm;font-size:17px;text-align:left}.xc th{width:30%;text-align:center;font-weight:700}
.xc .say{margin:12mm 0;font-size:18px;text-indent:2em}.xc .by{margin-left:38%;font-size:16px;line-height:2}.xc .by .seal{color:#777;margin-top:6mm}.xc .dt{text-align:center;margin-top:16mm;font-size:17px;letter-spacing:.15em}
.xp th{white-space:normal}

/* 手機簽名 (2026-10-15) */
.sigpad { position: relative; border: 2px dashed #999; border-radius: 10px; background: #fff; overflow: hidden; }
.sigpad canvas { display: block; touch-action: none; }
.sighint { position: absolute; inset: 0; margin: 0; display: flex; align-items: center; justify-content: center; color: #999; pointer-events: none; font-size: 15px; text-align: center; padding: 0 12px; }
.sighint[hidden] { display: none; }
.sigbar { margin-top: 8px; display: flex; gap: 8px; flex-wrap: wrap; }
.sigimg { max-width: 260px; max-height: 110px; border: 1px solid #ddd; border-radius: 6px; background: #fff; }
.exsig { margin: 8px 0; padding: 8px 10px; border: 1px solid #ddd; border-radius: 8px; }
.exsig h4 { margin: 0 0 4px; }
.exsigpad { margin-top: 8px; }
.ctbox { margin: 10px 0; padding: 8px 10px; border: 1px solid #ddd; border-radius: 8px; }
.setupfold summary{font-size:15px;color:#5d6a61}.setupfold[open] summary{margin-bottom:8px}
#homecard .homem{border-top:1px solid #e3e8e3;padding-top:6px;margin-top:6px}#homecard .homem h4{margin:4px 0}
/* 信箱與工作日誌 (2026-10-22): date list + day, stacks on a phone */
.jbar { display: flex; gap: 8px; margin: 8px 0; } .jbar input { flex: 1; min-width: 0; }
.jcols { display: grid; grid-template-columns: 260px 1fr; gap: 12px; align-items: start; } @media (max-width: 760px) { .jcols { grid-template-columns: 1fr; } }
.jlist { max-height: 70vh; overflow: auto; } .jday { display: block; padding: 6px 8px; border-radius: 6px; text-decoration: none; color: inherit; } .jday.on { background: #e6f1ea; }
.jmeta { margin-bottom: 8px; } .jmd { overflow-wrap: anywhere; } .jmd pre { white-space: pre-wrap; background: #f5f5f5; padding: 8px; border-radius: 6px; }
.tblwrap { overflow-x: auto; } table.jt { border-collapse: collapse; } table.jt th, table.jt td { border: 1px solid #d8d8d8; padding: 4px 6px; vertical-align: top; }
.jhit { margin: 6px 0; } .jhit ul { margin: 2px 0 6px 18px; }
.jref { margin: 6px 0 10px; font-size: 14px; } .jonly { display: inline-flex; align-items: center; gap: 4px; margin-left: 10px; } .jonly input { width: auto; margin: 0; }
/* msg 5920: no coloured blocks -- the text stays plain on white; only a small dot + time + word beside the item */
.jwho { font-size: 12px; color: #666; }      /* Gmail 原信連結旁的信箱（Codex 2026-10-27 msg 6378） */
.jtag { font-size: 12px; white-space: nowrap; color: #555; margin-right: 2px; } .jtag .jd { font-size: 10px; }
/* LINE統整 (Codex 2026-10-27 msg 6405): the two-button switch at the top of the tab, the empty state, the importer's format box, the 待辦 tag */
.jkind { display: inline-flex; border: 1px solid #1f7a3a; border-radius: 8px; overflow: hidden; margin: 4px 0 8px; } .jkind button { border: 0; border-radius: 0; background: #fff; color: #1f7a3a; padding: 8px 18px; font-weight: 600; margin: 0; }
.jkind button + button { border-left: 1px solid #1f7a3a; } .jkind button.on { background: #1f7a3a; color: #fff; }
.jpick { display: block; font-size: 13px; margin-bottom: 6px; } .jnone { font-size: 16px; color: #8a5a00; } .jhelp { font-size: 13px; margin: 6px 0 10px; } .jhelp pre { white-space: pre-wrap; background: #f5f5f5; padding: 6px 8px; border-radius: 6px; margin: 4px 0; }
.jtag.jtodo { color: #8a5a00; border: 1px solid #c9a227; border-radius: 3px; padding: 0 3px; }
.jtag.jnew .jd { color: #1d6fb8; } .jtag.jupd .jd { color: #d07a12; } .jtag.jdone { color: #1f7a3a; border: 1px solid #1f7a3a; border-radius: 3px; padding: 0 3px; }
.jpart { background: #fff4e0; border: 1px solid #e0a040; border-radius: 8px; padding: 8px 12px; margin: 4px 0 8px; font-size: 14px; color: #6a4400; } .jpartt { color: #8a5a00; }
/* 信箱與工作日誌 on a phone (Green 2026-10-28 msg 6852「手機看..字太小」): one column that never runs off the screen, bigger text */
.jcols > * { min-width: 0; } .jmeta { overflow-wrap: anywhere; }
@media (max-width: 760px) { .jcols { grid-template-columns: minmax(0, 1fr); } .jlist { max-height: 40vh; }
  .jmd { font-size: 17px; line-height: 1.75; } .jmd li { margin-bottom: 8px; } .jmd h1, .jmd h2, .jmd h3 { font-size: 19px; }
  .jpart { font-size: 16px; line-height: 1.6; } .jday { font-size: 16px; } .jday small { font-size: 14px; } .jref, .jmeta { font-size: 15px; }
  .jtag { font-size: 14px; } .jtag .jd { font-size: 12px; } }
/* 公司行事曆 Lịch công ty (Green 2026-10-28): 會議 blue, 出貨銷貨 orange (Excel #fce4d6 / #c65911, clearly apart from the yellow 採購入料 #fff2cc / #bf8f00), 待確認 dashed amber; month grid of 7 minmax(0,1fr) columns that never runs off a phone */
.ccbar{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:0 0 8px}.cctitle{font-size:19px;font-weight:700;margin:0 4px}.ccseg{display:inline-flex;gap:0}.ccseg button{border-radius:0}.ccseg button:first-child{border-radius:8px 0 0 8px}.ccseg button:last-child{border-radius:0 8px 8px 0}.ccseg button+button{margin-left:-1px}
.ccbar button[aria-pressed=true],.cctype button[aria-pressed=true]{background:var(--g);color:#fff}#ccprev,#ccnext{min-width:44px;font-size:22px;padding:4px 10px}
.cclegend{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;font-size:14px;margin:0 0 10px}.ccl{border-width:1px;border-style:solid;border-radius:6px;padding:0 8px}.cclegend label{display:inline-flex;gap:4px;align-items:center}.cclegend input{min-height:0}
.cc-meeting{background:#e8f1fb;border-color:#8fb8e3;color:#123f6b}.cc-ship{background:#fce4d6;border-color:#c65911;color:#843c0c}.cc-recv{background:#fff2cc;border-color:#bf8f00;color:#7f5f00}.cc-pay{background:#fde4ec;border-color:#b0305c;color:#7a1f40}.ccpend{border-style:dashed!important;border-color:#c77d00!important}.ccoff{opacity:.55}.ccoff b,.ccoff .ccx>b{text-decoration:line-through}
.ccg{display:inline-block;background:#6d3fb8;color:#fff;border-radius:4px;padding:0 4px;font-size:11px;font-weight:700;line-height:1.4}.ccpt{display:inline-block;background:#fff4d6;color:#7a4b00;border:1px solid #d9a33a;border-radius:4px;padding:0 4px;font-size:11px;line-height:1.4}.ccpt.off{background:#eee;color:#555;border-color:#bbb}.cck{font-weight:700}
.ccgrid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line);background:#fff;border-radius:8px;overflow:hidden;margin-bottom:12px}
.ccgrid>div{border-right:1px solid var(--line);border-bottom:1px solid var(--line);min-width:0}.cchd{background:#f2f4f7;text-align:center;font-size:14px;font-weight:600;padding:4px 2px}.cchd small{font-weight:400;color:var(--mut)}
.ccday{min-height:104px;padding:3px 3px 5px;cursor:pointer}.ccday:hover{background:#f7faf7}.ccday.out{background:#fafbfc}.ccday.out .ccn{color:#a0a8b2}.ccday.sel{box-shadow:inset 0 0 0 2px #2f6b3a}
.ccn{display:inline-block;min-width:28px;line-height:26px;text-align:center;font-size:15px;font-weight:600;border-radius:999px}.ccday.today .ccn{background:var(--g);color:#fff}
.ccev{display:block;width:100%;min-height:0;text-align:left;font-size:13px;line-height:1.35;padding:2px 4px;margin:2px 0 0;border-width:1px;border-style:solid;border-radius:5px;white-space:normal;overflow:hidden;max-height:calc(2.7em + 6px);overflow-wrap:anywhere}
.ccdots{display:none}.ccdots i{display:inline-block;width:9px;height:9px;border-radius:50%;border:1px solid;margin:0 1px}.ccdots i.cc-meeting{background:#3b82c4;border-color:#3b82c4}.ccdots i.cc-ship{background:#c65911;border-color:#c65911}.ccdots i.cc-recv{background:#f2c400;border-color:#bf8f00}.ccdots i.ccpend{background:#fff;border:2px solid #c77d00!important}.ccdots b{font-size:12px;color:var(--mut);margin-left:2px}
.ccrow{display:flex;width:100%;gap:12px;justify-content:flex-start;align-items:flex-start;text-align:left;margin:6px 0;padding:8px 12px;border-width:1px;border-style:solid;border-radius:8px;font-size:16px;line-height:1.45}.ccrow.on{box-shadow:0 0 0 2px #2f6b3a}
.cct{flex:0 0 auto;min-width:104px;font-weight:700;font-variant-numeric:tabular-nums}.cct small{font-weight:400}.ccx{min-width:0;overflow-wrap:anywhere}.ccsub{color:#3d4652;white-space:pre-line}
.ccweek{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;margin-bottom:12px}.ccwd{background:#fff;border:1px solid var(--line);border-radius:8px;padding:6px 10px}.ccwd h4{margin:2px 0 4px;font-size:16px}.ccwd.today{border-color:var(--g);box-shadow:inset 4px 0 0 var(--g)}.ccwd .muted{margin:2px 0}
.ccdet{border-width:2px}.ccdet h3{font-size:18px}.ccst{font-size:15px;font-weight:600}.ccdl{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:4px 14px;margin:0 0 10px;font-size:16px}.ccdl dt{color:#3d4652}.ccdl dd{margin:0;overflow-wrap:anywhere;white-space:pre-line;color:var(--ink)}
.ccclash{margin:8px 0;font-size:15px;color:#5a3300}.ccclash small{font-size:14px}.ccclash ul{margin:4px 0 0;padding-left:20px}.ccdec label{display:grid;gap:4px;font-size:15px;max-width:420px}.cchist{font-size:14px;color:var(--ink)}.cchist ul{padding-left:18px;margin:6px 0}.cchist li{margin-bottom:4px}
.ccform .stack{max-width:560px}.ccform textarea{font:inherit;width:100%;border:1px solid var(--line);border-radius:8px;padding:8px 10px}.ccform .ccwg{display:flex;gap:8px;align-items:center;font-size:16px;flex-wrap:wrap}.ccform .ccwg input{min-height:0;width:22px;height:22px}.ccclashq{font-weight:700;margin:4px 0}
.ccpendbox .ccrow{background:#fff}
/* Green 私人工作時間 (Green 2026-10-28 msg 6945「周一整天幫我用綠色」): Excel-like light green #e2efda with a darker #548235 border / text */
.ccday.priv{background:#f3f8ef}.ccpriv{display:block;margin:2px 0 0;padding:2px 4px;background:#e2efda;border:1px solid #548235;border-left-width:4px;border-radius:5px;color:#385723;font-size:13px;font-weight:700;line-height:1.3;overflow-wrap:anywhere}.ccpriv small{display:block;font-weight:400;font-size:11px}
.ccprivl{background:#e2efda;border-color:#548235;color:#385723}.ccprivc{background:#e2efda;border-color:#548235;color:#385723;border-left-width:5px}.ccprivc .ccsub{color:#385723}.ccdots i.ccprivd{background:#548235;border-color:#548235;border-radius:2px}.ccwd.priv{background:#f3f8ef}
.ccmon{margin:0;font-size:15px}
@media (max-width:760px){
  .ccday .ccpriv{display:none}.ccday.priv{background:#e2efda}.ccday.priv.out{background:#eef5e8}
  .ccday{min-height:58px;padding:2px 1px;text-align:center}.ccday .ccev{display:none}.ccdots{display:flex;flex-wrap:wrap;justify-content:center;gap:2px;margin-top:2px}.ccn{font-size:16px;min-width:30px;line-height:30px}
  .cchd{font-size:15px;padding:4px 0}.cchd small{display:block;font-size:12px}.cctitle{font-size:20px;width:100%;order:-1;margin:0 0 2px}
  .ccrow{flex-direction:column;gap:2px;font-size:17px;line-height:1.55}.cct{min-width:0}.ccdet,.ccdl{font-size:17px}.ccdl{grid-template-columns:minmax(0,1fr);gap:0}.ccdl dt{font-size:15px;margin-top:6px}
  .ccform .stack label,.ccdec label{font-size:16px}.ccclash,.cchist,.cclegend{font-size:16px}.ccg,.ccpt{font-size:13px}.ccdaybox h3,.ccwd h4{font-size:18px}
}
/* 公司行事曆 shortcut on the punch page (Green 2026-10-28 msg 6964): one wide button, >= 56 px tall */
.calgo{margin:0 0 12px}.calgo button{width:100%;min-height:56px;justify-content:flex-start;gap:6px 14px;flex-wrap:wrap;text-align:left;background:#e8f1fb;border:1px solid #8fb8e3;color:#123f6b;border-radius:10px;padding:8px 14px;position:relative;padding-right:36px}
.calgo .cgt{font-size:18px;font-weight:700}.calgo .cgn{font-size:16px;display:inline-flex;flex-wrap:wrap;gap:4px 10px;align-items:center}.calgo .cgp{background:#fff4d6;color:#7a4b00;border:1px dashed #c77d00;border-radius:6px;padding:0 6px;font-weight:700}.calgo .cga{position:absolute;right:12px;top:50%;transform:translateY(-50%);font-size:26px}
/* a wide table (健保眷屬 on 我的資料) scrolls inside its own box instead of widening the phone page (found 2026-10-28 with the in-app viewer: the page was 604 px wide at 390) */
.tw{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch}
/* SALES 首頁待辦 auto items (Green 2026-10-30): read-only, 「SALES」 badge; 收款 rose; sync status line for admins */
.ccsrc{display:inline-block;background:#17334a;color:#fff;border-radius:4px;padding:0 4px;font-size:10px;font-weight:700;line-height:1.5;letter-spacing:.02em;vertical-align:1px}
.ccauto{border-left-width:3px!important}.ccdots i.cc-pay{background:#b0305c;border-color:#b0305c}
.ccsync{margin:-2px 0 8px;font-size:14px;color:#3d4652}.ccsync.bad b{color:#a61b1b}
.uerp{border:1px solid var(--line);border-radius:8px;padding:8px 10px;display:flex;flex-wrap:wrap;gap:4px 14px}.uerp legend{font-size:14px;font-weight:600}.uerp label{display:inline-flex;gap:4px;align-items:center;font-size:14px}.uerp small{flex-basis:100%}
.tabs a.erplink{display:flex;align-items:center;min-height:40px;font-size:14px;padding:8px 10px;border:1px solid var(--g);border-radius:8px;color:var(--g);text-decoration:none;font-weight:600}
/* completed SALES items (Green 2026-10-30 msg 7995): same colour family, lighter and muted, with the ✓ in the text */
.ccdone{opacity:.62;background-image:linear-gradient(rgba(255,255,255,.45),rgba(255,255,255,.45))!important;border-style:dotted!important}.ccdots i.ccdone{opacity:.45}
.ccmbar{position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:8px;background:#fff;border:1px solid var(--line);border-radius:8px;padding:4px;margin:0 0 6px;box-shadow:0 2px 6px rgba(0,0,0,.06)}
.ccmbar button{min-width:52px;min-height:44px;font-size:24px;line-height:1;padding:0 12px}.ccmt{font-size:17px;font-weight:700;text-align:center;flex:1}.ccgrid,.ccweek{touch-action:pan-y}