.gp360{width:100%;max-width:620px;margin:1.25rem auto;color:#2a2022;outline:0}
.gp360__stage{position:relative;overflow:hidden;border:1px solid #eadfe1;border-radius:20px;background:#faf8f8;cursor:grab;touch-action:pan-y;user-select:none}
.gp360--dragging .gp360__stage{cursor:grabbing}
.gp360__image{display:block;width:100%;aspect-ratio:3/4;object-fit:contain;pointer-events:none}
.gp360__badge,.gp360__hint{position:absolute;border-radius:999px;font-weight:700}
.gp360__badge{top:14px;left:14px;padding:6px 10px;background:rgba(255,255,255,.94);box-shadow:0 4px 16px rgba(42,32,34,.12)}
.gp360__hint{left:50%;bottom:14px;transform:translateX(-50%);white-space:nowrap;padding:8px 12px;background:rgba(42,32,34,.82);color:#fff;font-size:.82rem;transition:opacity .25s}
.gp360--used .gp360__hint{opacity:0}
.gp360__controls{display:grid;grid-template-columns:44px 1fr 44px;align-items:center;gap:12px;margin-top:12px}
.gp360__controls button{display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid #eadfe1;border-radius:50%;background:#fff;color:#97152d;font-size:1.3rem;cursor:pointer}
.gp360__track{height:5px;overflow:hidden;border-radius:99px;background:#eadfe1}
.gp360__track span{display:block;height:100%;width:0;border-radius:inherit;background:#97152d}
.gp360__count{text-align:center;margin-top:7px;color:#746b6d;font-size:.88rem}
@media(max-width:575px){.gp360{margin:1rem auto}.gp360__stage{border-radius:16px}}