:root { color: #1f2937; background: #f4f6f8; font: 14px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif; }
* { box-sizing: border-box; }
body { margin: 0; }
.page { max-width: 720px; margin: 0 auto; min-height: 100vh; background: #fff; }
.state { padding: 80px 24px; text-align: center; color: #6b7280; }
.state.error { color: #b42318; }
.cover-wrap { position: relative; background: #e5e7eb; aspect-ratio: 16/7; }
.cover-wrap img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cover-wrap img:not([src]) { display: none; }
.status { position: absolute; right: 14px; bottom: 14px; padding: 4px 10px; color: #fff; background: #1677ff; border-radius: 4px; }
.content { padding: 22px 18px 36px; }
h1 { margin: 0 0 10px; font-size: 25px; line-height: 1.3; }
h2 { margin: 25px 0 12px; font-size: 17px; }
.summary { color: #667085; margin: 0 0 18px; white-space: pre-wrap; }
.meta { border-top: 1px solid #eaecf0; border-bottom: 1px solid #eaecf0; margin: 0; }
.meta div { display: grid; grid-template-columns: 76px 1fr; gap: 10px; padding: 10px 0; }
dt { color: #667085; } dd { margin: 0; word-break: break-word; }
.detail { padding: 18px 0; white-space: pre-wrap; word-break: break-word; }
.form label { display: block; margin: 14px 0; font-weight: 500; }
label > span { color: #d92d20; }
input, select, textarea { display: block; width: 100%; min-height: 42px; margin-top: 7px; padding: 9px 11px; border: 1px solid #d0d5dd; border-radius: 4px; background: #fff; font: inherit; }
.specs { display: grid; gap: 10px; }
.spec { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px; border: 1px solid #d0d5dd; border-radius: 5px; cursor: pointer; }
.spec.selected { border-color: #1677ff; box-shadow: 0 0 0 1px #1677ff inset; }
.spec input { width: 18px; min-height: 18px; margin: 0; }
.spec-info { flex: 1; } .spec-name { display: block; font-weight: 600; } .price { color: #d92d20; }
button { width: 100%; min-height: 44px; border: 0; border-radius: 4px; font: inherit; cursor: pointer; }
.primary { margin-top: 20px; color: #fff; background: #1677ff; }
.primary:disabled { background: #98a2b3; cursor: wait; }
.result { margin-top: 20px; padding: 15px; border-radius: 4px; background: #f0f9ff; color: #075985; word-break: break-word; }
.result.error { background: #fff1f0; color: #b42318; }
.checkin { padding: 30px 18px; } .checkin p { color: #667085; }
@media (min-width: 721px) { body { padding: 24px 0; } .page { box-shadow: 0 2px 14px #10182814; } }