/* ============================================================
   semiEE global navbar — injected on every SSR page by src/ssr.js
   (light + colorful theme; loaded AFTER style.css so overrides win)

   z-index ladder (see style.css):
     .grid 2 · node badge 4 · .app-header 20 · [.site-nav 30] ·
     .update-sidebar 38/39 · .scrim 40 · .drawer 50 · toast 80 ·
     future modal 9000+
   The navbar sits above in-page content but BELOW overlays
   (本期重點 panel / drawer / scrim), so open panels cover it.
   ============================================================ */

:root{ --snav-h: 52px; }

.site-nav{
  position: sticky;
  top: 0;
  z-index: 30;
  background: #fff;
  border-bottom: 1px solid var(--border, #e2e8f4);
  box-shadow: 0 1px 0 rgba(31,42,68,.04), 0 4px 14px rgba(31,42,68,.07);
}
.site-nav-inner{
  max-width: 1280px;
  margin: 0 auto;
  height: var(--snav-h);
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 0 22px;
}

/* ---- logo (inline SVG: hex chip + semiEE wordmark) ---- */
.site-nav-logo{
  flex: none;                 /* never squeezed by the link row */
  display: flex;
  align-items: center;
  text-decoration: none;
  line-height: 0;
  border-radius: 8px;
}
.site-nav-logo svg{ height: 30px; width: auto; display: block; }
.site-nav-logo:hover{ opacity: .85; }
.site-nav-logo:focus-visible{ outline: 2px solid var(--accent, #2f6bff); outline-offset: 2px; }

/* ---- links (plain <a> full navigation — no client-side routing) ---- */
.site-nav-links{
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;        /* never wrap… */
  overflow-x: auto;           /* …scroll sideways on narrow screens instead */
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.site-nav-links::-webkit-scrollbar{ display: none; }

/* ---- auth chip (login / avatar) hydrated client-side ---- */
.site-nav-auth{ flex: none; display: inline-flex; align-items: center; gap: 8px; }
.site-nav-auth:empty{ display: none; }
.nav-login{ display: inline-flex; align-items: center; padding: 6px 14px; border-radius: 999px;
  font-size: 13px; font-weight: 600; text-decoration: none; color: #fff;
  background: linear-gradient(135deg,#2f6bff,#6d28d9); }
.nav-login:hover{ filter: brightness(1.06); }
.nav-av{ width: 28px; height: 28px; border-radius: 50%; object-fit: cover; background: #e2e8f0; }
.nav-av-ph{ display: inline-flex; align-items: center; justify-content: center; font-size: 13px;
  font-weight: 700; color: #fff; text-transform: uppercase; background: linear-gradient(135deg,#2f6bff,#8e4ec6); }
.nav-uname{ font-size: 13px; font-weight: 600; color: #1f2a44; max-width: 120px; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; }
.nav-logout{ font-size: 12px; color: #64748b; text-decoration: none; padding: 4px 8px; border-radius: 6px; }
.nav-logout:hover{ color: #1f2a44; background: #f1f5f9; }
@media (max-width: 640px){ .nav-uname{ display: none; } }

.site-nav .nav-link{
  flex: none;
  text-decoration: none;
  color: var(--ink-2, #46546f);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .01em;
  padding: 7px 12px;
  border-radius: 8px;
  box-shadow: inset 0 -2px 0 transparent;   /* reserve the active underline */
  transition: color .15s, background .15s, box-shadow .15s;
}
.site-nav .nav-link:hover{
  color: var(--ink, #1f2a44);
  background: #f1f5fd;
}
.site-nav .nav-link.is-active{
  color: var(--accent, #2f6bff);
  background: #eef3ff;
  box-shadow: inset 0 -2px 0 var(--accent, #2f6bff);
}
.site-nav .nav-link:focus-visible{ outline: 2px solid var(--accent, #2f6bff); outline-offset: 1px; }

/* The in-app sticky header (topic pages) now sticks BELOW the navbar.
   Safe to override here: this rule only loads on pages that have the navbar. */
.app-header{ top: var(--snav-h); }

/* ---- mobile (<640px): shrink type, keep one row, logo untouched ---- */
@media (max-width: 640px){
  :root{ --snav-h: 48px; }
  .site-nav-inner{ gap: 10px; padding: 0 12px; }
  .site-nav-logo svg{ height: 26px; }
  .site-nav .nav-link{ font-size: 13px; padding: 6px 9px; }
}

/* ============================================================
   .co-link — clickable company-name marker (contract markup:
   <button class="co-link" data-ticker data-name>…</button>).
   Scoped to the 本期重點 sidebar (.us-txt) only — the drawer
   company table gets its own .co-link base style injected by
   engine.js, and the two must not compete (specificity clash).
   Click behaviour lives in engine.js.
   ============================================================ */
.us-txt button.co-link{
  appearance: none;
  -webkit-appearance: none;
  background: none;
  border: none;
  padding: 0 1px;
  margin: 0;
  font: inherit;
  color: var(--accent, #2f6bff);
  cursor: pointer;
  text-decoration: underline dotted rgba(47,107,255,.55);
  text-underline-offset: 2px;
  border-radius: 3px;
}
.us-txt button.co-link:hover{
  color: #1d4ed8;
  background: rgba(47,107,255,.08);
  text-decoration-style: solid;
}
.us-txt button.co-link:focus-visible{ outline: 2px solid var(--accent, #2f6bff); outline-offset: 1px; }

/* ============================================================
   留言區 comments (topic pages) — light theme, matches .ssr-fallback width
   ============================================================ */
.comments-section{max-width:1100px;margin:8px auto 64px;padding:0 28px;font-family:inherit}
.cm-title{font-size:18px;color:#0f172a;margin:0 0 4px;font-weight:700}
.cm-count{color:#94a3b8;font-weight:600;font-size:15px}
.cm-note{font-size:12px;color:#64748b;margin:0 0 16px;line-height:1.6}
.cm-compose{margin:0 0 22px}
.cm-compose-row{display:flex;gap:12px;align-items:flex-start}
.cm-compose-main{flex:1;min-width:0}
.cm-av{width:36px;height:36px;border-radius:50%;object-fit:cover;flex:none;background:#e2e8f0}
.cm-av-ph{display:flex;align-items:center;justify-content:center;font-weight:700;color:#fff;
  background:linear-gradient(135deg,#2f6bff,#8e4ec6);font-size:15px;text-transform:uppercase}
.cm-input{width:100%;box-sizing:border-box;border:1px solid #cbd5e1;border-radius:10px;padding:10px 12px;
  font:inherit;font-size:14px;color:#1e293b;resize:vertical;min-height:64px;background:#fff}
.cm-input:focus{outline:none;border-color:#2f6bff;box-shadow:0 0 0 3px rgba(47,107,255,.12)}
.cm-compose-foot{display:flex;align-items:center;justify-content:space-between;margin-top:8px;gap:12px}
.cm-asuser{font-size:12px;color:#94a3b8}
.cm-submit{appearance:none;border:0;border-radius:8px;padding:8px 18px;font:inherit;font-weight:600;font-size:14px;
  color:#fff;background:linear-gradient(135deg,#2f6bff,#6d28d9);cursor:pointer}
.cm-submit:hover{filter:brightness(1.05)}
.cm-submit:disabled{opacity:.6;cursor:default}
.cm-replyhint{font-size:12px;color:#475569;margin-bottom:6px}
.cm-linkbtn,.cm-del,.cm-replybtn{appearance:none;background:none;border:0;padding:0;font:inherit;
  font-size:12px;color:#2563eb;cursor:pointer}
.cm-linkbtn:hover,.cm-del:hover,.cm-replybtn:hover{text-decoration:underline}
.cm-login{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:16px;border:1px dashed #cbd5e1;
  border-radius:12px;background:#f8fafc;font-size:13px;color:#475569}
.cm-login-btn{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border:1px solid #dadce0;
  border-radius:8px;background:#fff;color:#3c4043;font-weight:600;font-size:13px;text-decoration:none}
.cm-login-btn:hover{background:#f8faff;box-shadow:0 1px 3px rgba(60,64,67,.2)}
.cm-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:18px}
.cm-replies{list-style:none;margin:14px 0 0 26px;padding:0 0 0 16px;border-left:2px solid #eef2f7;
  display:flex;flex-direction:column;gap:14px}
.cm-item{}
.cm-head{display:flex;align-items:center;gap:8px}
.cm-author{font-weight:600;color:#0f172a;font-size:13px}
.cm-date{color:#94a3b8;font-size:11px}
.cm-actions{margin-left:auto;display:flex;gap:12px}
.cm-body{margin:6px 0 0 44px;color:#334155;font-size:14px;line-height:1.65;white-space:pre-wrap;word-break:break-word}
.cm-reply .cm-body{margin-left:44px}
.cm-empty{color:#94a3b8;font-size:13px;padding:18px 0}
@media (max-width:640px){
  .comments-section{padding:0 16px;margin-bottom:48px}
  .cm-body{margin-left:0;margin-top:8px}
  .cm-replies{margin-left:12px;padding-left:12px}
}

/* ============================================================
   FAQ block (AEO / answer-engine extractable Q&A on topic pages)
   ============================================================ */
.faq-block{margin-top:6px}
.faq-block h2{font-size:16px;color:#0f172a;margin:0 0 6px;font-weight:700}
.faq-block dl{margin:0}
.faq-block dt{font-weight:700;color:#1e293b;margin:12px 0 3px;font-size:14px}
.faq-block dt::before{content:"Q ";color:#2f6bff;font-weight:800}
.faq-block dd{margin:0 0 8px;color:#475569;font-size:13px;line-height:1.7}