:root{--navy:#37697b;--navy2:#234b5a;--blue:#6f9eac;--sky:#e8f3f4;--orange:#f19a55;--cream:#fbf8f2;--ink:#24343a;--muted:#65767a;--line:#d9e3e1;--white:#fff;--shadow:0 18px 50px rgba(55,105,123,.11)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--cream);font-family:"Noto Sans TC","PingFang TC","Microsoft JhengHei",system-ui,sans-serif;line-height:1.7}button,input{font:inherit}a{color:inherit}.topbar{height:82px;padding:0 max(24px,calc((100vw - 1180px)/2));display:flex;align-items:center;justify-content:space-between;background:rgba(247,244,237,.92);backdrop-filter:blur(12px);border-bottom:1px solid rgba(18,59,93,.1);position:sticky;top:0;z-index:20}.brand{display:flex;align-items:center;gap:12px;text-decoration:none}.brand-mark{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:var(--navy);color:white;font-size:27px;line-height:1}.brand b{display:block;font-size:17px;letter-spacing:.04em}.brand small{display:block;color:var(--muted);font-size:12px}.source-link{font-weight:700;text-decoration:none;color:var(--navy);font-size:14px;border-bottom:1px solid var(--navy)}main{overflow:hidden}.intro{max-width:1180px;margin:0 auto;padding:78px 24px 46px;display:grid;grid-template-columns:1.25fr .75fr;gap:48px;align-items:end}.eyebrow{margin:0 0 12px;color:var(--orange);font-size:13px;font-weight:800;letter-spacing:.14em}.intro h1{font-family:"Noto Serif TC","Songti TC",serif;font-size:clamp(42px,6vw,74px);line-height:1.14;margin:0 0 20px;color:var(--navy2);letter-spacing:-.035em}.intro-copy>p:last-child{max-width:620px;margin:0;font-size:18px;color:var(--muted)}.safety-card{display:flex;gap:16px;padding:24px;border-radius:22px;background:var(--navy);color:white;box-shadow:var(--shadow)}.safety-card p{margin:4px 0 0;color:#d7e5ec;font-size:14px}.safety-icon{flex:0 0 auto;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--orange);font-weight:900}.finder{max-width:1180px;margin:0 auto;padding:0 24px 28px}.search-box{height:66px;display:flex;align-items:center;gap:14px;background:white;border:1px solid var(--line);border-radius:18px;padding:0 18px;box-shadow:0 10px 30px rgba(19,54,76,.06)}.search-box>span{font-size:28px;color:var(--blue)}.search-box input{width:100%;border:0;outline:0;font-size:17px;color:var(--ink);background:transparent}.search-box button{border:0;background:#eef3f4;color:var(--muted);border-radius:50%;width:32px;height:32px;cursor:pointer}.filter-row{display:flex;gap:9px;padding:20px 0 12px;overflow-x:auto;scrollbar-width:none}.filter-row::-webkit-scrollbar{display:none}.filter-row button{white-space:nowrap;border:1px solid var(--line);background:transparent;color:var(--navy);border-radius:999px;padding:9px 16px;cursor:pointer;font-weight:700}.filter-row button.active{background:var(--navy);border-color:var(--navy);color:white}.result-meta{display:flex;justify-content:space-between;gap:20px;color:var(--muted);font-size:13px}.result-meta b{color:var(--navy)}.condition-grid{max-width:1180px;margin:0 auto;padding:10px 24px 84px;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.condition-card{position:relative;min-height:310px;display:flex;flex-direction:column;padding:25px;border:1px solid var(--line);border-radius:24px;background:var(--white);transition:.2s ease;overflow:hidden}.condition-card:before{content:"";position:absolute;width:90px;height:90px;border-radius:50%;background:var(--sky);right:-28px;top:-30px}.condition-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:#b9cdd5}.card-top{display:flex;justify-content:space-between;align-items:center;position:relative}.body-tag{padding:5px 10px;border-radius:8px;background:var(--sky);color:var(--navy);font-size:12px;font-weight:800}.card-num{font-family:serif;color:#9eb0b8;font-size:13px}.condition-card h3{font-size:22px;line-height:1.35;margin:24px 0 5px;color:var(--navy2)}.condition-card .en{margin:0;color:var(--blue);font-size:12px;font-weight:700}.condition-card .summary{margin:16px 0;color:var(--muted);font-size:14px}.card-bottom{display:flex;justify-content:space-between;align-items:end;margin-top:auto}.card-bottom small{color:var(--muted)}.view-btn{border:0;background:none;color:var(--orange);font-weight:800;cursor:pointer;padding:8px 0}.empty{text-align:center;padding:20px 24px 90px;color:var(--muted)}.empty b{font-size:22px;color:var(--navy)}.principles{background:var(--navy2);color:white;padding:74px max(24px,calc((100vw - 1180px)/2));display:grid;grid-template-columns:.7fr 1.3fr;gap:60px}.principles h2,.sources h2{font-family:"Noto Serif TC","Songti TC",serif;font-size:clamp(32px,4vw,48px);line-height:1.2;margin:0}.principle-list article{display:grid;grid-template-columns:48px 1fr;gap:18px;padding:22px 0;border-top:1px solid rgba(255,255,255,.16)}.principle-list article:last-child{border-bottom:1px solid rgba(255,255,255,.16)}.principle-list span{font-family:serif;color:var(--orange);font-size:22px}.principle-list b{font-size:18px}.principle-list p{margin:5px 0 0;color:#bfd0da;font-size:14px}.sources{max-width:1180px;margin:0 auto;padding:85px 24px;display:grid;grid-template-columns:.72fr 1.28fr;gap:70px}.sources>div>p:last-child{color:var(--muted)}.source-list{border-top:1px solid var(--line)}.source-list a{display:grid;grid-template-columns:130px 1fr auto;gap:18px;align-items:center;padding:22px 6px;border-bottom:1px solid var(--line);text-decoration:none}.source-list a:hover b{color:var(--orange)}.source-list span,.source-list i{font-size:12px;color:var(--muted);font-style:normal}.source-list b{color:var(--navy);transition:.2s}footer{padding:36px 24px;text-align:center;background:white;border-top:1px solid var(--line)}footer b{color:var(--navy)}footer p{margin:4px auto 0;max-width:760px;color:var(--muted);font-size:13px}dialog{width:min(760px,calc(100% - 28px));max-height:90vh;padding:0;border:0;border-radius:28px;background:white;box-shadow:0 30px 90px rgba(0,0,0,.28)}dialog::backdrop{background:rgba(7,28,42,.7);backdrop-filter:blur(4px)}.dialog-shell{position:relative;padding:40px}.dialog-close{position:absolute;right:20px;top:18px;border:0;background:#edf2f3;color:var(--navy);border-radius:50%;width:38px;height:38px;font-size:24px;cursor:pointer}.dialog-kicker{color:var(--orange);font-weight:800;font-size:13px;letter-spacing:.1em}.dialog-shell h2{margin:8px 50px 4px 0;font-family:"Noto Serif TC",serif;color:var(--navy);font-size:34px;line-height:1.25}.dialog-en{color:var(--blue);font-size:13px}.dialog-lead{font-size:16px;color:var(--muted);margin:20px 0 25px}.stage-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0 0 28px}.stage-strip span{padding:10px 6px;text-align:center;background:var(--sky);border-radius:10px;color:var(--navy);font-size:12px;font-weight:800}.exercise-list{display:grid;gap:10px}.exercise{display:grid;grid-template-columns:38px 1fr;gap:12px;padding:15px;background:#f7f9f9;border-radius:14px}.exercise>span{width:32px;height:32px;display:grid;place-items:center;border-radius:9px;background:var(--navy);color:white;font-weight:800}.exercise b{display:block;color:var(--navy)}.exercise p{margin:3px 0 0;font-size:13px;color:var(--muted)}.caution{margin-top:22px;padding:18px;border-left:4px solid var(--orange);background:#fff3ed;border-radius:4px 14px 14px 4px}.caution b{color:#9b4727}.caution p{margin:4px 0 0;font-size:13px;color:#754b3a}.dialog-actions{display:flex;gap:10px;margin-top:24px}.dialog-actions a{flex:1;text-align:center;padding:12px;border-radius:12px;text-decoration:none;font-weight:800}.dialog-actions a:first-child{background:var(--navy);color:white}.dialog-actions a:last-child{border:1px solid var(--line);color:var(--navy)}
@media(max-width:900px){.intro,.principles,.sources{grid-template-columns:1fr}.intro{padding-top:48px;gap:28px}.condition-grid{grid-template-columns:repeat(2,1fr)}.principles,.sources{gap:30px}.source-list a{grid-template-columns:110px 1fr}.source-list i{display:none}}
@media(max-width:620px){.topbar{height:70px;padding:0 16px}.brand-mark{width:38px;height:38px}.brand small,.source-link{display:none}.intro{padding:40px 18px 30px}.intro h1{font-size:42px}.intro-copy>p:last-child{font-size:16px}.finder{padding:0 18px 22px}.search-box{height:58px}.result-meta span{display:none}.condition-grid{grid-template-columns:1fr;padding:6px 18px 60px}.condition-card{min-height:270px}.principles,.sources{padding:58px 18px}.source-list a{grid-template-columns:1fr;gap:2px}.dialog-shell{padding:32px 20px}.dialog-shell h2{font-size:28px}.stage-strip{grid-template-columns:1fr}.dialog-actions{flex-direction:column}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Comic-style exercise panels */
.header-note{font-weight:800;color:var(--navy);font-size:13px;padding:7px 12px;border:1px solid var(--line);border-radius:999px;background:white}
.topbar{background:rgba(251,248,242,.94)}
.brand-mark{position:relative;border-radius:50%;background:var(--orange);font-family:"Noto Serif TC","Songti TC",serif;font-size:22px;box-shadow:inset 0 0 0 5px rgba(255,255,255,.3)}
.brand-logo{width:54px;height:54px;object-fit:contain;flex:0 0 auto}
.brand b{color:var(--navy2);letter-spacing:.08em}
.intro{position:relative}
.intro:before{content:"";position:absolute;width:290px;height:145px;border-radius:290px 290px 0 0;background:linear-gradient(180deg,rgba(241,154,85,.16),rgba(241,154,85,0));right:-40px;top:32px;z-index:-1}
.doctor-note{display:flex;align-items:flex-start;gap:12px;max-width:620px;margin-top:22px;padding:14px 16px;border-left:4px solid var(--orange);border-radius:4px 14px 14px 4px;background:rgba(255,255,255,.72)}
.doctor-note span{flex:0 0 auto;color:var(--navy);font-size:13px;font-weight:900}
.doctor-note p{margin:0!important;color:var(--muted)!important;font-size:14px!important;line-height:1.65}
.clinic-signature{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.clinic-signature span{display:flex;align-items:center;gap:7px;padding:8px 12px;border:1px solid #cadbdc;border-radius:999px;background:#fff;color:var(--navy);font-size:13px;font-weight:800}
.clinic-signature b{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--orange);color:#fff;font:800 11px/1 system-ui}
.intro h1{font-size:clamp(40px,5.2vw,66px);max-width:760px}
.hero-description{max-width:700px;margin:0;color:var(--muted);font-size:18px;line-height:1.8}
.hero-closing{display:inline-block;margin:12px 0 0;padding-bottom:2px;border-bottom:3px solid rgba(241,154,85,.42);color:var(--navy);font-size:16px;font-weight:900;letter-spacing:.02em}
.condition-card{box-shadow:0 8px 22px rgba(55,105,123,.055)}
.body-tag{background:#edf5f5}
.view-btn{border-bottom:2px solid rgba(241,154,85,.3)}
.principles{background:linear-gradient(145deg,#234b5a,#37697b)}
.comic-panel{box-shadow:4px 4px 0 #315968}
.comic-art{background-color:#fffaf0}
.panel-label{background:var(--orange)}
footer{background:#f1f7f6}
.footer-logo{display:block;width:210px;height:150px;object-fit:contain;margin:0 auto 12px}
.readiness{max-width:1180px;margin:0 auto 34px;padding:24px;display:grid;grid-template-columns:.7fr 1.3fr;gap:28px;border:1px solid var(--line);border-radius:24px;background:white;box-shadow:0 12px 34px rgba(55,105,123,.07)}
.readiness-head h2{margin:0 0 8px;color:var(--navy2);font-family:"Noto Serif TC","Songti TC",serif;font-size:30px}
.readiness-head>p:last-child{margin:0;color:var(--muted);font-size:14px}
.traffic-lights{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.traffic{position:relative;padding:15px 14px 14px 18px;border-radius:14px;background:#f7f9f8}
.traffic:before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:5px;border-radius:6px;background:var(--traffic)}
.traffic.green{--traffic:#55a779}.traffic.yellow{--traffic:#e7ad3f}.traffic.red{--traffic:#d96252}
.traffic span{color:var(--traffic);font-size:12px;font-weight:900}
.traffic b{display:block;margin:3px 0;color:var(--navy2);font-size:14px;line-height:1.45}
.traffic p{margin:0;color:var(--muted);font-size:12px;line-height:1.5}
.start-check{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 22px}
.start-check>div{padding:15px 16px;border:1px solid var(--line);border-radius:14px;background:#f7faf9}
.start-check span{color:var(--navy);font-size:13px;font-weight:900}
.start-check p{margin:4px 0 0;color:var(--muted);font-size:13px;line-height:1.6}
.stage-strip span{display:flex;flex-direction:column;gap:2px}
.stage-strip small{color:var(--blue);font-size:10px;font-weight:800}
.done-btn{width:100%;margin-top:13px;padding:8px 10px;border:1px solid #b9ced2;border-radius:10px;background:white;color:var(--navy);font-weight:800;cursor:pointer}
.done-btn>span:first-child{display:inline-grid;place-items:center;width:20px;height:20px;margin-right:5px;border:1px solid #a9c0c5;border-radius:50%;color:transparent}
.done-btn .done-label{display:inline}
.done-btn.is-done{border-color:#79ad91;background:#edf8f1;color:#357050}
.done-btn.is-done>span:first-child{border-color:#55a779;background:#55a779;color:white}
.response-check{margin-top:24px;padding:17px 18px;border:1px solid #bfdbd0;border-radius:14px;background:#f0f8f4}
.response-check b{color:#356c55}
.response-check p{margin:4px 0 0;color:#557065;font-size:13px}
.supervised-note{margin:0 0 18px;padding:16px;border:2px solid #e7ad3f;border-radius:14px;background:#fff8e9}
.supervised-note b{color:#815b12}.supervised-note p{margin:4px 0 0;color:#6f6042;font-size:13px}
.medical-note{margin:16px 2px 0;color:#7a8789;font-size:12px;line-height:1.6}
.evidence-note{margin:0 0 18px;padding:16px 18px;border:1px solid #bfd5dd;border-radius:14px;background:#eef6f8}
.evidence-note span{display:block;color:var(--navy);font-size:13px;font-weight:900}
.evidence-note p{margin:4px 0 0;color:#526d76;font-size:14px;line-height:1.65}
.doctor-prescription{position:relative;margin:0 0 18px;padding:16px 18px 16px 62px;border-radius:16px;background:linear-gradient(135deg,#fff4e8,#fffaf4);border:1px solid #efcfb3}
.doctor-prescription:before{content:"陳";position:absolute;left:16px;top:16px;display:grid;place-items:center;width:34px;height:34px;border:2px solid var(--orange);border-radius:50%;color:var(--orange);font-family:"Noto Serif TC",serif;font-weight:900}
.doctor-prescription span{display:block;color:#995428;font-size:13px;font-weight:900}
.doctor-prescription p{margin:3px 0 0;color:#715747;font-size:14px;line-height:1.65}
.comic-intro{display:flex;justify-content:space-between;align-items:end;margin:0 0 12px}
.comic-intro b{color:var(--navy);font-size:18px}
.comic-intro span{color:var(--muted);font-size:12px}
.exercise-list{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.comic-panel{position:relative;display:block;overflow:hidden;padding:0;border:2px solid var(--navy2);border-radius:16px;background:white;box-shadow:4px 4px 0 var(--navy2)}
.panel-label{position:absolute;z-index:2;left:9px;top:9px;background:var(--orange);color:white;border:2px solid var(--navy2);border-radius:999px;padding:2px 9px;font-size:12px;font-weight:900;transform:rotate(-2deg)}
.comic-art{width:100%;height:auto;aspect-ratio:1 / 1;position:relative;background-color:#f7f1df;background-image:var(--comic);background-size:var(--comic-size,300% 300%);background-position:var(--comic-x) var(--comic-y);background-repeat:no-repeat;border-bottom:2px solid var(--navy2);overflow:hidden}
.comic-art.is-single{background-size:cover;background-position:center}
.figure{font-size:64px;z-index:1;filter:saturate(.75);transform:rotate(-2deg)}
.motion{position:absolute;right:14px;top:50%;font:900 35px/1 system-ui;color:var(--orange);transform:rotate(-8deg)}
.prop{position:absolute;left:16px;bottom:21px;font-size:26px;color:var(--navy)}
.floor{position:absolute;width:72%;height:3px;bottom:16px;background:var(--navy2);border-radius:50%}
.speech{position:absolute;z-index:2;right:8px;top:8px;padding:5px 8px;background:white;border:2px solid var(--navy2);border-radius:50%;font-size:11px;font-weight:900;color:var(--navy);transform:rotate(3deg)}
.speech:after{content:"";position:absolute;left:10px;bottom:-7px;width:8px;height:8px;background:white;border-right:2px solid var(--navy2);border-bottom:2px solid var(--navy2);transform:rotate(45deg)}
.comic-copy{padding:14px 13px 16px;min-height:126px}
.phase-badge{display:inline-flex;width:max-content;margin:0 0 8px;padding:3px 8px;border-radius:999px;background:#e8f3f4;color:var(--navy);font-size:11px;font-weight:900}
.comic-copy b{display:block;color:var(--navy);font-size:16px}
.comic-copy p{margin:5px 0 0;font-size:14px;line-height:1.6;color:var(--muted)}
.dialog-actions,.sources{display:none}
@media(max-width:900px){
  .readiness{grid-template-columns:1fr;margin:0 24px 30px}
  .traffic-lights{grid-template-columns:1fr}
  .exercise-list{grid-template-columns:1fr}
  .comic-panel{display:grid;grid-template-columns:minmax(190px,34%) 1fr}
  .comic-art{width:100%;height:auto;min-height:0;aspect-ratio:1 / 1;border-bottom:0;border-right:2px solid var(--navy2)}
  .comic-copy{display:flex;flex-direction:column;justify-content:center;min-height:190px;padding:20px}
}
@media(max-width:620px){
  .readiness{margin:0 18px 26px;padding:18px}
  .readiness-head h2{font-size:26px}
  .start-check{grid-template-columns:1fr}
  .header-note{display:none}
  .comic-intro{align-items:start;flex-direction:column}
  .comic-panel{display:block}
  .comic-art{width:100%;height:auto;aspect-ratio:1 / 1;border-right:0;border-bottom:2px solid var(--navy2)}
  .comic-copy{min-height:0;padding:14px}
  .doctor-note{display:block}
  .doctor-note span{display:block;margin-bottom:4px}
  .brand-logo{width:46px;height:46px}
  .footer-logo{width:180px;height:130px}
  .intro h1{font-size:36px;line-height:1.2}
  .hero-description{font-size:16px;line-height:1.75}
  .hero-closing{font-size:15px}
}

@media(min-width:901px){
  dialog{width:min(1180px,calc(100% - 48px));max-height:94dvh}
}

/* 漫畫圖卡：依裝置保留正方形分鏡，不拉伸人物比例 */
.exercise-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.comic-panel{min-width:0}
.comic-art{width:100%;max-width:420px;margin-inline:auto;aspect-ratio:1/1;background-color:#fff7e9}
.comic-copy{min-height:168px;padding:16px}
.speech{font-size:clamp(11px,1.1vw,13px);padding:6px 9px}
.panel-label{font-size:13px;padding:3px 10px}

@media (min-width:681px) and (max-width:1024px){
  dialog{width:calc(100% - 32px);max-height:94dvh}
  .dialog-shell{padding:34px 28px}
  .exercise-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  .comic-panel{display:block}
  .comic-art{max-width:none;border-right:0;border-bottom:2px solid var(--navy2)}
  .comic-copy{min-height:174px;padding:17px}
}

@media (max-width:680px){
  dialog{width:calc(100% - 14px);max-height:96dvh;border-radius:20px}
  .dialog-shell{padding:28px 14px 22px}
  .dialog-close{right:12px;top:12px}
  .exercise-list{grid-template-columns:1fr;gap:18px}
  .comic-panel{display:block;width:100%;max-width:430px;margin-inline:auto}
  .comic-art{width:100%;max-width:none;aspect-ratio:1/1;border-right:0;border-bottom:2px solid var(--navy2)}
  .comic-copy{min-height:0;padding:16px}
  .panel-label{left:10px;top:10px}
  .speech{right:10px;top:10px}
}

/* 症狀、分期門檻與自費治療：在各裝置保留清楚的閱讀寬度 */
.symptom-note,.phase-note{margin:20px 0;padding:17px 19px;border-radius:15px;background:#f0f7f7;border:1px solid #cbdfe0}
.symptom-note b,.phase-note b{color:var(--navy2);font-size:15px}
.symptom-note p,.phase-note p{margin:5px 0 0;color:#4b656d;font-size:14px;line-height:1.8}
.phase-note{margin:0 0 15px;background:#fffaf1;border-color:#efd9c2}
.treatment-note{max-width:1180px;margin:auto;padding:78px 24px 90px}
.treatment-note h2{margin:0 0 14px;color:var(--navy2);font:700 clamp(29px,3.5vw,43px)/1.3 "Noto Serif TC","Songti TC",serif}
.treatment-lead{max-width:850px;color:var(--muted);font-size:16px;line-height:1.85}
.treatment-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:27px}
.treatment-grid article{padding:23px 25px;background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:0 8px 25px rgba(55,105,123,.05)}
.treatment-grid h3{margin:10px 0 7px;color:var(--navy2);font-size:19px}
.treatment-grid p{margin:0;color:var(--muted);font-size:14px;line-height:1.8}
.evidence-tag{display:inline-block;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:800}
.evidence-tag.selected{background:#e9f5f0;color:#39785c}
.evidence-tag.uncertain{background:#fff2e6;color:#a35f2c}
.treatment-disclaimer{margin:20px 0 0;color:#83533d;font-size:13px}
.clinical-sources{margin-top:24px;padding:15px 18px;border:1px solid var(--line);border-radius:15px;background:white;font-size:14px;color:var(--muted)}
.clinical-sources summary{display:flex;align-items:center;gap:12px;cursor:pointer;color:var(--navy);font-weight:800;list-style:none}.clinical-sources summary::-webkit-details-marker{display:none}.clinical-sources summary::after{content:"＋";margin-left:auto;font-size:20px;line-height:1}.clinical-sources[open] summary::after{content:"－"}.clinical-sources summary span{padding:3px 8px;border-radius:999px;background:var(--sand);font-size:12px;white-space:nowrap}
.clinical-sources ul{padding-left:22px;line-height:1.9}
.clinical-sources li{padding:3px 0}.clinical-sources a{color:var(--navy);text-underline-offset:3px}
.clinical-sources small{display:block;margin:8px 0 2px}
@media(max-width:680px){.treatment-note{padding:55px 18px 64px}.treatment-grid{grid-template-columns:1fr}.treatment-grid article{padding:20px}.symptom-note,.phase-note{padding:15px}}