/* Shared visual system. Included last on every public site page. */
:root { --site-gutter:clamp(24px,4vw,64px); }
body main.page-shell.reading-page { max-width:860px; width:100%; margin:0 auto; padding:48px 24px 64px; }
body .reading-page .content { padding:0; background:transparent; border:0; box-shadow:none; font-size:17px; line-height:1.9; }
body .reading-page h2 { margin-top:36px; font-size:25px; }
body .reading-page p,body .reading-page li { overflow-wrap:anywhere; }
.support-directory { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:28px 0; }
.support-directory a { padding:14px 18px; border:1px solid #dce6e5; border-radius:8px; background:#f5f9f8; color:#154f49; }
body .drug-index-page .static-search-bar { display:flex; flex-wrap:wrap; gap:12px; padding:16px; background:#f5f9f8; }
body .drug-index-page .static-search-modes { display:flex; gap:8px; }
body .drug-index-page .static-search-modes a { display:flex; align-items:center; padding:12px 18px; border:1px solid #bdcecf; border-radius:8px; background:#fff; }
body .drug-index-page .static-search-modes a[aria-current] { background:#e1f0ec; color:#154f49; }
body .drug-index-page .static-search-form { display:flex; flex:1; min-width:240px; gap:8px; }
body .drug-index-page .static-search-form input[type="search"] { flex:1; min-width:0; width:100%; min-height:56px; border:1px solid #bdcecf; border-radius:8px; padding:14px 18px; font-size:18px; background:#fff; }
body .drug-index-page .static-search-form button { width:100px; flex:0 0 100px; min-height:56px; border:0; background:#1b655b; color:white; font-size:18px; }
@media(max-width:760px) {
 body main.page-shell.reading-page { padding:28px 20px 44px; }
 .support-directory { grid-template-columns:1fr; }
 body .drug-index-page .static-search-form { flex-basis:100%; min-width:0; }
 body .drug-index-page .static-search-form input[type="search"] { font-size:16px; padding:12px; }
 body .drug-index-page .static-search-form button { width:72px; flex-basis:72px; }
}
:root { --bg:#fff; --surface:#fff; --surface-soft:#f5f9f8; --text:#102c32; --muted:#566872; --accent:#1b655b; --accent-strong:#154f49; --accent-soft:#e1f0ec; --line:#dce6e5; --site-header-offset:100px; }
html { background:#fff; font-family:"Noto Sans TC","Microsoft JhengHei",system-ui,sans-serif; }
body,body.audience-search { background:#fff; color:var(--text); padding-top:var(--site-header-offset); }
body .site-header { background:#fff; border-bottom:1px solid var(--line); box-shadow:none; }
body .site-header .header-inner { display:flex; align-items:center; justify-content:space-between; max-width:none; width:100%; min-height:100px; margin:0; padding:16px; gap:20px; }
body .site-header .brand { color:var(--text); font-size:30px; flex-shrink:0; }
body .site-header .brand img { width:60px; height:60px; }
body .site-header .nav { display:flex; align-items:center; justify-content:flex-end; gap:18px; flex-wrap:wrap; }
body .site-header .nav a { color:#334b53; background:transparent; font-size:15px; padding:6px 0; border-radius:0; border:0; }
body .site-header .nav a[aria-current="page"] { color:var(--accent); border-bottom:3px solid var(--accent); }
/* Override legacy mobile navigation suppression consistently across routes. */
body .site-header .nav a { display:inline-flex !important; }
body .footer { background:#f5f9f8; border-top:1px solid #bdcecf; color:#334b53; font-size:15px; line-height:1.8; }
body .footer a { color:#154f49; font-weight:600; text-decoration:underline; text-underline-offset:4px; }
body .footer a:hover { color:#102c32; }
body .footer .footer-inner { width:100%; max-width:none; padding:0 16px; }
body .page-shell,body .facility-account-page,body .drug-search-app { width:100%; max-width:none; margin-left:0; margin-right:0; padding-left:16px; padding-right:16px; }
body .desktop-product-hero-inner,body .desktop-preview-inner,body .desktop-section-inner,body .desktop-product-notice { max-width:none; margin-left:16px; margin-right:16px; }
body .desktop-product-hero,body .desktop-preview-band { background:#f5f9f8; }
body .desktop-product-hero { color:var(--text); border-color:var(--line); }
body .desktop-product-lead,body .desktop-product-meta,body .desktop-product-status { color:var(--muted); }
body .desktop-product-kicker { color:var(--accent); }
body .desktop-product-actions .button.secondary { color:var(--accent-strong); background:#fff; border-color:#bdcecf; }
body .desktop-product-actions .button.secondary:hover { background:var(--accent-soft); }
body .desktop-product-section,body .desktop-plans-section { max-width:none; margin-left:16px; margin-right:16px; }
body .desktop-product-hero h1,body .page-title { color:var(--text); letter-spacing:-.025em; }
body .button,body .static-search-form button { border-radius:8px; }
body button:focus-visible,body a:focus-visible { outline:3px solid #217a70; outline-offset:4px; }
body .static-drug-card { border:1px solid var(--line); border-radius:12px; background:#fff; box-shadow:none; }
body .static-drug-page .drug-detail-section { padding:24px 0; border-color:var(--line); }
body .static-drug-page .drug-detail-section h3 { color:var(--accent-strong); font-size:22px; }
body .static-drug-page .drug-detail-field { background:#f7faf9; border:1px solid var(--line); border-radius:8px; padding:16px; min-width:0; }
body .static-drug-page .drug-detail-field strong { overflow-wrap:anywhere; line-height:1.8; }
body .static-drug-page .static-search-bar { position:static; width:100%; margin:0; background:#f5f9f8; border:1px solid var(--line); border-radius:10px; box-shadow:none; }
.detail-reading { margin:20px 0; padding:0; border:0; background:transparent; }
.detail-reading-group { display:flex; gap:8px; flex-wrap:wrap; }
.detail-reading button { min-width:120px; min-height:46px; padding:10px 20px; border:1px solid #bdcecf; border-radius:8px; background:#fff; color:var(--muted); font:inherit; font-weight:700; cursor:pointer; }
.detail-reading button[aria-pressed="true"] { color:var(--accent-strong); background:var(--accent-soft); border-color:#a5cfc5; }
.detail-reading p { margin:12px 0 0; color:var(--muted); font-size:15px; line-height:1.8; }
.detail-reading-status { min-height:1.8em; }
body[data-drug-audience="public"] .reading-professional { display:none !important; }
body[data-drug-audience="public"] .static-drug-page .drug-detail-grid-inline { grid-template-columns:repeat(2,minmax(0,1fr)); }
body[data-drug-audience="public"] .static-drug-page .drug-detail-field-wide { grid-column:1/-1; }
body[data-drug-audience="public"] .static-drug-page .drug-detail-field strong { font-size:18px; }
.reading-source-date { color:var(--muted); font-size:14px; }
body[data-drug-audience="professional"] .reading-source-date { display:none; }
.professional-summary { margin:24px 0; padding:24px; background:#f1f7f5; border-radius:12px; color:#183c39; }
.static-drug-page .professional-summary,.static-drug-page .professional-comparison { width:100%; max-width:none; box-sizing:border-box; margin-left:0; margin-right:0; }
.professional-summary h2 { margin:0 0 20px; font-size:23px; }
.professional-summary dl { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:20px; margin:0; }
.professional-summary dt { font-size:14px; color:#526b71; margin-bottom:6px; }
.professional-summary dd { margin:0; font-weight:600; overflow-wrap:anywhere; }
.professional-summary p { font-size:14px; }
.reading-safety { border-top:1px solid var(--line); padding:18px 0; font-size:15px; color:var(--muted); }
.leaflet-reader { margin:24px 0; color:var(--text); }
.leaflet-reader > summary { cursor:pointer; font-size:18px; font-weight:700; padding:12px 0; }
.leaflet-reader .detail-reading-group button { flex:1; padding:14px; border:1px solid #bdcecf; border-radius:8px; background:white; color:#154f49; font:inherit; cursor:pointer; }
.leaflet-reader button[aria-pressed="true"] { background:#e1f0ec; font-weight:700; }
.leaflet-reader [hidden] { display:none !important; }
.leaflet-reader [data-leaflet-electronic], .leaflet-reader [data-leaflet-image] { height:640px; max-height:75vh; box-sizing:border-box; overflow:auto; scrollbar-gutter:stable; padding:20px; border:1px solid var(--line); line-height:1.9; min-width:0; scroll-padding-top:100px; }
.leaflet-reader h4 { font-size:18px; margin:24px 0 10px; }
.leaflet-reader p { white-space:pre-wrap; overflow-wrap:anywhere; }
.leaflet-reader iframe { width:100%; height:620px; border:1px solid var(--line); background:#fff; }
.leaflet-table { overflow-x:auto; max-height:none; padding-bottom:4px; }
.leaflet-table table { width:100%; border-collapse:collapse; }
.leaflet-tools { position:sticky; top:0; z-index:2; display:flex; flex-wrap:wrap; align-items:center; gap:10px; padding:14px; background:#f5f9f8; border:1px solid #bdcecf; }
.leaflet-tools label { display:flex; align-items:center; gap:16px; flex:1 1 240px; min-width:0; }
.leaflet-tools label span { flex-shrink:0; }
.leaflet-tools label input { flex:1; min-width:0; width:100%; height:44px; }
.leaflet-tools button[data-find] { width:44px; height:44px; padding:0; font-size:24px; flex-shrink:0; }
.leaflet-tools input::-webkit-search-cancel-button { -webkit-appearance:none; }
.leaflet-tools input { max-width:100%; padding:10px; border:1px solid #bdcecf; border-radius:6px; font:inherit; }
.leaflet-tools button { padding:10px 14px; color:#154f49; background:white; border:1px solid #bdcecf; border-radius:6px; cursor:pointer; }
.leaflet-tools nav { display:grid; gap:8px; padding:12px; }
.leaflet-tools output { color:#334b53; }
.leaflet-content { width:100%; max-width:none; margin:0; }
.leaflet-content section { scroll-margin-top:calc(var(--site-header-offset) + 20px); }
.leaflet-subsection { padding-left:0; border-left:0; }
.leaflet-content h4 { font-size:23px; color:#154f49; }
.leaflet-content h5 { font-size:18px; margin:20px 0 10px; }
.leaflet-content img { max-width:100%; height:auto; }
.leaflet-table-card { border:1px solid #bdcecf; border-radius:8px; margin:16px 0; }
.leaflet-table-card summary { padding:12px; background:#e1f0ec; cursor:pointer; color:#154f49; font-weight:700; }
.leaflet-table th { padding:12px; border:1px solid #bdcecf; min-width:100px; background:#e1f0ec; text-align:left; white-space:pre-wrap; }
.leaflet-table td:first-child { background:#f5f9f8; }
.leaflet-content mark { background:#fff0a3; color:#102c32; }
.leaflet-content mark.current-match { background:#ffc85b; outline:2px solid #805100; }
.leaflet-table td { padding:12px; border:1px solid #bdcecf; min-width:100px; white-space:pre-wrap; }
@media(max-width:760px) {
 :root { --site-header-offset:150px; }
 body .site-header .header-inner { min-height:150px; flex-direction:column; gap:8px; padding:12px; }
 body .site-header .brand { font-size:25px; }
 body .site-header .brand img { width:42px; height:42px; }
 body .site-header .nav { justify-content:center; gap:6px 16px; }
 body .site-header .nav a { font-size:13px; padding:4px 0; }
 body .page-shell,body .facility-account-page,body .drug-search-app { padding-left:12px; padding-right:12px; }
 body .footer .footer-inner { padding:0 12px; }
 body .desktop-product-hero-inner,body .desktop-preview-inner,body .desktop-section-inner,body .desktop-product-notice { margin-left:12px; margin-right:12px; }
 body[data-drug-audience="public"] .static-drug-page .drug-detail-grid-inline { grid-template-columns:minmax(0,1fr); }
 .detail-reading { padding:0; }
 .detail-reading-group { display:grid; grid-template-columns:1fr 1fr; }
 .detail-reading button { min-width:0; padding:10px 8px; }
}
/* Match the homepage's full-width segmented reading-mode control. */
.detail-reading > .detail-reading-group { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0; padding:4px; border:1px solid #d8e2e4; border-radius:14px; background:#fafcfc; }
.detail-reading > .detail-reading-group button { width:100%; min-width:0; min-height:96px; padding:20px 16px; border:1px solid transparent; border-radius:11px; background:transparent; font-size:26px; letter-spacing:.05em; text-align:center; }
.detail-reading > .detail-reading-group button[aria-pressed="true"] { color:#154f49; background:#e1f0ec; border-color:#b8ded5; }
@media(max-width:760px) {
 .detail-reading > .detail-reading-group button { min-height:76px; padding:14px 8px; font-size:22px; }
 .leaflet-reader [data-leaflet-electronic], .leaflet-reader [data-leaflet-image] { padding:12px; }
}
/* Consistent outer breathing room; keep full-width background bands. */
body .site-header .header-inner,
body .footer .footer-inner,
body .page-shell,
body .facility-account-page,
body .drug-search-app,
body.audience-search .drug-search-app,
body.audience-search .footer-inner,
body main.page-shell.reading-page {
 box-sizing:border-box;
 padding-left:var(--site-gutter);
 padding-right:var(--site-gutter);
}
body .desktop-product-hero-inner,
body .desktop-preview-inner,
body .desktop-section-inner,
body .desktop-product-notice,
body .desktop-product-section,
body .desktop-plans-section {
 margin-left:var(--site-gutter);
 margin-right:var(--site-gutter);
}
/* Sections already inside the page gutter should not add a second inset. */
body .drug-search-app .desktop-product-notice { margin-left:0; margin-right:0; }
@media(min-width:1100px){body .static-drug-page{max-width:1800px;width:100%;box-sizing:border-box}.drug-reading-layout{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,7fr);gap:24px;align-items:start}.drug-reading-layout>.drug-reading-appearance,.drug-reading-layout>.leaflet-reader{min-width:0;margin:0}.drug-reading-layout>.drug-reading-appearance{padding-top:0}.drug-reading-layout .drug-detail-image-grid{grid-template-columns:minmax(0,1fr)}.drug-reading-layout .drug-detail-image img{width:100%;height:auto;max-height:520px;object-fit:contain}.drug-reading-layout .leaflet-reader [data-leaflet-electronic],.drug-reading-layout .leaflet-reader [data-leaflet-image]{height:calc(100vh - 200px);max-height:1100px;min-height:600px}.drug-reading-layout .pdf-pages{max-width:900px;margin:0 auto}.drug-reading-layout .leaflet-content{max-width:900px;margin:0 auto}}
@media(max-width:1099px){.drug-reading-layout{display:block}.drug-reading-layout>.leaflet-reader{margin-top:24px}}
/* Leaflet reading cards: distinct spacing, soft corners and aligned columns. */
.drug-reading-layout{column-gap:28px;row-gap:28px}
.leaflet-reader>h3{margin:0 0 20px}
.leaflet-reader .detail-reading-group{display:flex;gap:12px;margin:0 0 16px;padding:0}
.leaflet-reader .detail-reading-group button{border-radius:14px;min-height:52px}
.leaflet-reader [data-leaflet-electronic],.leaflet-reader [data-leaflet-image]{border-radius:16px;background:#fff}
.leaflet-reader .leaflet-tools{border-radius:12px;gap:10px;margin-bottom:20px}
.leaflet-reader .leaflet-tools input,.leaflet-reader .leaflet-tools button{border-radius:10px}
.drug-reading-appearance .drug-detail-image-grid{gap:16px}
.drug-reading-appearance .drug-detail-image{border-radius:16px;overflow:hidden;margin:0}
.drug-reading-appearance .appearance-detail-list{gap:16px;margin-top:16px}
.drug-reading-appearance .appearance-detail-field{border-radius:14px}
@media(max-width:1099px){.drug-reading-layout>.leaflet-reader{margin-top:28px}}
@media(max-width:600px){.leaflet-reader .detail-reading-group{gap:10px}.leaflet-reader .leaflet-tools{padding:12px}.leaflet-reader>h3{margin-bottom:16px}}
body .static-drug-page .drug-reading-layout>.drug-reading-appearance{padding:0}
.drug-reading-layout>.drug-reading-appearance>h3,.drug-reading-layout>.leaflet-reader>h3{margin:0 0 20px;font-size:22px;color:var(--accent-strong)}
/* Public launch: equal columns and downloads attached to their source section. */
@media(min-width:1100px){.drug-reading-layout{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.drug-reading-appearance,.leaflet-reader,.drug-package-preview{position:relative}
.drug-reading-appearance>h3,.leaflet-reader>h3,.drug-package-preview>h4{padding-right:130px;min-height:32px}
.drug-section-downloads{position:absolute;top:0;right:0;display:flex;justify-content:flex-end;flex-wrap:wrap;gap:6px;max-width:60%}
.drug-section-downloads a{display:inline-flex;align-items:center;justify-content:center;min-height:32px;padding:5px 10px;border:1px solid #bdcecf;border-radius:10px;background:#fff;color:#154f49;font-size:13px;text-decoration:none}
.drug-package-preview{margin-top:24px;padding-top:24px;border-top:1px solid var(--line)}
.drug-package-preview>.drug-section-downloads{top:24px}
.drug-package-preview h4{margin:0 0 16px;font-size:20px;color:var(--accent-strong)}
.drug-package-preview iframe{width:100%;height:420px;border:0;border-radius:12px}
.drug-nhi-summary>.drug-detail-section{margin:0}
.drug-detail-section[hidden]{display:none!important}
@media(max-width:600px){.drug-section-downloads a{font-size:12px;padding:5px 8px}.drug-package-preview iframe{height:320px}}
.drug-section-downloads{z-index:5}
.drug-section-downloads summary{display:flex;align-items:center;min-height:32px;padding:5px 10px;border:1px solid #bdcecf;border-radius:10px;background:#fff;color:#154f49;font-size:13px;cursor:pointer;list-style:none}
.drug-section-downloads summary::-webkit-details-marker{display:none}
.drug-download-menu{position:absolute;right:0;top:100%;margin-top:6px;min-width:200px;max-width:min(320px,80vw);padding:8px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 24px #153c3620;display:grid;gap:6px}
.drug-download-menu a{justify-content:flex-start;overflow-wrap:anywhere}
.drug-package-preview canvas{display:block;width:100%;height:auto;border-radius:12px;margin-bottom:12px;background:#fff}
.drug-package-preview .drug-detail-image>a:empty{display:none}
.drug-package-preview>.drug-detail-image-grid{display:block;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;border:1px solid var(--line);border-radius:16px;min-height:0}
.drug-package-preview .drug-detail-image{margin:0 0 16px;border:0}
.drug-package-preview .drug-detail-image:last-child{margin-bottom:0}
.drug-section-downloads button{display:inline-flex;align-items:center;justify-content:center;min-height:32px;padding:5px 10px;border:1px solid #bdcecf;border-radius:10px;background:#fff;color:#154f49;font:inherit;font-size:13px;cursor:pointer}
.drug-section-downloads button:disabled{opacity:.6;cursor:wait}
.drug-alternative-shortcut{display:inline-flex;margin-top:12px;padding:10px 16px;min-height:44px;align-items:center;border-radius:12px;background:#1b655b;color:#fff!important;text-decoration:none;font-size:15px;font-weight:700}
#drug-alternatives{scroll-margin-top:calc(var(--site-header-offset) + 20px)}
@media(min-width:1100px){.drug-reading-layout{align-items:stretch}.drug-reading-layout>.leaflet-reader{display:flex;flex-direction:column;align-self:stretch}.drug-reading-layout>.leaflet-reader>h3,.drug-reading-layout>.leaflet-reader>.detail-reading-group{flex-shrink:0}.drug-reading-layout>.leaflet-reader>[data-leaflet-electronic],.drug-reading-layout>.leaflet-reader>[data-leaflet-image]{flex:1 1 0%;height:0!important;min-height:600px;max-height:none!important}}
.leaflet-export-document{position:absolute;left:-10000px;top:0;box-sizing:border-box;width:794px;padding:32px;background:#fff;color:#111;font:15px/1.6 "Microsoft JhengHei",sans-serif;overflow:visible}
.leaflet-export-document *{box-sizing:border-box;max-height:none!important;overflow:visible!important}
.leaflet-export-document h1{font-size:24px}.leaflet-export-document h4{font-size:19px;margin:20px 0 8px}.leaflet-export-document h5{font-size:16px}.leaflet-export-document p{white-space:pre-wrap;overflow-wrap:anywhere}
.leaflet-export-document .leaflet-content{width:100%;max-width:none}.leaflet-export-document table{width:100%;border-collapse:collapse;font-size:12px}.leaflet-export-document td,.leaflet-export-document th{border:1px solid #777;padding:5px;word-break:break-word}.leaflet-export-document img{max-width:100%;height:auto}.leaflet-export-document details{display:block}.leaflet-export-document summary{font-weight:bold}
@media(max-width:600px){.drug-section-downloads button{font-size:12px;padding:5px 8px}}
@media(min-width:1100px){.drug-reading-layout>.leaflet-reader{display:block;min-height:760px}.drug-reading-layout>.leaflet-reader>[data-leaflet-electronic],.drug-reading-layout>.leaflet-reader>[data-leaflet-image]{position:absolute;left:0;right:0;top:var(--reader-content-top,128px);bottom:0;height:auto!important;min-height:0;flex:none}}
.drug-reading-layout .drug-reading-appearance>.drug-detail-image-grid .drug-detail-image img{aspect-ratio:auto;height:auto;max-height:none;object-fit:contain}
.drug-reading-appearance>.drug-detail-image-grid .drug-detail-image a{min-height:0}
.drug-package-preview>.drug-detail-image-grid{margin-bottom:0}
.pdf-image-controls{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:8px;background:#f5f9f8;border:1px solid #d5e2df;border-radius:12px;position:sticky;top:0;left:0;z-index:4;width:fit-content;max-width:100%;box-sizing:border-box}
.pdf-image-controls button{min-height:36px;min-width:36px;padding:5px 9px;border:1px solid #bdcecf;border-radius:9px;background:#fff;color:#154f49;font:inherit;cursor:pointer}
.pdf-image-controls output{min-width:48px;text-align:center;font-size:14px}.pdf-image-controls button[aria-pressed=true]{background:#dceee9}.pdf-image-controls button:disabled{opacity:.4}
.pdf-search-toolbar .pdf-image-controls{position:static;flex-basis:100%;margin-bottom:6px;border:0;padding:0;background:transparent}
.pdf-search-toolbar{flex-wrap:wrap}
.leaflet-reader .pdf-search-toolbar{left:12px;width:calc(100% - 24px);box-sizing:border-box}
.pdf-pan-viewport{overflow:auto!important;overscroll-behavior:contain;position:relative}.pdf-pan-viewport.pdf-pan-enabled .pdf-zoom-content{cursor:grab}.pdf-pan-viewport.pdf-panning .pdf-zoom-content{cursor:grabbing;user-select:none}
.pdf-pan-viewport.pdf-pan-enabled[data-zoom]:not([data-zoom="1"]){touch-action:none}
.pdf-zoom-content{box-sizing:border-box;min-width:0}.drug-package-preview .package-zoom-content img{aspect-ratio:auto;height:auto;max-height:none}
.drug-package-preview .package-zoom-content{padding:8px}
.drug-package-preview>.drug-detail-image-grid>.pdf-image-controls{margin:8px;top:8px;left:8px}
.static-drug-page [data-empty-content="true"]{display:none!important}
.static-drug-page .drug-reading-layout.drug-reading-single{grid-template-columns:minmax(0,1fr)}
.static-drug-page [hidden]{display:none!important}
.static-drug-page .leaflet-reader[data-reader-state="error"]{min-height:0!important}
.static-drug-page .leaflet-reader[data-reader-state="error"]>[data-leaflet-electronic]{position:static;height:auto!important;min-height:0;max-height:none}