.back-symptom-page { --back-green:#256548; --back-green-dark:#164832; --back-green-soft:#ecf6f0; --back-amber:#a76a28; --back-amber-soft:#fff4e7; --back-blue:#37627c; --back-blue-soft:#eef5f8; --back-purple:#665784; --back-purple-soft:#f3f0f8; }
.back-hero { background:radial-gradient(circle at 82% 20%,rgba(214,169,105,.28),transparent 28%),radial-gradient(circle at 70% 82%,rgba(55,98,124,.13),transparent 34%),linear-gradient(135deg,#eef7f2 0%,#fff9ef 100%); }
.back-title { display:flex; flex-wrap:wrap; align-items:center; gap:.42em; max-width:1050px; font-size:clamp(2.1rem,5vw,4.05rem); }
.back-title span { display:inline-flex; align-items:center; }
.back-title span:not(:last-child)::after { content:'→'; margin-left:.42em; color:var(--color-accent-dark); font-size:.54em; }
.quick-back-nav { display:flex; flex-wrap:wrap; gap:var(--space-3); margin-top:var(--space-8); }
.quick-back-nav a { display:inline-flex; align-items:center; gap:var(--space-2); padding:.78rem 1rem; border:1px solid rgba(37,101,72,.22); border-radius:999px; background:rgba(255,255,255,.84); color:var(--back-green-dark); font-size:var(--text-sm); font-weight:800; text-decoration:none; box-shadow:0 8px 22px rgba(22,72,50,.06); }
.quick-back-nav a:hover,.quick-back-nav a:focus-visible { border-color:var(--back-green); background:#fff; }
.section-kicker { margin-bottom:var(--space-2); color:var(--color-accent-dark); font-size:var(--text-sm); font-weight:900; letter-spacing:.05em; }
.back-route-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--space-5); margin-top:var(--space-8); }
.back-route-card { position:relative; display:flex; min-height:310px; flex-direction:column; padding:var(--space-8); overflow:hidden; border:1px solid #ead4b8; border-radius:28px; background:linear-gradient(155deg,#fff 0%,var(--back-amber-soft) 100%); box-shadow:0 16px 42px rgba(70,55,32,.08); }
.back-route-card.is-daily { border-color:#d4e6da; background:linear-gradient(155deg,#fff 0%,var(--back-green-soft) 100%); }
.back-route-card.is-leg { border-color:#cfdee7; background:linear-gradient(155deg,#fff 0%,var(--back-blue-soft) 100%); }
.route-number { position:absolute; top:var(--space-5); right:var(--space-6); color:rgba(22,72,50,.18); font-size:2.8rem; font-weight:900; line-height:1; }
.route-icon { display:grid; width:58px; height:58px; place-items:center; border-radius:18px; background:var(--back-amber); color:#fff; font-size:1.55rem; font-weight:900; }
.is-daily .route-icon { background:var(--back-green); font-size:1rem; } .is-leg .route-icon { background:var(--back-blue); font-size:.95rem; }
.back-route-card h3 { margin:var(--space-6) 0 var(--space-3); color:var(--color-primary-dark); font-size:clamp(1.3rem,2.2vw,1.65rem); }
.back-route-card p { margin:0; color:var(--color-text-light); line-height:1.7; }
.back-route-card>a { display:inline-flex; align-items:center; gap:var(--space-2); margin-top:auto; padding-top:var(--space-6); color:var(--back-green-dark); font-weight:900; text-decoration:none; }
.back-pattern-section,.back-visit-section { background:#f5f8f5; }
.pattern-hub { display:flex; flex-direction:column; align-items:center; justify-content:center; width:max-content; max-width:100%; margin:0 auto var(--space-4); padding:var(--space-4) var(--space-6); border-radius:18px; background:var(--color-primary-dark); color:#fff; font-size:var(--text-sm); font-weight:900; text-align:center; }
.pattern-hub b { margin-top:var(--space-2); color:#ead5bc; font-size:1.45rem; letter-spacing:.2em; }
.back-pattern-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--space-5); }
.pattern-card { padding:var(--space-6); border:1px solid var(--color-border); border-top:6px solid var(--back-green); border-radius:24px; background:#fff; box-shadow:var(--shadow-sm); }
.nerve-pattern { border-top-color:var(--back-blue); } .walking-pattern { border-top-color:var(--back-purple); }
.pattern-heading { display:flex; align-items:flex-start; gap:var(--space-3); }
.pattern-symbol { display:grid; width:48px; height:48px; flex:0 0 48px; place-items:center; border-radius:50%; background:var(--back-green); color:#fff; font-size:var(--text-xs); font-weight:900; }
.nerve-pattern .pattern-symbol { background:var(--back-blue); } .walking-pattern .pattern-symbol { background:var(--back-purple); }
.pattern-heading small { color:var(--color-text-muted); font-size:var(--text-xs); font-weight:800; }
.pattern-heading h3 { margin:var(--space-1) 0 0; color:var(--color-primary-dark); font-size:var(--text-lg); }
.pattern-card ul { display:grid; gap:var(--space-3); margin:var(--space-6) 0 0; padding:0; list-style:none; }
.pattern-card li { padding-top:var(--space-3); border-top:1px solid var(--color-border); }
.pattern-card li strong,.pattern-card li span { display:block; }
.pattern-card li strong { color:var(--color-text); font-size:var(--text-sm); }
.pattern-card li span { margin-top:.2rem; color:var(--color-text-light); font-size:var(--text-sm); line-height:1.5; }
.back-question-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-4); margin-top:var(--space-8); }
.back-question-grid details { border:1px solid var(--color-border); border-radius:18px; background:#fff; box-shadow:var(--shadow-sm); }
.back-question-grid summary { display:flex; align-items:center; justify-content:space-between; gap:var(--space-4); padding:var(--space-5); color:var(--color-primary-dark); font-weight:900; cursor:pointer; list-style:none; }
.back-question-grid summary::-webkit-details-marker { display:none; }
.back-question-grid summary span { color:var(--color-accent-dark); font-size:1.45rem; transition:transform var(--transition-fast); }
.back-question-grid details[open] summary span { transform:rotate(45deg); }
.back-question-grid details p { margin:0; padding:0 var(--space-5) var(--space-5); color:var(--color-text-light); line-height:1.7; }
.back-visit-flow { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:42px; margin-top:var(--space-8); }
.back-visit-step { position:relative; min-height:175px; padding:var(--space-6); border:1px solid var(--color-border); border-radius:22px; background:#fff; text-align:center; }
.back-visit-step:not(:last-child)::after { content:'→'; position:absolute; top:50%; right:-34px; color:var(--color-accent-dark); font-size:1.65rem; font-weight:900; transform:translateY(-50%); }
.back-visit-step>span { display:grid; width:38px; height:38px; margin:0 auto var(--space-4); place-items:center; border-radius:50%; background:var(--color-primary-dark); color:#fff; font-weight:900; }
.back-visit-step h3 { margin:0; color:var(--color-primary-dark); font-size:var(--text-lg); }
.back-visit-step p { margin:var(--space-2) 0 0; color:var(--color-text-light); font-size:var(--text-sm); line-height:1.55; }
.back-doctor-card { display:flex; align-items:center; gap:var(--space-5); max-width:860px; margin:var(--space-8) auto 0; padding:var(--space-6); border-radius:22px; background:var(--color-primary-dark); color:#fff; }
.back-doctor-mark { display:grid; width:54px; height:54px; flex:0 0 54px; place-items:center; border:1px solid rgba(255,255,255,.45); border-radius:50%; font-family:var(--font-display); font-size:1.35rem; font-weight:900; }
.back-doctor-card strong { display:block; font-size:var(--text-lg); } .back-doctor-card p { margin:var(--space-2) 0 0; color:rgba(255,255,255,.76); line-height:1.65; }
.back-actions { justify-content:center; }
@media (max-width:960px) { .back-route-grid,.back-pattern-grid { grid-template-columns:1fr; } .back-route-card { min-height:0; } .back-route-card>a { margin-top:var(--space-6); } .back-visit-flow { grid-template-columns:repeat(2,minmax(0,1fr)); row-gap:var(--space-5); } .back-visit-step::after { display:none; } }
@media (max-width:720px) { .back-title { display:grid; gap:.12em; } .back-title span:not(:last-child)::after { content:''; margin:0; } .quick-back-nav { display:grid; } .quick-back-nav a { justify-content:space-between; } .pattern-hub { width:100%; } .pattern-hub b { font-size:0; letter-spacing:0; } .pattern-hub b::after { content:'↓'; font-size:1.45rem; } .back-question-grid,.back-visit-flow { grid-template-columns:1fr; } .back-doctor-card { align-items:flex-start; } }
@media (prefers-reduced-motion:reduce) { .back-question-grid summary span { transition:none; } }
