* { box-sizing: border-box; }
    html, body { margin: 0; height: 100%; }
    body { font-family: "PingFang SC", "Hiragino Sans GB", system-ui, sans-serif; }

    /* 背景图=全部视觉（按钮、插画都画在图里），点击区靠百分比对位 */
    .bgc {
      position: relative;
      height: 100vh;
      height: 100svh;
      overflow-y: auto;
      background: url(/assets/bg-1e2435ba.webp) no-repeat left top;
      background-size: 100% 100%;
      background-position: center center;
      background-color: #0e0e0e;
    }

    /* 线路选择：框画在背景图里，这里只叠文字与点击区（坐标=图上实测像素/1500 与 /2900） */
    .lines {
      position: absolute;
      left: 9%;
      top: 64.69%;
      width: 82.2%;
      height: 2.5517%;
      display: flex;
      gap: 1.7333vw; /* 用 vw：百分比 gap 会按容器宽（82.2%）算，缝会变小 0.2% */
    }
    .lines > button {
      flex: 1;
      min-width: 0;
      padding: 0;
      border: 1px solid #a8c7f0;                 /* 框由 CSS 画：线路几条都不用重出背景图 */
      border-radius: 999px;
      background: rgba(255, 255, 255, .92);
      box-shadow: 0 .4vh .9vh rgba(34, 86, 255, .12);
      color: #2256ff;
      font-family: inherit;
      font-size: min(3.2vw, 1.55vh);
      font-weight: 600;
      line-height: 1;
      letter-spacing: .04em;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      cursor: pointer;
      -webkit-tap-highlight-color: transparent;
    }
    .lines > button.on { background: #2256ff; border-color: #2256ff; color: #fff; }
    .lines > button.down { opacity: .38; }

    /* 平台按钮：位置对齐背景图上画好的按钮 */
    .btn { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
    .btn > a {
      position: absolute;
      left: 8%;
      width: 84%;
      height: 7.2%;
      pointer-events: auto;
      cursor: pointer;
      padding: 0; border: 0; background: transparent; border-radius: 999px;
      -webkit-tap-highlight-color: transparent;
    }
    .btn > a:first-child { top: 74.8%; }
    .btn > a:last-child { top: 82.5%; }

    button:focus-visible, a:focus-visible { outline: 3px solid #102e80; outline-offset: 4px; }
    .toast {
      position: fixed; left: 50%; top: max(12px, env(safe-area-inset-top)); transform: translateX(-50%);
      width: max-content; max-width: calc(100vw - 32px); padding: 10px 16px; border-radius: 999px;
      background: rgba(14, 32, 60, .88); color: #fff; font-size: 13px;
      opacity: 0; pointer-events: none; transition: opacity .2s; z-index: 999;
    }
    .toast.show { opacity: 1; }

    .loading-overlay { border: 0; padding: 24px; width: min(88vw, 420px); border-radius: 18px; color: #19324d; }
    .loading-overlay::backdrop { background: rgba(0, 0, 0, .55); }
    .loading-title { margin: 0 0 12px; font-size: 20px; }
    .loading-desc { margin: 0; font-size: 15px; line-height: 1.7; white-space: pre-line; }
    .help-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 20px; }
    .help-actions button { flex: 1; min-height: 44px; border: 1px solid #cad9ef; border-radius: 10px; background: white; color: #2256ff; font: inherit; cursor: pointer; }
    .help-actions button.primary { background: #2256ff; color: white; border-color: #2256ff; }
    .page-url { display: block; width: 100%; margin-top: 16px; padding: 10px; border: 1px solid #cad9ef; border-radius: 8px; font-size: 13px; }
    .page-url[hidden] { display: none; }

.init-status { position: fixed; bottom: 0; left: 0; width: 100%; margin: 0; padding: 10px; background: #fff; color: #19324d; font-size: 13px; text-align: center; }
