:root{
  --brand:#1abc9c; /* turquoise */
  --brand-dark:#0b7285;
  --title:#0b3d91; /* royal blue-ish for 'Tickets' */
}
*{box-sizing:border-box}
body{font-family:ui-sans-serif,system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif;margin:0;background:#f6fbff;color:#0f172a}
.container{max-width:900px;margin:0 auto;padding:16px}
.hero{position:relative}
.hero img{width:100%;height:150px;object-fit:cover;border-bottom-left-radius:16px;border-bottom-right-radius:16px;filter:saturate(1.1)}
.brand{position:absolute;left:24px;top:20px;font-weight:800;font-size:36px;letter-spacing:.5px}
.brand .goeko{color:var(--brand)}
.brand .tickets{color:var(--title)}
.tag{position:absolute;left:24px;top:70px;font-size:18px;color:#0f172a;background:rgba(255,255,255,.7);padding:6px 10px;border-radius:10px}
.card{background:#fff;border-radius:18px;box-shadow:0 10px 30px rgba(2,8,20,.05);padding:16px;margin-top:10px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:640px){.row{grid-template-columns:1fr}}
label{display:block;font-weight:600;margin:8px 0 6px}
input[type="text"],input[type="date"],select{width:100%;padding:12px 14px;border:1px solid #cbd5e1;border-radius:12px;font-size:16px}
.badge{font-size:12px;color:#475569;margin-top:8px}
.results{white-space:pre-wrap;background:#0b1324;color:#e5e7eb;padding:16px;border-radius:12px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.btn{background:#10b981;color:white;border:0;padding:14px 18px;border-radius:12px;font-weight:700;cursor:pointer}
.list{position:absolute;z-index:20;background:#fff;border:1px solid #e2e8f0;border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.08);margin-top:4px;max-height:240px;overflow:auto;width:100%}
.list div{padding:10px 12px;cursor:pointer}
.list div:hover{background:#f1f5f9}
small.muted{color:#64748b}
.toggle{display:flex;gap:16px;margin:10px 0}
.toggle label{font-weight:500}
hr.sep{border:0;border-top:1px dashed #cbd5e1;margin:12px 0}