@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:opsz,wght@9..40,400;9..40,500;9..40,600;9..40,700&family=Noto+Sans+TC:wght@400;500;600;700&display=swap');

:root { --bg:#f7f3ee; --paper:#fffdfa; --ink:#3d342e; --muted:#81766d; --line:#e5dbd1; --lilac:#f1ece7; --lilac-deep:#8b7360; --rose:#dec7b5; --rose-strong:#9a7456; --coral:#b58a67; --sage:#e2e8e3; --sage-deep:#5f7165; --sand:#f1e5d7; --shadow:0 18px 46px rgba(80,66,58,.11); --radius-lg:26px; --radius-md:17px; --radius-sm:12px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; min-width:320px; background:var(--bg); color:var(--ink); font-family:'DM Sans','Noto Sans TC',system-ui,sans-serif; }
button,input,textarea,select { font:inherit; }
button { cursor:pointer; }
button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible { outline:3px solid rgba(232,99,77,.3); outline-offset:2px; }
.app-shell { min-height:100vh; background-image:radial-gradient(circle at 8% 0%,rgba(226,214,201,.7),transparent 25rem),radial-gradient(circle at 93% 18%,rgba(241,229,215,.82),transparent 22rem); }.topbar { position:sticky; top:0; z-index:20; height:84px; padding:0 clamp(18px,4vw,64px); display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid rgba(200,178,153,.42); background:rgba(80,66,58,.98); box-shadow:0 8px 24px rgba(80,66,58,.12); backdrop-filter:blur(18px); }.topbar::after { position:absolute; content:''; left:clamp(18px,4vw,64px); right:clamp(18px,4vw,64px); bottom:-1px; height:1px; background:linear-gradient(90deg,transparent,rgba(200,178,153,.9),transparent); }.brand { display:inline-flex; align-items:center; text-decoration:none; }.brand-official-logo { display:block; width:min(270px,37vw); height:auto; max-height:46px; object-fit:contain; filter:drop-shadow(0 1px 0 rgba(255,255,255,.08)); }.topbar-actions { display:flex; align-items:center; gap:16px; }.internal-badge { padding:7px 10px; color:#fff; background:rgba(255,255,255,.1); border:1px solid rgba(200,178,153,.48); border-radius:999px; font-size:12px; font-weight:600; }.language-switch { display:inline-flex; padding:3px; background:rgba(255,255,255,.1); border:1px solid rgba(200,178,153,.48); border-radius:999px; }.lang-button { width:31px; height:28px; border:0; border-radius:999px; background:transparent; color:rgba(255,255,255,.78); font-size:12px; font-weight:600; }.lang-button.is-active { color:#50423a; background:#fff; }
main { max-width:1600px; padding:clamp(28px,4vw,64px); margin:0 auto; }.hero-section { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(300px,.6fr); gap:36px; align-items:end; padding:24px 0 36px; }.compact-hero { padding-bottom:27px; }.eyebrow,.section-kicker { margin:0 0 11px; color:var(--rose-strong); font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }.hero-copy h1 { max-width:900px; margin:0; font-size:clamp(38px,5.2vw,70px); font-weight:600; line-height:.99; letter-spacing:-.06em; }.hero-description { max-width:735px; margin:20px 0 0; color:#5e5c62; font-size:15px; line-height:1.8; }.care-card { display:flex; align-items:flex-start; gap:14px; padding:20px; border:1px solid rgba(36,38,45,.08); border-radius:var(--radius-lg); background:rgba(255,253,250,.88); box-shadow:var(--shadow); }.care-icon { display:grid; flex:0 0 auto; place-items:center; width:36px; height:36px; color:var(--rose-strong); background:#fff0ec; border-radius:50%; font-size:21px; }.care-card strong { font-size:14px; }.care-card p { margin:6px 0 0; color:var(--muted); font-size:13px; line-height:1.6; }.safety-strip { display:flex; align-items:center; gap:10px; margin-bottom:25px; padding:13px 16px; color:#526356; background:#f0f4ef; border:1px solid #dce7da; border-radius:12px; font-size:13px; }.safety-strip p { margin:0; line-height:1.55; }.safety-dot { flex:0 0 auto; width:9px; height:9px; background:var(--sage-deep); border-radius:50%; }
.mode-tabs { display:grid; gap:10px; margin-bottom:21px; }.mode-tabs-five { grid-template-columns:repeat(5,1fr); }.mode-tab { display:grid; grid-template-columns:27px 1fr; align-items:center; column-gap:10px; padding:15px 16px; color:var(--muted); text-align:left; background:rgba(255,253,250,.55); border:1px solid transparent; border-radius:var(--radius-md); transition:.2s ease; }.mode-tab span { grid-row:span 2; color:var(--rose-strong); font:11px 'DM Mono',monospace; }.mode-tab b { color:var(--ink); font-size:13px; }.mode-tab small { margin-top:4px; font-size:11px; }.mode-tab.is-active { background:var(--paper); border-color:var(--line); box-shadow:0 10px 26px rgba(62,46,38,.07); }.view-panel { display:none; }.view-panel.is-active { display:block; animation:rise .3s ease both; } @keyframes rise { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }
.workspace-header,.report-topline { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin:28px 0 16px; }.workspace-header h2,.report-topline h2 { max-width:900px; margin:0; font-size:clamp(24px,3vw,38px); line-height:1.06; letter-spacing:-.04em; }.flow-board { display:grid; grid-template-columns:repeat(6,minmax(150px,1fr)); gap:8px; align-items:stretch; padding:20px; overflow-x:auto; background:var(--paper); border:1px solid var(--line); border-radius:var(--radius-lg); box-shadow:var(--shadow); }.flow-stage { position:relative; min-width:176px; padding:17px; background:#fff; border:1px solid var(--line); border-radius:15px; }.flow-stage::after { position:absolute; content:''; left:50%; bottom:-8px; width:1px; height:8px; background:#c9c2ba; }.flow-stage-top { display:flex; justify-content:space-between; gap:8px; color:var(--rose-strong); font:10px 'DM Mono',monospace; }.flow-stage-top b { color:var(--sage-deep); font-family:'DM Sans','Noto Sans TC',sans-serif; }.flow-stage h3 { margin:13px 0 7px; font-size:15px; line-height:1.25; }.flow-stage p { margin:0; color:var(--muted); font-size:11px; line-height:1.55; }.flow-stage small { display:block; margin-top:15px; color:var(--lilac-deep); font:10px 'DM Mono',monospace; }.tone-branch { background:#fbf9ff; border-color:#ddd4ee; }.tone-human { background:#f8fcf7; border-color:#cfe0ce; }.tone-scan { background:#fff8f5; border-color:#f3c9be; }.tone-final { background:#fffdf8; border-color:#eadfc5; }.flow-arrow { display:none; }.flow-note { margin-top:12px; padding:11px 13px; color:var(--muted); border-left:3px solid var(--lilac-deep); background:rgba(238,232,247,.55); border-radius:0 9px 9px 0; font-size:12px; line-height:1.55; }
.work-layout { display:grid; gap:16px; min-height:600px; }.three-column { grid-template-columns:232px minmax(0,1fr) 282px; }.workflow-rail,.form-card,.live-summary,.planner-main,.planner-side>section,.mscan-main,.mscan-side>section { background:var(--paper); border:1px solid var(--line); border-radius:var(--radius-lg); box-shadow:var(--shadow); }.workflow-rail { padding:22px; }.workflow-rail h3 { margin:0; font-size:18px; line-height:1.3; }.stepper { display:grid; gap:17px; margin:26px 0; padding:0; list-style:none; }.stepper li { display:grid; grid-template-columns:18px 1fr; gap:8px; align-items:center; color:#aaa6a3; font-size:11px; }.stepper li::before { content:''; width:7px; height:7px; border:1px solid currentColor; border-radius:50%; }.stepper li.is-current { color:var(--ink); font-weight:700; }.stepper li.is-current::before,.stepper li.is-complete::before { background:var(--coral); border-color:var(--coral); }.stepper li.is-complete { color:var(--sage-deep); }.rail-assurance { display:flex; gap:8px; padding-top:15px; color:var(--muted); border-top:1px dashed var(--line); font-size:11px; line-height:1.55; }.rail-assurance span { color:var(--lilac-deep); }.rail-assurance p { margin:0; }.form-card { padding:24px clamp(20px,4vw,46px); min-width:0; }.card-topline { display:flex; align-items:center; justify-content:space-between; padding-bottom:19px; color:var(--muted); border-bottom:1px solid var(--line); font:11px 'DM Mono',monospace; }.question-block { padding-top:27px; }.question-block h2 { max-width:640px; margin:0; font-size:clamp(24px,3.2vw,38px); line-height:1.1; letter-spacing:-.04em; }.question-block .help { margin:11px 0 22px; color:var(--muted); font-size:13px; line-height:1.65; }.live-summary { padding:22px; }.live-summary h3 { margin:0; font-size:16px; line-height:1.3; }.summary-section { margin-top:18px; }.summary-section b,.report-meta b { display:block; margin-bottom:7px; color:var(--muted); font-size:10px; letter-spacing:.08em; }.summary-section p { margin:0; color:#56545a; font-size:12px; line-height:1.6; }.summary-pill { display:inline-block; margin:0 5px 5px 0; padding:5px 8px; color:var(--lilac-deep); background:var(--lilac); border-radius:999px; font-size:10px; }.answer-grid { display:grid; gap:10px; }.stacked-fields { display:grid; gap:18px; }.answer-option { display:flex; align-items:flex-start; gap:11px; padding:13px 14px; background:#fff; border:1px solid var(--line); border-radius:13px; cursor:pointer; font-size:13px; line-height:1.45; transition:.15s; }.answer-option:hover { border-color:#cfbfc0; }.answer-option.is-checked { background:#fff8f5; border-color:var(--rose-strong); }.answer-option input { margin:3px 0 0; accent-color:var(--coral); }.field-label { display:grid; gap:9px; color:#4a484c; font-size:12px; font-weight:600; }.field-label input,.field-label textarea,.field-label select { width:100%; min-height:45px; padding:12px 13px; color:var(--ink); background:#fff; border:1px solid var(--line); border-radius:12px; }.field-label textarea { min-height:105px; line-height:1.55; resize:vertical; }.form-actions,.planner-actions { display:flex; align-items:center; justify-content:space-between; gap:13px; margin-top:24px; }.secondary-button,.primary-button { padding:12px 16px; border-radius:10px; font-size:13px; font-weight:700; }.secondary-button { color:var(--muted); background:#fff; border:1px solid var(--line); }.primary-button { display:inline-flex; align-items:center; justify-content:center; gap:18px; color:#fff; background:var(--coral); border:1px solid var(--coral); box-shadow:0 10px 20px rgba(232,99,77,.19); }.primary-button:hover { background:#d65542; }.primary-button:disabled { opacity:.42; cursor:not-allowed; }.quiet-button { padding:7px 5px; color:var(--muted); background:transparent; border:0; font-size:12px; }.quiet-button:hover { color:var(--ink); }.pause-button { color:var(--rose-strong); }.text-link { margin:14px 0 0; padding:0; color:var(--lilac-deep); background:transparent; border:0; text-decoration:underline; font-size:12px; }.hint { color:var(--muted); font-size:11px; line-height:1.55; }.step-preview { display:grid; gap:4px; margin-top:18px; padding:13px 15px; background:#fbf9ff; border:1px solid #ddd4ee; border-radius:12px; }.step-preview span { color:var(--lilac-deep); font:10px 'DM Mono',monospace; letter-spacing:.08em; }.step-preview b { font-size:13px; }.step-preview small { color:var(--muted); font-size:11px; line-height:1.5; }.consent-hint { min-height:18px; margin:10px 0 0; }.consent-hint.is-alert { color:#a05245; font-weight:700; }.red-flag,.soft-warning { margin-top:17px; padding:11px 13px; color:#9d5649; background:#fff0ed; border:1px solid #ffd6ce; border-radius:10px; font-size:12px; line-height:1.55; }.candidate-list { display:grid; gap:9px; }.candidate-card { display:grid; gap:5px; padding:14px; background:#fbf9ff; border:1px solid #ddd4ee; border-radius:13px; }.candidate-card span,.planner-candidate span,.observation-row span { color:var(--lilac-deep); font:10px 'DM Mono',monospace; }.candidate-card strong { font-size:13px; }.candidate-card small { color:var(--muted); font-size:11px; }.route-line { margin-top:20px; font-size:12px; }.route-line b { display:block; margin-bottom:8px; }
.status-pill { display:inline-flex; align-items:center; max-width:260px; padding:7px 10px; color:var(--sage-deep); background:var(--sage); border:1px solid #c9dac9; border-radius:999px; font-size:11px; font-weight:700; }.status-pill.is-paused,.report-badge.is-paused { color:#a05245; background:#fff0ed; border-color:#ffd1c7; }.planner-layout,.mscan-layout { display:grid; grid-template-columns:minmax(0,1.25fr) 330px; gap:16px; }.planner-main,.mscan-main { padding:clamp(23px,3.5vw,44px); }.planner-side,.mscan-side { display:grid; align-content:start; gap:16px; }.planner-side>section,.mscan-side>section { padding:22px; }.script-card { margin-bottom:16px; padding:22px; background:linear-gradient(135deg,#fbf9ff,#fffdfa); border:1px solid #e1d9ef; border-radius:var(--radius-md); }.script-card blockquote { margin:0; font-size:17px; line-height:1.6; letter-spacing:-.015em; }.script-card>p:last-child { margin:13px 0 0; color:var(--muted); font-size:12px; }.planner-form-card,.scan-card { margin-top:16px; padding:22px; background:#fbfafc; border:1px solid var(--line); border-radius:var(--radius-md); }.section-head { display:flex; gap:12px; align-items:flex-start; margin-bottom:19px; }.section-index { display:grid; flex:0 0 auto; place-items:center; width:29px; height:29px; color:var(--rose-strong); background:#fff1ed; border-radius:9px; font:11px 'DM Mono',monospace; }.section-head h3 { margin:0; font-size:17px; line-height:1.3; }.section-head p { margin:5px 0 0; color:var(--muted); font-size:12px; line-height:1.55; }.verbatim-record { padding:14px 16px; background:#f7f3fb; border:1px solid #ddd4ee; border-radius:12px; }.verbatim-record span { display:block; margin-bottom:7px; color:var(--lilac-deep); font-size:10px; font-weight:700; letter-spacing:.08em; }.verbatim-record p { margin:0; color:#55535a; font-size:12px; line-height:1.65; }.planner-grid,.assessment-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }.span-2 { grid-column:span 2; }.planner-candidate,.observation-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(230px,.85fr); gap:14px; align-items:center; padding:14px 0; border-bottom:1px dashed var(--line); }.planner-candidate:last-child,.observation-row:last-child { border:0; }.planner-candidate h4,.observation-row h4 { margin:6px 0 3px; font-size:13px; }.planner-candidate p,.observation-row p { margin:0; color:var(--muted); font-size:11px; line-height:1.5; }.candidate-controls,.observation-controls { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; }.choice-button { min-height:48px; padding:8px; color:var(--muted); text-align:left; background:#fff; border:1px solid var(--line); border-radius:9px; font-size:10px; }.choice-button.is-active { color:#4c6553; background:var(--sage); border-color:#bfd2bf; font-weight:700; }.choice-button.status-revise,.choice-button.scan-needs_review { color:#796392; background:#f7f3fb; border-color:#d8ccec; }.choice-button.status-remove,.choice-button.scan-not_observed { color:#8a7370; background:#fbf8f7; }.priority-list { display:grid; gap:9px; }.priority-option { display:flex; align-items:flex-start; gap:10px; padding:12px; background:#fff; border:1px solid var(--line); border-radius:11px; cursor:pointer; }.priority-option.is-checked { background:#fff8f5; border-color:var(--rose-strong); }.priority-option input { margin-top:3px; accent-color:var(--coral); }.priority-option b { display:block; font-size:12px; line-height:1.45; }.priority-option small { display:block; margin-top:4px; color:var(--lilac-deep); font:10px 'DM Mono',monospace; }.safety-card .shield,.boundary-card .shield { display:grid; place-items:center; width:34px; height:34px; color:var(--sage-deep); background:var(--sage); border-radius:10px; font-weight:700; }.safety-card h3,.boundary-card h3 { margin:12px 0; font-size:17px; }.safety-card ul,.boundary-card ul { display:grid; gap:10px; margin:0; padding:0; list-style:none; }.safety-card li,.boundary-card li { display:flex; gap:9px; color:var(--muted); font-size:12px; line-height:1.55; }.safety-card li::before,.boundary-card li::before { content:'—'; color:var(--rose-strong); }.trace-card { min-height:175px; }.trace-entry { display:flex; align-items:baseline; gap:8px; padding:8px 0; border-bottom:1px dashed var(--line); font-size:11px; }.trace-entry:last-child { border:0; }.trace-entry span { color:var(--rose-strong); font:10px 'DM Mono',monospace; }.trace-entry b { color:#4e4d52; font-weight:600; }.empty-state { margin:0; padding:14px; color:var(--muted); background:#fff; border:1px dashed var(--line); border-radius:10px; font-size:12px; line-height:1.55; }.inline-message { min-height:18px; margin:12px 0 0; color:var(--sage-deep); font-size:12px; line-height:1.5; }
.decision-gate { display:grid; gap:10px; margin-bottom:16px; padding:14px; background:linear-gradient(135deg,#fffdf9,#f8f1e8); border:1px solid #dfcdbb; border-radius:13px; }.decision-gate .toggle-row { background:rgba(255,255,255,.72); }.decision-rule { margin:0; color:var(--muted); font-size:11px; line-height:1.6; }.decision-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }.field-help { margin:5px 0 8px; color:var(--muted); font-size:11px; line-height:1.5; }.decision-status { margin:16px 0 0; padding:11px 13px; border-radius:10px; font-size:12px; line-height:1.55; }.decision-status.is-ready { color:#526356; background:#f0f4ef; border:1px solid #dce7da; }.decision-status.is-pending { color:#8a684e; background:#fff8ef; border:1px solid #ead2b8; }
.bone-review-box { grid-column:span 2; padding:16px; background:linear-gradient(135deg,#fffaf5,#f9f4ec); border:1px solid #e5cfb9; border-radius:13px; }.bone-review-box strong { display:block; font-size:13px; }.bone-review-box>p { margin:6px 0 14px; color:var(--muted); font-size:11px; line-height:1.55; }.bone-question-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }.bone-route-card { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:18px; margin-top:14px; padding:16px; background:#f8fcf7; border:1px solid #d3e1d2; border-radius:13px; }.bone-route-card.is-possible { background:#fffaf3; border-color:#ead2b8; }.bone-route-card.is-candidate { background:#fff7f3; border-color:#f1c6bb; }.bone-route-card.is-refer { background:#fff0ed; border-color:#ffd1c7; }.bone-route-card h3 { margin:4px 0 7px; font-size:15px; line-height:1.35; }.bone-route-card p { margin:0; color:var(--muted); font-size:11px; line-height:1.55; }.bone-route-card ul { display:grid; gap:7px; margin:0; padding:0 0 0 18px; color:#5c5858; font-size:11px; line-height:1.55; }.bone-route-summary { display:grid; gap:5px; margin-bottom:15px; padding:13px 14px; color:#6d5d4c; background:#fffaf3; border:1px solid #ead2b8; border-radius:11px; font-size:12px; }.bone-route-summary.is-candidate { color:#8c5549; background:#fff3ef; border-color:#f1c6bb; }.bone-route-summary span { font-weight:700; }.bone-route-summary small { color:var(--muted); font-size:11px; line-height:1.5; }.longitudinal-note { margin:15px 0 0; padding:11px 13px; color:var(--muted); background:#f8f6f1; border:1px dashed #d9cbbb; border-radius:10px; font-size:11px; line-height:1.6; }
.protocol-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }.toggle-row { display:flex; align-items:center; gap:10px; padding:13px; color:#4a484c; background:#fff; border:1px solid var(--line); border-radius:11px; font-size:12px; font-weight:600; }.toggle-row input { accent-color:var(--coral); }.observation-matrix { display:grid; gap:0; }.report-topline { margin-bottom:16px; }.client-report { padding:clamp(20px,4vw,42px); background:var(--paper); border:1px solid var(--line); border-radius:var(--radius-lg); box-shadow:var(--shadow); }.report-header { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; padding-bottom:20px; border-bottom:1px solid var(--line); }.report-header p { max-width:660px; margin:0; color:var(--muted); font-size:12px; line-height:1.6; }.report-badge { display:inline-block; padding:7px 9px; color:var(--sage-deep); background:var(--sage); border:1px solid #c9dac9; border-radius:999px; font:10px 'DM Mono',monospace; white-space:nowrap; }.report-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:22px 0; }.report-section { min-height:190px; padding:18px; border:1px solid var(--line); border-radius:15px; }.report-section h3 { margin:0 0 12px; font-size:16px; line-height:1.3; }.report-section p,.report-section li,.report-section blockquote { color:#55535a; font-size:12px; line-height:1.65; }.report-section blockquote { margin:0; font-size:14px; }.report-section ul { margin:0; padding-left:18px; }.report-section li+li { margin-top:5px; }.report-meta { margin-top:15px; padding-top:12px; border-top:1px dashed var(--line); }.report-meta span { display:block; color:#55535a; font-size:11px; line-height:1.55; }.accent-rose { background:#fff9f7; border-color:#f5d4cc; }.accent-lilac { background:#fbf9ff; border-color:#e1d9ef; }.accent-sage { background:#f8fcf7; border-color:#d3e1d2; }.accent-sand { background:#fffdf8; border-color:#eadfc5; }.accent-line { background:#fcfaf7; }.accent-dark { color:#fff; background:#3a3b43; border-color:#3a3b43; }.accent-dark h3,.accent-dark p { color:#fff; }.hammock-card { display:grid; grid-template-columns:.9fr 1.1fr; gap:25px; align-items:center; padding:24px; color:#433e50; background:linear-gradient(135deg,#f5f0fb,#fff7f3); border:1px solid #dfd2ed; border-radius:18px; }.hammock-card h3 { margin:0 0 11px; font-size:21px; line-height:1.25; }.hammock-card p:last-child { margin:0; color:#605c69; font-size:13px; line-height:1.7; }.hammock-map { position:relative; display:grid; grid-template-columns:repeat(2,1fr); gap:10px; padding:14px; }.hammock-map span { display:block; padding:12px; color:#5e5275; background:rgba(255,255,255,.75); border:1px solid #dacceb; border-radius:12px; font-size:12px; font-weight:700; }.hammock-map small { display:block; margin-top:5px; color:#867c94; font-size:10px; font-weight:500; }.hammock-map .hammock-fabric { grid-column:span 2; color:#a25547; background:#fff3ef; border-color:#f2c8bd; }.hammock-map .hammock-motion { color:#4e715b; background:#f2f8f1; border-color:#d2e3d1; }.hammock-map .secondary { color:#7a6651; background:#fffbf3; border-color:#eadfc5; }.protocol-chips { display:flex; flex-wrap:wrap; gap:6px; margin-top:13px; }.protocol-chips span { padding:5px 7px; color:var(--sage-deep); background:var(--sage); border-radius:999px; font-size:10px; }.report-empty { padding:55px 25px; text-align:center; background:var(--paper); border:1px dashed var(--line); border-radius:var(--radius-lg); }.report-empty h3 { max-width:460px; margin:0 auto 18px; color:var(--muted); font-size:16px; font-weight:500; line-height:1.6; }
footer { display:flex; justify-content:space-between; gap:18px; max-width:1600px; margin:0 auto; padding:28px clamp(18px,4vw,64px) 32px; color:#85817e; font:10px 'DM Mono','Noto Sans TC',monospace; letter-spacing:.03em; }
@media (max-width:1280px) { .mode-tabs-five { grid-template-columns:repeat(3,1fr); }.three-column { grid-template-columns:205px minmax(0,1fr); }.live-summary { grid-column:1 / -1; }.planner-layout,.mscan-layout { grid-template-columns:minmax(0,1fr) 290px; }.flow-board { grid-template-columns:repeat(3,minmax(180px,1fr)); }.flow-stage::after { display:none; } }
@media (max-width:980px) { .planner-layout,.mscan-layout { grid-template-columns:1fr; }.planner-side,.mscan-side { grid-template-columns:repeat(2,minmax(0,1fr)); }.report-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.hero-section { grid-template-columns:1fr; }.hero-section { gap:21px; }.mode-tabs-five { grid-template-columns:repeat(2,1fr); }.mode-tab:last-child { grid-column:span 2; }.flow-board { grid-template-columns:repeat(2,minmax(180px,1fr)); } }
@media (max-width:720px) { .topbar { height:65px; }.internal-badge { display:none; }.three-column { grid-template-columns:1fr; }.workflow-rail { padding:16px 20px; }.workflow-rail h3 { display:none; }.stepper { grid-template-columns:repeat(7,1fr); gap:5px; margin:15px 0; }.stepper li { display:block; font-size:0; }.stepper li::before { display:block; }.rail-assurance { display:none; }.planner-side,.mscan-side { grid-template-columns:1fr; }.planner-grid,.assessment-grid,.protocol-grid,.decision-grid,.bone-question-grid { grid-template-columns:1fr; }.bone-review-box { grid-column:auto; }.bone-route-card { grid-template-columns:1fr; }.span-2 { grid-column:auto; }.planner-candidate,.observation-row { grid-template-columns:1fr; }.candidate-controls,.observation-controls { grid-template-columns:repeat(3,1fr); }.hammock-card { grid-template-columns:1fr; }.workspace-header,.report-topline { align-items:flex-start; flex-direction:column; }.report-grid { grid-template-columns:1fr; }.flow-board { grid-template-columns:1fr; }.mode-tabs-five { grid-template-columns:1fr; }.mode-tab:last-child { grid-column:auto; }.mode-tab { grid-template-columns:28px 1fr auto; }.mode-tab small { grid-column:2; } }
@media (max-width:500px) { main { padding:24px 16px; }.topbar { padding:0 16px; }.brand strong { font-size:11px; }.topbar-actions { gap:8px; }.hero-copy h1 { font-size:38px; }.care-card { padding:16px; }.form-card,.planner-main,.mscan-main,.client-report { padding:21px; }.form-actions,.planner-actions { flex-direction:column-reverse; align-items:stretch; }.form-actions .primary-button,.form-actions .secondary-button,.planner-actions .primary-button,.planner-actions .secondary-button { width:100%; }.form-actions .quiet-button { text-align:center; }.safety-strip { align-items:flex-start; }.report-header { flex-direction:column; }.report-badge { white-space:normal; } footer { display:block; line-height:1.8; } }
@media print { .topbar,.hero-section,.safety-strip,.mode-tabs,.report-topline button,footer { display:none!important; } main { padding:0; }.view-panel { display:none!important; }.view-panel#reportView { display:block!important; }.client-report { border:0; box-shadow:none; } body { background:white; } }