
    :root {
      font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif;
      color: #102d63;
      background: #eaf7ff;
      font-synthesis: none;
    }
    * { box-sizing: border-box; }
    body { margin: 0; min-width: 300px; }
    button, input { font: inherit; }
    button { cursor: pointer; }
    .screen {
      display: flex;
      flex-direction: column;
      width: min(100%, 430px);
      min-height: 100dvh;
      margin: 0 auto;
      overflow: hidden;
      background: linear-gradient(180deg, #e7f9ff 0, #fff 42%);
      box-shadow: 0 18px 56px rgba(23, 98, 165, .14);
    }
    .hero {
      position: relative;
      flex: none;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      height: clamp(158px, 23.5dvh, 220px);
      padding: 12px 20px 26px;
      overflow: hidden;
      background: linear-gradient(112deg, #118aff 0%, #16b4f8 64%, #20d9e5 100%);
      color: #fff;
      text-align: center;
    }
    .hero-wave { position: absolute; right: 0; bottom: -1px; left: 0; width: 100%; height: 25px; fill: #e7f9ff; }
    .signal { width: 30px; height: 30px; margin-bottom: 8px; fill: #fff; transform-origin: center; animation: signal-breathe 2.4s ease-in-out infinite; }
    @keyframes signal-breathe {
      0%, 100% { transform: scale(.84); opacity: .5; filter: drop-shadow(0 0 0 rgba(255,255,255,0)); }
      50% { transform: scale(1.2); opacity: 1; filter: drop-shadow(0 0 8px rgba(255,255,255,.9)); }
    }
    @media (prefers-reduced-motion: reduce) {
      .signal { animation: none; opacity: 1; }
    }
    h1 { margin: 0; font-size: 25px; font-weight: 800; letter-spacing: .055em; line-height: 1.25; }
    .hero p { margin: 5px 0 10px; font-size: 12px; font-weight: 600; letter-spacing: .025em; opacity: .94; }
    .tag { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border-radius: 999px; background: rgba(255,255,255,.18); font-size: 11px; font-weight: 700; }
    .tag::before { width: 6px; height: 6px; border-radius: 50%; background: #a7fcfa; content: ""; }
    main { flex: 1; padding: 14px 16px 0; }
    .lookup {
      display: flex;
      align-items: center;
      min-height: 64px;
      padding: 6px;
      border: 1px solid #cce7fa;
      border-radius: 19px;
      background: #f7fbff;
      box-shadow: 0 8px 22px rgba(15, 99, 185, .10);
    }
    .lookup:focus-within { border-color: #1599f7; box-shadow: 0 0 0 3px rgba(21,153,247,.12), 0 8px 22px rgba(15,99,185,.10); }
    .phone { flex: none; width: 21px; height: 25px; margin: 0 9px 0 10px; color: #7995b3; }
    .lookup input { flex: 1; width: 0; min-width: 0; height: 44px; padding: 0; border: 0; outline: 0; background: transparent; color: #102d63; font-size: 14px; font-weight: 600; }
    .lookup input::placeholder { color: #8197ae; opacity: 1; }
    .lookup button { flex: none; min-width: 110px; min-height: 48px; padding: 0 14px; border: 0; border-radius: 14px; background: linear-gradient(100deg, #087ef3, #0cc9e7); box-shadow: 0 4px 10px rgba(4,130,232,.18); color: #fff; font-size: 15px; font-weight: 800; white-space: nowrap; }
    .lookup button:focus-visible { outline: 3px solid #075fc2; outline-offset: 3px; }
    .notice { min-height: 22px; margin: 8px 4px 0; color: #3d6f9b; font-size: 11px; line-height: 1.5; }
    .footer { display: flex; align-items: center; gap: 12px; padding: 12px 24px calc(25px + env(safe-area-inset-bottom)); color: #7893b2; font-size: 11px; font-weight: 600; white-space: nowrap; }
    .footer::before, .footer::after { flex: 1; height: 1px; background: #d7eafb; content: ""; }
    @media (min-width: 500px) {
      body { padding: 22px; }
      .screen { min-height: min(820px, calc(100dvh - 44px)); border: 1px solid #c8e7fb; border-radius: 28px; }
    }
    @media (max-width: 360px) {
      main { padding-inline: 12px; }
      .hero { padding-inline: 12px; }
      h1 { font-size: 22px; }
      .lookup { min-height: 59px; padding: 5px; }
      .phone { width: 18px; height: 23px; margin-inline: 7px; }
      .lookup input { font-size: 12px; }
      .lookup button { min-width: 96px; min-height: 45px; padding-inline: 9px; font-size: 13px; }
      .footer { padding-inline: 17px; font-size: 10px; }
    }
  
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.lookup button:disabled{cursor:default;opacity:.72}
