/* Compact tool navigation and related links. Tool content and home grids keep site.css. */
.menu-trigger { display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:0 14px; border:1px solid var(--line); border-radius:8px; background:var(--panel); font-size:14px; font-weight:600; }
.menu-trigger svg { width:16px; height:16px; color:var(--accent); }
.menu-trigger:hover { background:var(--soft); }
.tool-menu.menu-panel { position:fixed; inset:0; margin:auto; width:min(1000px,calc(100% - 40px)); max-width:none; max-height:calc(100dvh - 40px); padding:0; overflow:hidden; display:none; gap:0; color:var(--ink); background:var(--panel); border:1px solid var(--line); border-radius:18px; box-shadow:0 24px 100px color-mix(in srgb,var(--ink) 20%,transparent); }
.tool-menu[open] { display:flex; flex-direction:column; }
.tool-menu::backdrop { background:color-mix(in srgb,var(--ink) 24%,transparent); backdrop-filter:blur(3px); }
.tool-menu [hidden] { display:none!important; }
.nav-dialog-top { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:6px 20px 0 28px; flex:none; font-size:11px; color:var(--muted); }
.nav-close { display:grid; place-items:center; width:44px; height:44px; min-width:44px; padding:0; border:0; border-radius:50%; background:transparent; font-size:27px; font-weight:300; }
.nav-close:hover { background:var(--soft); }
.nav-scroll { min-height:0; overflow-y:auto; padding:4px 28px 0; }
.nav-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:16px; }
.nav-heading h2 { font-size:25px; line-height:1.2; letter-spacing:-.7px; font-weight:600; margin:4px 0 0; }
.nav-heading>span { color:var(--muted); font:12px/1.6 var(--mono); }
.nav-eyebrow { display:block; color:var(--muted); font-size:10px; font-weight:600; text-transform:uppercase; letter-spacing:1.5px; }
.nav-search { display:flex; align-items:center; gap:12px; padding:0 14px; min-height:52px; border:1px solid var(--line); border-radius:10px; background:var(--bg); }
.nav-search:focus-within { outline:2px solid var(--accent); outline-offset:2px; }
.nav-search>svg { width:20px; height:20px; flex:none; color:var(--muted); }
.nav-search input { min-width:0; width:0; flex:1; min-height:50px; padding:0; border:0; background:transparent; color:var(--ink); font-size:16px; outline:none; }
.nav-workspace { display:grid; grid-template-columns:200px minmax(0,1fr); margin:18px -28px 0; border-top:1px solid var(--line); }
.nav-categories { padding:12px; border-right:1px solid var(--line); background:var(--bg); display:grid; gap:3px; align-content:start; }
.nav-choice { display:flex; align-items:center; gap:10px; min-width:0; min-height:44px; padding:7px 10px; text-align:left; border:1px solid transparent; border-radius:8px; background:transparent; font-size:13px; }
.nav-choice>span { min-width:0; flex:1; overflow-wrap:anywhere; }
.nav-choice small { color:var(--muted); font:10px var(--mono); }
.nav-choice[aria-pressed=true] { color:var(--c); background:var(--panel); border-color:var(--line); font-weight:650; }
.nav-choice:hover { background:var(--panel); }
.nav-icon { display:grid; place-items:center; width:30px; height:30px; flex:none; border-radius:7px; background:var(--c-soft); color:var(--c); font-style:normal; }
.nav-icon svg { width:18px; height:18px; }
.nav-icon .k { stroke:var(--c-soft); }
.nav-choice,.nav-tool,.related-card { --c:var(--accent); --c-soft:var(--accent-soft); }
@supports(color:oklch(50% .1 100)) {
 .nav-choice,.nav-tool,.related-card { --c:oklch(48% .12 var(--h,150)); --c-soft:oklch(95.5% .03 var(--h,150)); }
 @media(prefers-color-scheme:dark) { :root:not([data-theme="light"]) :is(.nav-choice,.nav-tool,.related-card) { --c:oklch(82% .1 var(--h,150)); --c-soft:oklch(31% .05 var(--h,150)); } }
 :root[data-theme="dark"] :is(.nav-choice,.nav-tool,.related-card) { --c:oklch(82% .1 var(--h,150)); --c-soft:oklch(31% .05 var(--h,150)); }
}
.nav-results { min-width:0; padding:18px; }
.nav-caption { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:10px; }
.nav-caption h3 { margin:0; font-size:17px; font-weight:600; letter-spacing:-.4px; }
.nav-caption>span { color:var(--muted); font-size:12px; }
.nav-links { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px 12px; }
.tool-menu a.nav-tool { display:flex; align-items:flex-start; gap:10px; min-height:70px; min-width:0; padding:10px; margin:0; border:0; border-radius:8px; text-decoration:none; }
.nav-tool>span:not(.nav-arrow) { min-width:0; flex:1; }
.nav-tool strong { display:block; font-size:13px; font-weight:600; line-height:1.4; overflow-wrap:anywhere; }
.nav-tool small { display:block; font-weight:400; margin-top:3px; font-size:12px; line-height:1.45; color:var(--muted); }
.nav-arrow { flex:none; color:var(--muted); font-size:12px; }
.tool-menu a.nav-tool:hover { background:var(--soft); }
.tool-menu a.nav-tool[aria-current=page] { color:var(--accent); background:var(--accent-soft); }
.nav-empty { margin:24px 0; color:var(--muted); font-size:14px; }
.nav-dialog-bottom { display:flex; flex-wrap:wrap; justify-content:space-between; gap:6px 16px; flex:none; padding:13px 28px; border-top:1px solid var(--line); background:var(--bg); color:var(--muted); font-size:11px; }
.more.related-region { margin:32px 0 0; padding:24px 0; border-top:1px solid var(--line); }
.related-heading { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; margin-bottom:14px; }
.related-heading h2 { margin:0; font-size:20px; font-weight:600; letter-spacing:-.4px; line-height:1.3; }
.browse-tools { display:inline-flex; align-items:center; min-height:44px; gap:8px; padding:0 4px; border:0; background:transparent; color:var(--accent); font-size:13px; font-weight:600; }
.browse-tools:hover { text-decoration:underline; text-underline-offset:3px; }
.related-grid { display:grid; grid-template-columns:repeat(var(--related-columns,4),minmax(0,1fr)); gap:12px; }
.related-card { display:flex; align-items:flex-start; gap:10px; min-width:0; min-height:44px; padding:14px 12px; border:1px solid var(--line); border-radius:9px; background:var(--panel); text-decoration:none; }
.related-card .nav-icon { width:28px; height:28px; }
.related-card .nav-icon svg { width:17px; height:17px; }
.related-copy { flex:1; min-width:0; }
.related-copy strong { display:block; font-size:13px; font-weight:600; line-height:1.4; overflow-wrap:anywhere; }
.related-copy small { display:block; margin-top:4px; color:var(--muted); font-size:11px; line-height:1.5; }
.related-card:hover { border-color:var(--accent); background:var(--accent-soft); }
.site-footer.compact-footer { padding:0; }
.compact-footer .wrap { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px 24px; padding:18px 0; }
.compact-footer .brand { color:var(--ink); font-size:20px; letter-spacing:-.6px; min-height:44px; }
.compact-footer .footer-brand p { margin:0; color:var(--muted); font-size:11px; }
.compact-footer nav { display:flex; flex-wrap:wrap; gap:4px 20px; }
.compact-footer nav a { display:flex; align-items:center; min-width:44px; min-height:44px; margin:0; color:var(--muted); font-size:12px; text-decoration:none; }
.compact-footer nav a:hover { color:var(--accent); text-decoration:underline; }
.compact-footer small { font-size:11px; color:var(--muted); }
@media(min-width:761px) and (max-width:1000px) {
 .nav-links { grid-template-columns:minmax(0,1fr); }
 .related-grid { grid-template-columns:repeat(min(2,var(--related-columns,4)),minmax(0,1fr)); }
}
@media(max-width:760px) {
 .tool-menu.menu-panel { width:calc(100% - 16px); max-height:calc(100dvh - 24px); border-radius:14px; }
 .nav-dialog-top { padding:4px 8px 0 18px; }
 .nav-scroll { padding:0 16px; }
 .nav-heading { margin-bottom:16px; }
 .nav-heading h2 { font-size:23px; letter-spacing:-.6px; }
 .nav-heading>span { display:none; }
 .nav-eyebrow { font-size:9px; letter-spacing:1.2px; }
 .nav-search { gap:9px; padding:0 11px; }
 .nav-workspace { grid-template-columns:minmax(0,1fr); margin:18px -16px 0; }
 .nav-categories { grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; border-right:0; border-bottom:1px solid var(--line); }
 .nav-choice { padding:7px; gap:7px; font-size:12px; }
 .nav-choice .nav-icon { width:24px; height:24px; }
 .nav-choice .nav-icon svg { width:17px; height:17px; }
 .nav-choice small { font-size:9px; }
 .nav-results { padding:18px 16px; }
 .nav-caption { margin-bottom:16px; }
 .nav-caption h3 { font-size:18px; }
 .nav-links { grid-template-columns:minmax(0,1fr); gap:8px; }
 .tool-menu a.nav-tool { align-items:center; min-height:89px; padding:13px; gap:12px; border:1px solid var(--line); border-radius:12px; }
 .nav-tool strong { font-size:14px; }
 .nav-tool small { font-size:12px; line-height:1.5; }
 .nav-tool .nav-icon { width:34px; height:34px; }
 .nav-dialog-bottom { padding:12px 16px; font-size:10px; }
 .more.related-region { margin-top:24px; padding:20px 0 16px; }
 .related-heading h2 { font-size:19px; }
 .related-grid { grid-template-columns:minmax(0,1fr); gap:0; }
 .related-card { align-items:center; padding:12px 0; border:0; border-bottom:1px solid var(--line); border-radius:0; background:transparent; }
 .related-card:last-child { border-bottom:0; }
 .related-card .nav-icon { width:30px; height:30px; }
 .related-copy strong { font-size:14px; }
 .related-copy small { font-size:12px; margin-top:2px; }
 .compact-footer .wrap { align-items:flex-start; flex-direction:column; gap:6px; }
}