body.gwg-page { min-height:100vh; height:auto; background:#fff8fb; color:#22313f; user-select:auto; }
body.gwg-page header { background:#e8f7f1; color:#1f5b49; }
.calculator-shell { width:min(100%, 820px); margin:0 auto; padding:16px 16px 34px; }
.back-button { display:inline-flex; min-height:40px; align-items:center; border:1px solid #d8e8e1; border-radius:999px; background:#fff; color:#1f5b49; padding:8px 15px; font-size:.95rem; font-weight:800; text-decoration:none; }
.intro-card,.form-card,.result-card,.medical-note { background:#fff; border:1px solid #f0dfe8; border-radius:12px; box-shadow:0 6px 18px rgba(170,73,121,.08); }
.intro-card { display:flex; gap:14px; align-items:flex-start; margin-top:14px; padding:18px; }
.intro-icon { width:44px; height:44px; flex:0 0 auto; display:grid; place-items:center; border-radius:12px; background:#fdeef5; font-size:1.5rem; }
.intro-card h1 { margin:0; color:#164937; font-size:clamp(1.3rem,4vw,1.65rem); line-height:1.35; }
.intro-card p { margin:8px 0 0; color:#5d6d7e; line-height:1.6; font-size:.95rem; }
.form-card,.result-card,.medical-note { margin-top:16px; padding:18px; }
.form-card h2,.result-card h2,.medical-note h2 { margin:0 0 14px; color:#1f5b49; font-size:1.08rem; }
.medical-note h3 { margin:16px 0 6px; color:#1f5b49; font-size:.95rem; }
.field-grid { display:grid; gap:14px; }
.field-grid + .field-grid { margin-top:14px; }
.field-grid.two-col { grid-template-columns:1fr 1fr; }
.field { display:grid; gap:6px; align-content:start; min-width:0; color:#4b635b; font-size:.92rem; font-weight:800; }
.field small { color:#71817b; font-weight:600; font-size:.85rem; line-height:1.45; }
.field input,.field select { width:100%; min-width:0; box-sizing:border-box; min-height:46px; border:1px solid #d8e2de; border-radius:10px; background:#fff; color:#22313f; padding:10px 12px; font:inherit; font-size:16px; font-weight:600; }
.field input:focus,.field select:focus { outline:3px solid rgba(31,91,73,.2); border-color:#1f5b49; }
.field input[aria-invalid="true"],.field select[aria-invalid="true"] { border-color:#b42318; }
.form-message { min-height:20px; margin:12px 0 0; color:#b42318; font-size:.9rem; font-weight:800; line-height:1.45; }
.form-actions { display:flex; gap:10px; margin-top:6px; }
.primary-btn,.secondary-btn { min-height:46px; border-radius:10px; padding:10px 18px; font:inherit; font-weight:900; cursor:pointer; }
.primary-btn { flex:1; border:0; background:#1f5b49; color:#fff; }
.secondary-btn { border:1px solid #d8e2de; background:#fff; color:#1f5b49; }
.subtle-note { margin:10px 0 0; color:#6b7b76; font-size:.85rem; line-height:1.5; }
.result-list { display:grid; gap:12px; margin:0; }
.result-list > div { display:grid; gap:4px; border:1px solid #eef2f0; border-radius:10px; padding:12px 14px; background:#fbfdfc; }
.result-list dt { color:#4b635b; font-size:.88rem; font-weight:800; }
.result-list dd { display:grid; gap:4px; margin:0; }
.result-list strong { color:#164937; font-size:1.45rem; line-height:1.3; }
.result-list small { color:#62736c; font-size:.88rem; line-height:1.55; }
.result-note { margin:14px 0 0; color:#5d6d7e; font-size:.88rem; line-height:1.6; }
.medical-note p { margin:0 0 10px; color:#4f5f59; font-size:.9rem; line-height:1.7; }
.table-wrap { display:grid; gap:14px; }
.table-wrap table { width:100%; border-collapse:collapse; font-size:.9rem; }
.table-wrap caption { text-align:left; color:#1f5b49; font-weight:900; padding-bottom:6px; }
.table-wrap th,.table-wrap td { border:1px solid #eadde4; padding:8px 10px; text-align:center; }
.table-wrap th { background:#fdf3f8; color:#4b635b; font-size:.85rem; }
.source-list { margin:0 0 10px; padding-left:20px; color:#4f5f59; font-size:.88rem; line-height:1.6; }
.source-list a { color:#1f5b49; }
.checked-date { color:#6b7b76; font-size:.85rem; }
@media (max-width:360px) { .field-grid.two-col { grid-template-columns:1fr; } }
@media (min-width:720px) { .calculator-shell { padding-top:24px; } .intro-card,.form-card,.result-card,.medical-note { padding:22px; } .field-grid { grid-template-columns:1fr 1fr; } .table-wrap { grid-template-columns:1.4fr 1fr; align-items:start; } }
.intro-card p.lead-q { margin:6px 0 0; color:#1f5b49; font-weight:800; }
.faq-item { margin-top:0; border-top:1px solid #f0dfe8; padding:12px 0 0; }
.faq-item + .faq-item { margin-top:12px; }
.faq-item summary { line-height:1.5; }
.faq-item p { margin:8px 0 0; }
.related-link { margin:16px 0 0 !important; }
.related-link a { color:#1f5b49; font-weight:800; }
.faq-item summary,.medical-note details summary { color:#1f5b49; cursor:pointer; font-size:.95rem; font-weight:900; }
.conclusion { margin:0 0 14px; border-radius:12px; padding:14px 16px; border:2px solid #d8e2de; background:#f6f8f7; }
.conclusion p { margin:0; }
.conclusion-title { font-size:1.2rem; font-weight:900; line-height:1.4; }
.conclusion-title::before { margin-right:6px; }
.conclusion-text { margin-top:6px !important; font-size:.95rem; line-height:1.65; color:#33433d; }
.conclusion-links { display:flex; flex-wrap:wrap; gap:8px 16px; margin-top:10px !important; font-size:.9rem; }
.conclusion-links a { color:#1f5b49; font-weight:800; }
.conclusion.tone-green { border-color:#2e8b57; background:#eef8f2; } .tone-green .conclusion-title { color:#1d6b40; } .tone-green .conclusion-title::before { content:"✓"; }
.conclusion.tone-yellow { border-color:#d99a00; background:#fff8e6; } .tone-yellow .conclusion-title { color:#8a5a00; } .tone-yellow .conclusion-title::before { content:"!"; }
.conclusion.tone-red { border-color:#c0392b; background:#fdeeee; } .tone-red .conclusion-title { color:#a12a1e; } .tone-red .conclusion-title::before { content:"‼"; }
.conclusion.tone-neutral .conclusion-title { color:#4b635b; } .tone-neutral .conclusion-title::before { content:"ⓘ"; }
.advice { margin-top:12px; }
.advice summary { display:flex; align-items:center; justify-content:space-between; gap:10px; min-height:48px; box-sizing:border-box; padding:11px 14px; border-radius:10px; background:#1f5b49; color:#fff; cursor:pointer; font-size:1rem; font-weight:900; list-style:none; box-shadow:0 3px 8px rgba(0,0,0,.12); }
.advice summary::-webkit-details-marker { display:none; }
.advice summary::before { content:"💡"; margin-right:2px; }
.advice summary .advice-label { flex:1; }
.advice summary::after { content:"點開 ⌄"; font-size:.85rem; font-weight:800; opacity:.9; white-space:nowrap; }
.advice[open] summary::after { content:"收合 ⌃"; }
.advice summary:hover { filter:brightness(1.08); }
.advice summary:focus-visible { outline:3px solid #f2b705; outline-offset:2px; }
.tone-red .advice summary { background:#a12a1e; }
.tone-yellow .advice summary { background:#8a5a00; }
.tone-green .advice summary { background:#1d6b40; }
.advice[open] .advice-list:not([hidden]) { margin-top:12px; }
.advice-list { margin:8px 0 0; padding-left:20px; color:#33433d; font-size:.92rem; line-height:1.65; }
.advice-list li + li { margin-top:4px; }
.advice-source { margin-top:8px !important; color:#6b7b76; font-size:.85rem; line-height:1.5; }
