:root { font-family: Inter, ui-sans-serif, system-ui, sans-serif; color: #eef2ff; background: #090d18; }
* { box-sizing: border-box; }
body { min-height: 100vh; margin: 0; display: grid; place-items: center; padding: 24px; background: radial-gradient(circle at top, #1c315e 0, #090d18 52%); }
.card { width: min(760px, 100%); padding: clamp(22px, 5vw, 46px); background: rgba(14, 21, 38, .92); border: 1px solid #2b3959; border-radius: 24px; box-shadow: 0 25px 80px #0008; }
.eyebrow { color: #7dd3fc; font-size: .78rem; font-weight: 800; letter-spacing: .14em; }
h1 { margin: 8px 0 14px; font-size: clamp(1.8rem, 5vw, 3.2rem); line-height: 1.05; }
.intro, li { color: #bac5db; line-height: 1.6; }
.notice { margin: 24px 0; padding: 18px 20px; background: #111c32; border: 1px solid #26395c; border-radius: 16px; }
.notice h2 { margin: 0; font-size: 1rem; }
.notice ul { margin-bottom: 0; padding-left: 20px; }
.consent { display: flex; gap: 12px; align-items: flex-start; line-height: 1.45; cursor: pointer; }
.consent input { width: 20px; height: 20px; flex: 0 0 auto; accent-color: #38bdf8; }
.stage { margin: 24px 0; aspect-ratio: 4/3; display: grid; place-items: center; overflow: hidden; background: #050811; border: 1px solid #2b3959; border-radius: 18px; }
.stage > * { grid-area: 1 / 1; }
video, img { width: 100%; height: 100%; object-fit: cover; }
video { transform: scaleX(-1); }
.placeholder { color: #7f8ba3; }
.actions { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
button { border: 1px solid #40516f; border-radius: 12px; padding: 13px 16px; color: #eef2ff; background: #1a263d; font: inherit; font-weight: 750; cursor: pointer; }
button:hover:not(:disabled) { filter: brightness(1.15); }
button:disabled { opacity: .42; cursor: not-allowed; }
.primary { color: #06111a; background: #7dd3fc; border-color: #7dd3fc; }
.send { color: #06150e; background: #86efac; border-color: #86efac; }
.status { min-height: 1.5em; margin: 16px 0 0; color: #a5b4fc; text-align: center; }
@media (max-width: 520px) { .actions { grid-template-columns: 1fr; } }
