:root { color-scheme: dark; font-family: Inter, ui-sans-serif, system-ui, sans-serif; background: #0b0b0e; color: #f3f3f5; }
* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; }
.shell { width: min(760px, 100%); margin: 0 auto; padding: 32px 18px 56px; }
header { margin-bottom: 20px; }
h1 { font-size: clamp(26px, 6vw, 38px); margin: 4px 0 8px; }
h2 { font-size: 17px; margin: 0; }
.eyebrow,.hint { color: #a3a3af; font-size: 13px; line-height: 1.55; }
.eyebrow { color: #8d72ff; letter-spacing: .08em; text-transform: uppercase; margin: 0; }
.card { background: #17171d; border: 1px solid #2d2d36; border-radius: 16px; padding: 18px; margin: 14px 0; }
.section-title { display: flex; justify-content: space-between; gap: 12px; align-items: center; }
.pill { border-radius: 999px; background: #272734; color: #c9c4ff; padding: 4px 9px; font-size: 12px; white-space: nowrap; }
.facts { display: grid; grid-template-columns: minmax(115px, 35%) 1fr; gap: 9px 12px; margin: 17px 0; font-size: 14px; }
.facts dt { color: #9292a0; }.facts dd { margin: 0; overflow-wrap: anywhere; }
.actions { display: flex; flex-wrap: wrap; gap: 8px; }
button { min-height: 42px; appearance: none; border: 0; border-radius: 10px; padding: 0 14px; font: inherit; font-weight: 650; color: white; background: #705bf4; cursor: pointer; }
button:disabled { opacity: .5; cursor: not-allowed; } button.secondary { background: #343440; } button.danger { background: #54283a; }
.notice { min-height: 1.5em; color: #ffc36d; font-size: 13px; }