:root { --gap: 16px; font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, "Helvetica Neue", Arial }
body { margin:0; background:#0b0b0f; color:#e8e8ef; display:grid; place-items:center; min-height:100svh }
.wrap { width:min(720px, 92vw); padding:24px; display:grid; gap:var(--gap); justify-items:center }
.viz-wrap { width:min(68vmin, 560px); aspect-ratio:1/1; overflow:hidden }
.viz { width:100%; height:100%; object-fit:cover }
.circle .viz { border-radius:9999px }
/* шестиугольник вместо круга:
.viz-wrap { clip-path: polygon(50% 0%, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%) }
*/
.controls { display:flex; gap:10px; flex-wrap:wrap; justify-content:center }
button { background:#1b1b22; color:#fff; border:1px solid #2c2c35; padding:10px 14px; border-radius:999px; cursor:pointer }
button:disabled { opacity:.5; cursor:not-allowed }
.card { text-align:center; margin-top:4px }
.title { font-size:20px; font-weight:700 }
.meta { opacity:.8; margin-top:4px }
.back { color:#9aa0ff; text-decoration:none }