.header{position:sticky;top:0;z-index:30}
.header-actions{display:flex;align-items:center;gap:18px}
.header-action{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-width:48px;padding:4px 2px;border:0;background:transparent;color:#fff;font:inherit;cursor:pointer}
.header-action svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.header-action span{font-size:.67rem;font-weight:800;white-space:nowrap}
.favorite-count{position:absolute;right:1px;top:0;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:#ff8400;color:#111;font-size:.62rem;line-height:17px;text-align:center}
.header nav{display:none;position:absolute;right:max(18px,calc((100vw - 1180px)/2));top:66px;width:250px;padding:7px;border:1px solid #28587b;border-radius:9px;background:#071525f7;box-shadow:0 14px 35px #0008;gap:0}
.header nav.open{display:grid}
.header nav a{padding:11px 13px;border-bottom:1px solid #244057;color:#fff;text-decoration:none;font-size:.82rem;font-weight:800}
.header nav a:last-child{border-bottom:0}
.menu-toggle{display:flex}
.favorite-toggle{position:absolute;z-index:3;right:8px;top:8px;width:34px;height:34px;display:grid;place-items:center;border:1px solid #c9d4dc;border-radius:50%;background:#fffffff0;color:#263746;box-shadow:0 2px 7px #0002;cursor:pointer}
.favorite-toggle svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.favorite-toggle.is-saved{border-color:#ff9a00;background:#fff4df;color:#ff7100}
.favorite-toggle.is-saved svg{fill:#ff8400;stroke:#ff7100}
.utility-dialog{width:min(560px,calc(100% - 30px));max-height:min(720px,calc(100dvh - 40px));padding:24px;border:1px solid #bfd2df;background:#f8fbfd;color:#101820}
.utility-dialog .close{position:absolute;right:12px;top:8px;float:none}
.utility-dialog-head span{color:#0879bd;font-size:.72rem;font-weight:900;letter-spacing:.08em}
.utility-dialog-head h2{margin:0 38px 15px 0;font-size:1.45rem;line-height:1.3}
.site-search{height:48px;display:flex;align-items:center;gap:9px;padding:0 13px;border:2px solid #148ece;border-radius:8px;background:#fff}
.site-search svg{flex:none;width:22px;height:22px;fill:none;stroke:#0879bd;stroke-width:2;stroke-linecap:round}
.site-search input{width:100%;border:0;outline:0;background:transparent;font:inherit;font-size:.95rem}
.utility-results{display:grid;gap:8px;margin-top:14px;overflow-y:auto;max-height:450px}
.utility-result{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 13px;border:1px solid #d6e1e8;border-radius:7px;background:#fff;color:#101820;text-align:left;text-decoration:none;font:inherit;cursor:pointer}
.utility-result span{min-width:0}
.utility-result small{display:block;color:#0879bd;font-size:.67rem;font-weight:900}
.utility-result b{display:block;overflow:hidden;text-overflow:ellipsis;font-size:.84rem;line-height:1.35;white-space:nowrap}
.utility-result>i{flex:none;color:#ff8400;font-style:normal;font-size:1.3rem}
.utility-empty{padding:24px 10px;color:#64717c;text-align:center;font-size:.84rem}

@media(max-width:780px){
  .header{height:64px;padding:0 10px 0 12px}
  .brand img{width:142px}
  .header-actions{gap:3px}
  .header-action{min-width:43px;padding:3px 1px}
  .header-action svg{width:22px;height:22px}
  .header-action span{font-size:.55rem;letter-spacing:-.03em}
  .favorite-count{right:0;top:-1px}
  .header nav{left:8px;right:8px;top:60px;width:auto;padding:7px}
  .header nav.open{grid-template-columns:repeat(2,1fr)}
  .header nav a{padding:11px 8px;text-align:center;border:0;border-bottom:1px solid #244057;font-size:.74rem}
  .favorite-toggle{right:6px;top:6px;width:30px;height:30px}
  .favorite-toggle svg{width:17px;height:17px}
  .utility-dialog{padding:20px 14px 16px;border-radius:12px}
  .utility-dialog-head h2{font-size:1.25rem}
  .utility-results{max-height:55dvh}
}
