/* Fieldnotes home, section cards and the section navigation. Theme tokens only, so all three themes apply. */
.home-hero{grid-template-columns:minmax(0,1fr)}
.home-hero p{max-width:620px}
.section-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-4)}
.section-card{position:relative;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:8px;background:var(--panel);padding:22px;min-height:360px;transition:transform .2s cubic-bezier(0.16,1,0.3,1),border-color .18s,box-shadow .2s cubic-bezier(0.16,1,0.3,1)}
.section-card:hover{border-color:var(--muted);transform:translateY(-2px);box-shadow:0 6px 20px -4px rgba(0,0,0,0.22),0 1px 4px rgba(0,0,0,0.12)}
.section-card:active{transform:translateY(0) scale(0.992);transition:transform .06s ease-out,box-shadow .06s ease-out}
.section-card:focus-within{border-color:var(--accent)}
.section-card:hover .card-icon{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 12%, transparent);transform:translateY(-1px)}
.section-card:hover .section-cta span{transform:translate(2px,-2px)}
/* The whole card is one link; sub-section links sit above it. */
.section-card-link{position:absolute;inset:0;border-radius:inherit;z-index:1}
.section-card .card-top .number{font-size:9px;letter-spacing:1.3px}
.section-card h3{font-size:21px;font-weight:500;letter-spacing:-.5px;margin:0 0 10px;color:var(--text)}
.section-card p{font-size:12px;color:var(--muted);line-height:1.85;margin:0 0 16px}
.section-tracks{position:relative;z-index:2;display:flex;flex-direction:column;gap:6px;margin-top:auto;margin-bottom:10px;max-height:162px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--line) transparent;padding-right:3px}
.section-tracks::-webkit-scrollbar{width:4px}
.section-tracks::-webkit-scrollbar-track{background:transparent}
.section-tracks::-webkit-scrollbar-thumb{background:var(--line);border-radius:4px}
.section-tracks::-webkit-scrollbar-thumb:hover{background:var(--faint)}
.section-track{display:flex;justify-content:space-between;align-items:center;border:1px solid var(--line);border-radius:5px;padding:7px 11px;font-size:12px;color:var(--text);flex-shrink:0;transition:border-color .15s,background .15s,color .15s,transform .12s}
.section-track:hover{border-color:var(--accent);color:var(--accent);background:var(--raised)}
.section-track:active{transform:scale(0.985);transition:transform .06s ease-out}
.section-track-count{font:10px ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--faint)}
.section-track:hover .section-track-count{color:var(--accent)}
.section-card .card-bottom{margin-top:auto}
.card-category-badge{display:inline-block;padding:2px 7px;border-radius:4px;font:600 8.5px ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:1px;background:#c8b5fb18;color:var(--accent);margin-right:6px}
.card-category-badge.card-category-curricula{background:#c8b5fb18;color:var(--accent);border:1px solid #c8b5fb30}
.card-category-badge.card-category-workbench{background:#e5c07b18;color:#dfbe88;border:1px solid #e5c07b30}
.card-category-badge.card-category-research{background:#7fd5ea18;color:#7fd5ea;border:1px solid #7fd5ea30}
:root[data-theme='vercel-light'] .card-category-badge.card-category-workbench{color:#855a00;border-color:#d4a01740;background:#d4a01712}
:root[data-theme='vercel-light'] .card-category-badge.card-category-research{color:#006677;border-color:#00889940;background:#00889912}
.section-title-wrap{display:flex;flex-direction:column;gap:3px}
.section-title-desc{font-size:11px;color:var(--muted);font-weight:400}
.home-filters{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-bottom:0}
.section-card[hidden]{display:none!important}
.section-cta{display:inline-flex;align-items:center;gap:4px;color:var(--accent);font:500 11px var(--theme-sans,"Avenir Next","Segoe UI",sans-serif);white-space:nowrap}
.section-cta span{display:inline-block;transition:transform .18s cubic-bezier(0.16,1,0.3,1)}
/* Sidebar: sleek scrollbar, clean hierarchy, sharp active selection and tree lines. */
.sidebar{scrollbar-width:thin;scrollbar-color:var(--line) transparent}
.sidebar::-webkit-scrollbar{width:5px}
.sidebar::-webkit-scrollbar-track{background:transparent}
.sidebar::-webkit-scrollbar-thumb{background:var(--line);border-radius:4px}
.sidebar::-webkit-scrollbar-thumb:hover{background:var(--faint)}
.side-home,.side-link{display:flex;align-items:center;gap:9px;min-width:0;padding:7px 9px;border-radius:6px;color:var(--muted);font-size:13px;line-height:1.3;transition:background .15s,color .15s,box-shadow .15s}
.side-home:hover,.side-link:hover{background:var(--raised);color:var(--text)}
.side-home.active,.side-link.active{background:var(--raised);color:var(--text)}
.side-home[aria-current="page"],.side-link[aria-current="page"]{background:var(--raised);color:var(--text);box-shadow:inset 3px 0 0 var(--accent);font-weight:500}
.side-link[aria-current="location"]{color:var(--text);font-weight:500;background:transparent}
.side-link[aria-current="location"]:hover{background:var(--raised)}
.side-nav{display:flex;flex-direction:column;margin-top:12px}
.side-category-header{padding:16px 10px 6px;font:700 9px/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:1.5px;color:var(--faint);text-transform:uppercase}
.side-category-header:first-child{padding-top:4px}
.side-category-header:not(:first-child){border-top:1px solid var(--line);margin-top:10px;padding-top:14px}
.side-group{display:flex;flex-direction:column;gap:2px;padding:6px 0 10px}
.side-group + .side-group{border-top:1px dashed color-mix(in srgb, var(--line) 70%, transparent);margin-top:4px;padding-top:8px}
.side-heading{display:block;padding:0 10px 8px;font:600 10px/1.4 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:1.3px;text-transform:uppercase;color:var(--faint)}
a.side-heading:hover{color:var(--text)}
.side-heading.active{color:var(--accent)}
.side-icon{flex:none;display:inline-grid;place-items:center;width:20px;height:20px;border:1px solid var(--line);border-radius:5px;font-size:11px;line-height:1;color:var(--muted);transition:border-color .15s,color .15s}
.side-link.active .side-icon,.side-home.active .side-icon,.side-link[aria-current="location"] .side-icon{color:var(--accent);border-color:var(--accent)}
.side-text{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.side-count{flex:none;font:600 10px ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--faint);letter-spacing:0.3px}
.side-row{display:flex;align-items:center;gap:2px}
.side-row .side-link{flex:1}
.side-toggle{flex:none;display:grid;place-items:center;width:24px;height:26px;border-radius:5px;color:var(--faint);cursor:pointer;transition:background .15s,color .15s}
.side-toggle:hover{background:var(--raised);color:var(--text)}
.side-toggle span{display:inline-block;font-size:14px;line-height:1;transition:transform .18s cubic-bezier(0.16,1,0.3,1)}
.side-toggle[aria-expanded="true"] span{transform:rotate(90deg);color:var(--text)}
.side-lessons{display:flex;flex-direction:column;gap:2px;margin:4px 0 8px 18px;padding-left:8px;border-left:1px solid var(--line)}
.side-lessons[hidden]{display:none!important}
.side-lessons .chapter-link{padding:6px 9px;font-size:12px;line-height:1.4;display:flex;align-items:baseline;gap:9px;border-radius:5px;white-space:normal;min-height:30px;color:var(--muted);text-decoration:none;transition:background .12s,color .12s,box-shadow .12s}
.side-lessons .chapter-link:hover{background:var(--raised);color:var(--text)}
.side-lessons .chapter-link:hover .chapter-number{color:var(--text)}
.side-lessons .chapter-link.active{background:var(--raised);color:var(--text);box-shadow:inset 3px 0 0 var(--accent);font-weight:500}
.side-lessons .chapter-link .chapter-number{min-width:28px;flex-shrink:0;font:600 11px/1.4 var(--theme-mono,ui-monospace,SFMono-Regular,Consolas,monospace);color:var(--faint);letter-spacing:0.5px}
.side-lessons .chapter-link.active .chapter-number{color:var(--accent);font-weight:700}
.side-home:active,.side-link:active,.side-lessons .chapter-link:active{transform:scale(0.985);transition:transform .06s ease-out}
.side-toggle:active{transform:scale(0.92);transition:transform .06s ease-out}
.side-heading{padding-left:8px}
@media(prefers-reduced-motion:reduce){.side-toggle span,.side-home,.side-link,.side-lessons .chapter-link,.section-card,.section-track,.section-cta span{transition:none!important;transform:none!important}}
.drawer-sections{display:grid;gap:5px;margin-bottom:6px}
@media(max-width:1050px){.section-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.section-grid{grid-template-columns:1fr}.section-card{min-height:0;padding:18px}.section-card h3{font-size:18px}.section-card .card-bottom{flex-wrap:wrap;gap:8px}}
