.hp-main { flex: 1; display: flex; justify-content: center; padding: 12px 16px 24px; }
.hp-wrap { width: 100%; max-width: 520px; display: flex; flex-direction: column; align-items: center; }
.hp-stage { width: 100%; border-radius: 20px; overflow: hidden; background: #071a10; box-shadow: inset 0 0 0 1px rgba(255,255,255,.08), inset 0 6px 18px rgba(0,0,0,.4); }
.hp-hint { font-size: 13px; color: rgba(255,255,255,.75); text-align: center; margin: 4px 0 0; line-height: 1.45; position: relative; }
.ar-wrap { max-width: 460px; }
.ar-stage { position: relative; background: #020403; }
.ar-cv { display: block; width: 100%; aspect-ratio: 3 / 4; touch-action: none; cursor: ew-resize; }
@media (max-width: 600px) { .ar-cv { aspect-ratio: auto; height: calc(100svh - 190px); min-height: 380px; } }
.ar-go { position: absolute; left: 50%; bottom: 18%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 10px 18px; border-radius: 14px; background: rgba(0,0,0,.55); color: #fff; pointer-events: none; animation: ar-bob 1.2s ease-in-out infinite; }
.ar-go b { font-size: 17px; } .ar-go span { font-size: 13px; opacity: .8; }
@keyframes ar-bob { 50% { transform: translateX(-50%) translateY(-6px); } }
.ar-go[hidden] { display: none; }