:root {
        --bg: #000;
        --panel: #111;
        --ink: #fff;
        --muted: #aaa;
        --border: #222;
        --radius: 16px;
    }
        * {
            box-sizing: border-box
        }
        html,body {
            margin: 0;
            padding: 0;
            background: var(--bg);
            color: var(--ink);
            font-family: system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif
        }
        .wrap {
            max-width: 960px;
            margin: 0 auto;
            padding: 24px
        }
        header {
            display: flex;
            align-items: center;
            gap: 10px;
            margin-bottom: 24px
        }
        header img {
            height: 28px
        }
        .hero {
            display: grid;
            grid-template-columns: 1fr;
            gap: 24px
        }
        .flyer img {
            width: 100%;
            border-radius: var(--radius);
            border: 1px solid var(--border)
        }
        .details {
            background: var(--panel);
            padding: 20px;
            border-radius: var(--radius);
            border: 1px solid var(--border)
        }
        h1 {
            margin: 0 0 8px;
            font-size: 30px
        }
        .meta {
            color: var(--muted);
            margin-bottom: 10px
        }
        .list {
            margin: 0;
            padding-left: 18px
        }
        .card {
            background: var(--panel);
            border: 1px solid var(--border);
            border-radius: var(--radius);
            padding: 18px;
            text-align: center
        }
        .price {
            font-weight: 700;
            font-size: 18px
        }
        .small {
            font-size: 13px;
            color: var(--muted)
        }
        footer {
            margin-top: 32px;
            border-top: 1px solid var(--border);
            padding-top: 16px;
            text-align: center;
            font-size: 13px;
            color: var(--muted)
        }
        a {
            color: var(--ink);
            text-decoration: underline
        }
        .event-map {
            width: 100%;
            height: 300px;
            border-radius: var(--radius);
            margin-top: 16px;
            border: 1px solid var(--border);
            display: block
        }
        /* Simple button style */
        .btn {
            display: inline-block;
            padding: 12px 18px;
            border: 1px solid var(--border);
            border-radius: 10px;
            background: #1a1a1a;
            color: #fff;
            text-decoration: none;
            margin-top: 10px
        }
        .btn:hover {
            background: #161616
        }

        /* --- Stripey Ticket Card --- */
        .card {
            text-align: center;
        }
        .card .mini-flyer {
            display: block;
            width: 100%;
            max-width: 420px;
            height: auto;
            margin: 6px auto 14px auto;
            border-radius: 12px;
            border: 1px solid var(--border);
        }
        .btn--stripe {
            display: inline-block;
            padding: 12px 18px;
            border-radius: 999px;
            background: #635bff;
            color: #fff;
            text-decoration: none;
            font-weight: 600;
            border: 0;
            transition: transform .06s ease, box-shadow .2s ease, background .2s ease;
            box-shadow: 0 6px 14px rgba(99,91,255,.3);
        }
        .btn--stripe:hover {
            background: #4b45e6;
            transform: translateY(-1px);
        }
        .btn--stripe:active {
            transform: translateY(0);
        }
        .supported-methods {
            margin-top: 12px;
            color: var(--muted);
            font-size: 12px;
        }
        .pay-logos {
            display: block;
            width: 120px;
            height: auto;
            margin: 6px auto 0 auto;
            border-radius: 8px;
            border: 1px solid var(--border);
        }