/* The age check (hiro.games/age): a round camera view with a progress ring, in Hiro's black and chrome. */
.ag-lead { margin: -4px 0 18px; color: #cfd2d8; font-size: 17px; line-height: 1.55; max-width: 680px; }
.ag-stage { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 26px; align-items: center; }
.ag-cam { position: relative; width: 260px; aspect-ratio: 1; border-radius: 50%; overflow: hidden; background: radial-gradient(circle at 50% 40%, #1a1d26, #07080b 70%); }
.ag-cam video { position: absolute; inset: 7px; width: calc(100% - 14px); height: calc(100% - 14px); border-radius: 50%; object-fit: cover; transform: scaleX(-1); opacity: 0; transition: opacity 0.3s; }
.ag-cam.on video { opacity: 1; }
.ag-ring { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); pointer-events: none; }
.ag-ring circle { fill: none; stroke-width: 3; }
.ag-track { stroke: rgba(255, 255, 255, 0.12); }
.ag-fill { opacity: 0; stroke: #93c9ea; stroke-linecap: round; stroke-dasharray: 295.31; stroke-dashoffset: 295.31; transition: stroke-dashoffset 0.25s ease, stroke 0.3s; filter: drop-shadow(0 0 6px rgba(147, 201, 234, 0.6)); }
.ag-cam.done .ag-fill { stroke: #3ddc84; filter: drop-shadow(0 0 6px rgba(61, 220, 132, 0.6)); }
.ag-face { position: absolute; inset: 0; display: grid; place-items: center; color: rgba(255, 255, 255, 0.18); transition: opacity 0.3s; }
.ag-face svg { width: 44%; height: 44%; fill: none; stroke: currentColor; stroke-width: 1.2; stroke-linecap: round; }
.ag-cam.on .ag-face { opacity: 0; }
.ag-cam.done .ag-face { color: #3ddc84; }
.ag-side h2 { margin: 0 0 8px; font: italic 900 30px/1.05 var(--display); text-transform: uppercase; }
.ag-side p { margin: 0 0 14px; color: #d6d9de; font-size: 16px; line-height: 1.5; }
.ag-side .ag-note { color: var(--mist); font-size: 14px; }
.ag-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.ag-actions .st-btn[hidden] { display: none; }
.ag-list { margin: 0; padding-left: 20px; color: #cfd2d8; line-height: 1.6; }
.ag-list li { margin-bottom: 8px; }
.ag-list b { color: var(--fur); }
.ag-table { display: grid; gap: 2px; font-size: 14.5px; }
.ag-table [role=row] { display: grid; grid-template-columns: 1.1fr 1.4fr 0.8fr 1.3fr; gap: 10px; padding: 9px 12px; border-radius: 10px; background: rgba(255, 255, 255, 0.03); color: #cfd2d8; }
.ag-table .ag-th { background: none; color: var(--mist); font-size: 12px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; }
.ag-table b { color: var(--fur); font-weight: 600; }

@media (max-width: 700px) {
  .ag-stage { grid-template-columns: minmax(0, 1fr); justify-items: center; text-align: center; gap: 18px; }
  .ag-cam { width: min(260px, 72vw); }
  .ag-actions { justify-content: center; }
  .ag-table [role=row] { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .ag-table .ag-th { display: none; }
  .ag-table [role=row] > :nth-child(3)::before { content: 'Voice: '; color: var(--mist); }
}