/* Learning-only components, shared by all twelve static chapters. */
.learning-hub-hero{position:relative;isolation:isolate;overflow:hidden;max-width:none;padding:48px;border-radius:24px;background:var(--knowledge-paper);color:var(--knowledge-ink);margin:18px 0 34px;box-shadow:0 12px 30px #133e3712;border:1px solid var(--knowledge-border)}
.learning-hub-hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:linear-gradient(to right,#f5f5ee 0%,rgba(245,245,238,.98) 32%,rgba(245,245,238,.88) 52%,rgba(245,245,238,.2) 78%,rgba(245,245,238,0) 100%),url('/dashboard/images/knowledge/medaka-learning-hero.webp');background-size:100% 100%,auto 100%;background-position:center,right center;background-repeat:no-repeat}
.learning-hub-hero h1{max-width:780px;font-size:clamp(28px,3.5vw,42px)}
.learning-hub-hero p{color:var(--knowledge-ink);max-width:690px}.learning-hub-hero>span{color:var(--knowledge-accent);font-size:12px}.learning-hub-hero a{color:var(--knowledge-accent);display:inline-block;margin:8px 16px 0 0}.learning-hub-hero .lesson-start{padding:10px 18px;border-radius:9px;background:#e9d59d;color:#153f36;font-weight:bold;text-decoration:none}
.learning-hub-hero::after{content:"ภาพประกอบ AI";display:block;font-size:12px;color:var(--knowledge-muted);margin-top:18px}
@media(max-width:540px){.learning-hub-hero::before{opacity:.32;background-size:100% 100%,auto 100%;background-position:center,65% center}.learning-hub-hero h1{word-break:normal;overflow-wrap:normal}}
.reading-paths{grid-template-columns:repeat(2,minmax(0,1fr))}.reading-paths .knowledge-card{border-top:3px solid #b39a62}.reading-paths h3{margin-top:0}.reading-paths p{font-size:13px}.reading-paths ol{padding-left:22px;font-size:14px}.reading-paths li{margin:8px 0}
.chapter-card{display:flex;flex-direction:column}.chapter-card .chapter-number{font-size:12px;letter-spacing:.5px;font-weight:bold;color:#4d735d}.chapter-card h2{margin:12px 0}.chapter-card .chapter-cta{padding-top:20px;margin-top:auto;color:#24634d;font-weight:bold}
.lesson-hero{max-width:900px}.lesson-hero>span{font-weight:bold}.lesson-layout{display:grid;grid-template-columns:240px minmax(0,1fr);gap:32px;align-items:start}.lesson-sidebar{position:sticky;top:20px;max-height:calc(100dvh - 40px);overflow:auto;padding:4px 12px 20px 4px;font-size:13px}.lesson-toc{padding:16px;background:#edf1e8;border:1px solid var(--knowledge-border);border-radius:14px;margin-bottom:18px}.lesson-toc summary{font-weight:bold;cursor:pointer}.lesson-toc ol{list-style:none;padding:0;margin:12px 0 0}.lesson-toc li{margin:8px 0}.lesson-toc a{text-decoration:none;display:block;padding:3px 0}.lesson-toc a:hover{text-decoration:underline}
.lesson-reading{min-width:0;overflow-wrap:anywhere}.lesson-checklist{padding:20px 26px;border:1px solid #b5cbbb;border-radius:18px;background:#edf3e9}.lesson-checklist h2{margin:0;font-size:20px}.lesson-checklist ul{padding-left:24px;margin-bottom:0}.lesson-section{background:#fff;border:1px solid var(--knowledge-border);border-radius:16px;padding:24px;margin:20px 0;scroll-margin-top:24px;box-shadow:0 4px 14px #163a3305}.lesson-section h2{margin:0 0 16px;font-size:22px}.lesson-section h3{font-size:18px;margin-top:25px}.lesson-section p:last-child{margin-bottom:0}.lesson-section li{margin:7px 0}.lesson-section blockquote{margin:20px 0;padding:12px 20px;border-left:3px solid #b39a62;background:#f7f5ee}.lesson-section summary{cursor:pointer;color:var(--knowledge-ink)}.lesson-section summary h2{display:inline;font-size:20px}.lesson-section[open] summary{margin-bottom:20px}.lesson-section summary:focus-visible,.lesson-toc summary:focus-visible{outline:3px solid #ad8030;outline-offset:6px}
.lesson-cover{margin:24px 0;border-radius:16px;overflow:hidden;background:#fff;border:1px solid var(--knowledge-border)}.lesson-cover img{display:block;width:100%;max-height:300px;object-fit:contain}.lesson-cover figcaption{padding:12px 18px;font-size:12px;color:var(--knowledge-muted)}.lesson-diagram{margin:20px 0;max-width:100%;background:#f1f5ee;border:1px solid #d8e2d9;border-radius:12px;overflow:hidden}.lesson-diagram figcaption{padding:10px 16px;font-size:12px;color:#546959;border-bottom:1px solid #d8e2d9}.lesson-diagram pre{margin:0;padding:18px;overflow:auto;max-width:100%;font-family:Consolas,Tahoma,monospace;font-size:13px;line-height:1.8;tab-size:2}.lesson-reading code{font-family:Consolas,Tahoma,monospace;font-size:.9em;background:#eef2e9;padding:2px 5px;border-radius:4px;overflow-wrap:anywhere}.lesson-table-wrap{max-width:100%;overflow:auto;margin:22px 0;border:1px solid var(--knowledge-border);border-radius:10px}.lesson-table-wrap table{width:100%;min-width:420px;border-collapse:collapse;font-size:14px}.lesson-table-wrap th{background:#eaf0e5;color:#274f3f}.lesson-table-wrap th,.lesson-table-wrap td{text-align:left;padding:12px 14px;border-bottom:1px solid #dce5d9}.lesson-table-wrap tr:nth-child(even){background:#f7f9f4}.lesson-pagination{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;margin:28px 0}.lesson-pagination a{flex:1 1 230px;padding:16px;border-radius:12px;background:#e6edde;text-decoration:none}.lesson-pagination a:last-child{text-align:right}
@media(max-width:850px){.reading-paths{grid-template-columns:1fr}.lesson-layout{grid-template-columns:1fr;gap:18px}.lesson-sidebar{position:static;max-height:none;overflow:visible;padding:0}.lesson-toc ol{columns:2;column-gap:24px}.lesson-toc li{break-inside:avoid}.learning-hub-hero{padding:30px}.lesson-toc summary{min-height:32px}}
@media(max-width:540px){.learning-hub-hero{padding:24px}.lesson-toc ol{columns:1}.lesson-section,.lesson-checklist{padding:18px}.lesson-section h2{font-size:20px}.lesson-diagram pre{padding:12px;font-size:12px}.lesson-reading .knowledge-glossary dt,.lesson-reading .knowledge-glossary dd{padding:12px}.lesson-cover img{max-height:240px}}
@media print{.knowledge-header,.knowledge-footer,.lesson-sidebar,.lesson-pagination,.knowledge-skip{display:none}.lesson-layout{display:block}.knowledge-main{max-width:none;padding:0}.lesson-section{box-shadow:none;border:0;border-bottom:1px solid #ddd;border-radius:0;padding:10px 0}.lesson-section::details-content{display:block;content-visibility:visible}.lesson-diagram pre{white-space:pre-wrap}.lesson-table-wrap{overflow:visible}.lesson-table-wrap table{min-width:0}.lesson-section summary{list-style:none}.learning-hub-hero{background:none;color:#173e37;box-shadow:none}}
