:root{
    --green:#bf1a20; --green-d:#611218; --bg:#faf5f4; --card:#fff;
    --line:#ecdede; --txt:#241f1f; --muted:#7a6b6b; --accent:#bf1a20;
    --b120:#bf1a20; --b184:#1e64f9;
  }
  *{box-sizing:border-box}
  body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
       background:var(--bg);color:var(--txt);-webkit-text-size-adjust:100%}
  .wrap{max-width:680px;margin:0 auto;padding:0 14px 60px}
  header{background:linear-gradient(135deg,var(--green),var(--green-d));color:#fff;
         padding:20px 16px 22px;text-align:center}
  header img.logo{display:block;height:58px;width:auto;margin:2px auto 12px;
                  filter:brightness(0) invert(1)}
  header h1{margin:0;font-size:19px;line-height:1.3}
  header p{margin:6px 0 0;font-size:13px;opacity:.92}
  .card{background:var(--card);border:1px solid var(--line);border-radius:14px;
        padding:14px;margin-top:14px;box-shadow:0 1px 3px rgba(0,0,0,.04)}
  label{display:block;font-size:12px;font-weight:600;color:var(--muted);
        margin:0 0 4px 2px;text-transform:uppercase;letter-spacing:.03em}
  select,input{width:100%;padding:12px 12px;font-size:16px;border:1px solid var(--line);
        border-radius:10px;background:#fff;color:var(--txt);-webkit-appearance:none;appearance:none}
  select:focus,input:focus{outline:2px solid var(--green);border-color:var(--green)}
  .row{display:flex;gap:10px}
  .row>div{flex:1}
  .swap{display:flex;justify-content:center;margin:8px 0}
  .swap button{background:#f7e9e9;border:1px solid var(--line);border-radius:999px;
        width:40px;height:40px;font-size:18px;cursor:pointer;color:var(--green-d)}
  .swap button:active{transform:scale(.94)}
  .go{width:100%;margin-top:14px;background:var(--green);color:#fff;border:0;border-radius:12px;
        padding:15px;font-size:17px;font-weight:700;cursor:pointer}
  .go:active{background:var(--green-d)}
  .chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
  .chip{background:#f7e9e9;border:1px solid var(--line);border-radius:999px;padding:7px 12px;
        font-size:13px;cursor:pointer;color:var(--green-d)}
  .chip:active{background:#f0d6d6}
  .svc{font-size:12.5px;color:var(--muted);margin:10px 2px 0;text-align:center}
  .res{margin-top:10px}
  .conn{background:var(--card);border:1px solid var(--line);border-radius:14px;margin-top:12px;
        overflow:hidden}
  .conn-head{display:flex;align-items:center;gap:12px;padding:13px 14px;cursor:pointer}
  .times{display:flex;align-items:baseline;gap:8px;font-weight:700;font-size:20px;white-space:nowrap}
  .times .arrow{color:var(--muted);font-weight:400;font-size:16px}
  .meta{margin-left:auto;text-align:right;font-size:12px;color:var(--muted);line-height:1.5}
  .badges{display:flex;gap:5px;justify-content:flex-end;flex-wrap:wrap;margin-top:3px}
  .badge{font-size:11px;font-weight:700;color:#fff;border-radius:6px;padding:2px 7px}
  .badge.l120{background:var(--b120)} .badge.l184{background:var(--b184)}
  .badge.t{background:#ef6c00}
  .dur{font-variant-numeric:tabular-nums}
  .legs{border-top:1px dashed var(--line);padding:6px 14px 12px;display:none;background:#fbfdfb}
  .conn.open .legs{display:block}
  .leg{margin-top:10px}
  .leg-line{font-size:12px;font-weight:700;margin-bottom:4px}
  .leg-line.l120{color:var(--b120)} .leg-line.l184{color:var(--b184)}
  .stoprow{display:flex;gap:10px;font-size:13.5px;padding:2px 0;align-items:center}
  .stoprow .tm{font-variant-numeric:tabular-nums;font-weight:600;min-width:46px}
  .stoprow.mid{color:var(--muted);font-size:12.5px}
  .stoprow .dot{width:9px;height:9px;border-radius:50%;border:2px solid var(--green);background:#fff;flex:0 0 auto}
  .stoprow.end .dot{background:var(--green)}
  .xmark{font-size:11px;color:#b26a00;margin-left:4px}
  .wait{font-size:12px;color:#ef6c00;margin:8px 0 2px;padding-left:2px}
  .empty{padding:24px 14px;text-align:center;color:var(--muted);font-size:14px}
  .note{font-size:12px;color:var(--muted);line-height:1.55;margin-top:14px;
        background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px}
  .note b{color:var(--txt)}
  details.about{margin-top:12px}
  details.about summary{cursor:pointer;font-size:13px;color:var(--green-d);font-weight:600}
  .foot{text-align:center;font-size:11px;color:var(--muted);margin-top:18px}