.fuel-page{padding:var(--space-8) 0 var(--space-16)}.fuel-coverage-note{text-align:center;background:var(--color-bg-secondary);border-radius:var(--radius-md);padding:var(--space-3) var(--space-6);margin-bottom:var(--space-8);font-size:var(--text-sm);color:var(--color-ink-muted)}.fuel-coverage-note strong{color:var(--color-accent)}.fuel-query{text-align:center;margin-bottom:var(--space-8)}.fuel-query h1{margin-bottom:var(--space-4)}.fuel-input-row{display:flex;gap:var(--space-2);justify-content:center;align-items:center;flex-wrap:wrap;margin-bottom:var(--space-4)}.fuel-input-row input{font-size:var(--text-h3);font-family:var(--font-zh);padding:var(--space-3) var(--space-6);border:1px solid var(--color-border);border-radius:var(--radius-md);width:200px;text-align:center;outline:none;transition:border var(--transition-fast)}.fuel-input-row input:focus{border-color:var(--color-accent)}.btn-primary{display:inline-flex;align-items:center;gap:var(--space-2);background:var(--color-accent);color:#fff;border:none;padding:var(--space-3) var(--space-8);font-size:var(--text-body);font-family:var(--font-zh);font-weight:500;border-radius:var(--radius-full);cursor:pointer;transition:background var(--transition-fast)}.btn-primary:hover{background:var(--color-accent-hover)}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.fuel-presets{display:flex;gap:var(--space-2);justify-content:center;flex-wrap:wrap}.fuel-presets button{background:var(--color-bg-secondary);border:1px solid var(--color-border);padding:var(--space-2) var(--space-4);font-size:var(--text-sm);font-family:var(--font-zh);border-radius:var(--radius-full);cursor:pointer;transition:all var(--transition-fast)}.fuel-presets button:hover{border-color:var(--color-accent);color:var(--color-accent)}.fuel-presets button.active{background:var(--color-accent);color:#fff;border-color:var(--color-accent)}.fuel-type-label{text-align:center;font-size:var(--text-sm);color:var(--color-ink-muted);margin-bottom:var(--space-6)}.fuel-status{text-align:center;margin-bottom:var(--space-6);min-height:24px}.fuel-status .loading{color:var(--color-ink-muted)}.fuel-status .error{color:var(--color-error)}.fuel-status .empty{color:var(--color-ink-muted)}.fuel-reminder{display:none;margin-bottom:var(--space-8)}.fuel-reminder.visible{display:block}.reminder-card{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-6) var(--space-8);box-shadow:var(--shadow-card)}.reminder-card .reminder-title{font-size:var(--text-xs);font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--color-ink-muted);margin-bottom:var(--space-3)}.reminder-card .reminder-fact{font-size:var(--text-body);color:var(--color-ink);line-height:1.6}.reminder-card .reminder-fact strong{font-weight:700;color:var(--color-ink)}.reminder-card .reminder-meta{font-size:var(--text-xs);color:var(--color-ink-muted);margin-top:var(--space-2)}.range-bar-wrap{margin-top:var(--space-4)}.range-bar-labels{display:flex;justify-content:space-between;font-size:var(--text-xs);color:var(--color-ink-muted);margin-bottom:var(--space-1)}.range-bar{position:relative;height:6px;border-radius:3px;background:var(--color-bg-secondary);overflow:visible}.range-bar-marker{position:absolute;top:-4px;width:14px;height:14px;border-radius:50%;background:var(--color-ink);border:2px solid var(--color-bg);box-shadow:0 1px 3px #00000026;transform:translate(-50%)}.fuel-hero{display:none;margin-bottom:var(--space-8)}.fuel-hero.visible{display:block}.hero-card{display:grid;grid-template-columns:1fr auto;align-items:center;gap:var(--space-6);padding:var(--space-8);background:linear-gradient(135deg,#0d1117,#161b22);border-radius:var(--radius-xl);color:#fff;box-shadow:0 8px 40px #00000040}.hero-card-left{min-width:0}.hero-badge{display:inline-flex;align-items:center;gap:var(--space-1);background:#d4af3726;border:1px solid rgba(212,175,55,.3);color:#d4af37;font-size:var(--text-xs);font-weight:600;padding:var(--space-1) var(--space-3);border-radius:var(--radius-sm);margin-bottom:var(--space-4);letter-spacing:.04em}.hero-price-wrap{display:flex;align-items:baseline;gap:var(--space-2);margin-bottom:var(--space-3)}.hero-price{font-size:3.5rem;font-weight:700;line-height:1;letter-spacing:-.03em}.hero-unit{font-size:var(--text-h3);color:#ffffff80}.hero-name{font-size:var(--text-h3);font-weight:600;margin-bottom:var(--space-1)}.hero-meta{font-size:var(--text-sm);color:#ffffff73}.hero-card-right{text-align:right}.hero-nav-btn{display:inline-flex;align-items:center;gap:var(--space-2);background:var(--color-accent);color:#fff;border:none;padding:var(--space-3) var(--space-6);font-size:var(--text-body);font-family:var(--font-zh);font-weight:500;border-radius:var(--radius-full);cursor:pointer;transition:background var(--transition-fast);text-decoration:none}.hero-nav-btn:hover{background:var(--color-accent-hover)}.fuel-map{width:100%;height:400px;border-radius:var(--radius-md);margin-bottom:var(--space-8);background:var(--color-bg-secondary)}.fuel-map.hidden{display:none}.fuel-list{display:grid;gap:var(--space-3)}.fuel-card{display:grid;grid-template-columns:36px 1fr auto;align-items:center;gap:var(--space-4);padding:var(--space-4) var(--space-6);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);transition:all var(--transition-fast)}.fuel-card:hover{box-shadow:var(--shadow-card-hover);transform:translateY(-1px)}.fuel-card.cheapest{border-color:var(--color-success);background:#0f7b430a}.fuel-card-rank{font-size:var(--text-sm);font-weight:600;color:var(--color-ink-muted);text-align:center;line-height:1}.fuel-card.cheapest .fuel-card-rank{color:var(--color-success)}.fuel-card-info .name{font-size:var(--text-h4);font-weight:600;color:var(--color-ink);margin-bottom:var(--space-1)}.fuel-card-info .brand{font-size:var(--text-sm);color:var(--color-ink-muted)}.fuel-card-info .address{font-size:var(--text-sm);color:var(--color-ink-muted);margin-top:0}.fuel-card-info .updated{font-size:var(--text-xs);color:var(--color-ink-muted);margin-top:var(--space-1)}.fuel-card-price{text-align:right;min-width:100px}.fuel-card-price .cents{font-size:1.75rem;font-weight:700;line-height:1;color:var(--color-ink)}.fuel-card-price .unit{font-size:var(--text-xs);color:var(--color-ink-muted)}.fuel-card.cheapest .fuel-card-price .cents{color:var(--color-success);font-size:2rem}.fuel-card.cheapest .badge-cheapest{display:inline-block;background:var(--color-success);color:#fff;font-size:var(--text-xs);font-weight:600;padding:0 var(--space-2);border-radius:var(--radius-sm);margin-bottom:var(--space-2)}.fuel-card-nav{margin-top:var(--space-2);display:flex;gap:var(--space-2)}.fuel-card-nav a{font-size:var(--text-sm);color:var(--color-accent);text-decoration:none;display:inline-flex;align-items:center;gap:var(--space-1)}.fuel-card-nav a:hover{text-decoration:underline}@media(max-width:768px){.hero-card{grid-template-columns:1fr;gap:var(--space-4);padding:var(--space-6)}.hero-card-right{text-align:left}.hero-price{font-size:2.75rem}.fuel-card{grid-template-columns:28px 1fr;padding:var(--space-4)}.fuel-card-price{text-align:left;margin-top:var(--space-2);grid-column:2}.fuel-card-rank{font-size:var(--text-xs)}.fuel-map{height:300px}.fuel-input-row input{width:160px;font-size:var(--text-h4)}.reminder-card{padding:var(--space-4) var(--space-6)}}
