.agp {
    position: relative;
    border-radius: 22px;
    background: var(--qm-s2, #1D1721);
    padding: 8px 0 10px;
    direction: ltr;
}
.agp-strip {
    display: flex;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    padding: 6px calc(50% - 28px);
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 22%, #000 78%, transparent 100%);
            mask-image: linear-gradient(90deg, transparent 0, #000 22%, #000 78%, transparent 100%);
    outline: none;
    touch-action: pan-x;
}
.agp-strip::-webkit-scrollbar { display: none; }
.agp-strip:focus-visible { box-shadow: inset 0 0 0 2px var(--qm-pink, #E91E63); border-radius: 22px; }
.agp-n {
    flex: 0 0 56px;
    width: 56px;
    height: 52px;
    scroll-snap-align: center;
    border: 0;
    border-radius: 16px;
    background: transparent;
    color: var(--qm-fg3, rgba(255, 255, 255, .44));
    font: 600 18px/1 var(--qm-sans, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
    font-variant-numeric: tabular-nums;
    cursor: pointer;
    padding: 0;
    transform: scale(.86);
    transition: transform .16s cubic-bezier(.2, .8, .2, 1), color .16s, background-color .16s, box-shadow .16s;
    -webkit-tap-highlight-color: transparent;
}
.agp-n.is-near { color: var(--qm-fg2, rgba(255, 255, 255, .66)); transform: scale(.94); }
.agp-n.is-c { color: var(--qm-fg, #fff); transform: scale(1.08); font-weight: 800; }
.agp-n.is-sel {
    background: var(--qm-cream, #FFF3F6);
    color: var(--qm-ink, #1A0E14);
    box-shadow: 0 0 0 3px var(--qm-pink, #E91E63);
    font-weight: 800;
    transform: scale(1.08);
}

.agp-mark {
    position: absolute;
    left: 50%;
    bottom: 32px;
    width: 6px;
    height: 6px;
    margin-left: -3px;
    border-radius: 50%;
    background: var(--qm-pink-soft, #FF80AB);
    opacity: .9;
    pointer-events: none;
}
.agp.has-value .agp-mark { opacity: 0; }
.agp-status {
    margin-top: 8px;
    text-align: center;
    font: 500 13px/1.3 var(--qm-sans, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
    color: var(--qm-fg3, rgba(255, 255, 255, .44));
    direction: auto;
}
.agp.has-value .agp-status { color: var(--qm-pink-soft, #FF80AB); font-weight: 700; }
.agp-field-error .agp { box-shadow: 0 0 0 2px var(--qm-red-soft, #FF6B61); }


.agp-ask {
    position: fixed;
    inset: 0;
    z-index: 100050;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    background: var(--qm-scrim, rgba(5, 3, 7, .62));
    opacity: 0;
    transition: opacity .22s;
}
.agp-ask.is-open { opacity: 1; }
.agp-ask.is-closing { opacity: 0; }
.agp-ask-sheet {
    width: 100%;
    max-width: 440px;
    box-sizing: border-box;
    padding: 10px 20px calc(22px + env(safe-area-inset-bottom, 0px));
    border-radius: 28px 28px 0 0;
    background: var(--qm-s1, #151117);
    color: var(--qm-fg, #fff);
    box-shadow: 0 -12px 40px rgba(0, 0, 0, .45);
    transform: translateY(24px);
    transition: transform .26s cubic-bezier(.2, .8, .2, 1);
}
.agp-ask.is-open .agp-ask-sheet { transform: none; }
@media (min-width: 700px) {
    .agp-ask { align-items: center; }
    .agp-ask-sheet { border-radius: 28px; }
}
.agp-ask-grab { width: 40px; height: 4px; border-radius: 2px; background: var(--qm-line, rgba(255, 255, 255, .16)); margin: 0 auto 14px; }
.agp-ask-title { margin: 0 0 6px; font: 800 22px/1.2 var(--qm-sans, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif); text-align: center; }
.agp-ask-text { margin: 0 0 16px; font: 400 14px/1.4 var(--qm-sans, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif); color: var(--qm-fg2, rgba(255, 255, 255, .66)); text-align: center; }
.agp-ask-save {
    display: block;
    width: 100%;
    min-height: 54px;
    margin-top: 16px;
    border: 0;
    border-radius: 18px;
    background: var(--qm-pink, #E91E63);
    color: #fff;
    font: 800 16px/1 var(--qm-sans, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
    cursor: pointer;
    transition: opacity .16s, transform .14s;
}
.agp-ask-save:disabled { opacity: .38; cursor: default; }
.agp-ask-save:not(:disabled):active { transform: scale(.98); }
.agp-ask-save.is-loading { opacity: .6; }