/* ZC EUDR 盡職調查自我檢核（/check/eudr）
   深色刊頭放法規日期，下方三步驟：角色判斷、逐題檢核、結果與缺口。沿用 check.css 的色票（:root）與留資料表單（.ck-gate）。
   所有樣式都以 .eu 或 eu- 開頭，避免和 check.css 的全域 .tag 等名稱衝突。 */
.eu{--surface:#fff;--sunken:#efece4;--ok-bg:#e4eee7;--mid-bg:#f5ead2;--low-bg:#f6e2de;--na:#5f6967;--na-bg:#eceae4;
  --mono:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,monospace;--serif:"Noto Serif TC","Songti TC","PMingLiU",serif;
  background:var(--paper);color:var(--ink);font-size:15px;line-height:1.7}
/* 元素重設用 :where()（權重 0），才不會蓋掉 check.css 的 .ck-btn、.ck-gate 等樣式 */
:where(.eu) :where(h1,h2,h3,h4){margin:0;text-wrap:balance}
:where(.eu) :where(p){margin:0}
:where(.eu) :where(a){color:inherit}
:where(.eu) :where(button,input){font:inherit;color:inherit}
.eu :focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.eu [hidden]{display:none!important}
.eu-wrap{max-width:1120px;margin:0 auto;padding:0 20px}
.eu-mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
.eu-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* 刊頭 */
.eu-mast{background:var(--ink);color:#F3F1EA}
.eu-mast .eu-wrap{padding-top:40px;padding-bottom:28px;display:grid;gap:16px}
.eu-eyebrow{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#aeb8b4}
.eu-eyebrow b{color:var(--gold);font-weight:600}
.eu-mast h1{font-family:var(--serif);font-weight:600;font-size:clamp(28px,4.2vw,38px);line-height:1.3;color:#fff}
.eu-lead{max-width:66ch;color:#c3cbc8;font-size:15.5px}
.eu-dates{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid rgba(255,255,255,.16);margin:6px 0 0}
.eu-dates div{padding:12px 14px 0 0;display:grid;gap:2px;min-width:0}
.eu-dates div+div{padding-left:14px;border-left:1px solid rgba(255,255,255,.12)}
.eu-dates dt{font-size:12px;color:#aeb8b4}
.eu-dates dd{margin:0;font-family:var(--mono);font-size:16px;color:#fff}
.eu-dates dd small{font-family:inherit;font-size:12px;color:var(--gold);margin-left:6px}
@media (max-width:720px){.eu-dates{grid-template-columns:repeat(2,minmax(0,1fr))}.eu-dates div:nth-child(3){padding-left:0;border-left:0}.eu-dates div{padding-bottom:6px}}

/* 步驟列 */
.eu-steps{background:var(--surface);border-bottom:1px solid var(--line)}
.eu-steps .eu-wrap{display:flex;gap:4px;overflow-x:auto}
.eu-steps button{appearance:none;border:0;background:none;padding:14px 14px 12px;display:flex;gap:8px;align-items:baseline;cursor:pointer;color:var(--mute);border-bottom:2px solid transparent;white-space:nowrap;font-size:15px}
.eu-steps button .n{font-family:var(--mono);font-size:12px}
.eu-steps button[aria-current="step"]{color:var(--ink);border-bottom-color:var(--gold);font-weight:600}
.eu-steps button:disabled{cursor:not-allowed;opacity:.45}

.eu-main{padding-top:28px;padding-bottom:64px}
.eu-main>section{display:grid;gap:24px}
.eu-h2{font-family:var(--serif);font-weight:600;font-size:23px;line-height:1.35}
.eu-sub{color:var(--ink2)}
.eu-panel{background:var(--surface);border:1px solid var(--line)}
.eu-k{font-size:12px;letter-spacing:.08em;color:var(--mute)}

/* 範例提示 */
.eu-banner{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;justify-content:space-between;padding:10px 14px;border:1px dashed var(--gold);background:var(--mid-bg);font-size:14px;margin-bottom:20px}
.eu-banner b{color:var(--mid)}

/* 按鈕（補 check.css 的 .ck-btn） */
.eu .ck-btn.sm{padding:7px 14px;font-size:13.5px}
.eu-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.eu-linkbtn{appearance:none;background:none;border:0;padding:0;color:var(--gold-d);text-decoration:underline;text-underline-offset:3px;cursor:pointer;font-size:14px}

/* 角色判斷 */
.eu-triage{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:24px;align-items:start}
@media (max-width:880px){.eu-triage{grid-template-columns:minmax(0,1fr)}}
.eu-tq{padding:18px 20px 16px;border-bottom:1px solid var(--line)}
.eu-tq:last-child{border-bottom:0}
.eu-tq fieldset{border:0;margin:0;padding:0;display:grid;gap:10px;min-width:0}
.eu-tq legend{padding:0;font-weight:600;display:flex;gap:10px;align-items:baseline}
.eu-tq legend .eu-mono{color:var(--gold-d);font-size:12px;font-weight:400}
.eu-help{font-size:13px;color:var(--mute)}
.eu-choices{display:grid;gap:8px}
.eu-choice{position:relative}
.eu-choice input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.eu-choice label{display:block;padding:10px 12px 10px 38px;border:1px solid var(--line);cursor:pointer;background:var(--surface);position:relative;font-size:14.5px;line-height:1.55}
.eu-choice label::before{content:"";position:absolute;left:12px;top:14px;width:14px;height:14px;border-radius:50%;border:1.5px solid var(--ink2)}
.eu-choice label small{display:block;color:var(--mute);font-size:12.5px;margin-top:2px}
.eu-choice label:hover{border-color:#bfb8a6}
.eu-choice input:checked+label{border-color:var(--ink);background:#f1efe8;box-shadow:inset 3px 0 0 var(--gold)}
.eu-choice input:checked+label::before{border-color:var(--gold);background:radial-gradient(circle,var(--gold) 0 4px,transparent 5px)}
.eu-choice input:focus-visible+label{outline:2px solid var(--gold);outline-offset:2px}
.eu-thresh-wrap{overflow-x:auto}
.eu-thresh{font-size:12.5px;color:var(--ink2);border-collapse:collapse;width:100%}
.eu-thresh th,.eu-thresh td{padding:4px 8px 4px 0;text-align:left;border-bottom:1px solid var(--line);font-weight:400}
.eu-thresh th{color:var(--ink);font-weight:600}

.eu-side{display:grid;gap:16px;position:sticky;top:76px}
@media (max-width:880px){.eu-side{position:static}}
.eu-rolecard{padding:20px;display:grid;gap:12px;border-top:3px solid var(--ink)}
.eu-role{font-family:var(--serif);font-weight:600;font-size:21px;line-height:1.35}
.eu-map{font-family:var(--mono);font-size:12px;color:var(--gold-d)}
.eu-rolecard ul{margin:0;padding-left:1.1em;display:grid;gap:4px;font-size:14px}
.eu-notes{display:grid;gap:6px}
.eu-note{font-size:13px;padding:8px 10px;background:var(--paper);border-left:2px solid var(--gold);color:var(--ink2)}
.eu-kv{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;font-size:14px;margin:0}
.eu-kv dt{color:var(--mute)}
.eu-kv dd{margin:0}
.eu-empty{color:var(--mute);font-size:14px}

.eu-how{padding:20px;display:grid;gap:14px}
.eu-how h3{font-size:15px;font-weight:700}
.eu-how ol{margin:0;padding-left:1.2em;display:grid;gap:6px;font-size:14px}
.eu-sample{border-top:1px solid var(--line);padding-top:14px;display:grid;gap:10px}
.eu-sample-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.eu-chip{display:inline-flex;align-items:center;gap:6px;font-size:12px;padding:2px 8px;border-radius:999px;border:1px solid var(--line);color:var(--ink2);white-space:nowrap;background:var(--surface)}
.eu-chip.ex{border-color:var(--gold);color:var(--gold-d)}
.eu-chip.lock{border-color:var(--ink);color:var(--ink)}
.eu-score-mini{display:flex;align-items:baseline;gap:10px}
.eu-score-mini .pct{font-family:var(--mono);font-size:28px;font-weight:500}
.eu-bars{display:grid;gap:8px}
.eu-bar{display:grid;grid-template-columns:minmax(0,1fr) 56px;gap:4px 10px;align-items:center;font-size:13.5px}
.eu-bar .lbl{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.eu-bar .val{font-family:var(--mono);text-align:right}
.eu-bar .track{grid-column:1 / -1;height:8px;background:var(--sunken);overflow:hidden}
.eu-bar .fill{height:100%;background:var(--ink2)}
.eu .fill.g{background:var(--ok)}.eu .fill.y{background:var(--mid)}.eu .fill.r{background:var(--low)}

/* 燈號 */
.eu-light{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:14px;padding:3px 12px 3px 8px;border-radius:999px}
.eu-light::before{content:"";width:10px;height:10px;border-radius:50%;background:currentColor}
.eu-light.g{color:var(--ok);background:var(--ok-bg)}
.eu-light.y{color:var(--mid);background:var(--mid-bg)}
.eu-light.r{color:var(--low);background:var(--low-bg)}

/* 逐題檢核 */
.eu-progress{position:sticky;top:60px;z-index:5;background:var(--surface);border:1px solid var(--line);padding:10px 16px;display:grid;gap:8px}
.eu-progress .top{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;justify-content:space-between}
.eu-progress .who{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:baseline;font-size:14px;min-width:0}
.eu-progress .cnt{font-family:var(--mono);font-size:13px;color:var(--mute)}
.eu-ptrack{height:4px;background:var(--sunken);overflow:hidden}
.eu-ptrack i{display:block;height:100%;width:0;background:var(--gold);transition:width .25s}
@media (prefers-reduced-motion:reduce){.eu-ptrack i{transition:none}}
.eu-meta{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;padding:16px 20px}
@media (max-width:640px){.eu-meta{grid-template-columns:minmax(0,1fr)}}
.eu-field{display:grid;gap:4px}
.eu-field label{font-size:13px;color:var(--mute)}
.eu-field input{border:1px solid #cfd5d3;background:var(--surface);padding:9px 10px;width:100%}
.eu-legend{display:flex;flex-wrap:wrap;gap:8px 16px;font-size:12.5px;color:var(--mute);padding:0 20px 14px}

.eu-qlist{display:grid;gap:32px}
.eu-chap-h{display:flex;gap:12px;align-items:baseline;padding:4px 0 10px;border-bottom:2px solid var(--ink)}
.eu-chap-h .num{font-family:var(--mono);font-size:14px;color:var(--gold-d)}
.eu-chap-h h2{font-family:var(--serif);font-size:21px;font-weight:600}
.eu-chap-h .cs{margin-left:auto;font-family:var(--mono);font-size:12.5px;color:var(--mute)}
.eu-subh{font-size:15px;font-weight:700;padding:18px 0 6px;display:flex;gap:10px}
.eu-subh .eu-mono{color:var(--mute);font-weight:400}
.eu-q{display:grid;grid-template-columns:62px minmax(0,1fr);gap:12px;padding:16px 0;border-bottom:1px solid var(--line)}
.eu-q-num{font-family:var(--mono);font-size:13px;color:var(--mute);padding-top:2px}
.eu-q[data-a="y"] .eu-q-num{color:var(--ok)}.eu-q[data-a="p"] .eu-q-num{color:var(--mid)}.eu-q[data-a="n"] .eu-q-num{color:var(--low)}
.eu-q-body{display:grid;gap:10px;min-width:0}
.eu-q-text{font-size:15.5px;line-height:1.75}
.eu-q-meta{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;font-size:12px;color:var(--mute)}
.eu-tag{font-size:11.5px;padding:1px 7px;border:1px solid currentColor;line-height:1.6}
.eu-tag.law{color:var(--ink)}
.eu-tag.rec{color:var(--mute);border-style:dashed}
.eu-tag.crit{color:var(--low)}
.eu-ref{font-family:var(--mono);font-size:11.5px}
.eu-opts{border:0;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px;min-width:0}
.eu-opt{position:relative}
.eu-opt input{position:absolute;opacity:0;width:1px;height:1px}
.eu-opt label{display:inline-block;padding:6px 14px;border:1px solid var(--line);cursor:pointer;font-size:14px;background:var(--surface);min-width:64px;text-align:center}
.eu-opt label:hover{background:var(--sunken)}
.eu-opt input:focus-visible+label{outline:2px solid var(--gold);outline-offset:2px}
.eu-opt input[value="y"]:checked+label{background:var(--ok-bg);border-color:var(--ok);color:var(--ok);font-weight:600}
.eu-opt input[value="p"]:checked+label{background:var(--mid-bg);border-color:var(--mid);color:var(--mid);font-weight:600}
.eu-opt input[value="n"]:checked+label{background:var(--low-bg);border-color:var(--low);color:var(--low);font-weight:600}
.eu-opt input[value="na"]:checked+label{background:var(--na-bg);border-color:var(--na);color:var(--na);font-weight:600}
details.eu-ev{font-size:13.5px}
details.eu-ev summary{cursor:pointer;color:var(--ink2);width:max-content;max-width:100%}
details.eu-ev[open] summary{margin-bottom:6px}
.eu-why{padding:8px 10px;background:var(--paper);margin-bottom:6px}
details.eu-ev ul{margin:0;padding-left:1.15em;display:grid;gap:2px}
.eu-lockline{font-size:13px;color:var(--mute)}
.eu-qfoot{display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;align-items:center;padding-top:8px}

/* 結果 */
.eu-res-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)}
@media (max-width:820px){.eu-res-top{grid-template-columns:minmax(0,1fr)}}
.eu-res-score{padding:24px;display:grid;gap:10px;align-content:start;border-right:1px solid var(--line)}
@media (max-width:820px){.eu-res-score{border-right:0;border-bottom:1px solid var(--line)}}
.eu-big{font-family:var(--mono);font-size:56px;line-height:1;font-weight:500;letter-spacing:-.02em}
.eu-big small{font-size:22px;color:var(--mute)}
.eu-res-bars{padding:24px;display:grid;gap:14px;align-content:start}
.eu-res-bars h3,.eu-block h3{font-size:16px;font-weight:700;font-family:inherit}
.eu-scale{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--mute)}
.eu-scale span::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:5px;vertical-align:1px;background:currentColor}
.eu-scale .g{color:var(--ok)}.eu-scale .y{color:var(--mid)}.eu-scale .r{color:var(--low)}
.eu-block{padding:22px 24px;display:grid;gap:12px}
.eu-gaps{display:grid}
.eu-gap{display:grid;grid-template-columns:62px minmax(0,1fr) auto;gap:6px 12px;padding:12px 0;border-top:1px solid var(--line);align-items:start}
.eu-gap:first-child{border-top:0}
.eu-gap .n{font-family:var(--mono);font-size:13px;color:var(--mute);padding-top:1px}
.eu-gap .t{min-width:0;display:grid;gap:4px}
.eu-gap .t p{font-size:14.5px}
.eu-gap .t .ev2{font-size:13px;color:var(--ink2)}
.eu-st{font-size:12px;padding:1px 8px;white-space:nowrap}
.eu-st.n{color:var(--low);background:var(--low-bg)}.eu-st.p{color:var(--mid);background:var(--mid-bg)}.eu-st.u{color:var(--na);background:var(--na-bg)}
@media (max-width:560px){.eu-gap{grid-template-columns:48px minmax(0,1fr)}.eu-gap .eu-st{grid-column:2;justify-self:start}}
.eu-crit{border-top:3px solid var(--low)}
.eu-crit h3{color:var(--low)}
.eu-next ol{margin:0;padding-left:1.2em;display:grid;gap:6px;font-size:14.5px}
.eu-locked{display:grid;gap:10px}
.eu-locked .cnts{display:flex;flex-wrap:wrap;gap:8px}
.eu .ck-gate{margin-top:0}
.eu-toast{font-size:13px;color:var(--ok)}
.eu-method{font-size:13.5px;color:var(--ink2)}
.eu-method summary{cursor:pointer;color:var(--ink);font-weight:600;font-size:14.5px}
.eu-method .in{display:grid;gap:10px;padding-top:10px}
.eu-method ul{margin:0;padding-left:1.15em;display:grid;gap:3px}
.eu-method table{border-collapse:collapse;font-size:13px}
.eu-method td,.eu-method th{border-bottom:1px solid var(--line);padding:5px 12px 5px 0;text-align:left;font-weight:400}
.eu-method th{color:var(--ink);font-weight:600}
.eu-method a{color:var(--gold-d)}
.eu-confirm{display:inline-flex;gap:8px;align-items:center;font-size:13px;flex-wrap:wrap}
.eu-saved{font-size:13px;color:var(--mute)}
.eu-saved a{color:var(--gold-d)}
.eu-fine{border-top:1px solid var(--line);color:var(--mute);font-size:12.5px}
.eu-fine .eu-wrap{padding-top:20px;padding-bottom:32px;display:grid;gap:6px}
.eu-fine a{color:var(--gold-d)}
#eu-copy-fallback.show{position:static;width:100%;min-height:160px;clip:auto;white-space:pre-wrap}

@media print{
  zc-nav,.zc-foot,.fcw,.eu-steps,.eu-mast,.ck-gate,.eu-noprint{display:none!important}
  .eu{background:#fff}
  .eu-panel{break-inside:avoid}
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}
