:root { --bg:#eef1f4; --ink:#1a2330; --line:#c9d2dc; --on:#137a4b; --rs:#9a6b12; --wt:#8a3b2a; }
body { margin:0; font:14px/1.5 "Segoe UI",Roboto,sans-serif; background:var(--bg); color:var(--ink); }
header { background:#fff; border-bottom:1px solid var(--line); padding:.9rem 4vw; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:.8rem; }
header b { display:block; letter-spacing:.08em; }
header span { color:#5c6b7a; font-size:.78rem; }
nav a { margin-left:1rem; color:#1a2330; text-decoration:none; }
nav a.on { font-weight:700; border-bottom:2px solid #1a2330; }
.wrap { padding:1.4rem 4vw 3rem; }
h1 { font-size:1.35rem; margin:0 0 .8rem; }
table { width:100%; border-collapse:collapse; background:#fff; }
th,td { text-align:left; padding:.65rem .7rem; border-bottom:1px solid var(--line); }
th { font-size:.75rem; text-transform:uppercase; letter-spacing:.06em; color:#5c6b7a; }
tr:hover td { background:#f6f8fa; }
.b { font-size:.68rem; padding:.12rem .4rem; text-transform:uppercase; letter-spacing:.05em; }
.b.online { background:#d8f3e6; color:var(--on); }
.b.reserve { background:#f6e7c4; color:var(--rs); }
.b.watch { background:#f6d7d0; color:var(--wt); }
.card { background:#fff; border:1px solid var(--line); padding:1.2rem 1.3rem; max-width:640px; }
.go { display:inline-block; margin-top:1rem; background:#1a2330; color:#fff; text-decoration:none; padding:.55rem .95rem; }
.foot { margin-top:1.5rem; color:#5c6b7a; font-size:.82rem; }
.foot a { color:#1a2330; }
a:focus-visible, .go:focus-visible { outline:2px solid #1a2330; outline-offset:3px; }
@media (max-width:700px) { table { display:block; overflow-x:auto; } }