.search-guide,.search-links { box-sizing:border-box; width:calc(100% - 2 * clamp(20px,3vw,80px)); max-width:1440px; margin:20px auto; color:var(--ink,#172d45); font-family:"LINE Seed Sans TH",system-ui,sans-serif; font-size:1rem; font-weight:400; line-height:1.75; overflow-wrap:anywhere; }
.search-guide { padding:20px 24px; background:var(--surface,#fff); border:1px solid var(--line,#dfe9f2); border-radius:20px; }
.search-guide > header { display:block; padding:0; height:auto; min-height:0; border:0; background:none; max-width:80ch; margin-bottom:14px; }
.guide-eyebrow { display:block; color:var(--blue,#2457c5); font-size:.8125rem; font-weight:700; margin-bottom:4px; }
.search-guide h2 { margin:0 0 8px; font-size:clamp(1.375rem,2vw,1.875rem); line-height:1.4; font-weight:700; letter-spacing:normal; }
.search-guide h3 { margin:0 0 6px; font-size:1.0625rem; line-height:1.5; font-weight:700; letter-spacing:normal; }
.search-guide p { margin:0; max-width:78ch; font-weight:400; }
.guide-sections { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 32px; }
.guide-sections > section { min-width:0; }
.search-guide .guide-credit { font-size:.8125rem; color:var(--muted,#64758a); margin:8px 0 0; }
.search-links { display:flex; flex-wrap:wrap; gap:12px 24px; margin-block:12px 20px; padding:0; font-size:.875rem; }
.search-guide a,.search-links a { color:var(--blue,#2457c5); text-underline-offset:4px; }
.search-links a { display:inline-flex; min-height:44px; align-items:center; }
.search-guide[hidden] { display:none; }
.search-fallback { padding:28px; max-width:1120px; margin:auto; }
html[data-theme='dark'] .search-guide { background:#142739; color:#e6eff8; border-color:#30475c; }
html[data-theme='dark'] :is(.search-links,.search-guide .guide-credit) { color:#b1c4d6; }
@media(max-width:700px) { .search-guide,.search-links { width:calc(100% - 32px); margin-block:16px; }.search-guide { padding:18px 16px; }.guide-sections { grid-template-columns:minmax(0,1fr); gap:12px; } }

/* Keep the complete guide in HTML while allowing readers to expand it. */
details.search-guide { padding:0; }
.search-guide > summary { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px 24px; cursor:pointer; list-style:none; min-height:64px; box-sizing:border-box; }
.search-guide > summary::-webkit-details-marker { display:none; }
.search-guide > summary h2 { margin:0; font-size:1.0625rem; line-height:1.5; }
.search-guide > summary .guide-eyebrow { font-size:.75rem; margin-bottom:2px; }
.search-guide > summary:focus-visible { outline:3px solid var(--blue,#2457c5); outline-offset:3px; border-radius:20px; }
.guide-toggle { flex-shrink:0; font-size:1.5rem; line-height:1; transition:transform .18s ease; }
.search-guide[open] .guide-toggle { transform:rotate(180deg); }
.guide-content { padding:0 24px 20px; }
.search-guide .guide-description { margin-bottom:16px; }
@media(max-width:700px) { .search-guide > summary { padding:14px 16px; }.guide-content { padding:0 16px 18px; } }
@media(prefers-reduced-motion:reduce) { .guide-toggle { transition:none; } }