:root{--ink:#17212b;--muted:#607080;--line:#dce3e8;--paper:#fff;--bg:#f3f6f7;--brand:#0b6b58;--brand2:#084f43;--warn:#9a5b00;--danger:#b42318;--shadow:0 12px 35px rgba(24,39,53,.08);font-family:Inter,"Noto Sans TC","Microsoft JhengHei",sans-serif;color:var(--ink);background:var(--bg)}*{box-sizing:border-box}body{margin:0;line-height:1.55;background:linear-gradient(180deg,#eef6f3 0,#f7f8f9 320px);min-height:100vh}a{color:var(--brand);text-decoration:none}a:hover{text-decoration:underline}.topbar{height:68px;display:flex;align-items:center;justify-content:space-between;padding:0 max(24px,calc((100vw - 1240px)/2));background:rgba(255,255,255,.92);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20;backdrop-filter:blur(12px)}.brand{font-weight:800;font-size:1.1rem;color:var(--ink)}.brand span{color:var(--brand)}.topbar nav{display:flex;align-items:center;gap:22px}.inline{display:inline}.link-button{background:none;border:0;color:var(--brand);font:inherit;cursor:pointer;padding:0}.container{max-width:1240px;margin:0 auto;padding:42px 24px 80px}.hero{min-height:65vh;display:grid;grid-template-columns:1.3fr .7fr;align-items:center;gap:70px}.hero h1,.page-head h1{font-size:clamp(2.2rem,5vw,4.4rem);line-height:1.05;letter-spacing:-.04em;margin:.2em 0}.hero p{max-width:680px;font-size:1.15rem;color:var(--muted)}.hero-card,.panel,.auth-card,.step-card{background:var(--paper);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow)}.hero-card{padding:30px;font-size:1.05rem}.hero-card li{padding:12px 0}.eyebrow{text-transform:uppercase;letter-spacing:.12em;color:var(--brand);font-weight:800;font-size:.78rem}.actions,.row-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.button{display:inline-flex;justify-content:center;align-items:center;min-height:42px;padding:8px 15px;border:1px solid #bac6cc;border-radius:10px;background:#fff;color:var(--ink);font-weight:700;cursor:pointer}.button:hover{text-decoration:none;border-color:var(--brand)}.button.primary{background:var(--brand);border-color:var(--brand);color:#fff}.button.primary:hover{background:var(--brand2)}.button.danger,.danger{color:var(--danger);border-color:#efb1aa}.button.small{min-height:32px;padding:4px 9px;font-size:.82rem}.page-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:30px}.page-head h1{font-size:clamp(2rem,4vw,3.2rem)}.page-head p{color:var(--muted)}.panel{padding:24px;margin-bottom:24px}.auth-card{max-width:480px;margin:60px auto;padding:34px}.stack{display:flex;flex-direction:column;gap:18px}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.wide{grid-column:1/-1}label{display:flex;flex-direction:column;gap:7px;font-weight:700;font-size:.92rem}input,textarea,select{width:100%;border:1px solid #b8c3ca;border-radius:9px;padding:10px 12px;font:inherit;background:#fff;color:var(--ink)}textarea{min-height:95px;resize:vertical}input:focus,textarea:focus,select:focus{outline:3px solid rgba(11,107,88,.18);border-color:var(--brand)}.checkbox{display:flex;flex-direction:row;align-items:center;gap:8px}.checkbox input{width:auto}.upload{border:2px dashed #afc9c1;border-radius:14px;padding:25px;background:#f7fbfa}.alerts{margin-bottom:20px}.alert{padding:12px 16px;border-radius:10px;background:#e8f3ef;margin-bottom:8px}.alert.error{background:#fee9e7;color:#8f1e14}.alert.warning,.notice{background:#fff4db;color:#754500}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;padding:0;overflow:hidden}.metrics div,.sop-meta div{display:flex;flex-direction:column;padding:20px;background:#fff}.metrics span,.sop-meta span{color:var(--muted);font-size:.8rem}.consent li{margin-bottom:8px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:12px;border-bottom:1px solid var(--line);vertical-align:top}th{font-size:.8rem;color:var(--muted)}td small{display:block;color:var(--muted);max-width:360px}.filters{display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:10px;margin-bottom:20px}.status{display:inline-block;border-radius:999px;padding:3px 9px;background:#e8edf0;font-size:.78rem}.status.published{background:#d8f3e9;color:#075b48}.status.needs_review{background:#fff0c9;color:#7a4800}.status.failed{background:#fee3e0;color:#912018}.status.processing,.status.queued{background:#e0edff;color:#174ea6}.job-list{display:grid;gap:10px}.job{display:grid;grid-template-columns:minmax(180px,1fr) minmax(160px,2fr) 60px auto;align-items:center;gap:15px;padding:12px 0;border-bottom:1px solid var(--line)}.job small{display:block;color:var(--muted)}progress{accent-color:var(--brand);width:100%}.sop-layout{display:grid;grid-template-columns:250px minmax(0,1fr);gap:26px;align-items:start}.toc{position:sticky;top:90px;background:#fff;border:1px solid var(--line);border-radius:15px;padding:16px}.toc nav{display:flex;flex-direction:column;margin-top:15px;max-height:62vh;overflow:auto}.toc nav a{display:flex;gap:9px;padding:9px;border-radius:8px;color:var(--ink)}.toc nav a:hover,.toc nav a.active{background:#e7f3ef;text-decoration:none}.toc nav span{color:var(--brand);font-weight:800}.sop-content video{width:100%;max-height:520px;background:#111;border-radius:15px;margin-bottom:24px}.sop-meta{display:grid;grid-template-columns:repeat(4,1fr);padding:0;overflow:hidden}.summary-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:15px;margin-bottom:25px}.summary-grid>div{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px}.summary-grid h2{margin-top:0;font-size:1rem}.step-card{padding:24px;margin-bottom:20px;scroll-margin-top:90px}.step-card header{display:flex;align-items:center;justify-content:space-between;gap:15px}.step-card header p{margin:0;color:var(--brand);font-weight:800}.step-card h2{margin:.2em 0}.step-check{flex-direction:row}.timestamp{border:0;border-radius:9px;background:#e7f3ef;color:var(--brand2);padding:8px 10px;cursor:pointer}.image-button{width:100%;padding:0;border:0;background:none;cursor:zoom-in;margin:15px 0}.image-button img{width:100%;max-height:560px;object-fit:contain;border-radius:12px;border:1px solid var(--line);background:#f2f4f5}.instruction{font-size:1.12rem;font-weight:650;margin:15px 0}.expected,.warning{padding:13px;border-radius:10px;margin:12px 0}.expected{background:#eff8f5}.warning{background:#fff2df;color:#754500}.step-card footer{display:flex;gap:12px;color:var(--muted);font-size:.82rem;margin-top:15px}.review{color:var(--warn);font-weight:800}.step-nav{display:flex;justify-content:space-between}.edit-steps{margin:30px 0}.step-editor{display:grid;gap:14px}.step-editor header{display:flex;justify-content:space-between}.edit-actions{margin-top:24px;padding-top:20px;border-top:1px solid var(--line)}dialog{border:0;border-radius:15px;padding:42px 15px 15px;max-width:min(94vw,1100px);box-shadow:0 20px 80px #0008}dialog::backdrop{background:#000b}dialog img{max-width:100%;max-height:82vh}.dialog-close{position:absolute;right:12px;top:8px;border:0;background:none;font-size:2rem;cursor:pointer}.error-page{text-align:center;padding:100px 0}.error-page h1{font-size:6rem;margin:0;color:var(--brand)}.empty{text-align:center;padding:50px}.review-hidden{display:none!important}
@media(max-width:850px){.hero{grid-template-columns:1fr;gap:20px}.hero-card{display:none}.topbar{padding:0 16px}.topbar nav{gap:12px;font-size:.86rem}.container{padding:28px 16px 70px}.page-head{align-items:start;flex-direction:column}.form-grid,.summary-grid,.metrics,.sop-meta{grid-template-columns:1fr}.sop-layout{grid-template-columns:1fr}.toc{position:static}.filters{grid-template-columns:1fr}.job{grid-template-columns:1fr}.toc nav{max-height:none}}
.google-signin{min-height:44px;margin:1.5rem 0;display:flex;justify-content:center}.muted{color:var(--muted);font-size:.9rem}
@media print{body{background:#fff}.topbar,.print-hide,.alerts{display:none!important}.container{padding:0;max-width:none}.sop-layout{display:block}.step-card{box-shadow:none;break-inside:avoid}.sop-content video{display:none}.summary-grid{grid-template-columns:1fr 1fr}}
.step-check{white-space:nowrap;flex-shrink:0}