
:root{--bg:#111;--panel:#1c1c1c;--yellow:#ffcc00;--yellow2:#ffe066;--text:#f2f2f2;--muted:#999;--ok:#3dd68c;--radius:14px}
*{box-sizing:border-box}body{margin:0;font-family:"IBM Plex Sans",system-ui,sans-serif;background:var(--bg);color:var(--text)}
.wrap{max-width:960px;margin:0 auto;padding:1rem}
header.app{display:flex;justify-content:space-between;align-items:center;padding:.75rem 0;border-bottom:3px solid var(--yellow)}
.logo{font-weight:800;font-size:1.4rem;color:var(--yellow);letter-spacing:-.02em}
.logo span{color:#fff;font-weight:500;font-size:.75rem;margin-left:.35rem;background:#333;padding:.15rem .4rem;border-radius:4px}
nav a{color:var(--yellow2);margin-left:.9rem;text-decoration:none;font-size:.9rem}
h1{font-size:clamp(1.5rem,4vw,2rem);margin:.8rem 0 .3rem;color:var(--yellow)}
.tagline{color:var(--muted);margin-bottom:1rem}
.roles{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1rem}
.roles button{flex:1;min-width:120px}
.btn{background:var(--yellow);color:#111;border:none;border-radius:8px;padding:.7rem 1rem;font-weight:700;cursor:pointer}
.btn-outline{background:transparent;border:2px solid var(--yellow);color:var(--yellow)}
.btn.active{box-shadow:0 0 0 2px #fff inset}
.card{background:var(--panel);border-radius:var(--radius);padding:1rem;margin-bottom:1rem;border:1px solid #333}
.card h2{margin:0 0 .75rem;font-size:1.05rem;color:var(--yellow)}
#map{height:320px;border-radius:12px;background:#222;z-index:0}
.row{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}
input,select{padding:.55rem .7rem;border-radius:8px;border:1px solid #444;background:#0d0d0d;color:var(--text)}
.fare{font-size:1.6rem;font-weight:800;color:var(--yellow);margin:.5rem 0}
.trip{padding:.6rem;border-bottom:1px solid #333;font-size:.9rem}
.trial-box,.pay-box{background:#2a2400;border:1px solid var(--yellow);border-radius:var(--radius);padding:1rem;margin:1rem 0}
.trial-box.ok{border-color:var(--ok)}.trial-box.warn{border-color:#f66}
.muted{color:var(--muted);font-size:.85rem}
footer{text-align:center;padding:1.5rem;color:var(--muted);font-size:.8rem;border-top:1px solid #333}
footer a{color:var(--yellow2)}
.privacy h1{color:var(--yellow)}
