@import url('./design.css');
:root{--bg:var(--ui-bg);--panel:var(--ui-paper);--text:var(--ui-ink);--muted:var(--ui-muted);--line:var(--ui-line);--accent:var(--ui-accent);--green:var(--ui-green)}
body{min-height:100vh;background:var(--bg);color:var(--text)}header{display:none}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}
main{max-width:1180px;padding:30px 28px 48px;margin:auto}h1{font-size:28px;line-height:1.25;margin:0;font-weight:750;letter-spacing:-.6px}h2{font-size:17px;line-height:1.4;margin:0 0 14px}h3{font-size:15px}.eyebrow{font-size:11px;color:var(--muted);margin:0 0 7px;letter-spacing:.04em}.muted{color:var(--muted);font-size:12px}.page-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}#status{margin:10px 0 18px;font-size:12px;line-height:1.65}#status details{display:inline}#status summary{cursor:pointer;color:var(--muted)}#status details[open]{display:block}
.controls{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:16px 0}.controls label{font-size:12px;color:var(--muted)}button,select,input{color:var(--text);border:1px solid var(--line);border-radius:10px;background:var(--panel);padding:9px 12px;min-height:40px}button:hover{background:var(--ui-soft)}input:focus,select:focus{border-color:var(--accent)}.primary{background:var(--accent);color:#fff}.segmented{display:flex;gap:4px;background:#e9edf5;padding:4px;border-radius:12px;width:100%;max-width:470px}.segmented button{flex:1;border:0;background:transparent;color:var(--muted);padding:8px 6px;white-space:nowrap;min-height:36px;font-size:13px}.segmented button[aria-pressed=true]{background:#fff;color:var(--accent);box-shadow:0 1px 5px #24385a12;font-weight:650}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:14px}.card{border:1px solid var(--line);border-radius:var(--ui-radius);background:var(--panel);padding:20px;margin:0 0 16px;min-width:0;box-shadow:var(--ui-shadow)}.grid .card{margin:0}.number{font-size:30px;line-height:1.25;font-weight:750;letter-spacing:-1px;font-variant-numeric:tabular-nums}.amount{color:var(--green);font-weight:650;white-space:nowrap;font-variant-numeric:tabular-nums}.row{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;padding:14px 0;border-bottom:1px solid var(--line)}.row:last-child{border:0;padding-bottom:0}.row>div:first-child{min-width:0;overflow-wrap:anywhere}.paid{opacity:.55}.paid .amount{text-decoration:line-through}.pill{font-size:11px;padding:2px 7px;border-radius:5px;color:var(--accent);background:var(--ui-soft);margin-left:7px}.error{color:var(--ui-red)}
.table-wrap{overflow:auto;max-width:100%;border-radius:8px}table{width:100%;border-collapse:collapse;font-size:13px}th,td{padding:12px 8px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}th{color:var(--muted);font-size:11px;font-weight:600;white-space:nowrap;background:#f8faff}.chart{width:100%;height:280px;display:block;touch-action:pan-y}.timeline{border-left:2px solid #dce2f7;padding-left:18px;margin-left:4px}.timeline .row{position:relative}.timeline .row:before{content:'';position:absolute;width:8px;height:8px;background:var(--accent);border:2px solid white;outline:1px solid #ccd4ed;border-radius:50%;left:-24px;top:21px}.timeline .row .muted{margin-top:5px}
.login{max-width:450px;margin:12vh auto;padding:28px}.login .brand{font-size:11px;color:var(--accent);letter-spacing:2px;margin-bottom:18px}.login h1{font-size:27px}.login form{display:grid;gap:12px;margin:24px 0 0}.login input{width:100%}.login button{background:var(--accent);color:white;border:0}.link-card{display:block;color:var(--text)}.link-card:hover{border-color:#a5b0ee;text-decoration:none}label{color:var(--muted)}.empty{padding:30px 18px;background:#fafbfe;border:1px dashed var(--line);border-radius:12px;color:var(--muted);font-size:13px}
.cycle-scroll{overflow-x:auto;max-width:100%;border:1px solid var(--line);border-radius:10px;background:#fafbff;overscroll-behavior-x:contain}.cycle-chart{display:block;width:100%;min-width:0;height:auto;font:inherit}.cycle-legend{gap:6px}.cycle-legend button{font-size:12px;min-height:34px;padding:5px 10px}.cycle-legend button[aria-pressed=false]{opacity:.45;text-decoration:line-through}.cycle-scroll:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.billing-totals{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:12px;margin-bottom:18px}.billing-totals .card{margin:0;border:0;padding:18px;background:#edf0ff;box-shadow:none}.billing-total.cny{background:#e6f3ed}.billing-total-label{display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:12px;color:#53628b}.currency-tag{font-size:10px;font-weight:700;letter-spacing:1px;opacity:.7}.billing-total .number{font-size:clamp(24px,5.5vw,34px);margin:12px 0 9px;overflow-wrap:anywhere;color:#33449b}.billing-total.cny .number{color:#16664d}.billing-total .muted{font-size:10px;color:#63708e}.bill-name{font-weight:650}.bill-updated{font-size:11px;color:var(--muted);margin-top:4px}.local-bills>p{margin:-6px 0 4px}.bill-list .amount{font-size:15px}.bill-list .row .muted{margin-top:4px}.bill-list .row:first-of-type{padding-top:8px}
.flight-scope{padding:0 0 12px;background:none;border:0;box-shadow:none}.flight-scope p{font-size:12px;color:var(--muted);margin:6px 0}.flight-list{display:grid;gap:10px}.flight-item{border-bottom:1px solid var(--line);padding:12px 0}.flight-item:first-child{padding-top:0}.flight-item:last-child{border:0}.flight-item-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px}.flight-item .route{font-size:14px;margin:7px 0;line-height:1.6}.flight-item .muted{font-size:11px}.flight-chip{font-size:11px;color:var(--accent);background:var(--ui-soft);padding:3px 8px;border-radius:5px}.detail-toggle{margin-top:8px;font-size:12px;color:var(--muted)}
@media(max-width:600px){main{padding:20px 16px 32px}h1{font-size:24px}h2{font-size:16px}.card{padding:17px;margin-bottom:14px}.row{gap:12px}.row>div:first-child{font-size:14px}.row .amount{font-size:14px}.chart{height:235px}.controls{gap:7px}.grid{grid-template-columns:1fr}.billing-total .number{letter-spacing:-.8px}#status{margin-bottom:14px}.cycle-chart{min-width:330px}.login{margin:8vh 16px;padding:24px}.controls select{font-size:13px;max-width:100%;min-width:0}.controls{overflow-wrap:anywhere}}

.filter-field{display:flex;flex-direction:column;gap:5px;min-width:0;flex:1 1 140px}.filter-field span{font-size:11px}.filter-field select{width:100%;min-width:0}details.card>summary{cursor:pointer;font-size:14px;font-weight:650;list-style-position:inside}details.card[open]>summary{margin-bottom:16px}.cycle-chart text{font-family:inherit}.card:has(.cycle-scroll)>p{font-size:12px} @media(max-width:600px){.filter-field{flex-basis:42%}.cycle-legend{gap:5px}.cycle-legend button{padding:5px 8px}.flight-item-head .amount{font-size:17px}}
.paid .bill-name{text-decoration:line-through}.billing-rule{font-size:11px;line-height:1.7;margin:-5px 0 17px}
.billing-breakdown{font-size:10px;margin-top:10px;color:#53628b}.billing-breakdown summary{cursor:pointer}.billing-breakdown-row{display:flex;justify-content:space-between;gap:5px;margin-top:6px;font-variant-numeric:tabular-nums}
.journey-map-holder{width:100%;overflow:hidden;border:1px solid var(--line);border-radius:12px}.journey-map{width:100%;height:auto;display:block}.journey-water{fill:#e8f1f7}.journey-land{fill:#eef3e6;stroke:#adc3b4;stroke-width:.7}.journey-grid{stroke:#cedfe7;stroke-width:.5;opacity:.6}.journey-geography{fill:#788d80;font-size:11px;font-weight:600;paint-order:stroke;stroke:#eef3e6;stroke-width:2px}.journey-geography.ocean{fill:#7e9bae;font-style:italic;stroke:#e8f1f7}.journey-line,.journey-line-halo{fill:none;stroke-linecap:round;stroke-linejoin:round}.journey-line{stroke:#5264d9;stroke-width:2.5}.journey-line-halo{stroke:#fff;stroke-width:5;opacity:.9}.journey-stop{fill:#5264d9;stroke:#fff;stroke-width:1.7}.journey-stop-label{font-size:12px;font-weight:650;fill:#243856;paint-order:stroke;stroke:#fff;stroke-width:3px;stroke-linejoin:round}.map-modes{margin:12px 0}.map-modes button[aria-pressed=true]{background:var(--ui-soft);color:var(--accent);border-color:#a9b5ec}.map-attribution{font-size:10px;line-height:1.7}.full-monitor-link{display:inline-block;margin:7px 0;font-size:13px}
