/* Страница билета /t/<token> и база админки. Шрифты и размеры — как на их сайте (файлы шрифтов подключает tickets.css). */
:root { --bg: #061e18; --raise: #0b2a22; --line: rgba(214, 209, 196, .16); --line-strong: rgba(214, 209, 196, .42);
  --text: #f1ede3; --muted: rgba(241, 237, 227, .64); --cream: #d6d1c4; --cream-hi: #e3e1d7;
  --serif: Zabludshie, "Zabludshie Tickets", Georgia, serif; --sans: Zabludshie, "Zabludshie Tickets", Arial, sans-serif; color-scheme: dark; }
* { box-sizing: border-box; }
html { background: var(--bg); }
body { margin: 0; color: var(--text); font: 300 14px/1.55 var(--sans); -webkit-font-smoothing: antialiased; }
a { color: var(--cream); text-underline-offset: 3px; }
.brand { margin: 0; font-family: var(--serif); font-weight: 100; font-size: 20px; letter-spacing: .2em; text-transform: uppercase; color: var(--cream); }
.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 60px; padding: 0 32px; border: 0; border-radius: 0;
  background: var(--cream); color: #000; font: 400 16px/1 var(--sans); text-decoration: none; cursor: pointer; transition: background-color .2s; }
.btn:hover { background: var(--cream-hi); }
.btn.ghost { background: none; color: var(--text); border: 1px solid var(--line-strong); }
.btn.ghost:hover { border-color: var(--cream); }
.btn:disabled { opacity: .4; cursor: default; }
:focus-visible { outline: 2px solid var(--cream); outline-offset: 3px; }

.ticket { max-width: 520px; margin: 0 auto; padding: 40px 24px 64px; }
.ticket .state { margin: 28px 0 8px; color: var(--muted); font-size: 12px; }
.ticket h1 { margin: 0; font: 100 32px/1.3 var(--serif); text-transform: uppercase; color: var(--cream-hi); text-wrap: balance; }
.ticket dl { margin: 28px 0 0; }
.ticket dl div { display: grid; grid-template-columns: 96px 1fr; gap: 12px; padding: 12px 0; border-top: 1px solid var(--line); }
.ticket dt { color: var(--muted); font-size: 12px; }
.ticket dd { margin: 0; }
.ticket figure { margin: 32px 0 28px; }
.ticket figure img { display: block; width: 240px; height: 240px; padding: 12px; background: #fff; }
.ticket figcaption { margin-top: 10px; color: var(--muted); font-size: 12px; }
.ticket.is-off h1, .ticket.is-off figure { opacity: .35; }
.ticket .ghost { width: 100%; }
.staff { margin-top: 36px; padding-top: 24px; border-top: 1px solid var(--line); }
.staff .k { margin: 0 0 6px; color: var(--muted); font-size: 12px; }
@media (max-width: 640px) { body { font-size: 12px; } .ticket h1 { font-size: 20px; line-height: 1.23; } .btn { min-height: 50px; } .ticket dt, .ticket figcaption, .ticket .state { font-size: 10px; } }
.staff .btn { width: 100%; margin-top: 12px; }
.staff .err { color: #f2a896; min-height: 1em; }
