/*
 * P912 NUMBER UX V2
 * /numbers listing presentation
 *
 * Scope:
 * - primary listing number hierarchy
 * - deterministic LTR number rendering
 * - detected rond badge
 *
 * Canonical data/storage is not touched here.
 */

.numbers-listing__identity > .numbers-listing__number {
    display: block;
    direction: ltr;
    unicode-bidi: isolate;
    width: fit-content;
    max-width: 100%;
    margin-top: 12px;
    margin-bottom: 6px;
    font-size: clamp(1.72rem, 2.6vw, 2.25rem);
    font-weight: 900;
    line-height: 1.12;
    letter-spacing: 0.015em;
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1;
    white-space: nowrap;
    text-align: left;
}

.numbers-listing__badges [data-listing-rond-badge] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 28px;
    max-width: 100%;
    padding: 4px 9px;
    border: 1px solid rgba(0, 149, 218, 0.22);
    border-radius: 999px;
    background:
        linear-gradient(
            180deg,
            rgba(0, 149, 218, 0.09),
            rgba(0, 149, 218, 0.045)
        );
    color: #0877a8;
    font-size: 0.76rem;
    font-weight: 800;
    line-height: 1.35;
    white-space: normal;
}

.numbers-listing__badges [data-listing-rond-badge] i {
    flex: 0 0 auto;
    font-size: 0.72rem;
}

@media (max-width: 720px) {
    .numbers-listing__identity > .numbers-listing__number {
        margin-top: 10px;
        font-size: clamp(1.58rem, 7.2vw, 1.95rem);
        line-height: 1.15;
        letter-spacing: 0;
    }

    .numbers-listing__badges [data-listing-rond-badge] {
        min-height: 30px;
        padding-inline: 8px;
        font-size: 0.72rem;
    }
}

@media (max-width: 390px) {
    .numbers-listing__identity > .numbers-listing__number {
        font-size: 1.48rem;
    }
}


/* =========================================================
   P912_NUMBERS_MARKETPLACE_UI_V3
   Marketplace hierarchy for /numbers only.
   Filtering, search and backend behavior stay unchanged.
   ========================================================= */

.numbers-marketplace-v3{
    --p912-market-border:rgba(15, 23, 42, 0.10);
    --p912-market-muted:#64748b;
    --p912-market-ink:#0f172a;
    --p912-market-soft:#f8fafc;

    position:relative;
}

.numbers-marketplace-v3__hero{
    margin-bottom:20px;
    padding:14px;
    border:1px solid var(--p912-market-border);
    border-radius:18px;
    background:#fff;
    box-shadow:0 10px 30px rgba(15, 23, 42, 0.045);
}

.numbers-marketplace-v3__hero > a{
    min-height:44px;
}

.numbers-marketplace-v3__summary{
    gap:16px;
    margin-bottom:16px;
    padding:14px 16px;
    border:1px solid var(--p912-market-border);
    border-radius:16px;
    background:#fff;
}

.numbers-marketplace-v3__summary > div:first-child{
    display:flex;
    align-items:baseline;
    flex-wrap:wrap;
    gap:7px;
}

.numbers-marketplace-v3__summary > div:first-child > strong{
    color:var(--p912-market-ink);
    font-size:1.05rem;
    font-weight:900;
}

.numbers-marketplace-v3__summary > div:first-child > span{
    color:var(--p912-market-muted);
    font-size:.82rem;
}

.numbers-marketplace-v3__toolbar{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:6px;
}

.numbers-marketplace-v3__toolbar > a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:44px;
    padding:8px 12px;
    border-radius:10px;
    font-weight:750;
}

.numbers-marketplace-v3__results{
    min-width:0;
}

.numbers-marketplace-v3__card{
    position:relative;
    min-width:0;
    border:1px solid var(--p912-market-border);
    border-radius:18px;
    background:#fff;
    box-shadow:0 8px 24px rgba(15, 23, 42, 0.04);
    transition:
        border-color .18s ease,
        box-shadow .18s ease,
        transform .18s ease;
}

@media (hover:hover){

    .numbers-marketplace-v3__card:hover{
        border-color:rgba(0, 149, 218, 0.24);
        box-shadow:0 14px 34px rgba(15, 23, 42, 0.075);
        transform:translateY(-1px);
    }
}

.numbers-marketplace-v3__card:focus-visible,
.numbers-marketplace-v3__toolbar > a:focus-visible,
.numbers-marketplace-v3 .numbers-pagination > a:focus-visible,
.numbers-marketplace-v3 .numbers-empty > a:focus-visible{
    outline:3px solid rgba(0, 149, 218, 0.22);
    outline-offset:3px;
}

.numbers-marketplace-v3__identity{
    min-width:0;
}

.numbers-marketplace-v3__number{
    direction:ltr;
    unicode-bidi:isolate;
    text-align:left;
    white-space:nowrap;
    font-variant-numeric:tabular-nums;

    display:block;
    width:100%;
    min-width:0;
    margin-top:12px;
    color:var(--p912-market-ink);
    font-size:clamp(1.82rem, 2.8vw, 2.38rem);
    font-weight:950;
    line-height:1.08;
    letter-spacing:.012em;
}

.numbers-marketplace-v3__rond{
    min-height:30px;
    font-weight:850;
}

.numbers-marketplace-v3__price{
    min-width:145px;
}

.numbers-marketplace-v3__price > small{
    color:var(--p912-market-muted);
    font-size:.74rem;
    font-weight:700;
}

.numbers-marketplace-v3__price > strong{
    display:block;
    margin-top:4px;
    color:var(--p912-market-ink);
    font-size:1rem;
    font-weight:900;
    line-height:1.45;
}

.numbers-marketplace-v3__actions{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-height:44px;
    white-space:nowrap;
    font-weight:850;
}

.numbers-marketplace-v3 .numbers-pagination > a,
.numbers-marketplace-v3 .numbers-empty > a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:44px;
}

.numbers-marketplace-v3 .numbers-empty{
    border:1px dashed rgba(15, 23, 42, 0.14);
    border-radius:18px;
    background:var(--p912-market-soft);
}

@media (max-width:900px){

    .numbers-marketplace-v3__summary{
        align-items:flex-start;
        flex-direction:column;
    }

    .numbers-marketplace-v3__toolbar{
        width:100%;
    }
}

@media (max-width:720px){

    .numbers-marketplace-v3__hero{
        margin-bottom:14px;
        padding:10px;
        border-radius:14px;
    }

    .numbers-marketplace-v3__summary{
        padding:12px;
        border-radius:14px;
    }

    .numbers-marketplace-v3__toolbar{
        display:grid;
        grid-template-columns:repeat(3, minmax(0, 1fr));
    }

    .numbers-marketplace-v3__toolbar > a{
        width:100%;
        padding-inline:8px;
        font-size:.76rem;
    }

    .numbers-marketplace-v3__card{
        border-radius:16px;
    }

    .numbers-marketplace-v3__number{
        direction:ltr;
        unicode-bidi:isolate;
        text-align:left;
        white-space:nowrap;

        font-size:clamp(1.62rem, 7.3vw, 2rem);
        line-height:1.1;
        letter-spacing:0;
    }

    .numbers-marketplace-v3__price{
        min-width:0;
    }

    .numbers-marketplace-v3__actions{
        width:100%;
        min-height:44px;
    }
}

@media (max-width:390px){

    .numbers-marketplace-v3__toolbar{
        grid-template-columns:1fr;
    }

    .numbers-marketplace-v3__number{
        font-size:1.5rem;
    }
}


/* =========================================================
   P912_NUMBERS_MARKETPLACE_V4
   ========================================================= */

.p912-numbers-page-v4{
    min-width:0;
}

.p912-number-card-v4{
    min-width:0;
    overflow:hidden;
    border-radius:20px!important;
    transition:
        transform 160ms ease,
        box-shadow 160ms ease,
        border-color 160ms ease;
}

.p912-number-card-v4:hover{
    transform:translateY(-2px);
}

.p912-number-card-v4
.numbers-marketplace-v3__number{
    direction:ltr!important;
    unicode-bidi:isolate!important;
    text-align:left!important;
    white-space:nowrap!important;
    font-size:clamp(1.42rem,2vw,1.86rem)!important;
    font-weight:950!important;
    font-variant-numeric:tabular-nums;
}

.p912-number-card-v4__rond{
    display:inline-flex!important;
    align-items:center;
    gap:6px;
    max-width:100%;
    width:max-content;
    white-space:normal;
    line-height:1.4;
    font-weight:850!important;
}

.p912-number-card-v4
.numbers-listing__identity{
    min-width:0;
}

.p912-number-card-v4
.numbers-listing__badges{
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    min-width:0;
}

@media(max-width:640px){

    .p912-number-card-v4{
        border-radius:16px!important;
    }

    .p912-number-card-v4
    .numbers-marketplace-v3__number{
        font-size:clamp(1.30rem,6vw,1.58rem)!important;
    }
}


/* =========================================================
   P912_NUMBERS_SIDEBAR_CONTAINMENT_V1

   /numbers sidebar final containment authority.

   Root cause:
   desktop viewport breakpoints did not reflect the actual
   width of the sidebar. The 11-position number search kept
   fixed 48–50px digit widths while living in a substantially
   narrower column.

   Rules below make every control size against the sidebar
   itself and keep the exact-position search fully contained.
   ========================================================= */

.numbers-sidebar{
    width:100%;
    min-width:0!important;
    max-width:100%!important;

    box-sizing:border-box!important;

    padding:18px;

    border:
        1px solid
        rgba(15,23,42,.10);

    border-radius:20px;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fbfdff 100%
        );

    box-shadow:
        0 12px 34px
        rgba(15,23,42,.055);
}

/*
 * Every layout descendant must be allowed to shrink.
 * This is the missing containment authority.
 */
.numbers-sidebar *,
.numbers-sidebar *::before,
.numbers-sidebar *::after{
    box-sizing:border-box;
    min-width:0;
}

/*
 * Form surface.
 */
.numbers-sidebar form{
    width:100%;
    min-width:0!important;
    max-width:100%!important;
}

.numbers-sidebar label{
    max-width:100%;
}

/*
 * Normal controls — never exceed sidebar width.
 * Checkboxes are intentionally excluded.
 */
.numbers-sidebar input:not([type="checkbox"]):not([type="radio"]),
.numbers-sidebar select,
.numbers-sidebar textarea,
.numbers-sidebar button{
    width:100%;
    min-width:0!important;
    max-width:100%!important;

    box-sizing:border-box!important;
}

/*
 * Consistent enterprise form treatment.
 */
.numbers-sidebar select,
.numbers-sidebar input:not([type="checkbox"]):not([type="radio"]){
    min-height:46px;

    padding-inline:12px;

    border:
        1px solid
        rgba(15,23,42,.13);

    border-radius:12px;

    background:#fff;

    font-size:.90rem;
    line-height:1.4;

    transition:
        border-color .16s ease,
        box-shadow .16s ease,
        background-color .16s ease;
}

.numbers-sidebar select:focus,
.numbers-sidebar input:not([type="checkbox"]):not([type="radio"]):focus{
    outline:none;

    border-color:
        rgba(0,149,218,.66);

    box-shadow:
        0 0 0 3px
        rgba(0,149,218,.11);
}

/*
 * PRICE RANGE
 * Two inputs must divide the available sidebar width.
 */
.numbers-sidebar .numbers-price-range{
    display:grid!important;

    grid-template-columns:
        minmax(0,1fr)
        minmax(0,1fr)!important;

    width:100%!important;
    min-width:0!important;
    max-width:100%!important;

    gap:8px!important;
}

.numbers-sidebar .numbers-price-range > *{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
}

.numbers-sidebar .p912-price-input{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
}


/* ---------------------------------------------------------
   EXACT POSITION SEARCH
   0912 + divider + seven-digit body
   --------------------------------------------------------- */

.numbers-sidebar .numbers-position-search,
.numbers-sidebar .p912-position-search--numbers{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
}

/*
 * Important:
 * do not use viewport breakpoint to decide digit sizing here.
 * The component must fit its containing sidebar at all
 * desktop resolutions.
 */
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__fields{
    display:grid!important;

    grid-template-columns:
        minmax(0,4fr)
        auto
        minmax(0,7fr)!important;

    align-items:center;

    width:100%!important;
    min-width:0!important;
    max-width:100%!important;

    gap:5px!important;
}

/*
 * Each group distributes its own digits equally.
 */
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__group{
    display:grid!important;

    grid-auto-flow:column!important;
    grid-auto-columns:minmax(0,1fr)!important;

    width:100%!important;
    min-width:0!important;
    max-width:100%!important;

    gap:4px!important;
}

/*
 * Override V4's fixed 48–50px digit width specifically
 * inside the /numbers sidebar.
 */
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__digit{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;

    height:46px!important;

    padding:0!important;

    border-radius:10px!important;

    font-size:clamp(
        .82rem,
        1.3vw,
        1rem
    )!important;

    text-align:center!important;
}

/*
 * Divider must never steal flexible width.
 */
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__divider{
    width:auto!important;
    min-width:0!important;

    padding-inline:1px;

    flex:0 0 auto;
}

/*
 * Header/hint text must be able to wrap naturally without
 * expanding the sidebar.
 */
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__head,
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__hint{
    width:100%;
    min-width:0;
    max-width:100%;

    overflow-wrap:anywhere;
}

/*
 * VIP checkbox remains an inline/flex control and is not
 * affected by the generic width:100% input rule.
 */
.numbers-sidebar .numbers-vip-check{
    display:flex;
    align-items:center;
    gap:9px;

    width:100%;
    min-width:0;
}

.numbers-sidebar
.numbers-vip-check
input[type="checkbox"]{
    flex:0 0 auto;

    width:18px;
    min-width:18px;
    height:18px;

    margin:0;
}

/*
 * Submit/action button.
 */
.numbers-sidebar button[type="submit"]{
    min-height:48px;

    border-radius:12px;

    font-weight:850;
}


/* ---------------------------------------------------------
   TABLET / MOBILE
   --------------------------------------------------------- */

@media(max-width:900px){

    .numbers-sidebar{
        width:100%;
        max-width:100%!important;

        padding:15px;

        border-radius:17px;
    }

    .numbers-sidebar
    .p912-position-search--numbers
    .p912-position-search__digit{
        height:44px!important;
    }
}

@media(max-width:640px){

    .numbers-sidebar{
        padding:13px 11px;

        border-radius:15px;
    }

    .numbers-sidebar .numbers-price-range{
        grid-template-columns:
            minmax(0,1fr)
            minmax(0,1fr)!important;

        gap:7px!important;
    }

    .numbers-sidebar
    .p912-position-search--numbers
    .p912-position-search__fields{
        gap:3px!important;
    }

    .numbers-sidebar
    .p912-position-search--numbers
    .p912-position-search__group{
        gap:3px!important;
    }

    .numbers-sidebar
    .p912-position-search--numbers
    .p912-position-search__digit{
        height:42px!important;

        font-size:.82rem!important;

        border-radius:9px!important;
    }
}

@media(max-width:390px){

    .numbers-sidebar .numbers-price-range{
        grid-template-columns:1fr!important;
    }

    .numbers-sidebar
    .p912-position-search--numbers
    .p912-position-search__digit{
        height:40px!important;

        font-size:.76rem!important;
    }
}


/* =========================================================
   P912_NUMBERS_POSITION_SEARCH_READABILITY_V2

   /numbers exact-position search readability authority.

   The previous containment fix correctly prevented overflow,
   but eleven digit boxes sharing one narrow sidebar row made
   the controls too small.

   V2 uses two readable rows:
   - first group: 0912
   - second group: seven-digit number body

   Search semantics and JS behavior stay unchanged.
   ========================================================= */

.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__fields{
    display:grid!important;

    grid-template-columns:
        minmax(0,1fr)!important;

    grid-template-rows:
        auto
        auto
        auto!important;

    width:100%!important;
    min-width:0!important;
    max-width:100%!important;

    row-gap:10px!important;
    column-gap:0!important;

    overflow:visible!important;
}

/*
 * Each number group gets the full available row width.
 * Minimum 46px is safe now because groups live on separate
 * rows rather than forcing all eleven digits side-by-side.
 */
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__group{
    display:grid!important;

    grid-auto-flow:column!important;
    grid-auto-columns:
        minmax(46px,1fr)!important;

    justify-content:stretch!important;

    width:100%!important;
    min-width:0!important;
    max-width:100%!important;

    gap:7px!important;
}

/*
 * 0912 should not look excessively stretched compared with
 * the seven-digit body. Keep it visually compact but large.
 */
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__group:first-child{
    width:min(100%,244px)!important;
    max-width:244px!important;

    justify-self:start!important;
}

/*
 * Seven-digit body owns the complete available width.
 */
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__group--body{
    width:100%!important;
    max-width:100%!important;
}

/*
 * Real usable digit fields.
 */
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__digit{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;

    min-height:52px!important;
    height:52px!important;

    padding:0 3px!important;

    border-radius:12px!important;

    font-size:
        clamp(
            1rem,
            1.45vw,
            1.14rem
        )!important;

    font-weight:800!important;
    line-height:1!important;

    text-align:center!important;

    background:#fff!important;

    border:
        1px solid
        rgba(15,23,42,.16)!important;

    box-shadow:
        0 1px 2px
        rgba(15,23,42,.025)!important;
}

.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__digit:hover{
    border-color:
        rgba(0,149,218,.42)!important;
}

.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__digit:focus{
    outline:none!important;

    border-color:
        rgba(0,149,218,.78)!important;

    box-shadow:
        0 0 0 3px
        rgba(0,149,218,.12)!important;
}

/*
 * Existing visual divider is no longer required between
 * horizontally adjacent groups. Keep it structurally present
 * for compatibility but remove its consumed layout space.
 */
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__divider{
    display:none!important;
}

/*
 * Header hierarchy.
 */
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__head{
    margin-bottom:12px!important;
}

.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__title{
    font-size:
        clamp(
            1.02rem,
            1.4vw,
            1.14rem
        )!important;

    font-weight:900!important;
    line-height:1.55!important;
}

.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__subtitle{
    margin-top:3px!important;

    font-size:.88rem!important;
    line-height:1.75!important;
}

/*
 * Example/help text should be readable rather than compressed.
 */
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__hint{
    margin-top:12px!important;

    padding:9px 10px!important;

    border-radius:10px!important;

    background:
        rgba(0,149,218,.055)!important;

    font-size:.82rem!important;
    line-height:1.8!important;

    overflow-wrap:normal!important;
}


/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */

@media(max-width:900px){

    .numbers-sidebar
    .p912-position-search--numbers
    .p912-position-search__digit{
        min-height:50px!important;
        height:50px!important;

        font-size:1rem!important;
    }
}

@media(max-width:640px){

    .numbers-sidebar
    .p912-position-search--numbers
    .p912-position-search__fields{
        row-gap:8px!important;
    }

    .numbers-sidebar
    .p912-position-search--numbers
    .p912-position-search__group{
        grid-auto-columns:
            minmax(40px,1fr)!important;

        gap:5px!important;
    }

    .numbers-sidebar
    .p912-position-search--numbers
    .p912-position-search__group:first-child{
        width:min(100%,220px)!important;
        max-width:220px!important;
    }

    .numbers-sidebar
    .p912-position-search--numbers
    .p912-position-search__digit{
        min-height:48px!important;
        height:48px!important;

        font-size:.96rem!important;

        border-radius:10px!important;
    }

    .numbers-sidebar
    .p912-position-search--numbers
    .p912-position-search__hint{
        font-size:.80rem!important;
        line-height:1.75!important;
    }
}

@media(max-width:390px){

    .numbers-sidebar
    .p912-position-search--numbers
    .p912-position-search__group{
        grid-auto-columns:
            minmax(0,1fr)!important;

        gap:4px!important;
    }

    .numbers-sidebar
    .p912-position-search--numbers
    .p912-position-search__group:first-child{
        width:min(100%,208px)!important;
        max-width:208px!important;
    }

    .numbers-sidebar
    .p912-position-search--numbers
    .p912-position-search__digit{
        min-height:46px!important;
        height:46px!important;

        font-size:.92rem!important;
    }
}


/* =========================================================
   P912_NUMBERS_FIXED_0912_PREFIX_V3

   Exact search final sidebar presentation:
   - 0912 is a fixed, muted prefix
   - only seven variable digits are visually editable
   - original DOM/JS/backend contract remains untouched
   ========================================================= */

.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__fields{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:auto auto!important;

    width:100%!important;
    min-width:0!important;
    max-width:100%!important;

    row-gap:10px!important;
}

/*
 * Prefix digits remain in the DOM for compatibility,
 * but are no longer presented as editable controls.
 */
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__group:first-child{
    display:none!important;
}

/*
 * The visual fixed prefix.
 */
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__fields::before{
    content:"0912";

    display:inline-flex;
    align-items:center;
    justify-content:center;

    justify-self:start;

    width:auto;
    min-width:112px;
    min-height:42px;

    padding:7px 15px;

    border:
        1px solid
        rgba(15,23,42,.08);

    border-radius:11px;

    background:
        rgba(15,23,42,.035);

    color:
        rgba(15,23,42,.46);

    font-size:1.05rem;
    font-weight:800;
    line-height:1;

    font-variant-numeric:tabular-nums;
    letter-spacing:.18em;

    direction:ltr;
    unicode-bidi:isolate;

    user-select:none;
}

/*
 * Divider belongs to the old one-row layout.
 */
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__divider{
    display:none!important;
}

/*
 * Seven actual searchable digits.
 */
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__group{
    display:grid!important;

    grid-auto-flow:column!important;
    grid-auto-columns:
        minmax(0,1fr)!important;

    width:100%!important;
    min-width:0!important;
    max-width:100%!important;

    gap:8px!important;
}

.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__group:last-child{
    width:100%!important;
    max-width:100%!important;
}

/*
 * Large usable digit boxes.
 */
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__digit{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;

    min-height:54px!important;
    height:54px!important;

    padding:0!important;

    border-radius:12px!important;

    border:
        1px solid
        rgba(15,23,42,.15)!important;

    background:#fff!important;

    font-size:1.08rem!important;
    font-weight:850!important;
    line-height:1!important;

    text-align:center!important;

    box-shadow:
        0 1px 2px
        rgba(15,23,42,.03)!important;
}

.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__digit:focus{
    outline:none!important;

    border-color:
        rgba(0,149,218,.82)!important;

    box-shadow:
        0 0 0 3px
        rgba(0,149,218,.12)!important;
}

/*
 * Stronger hierarchy for the explanatory copy.
 */
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__title{
    font-size:1.08rem!important;
    font-weight:900!important;
    line-height:1.55!important;
}

.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__subtitle{
    margin-top:4px!important;

    font-size:.89rem!important;
    line-height:1.8!important;

    color:
        rgba(15,23,42,.66)!important;
}

.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__hint{
    margin-top:13px!important;

    padding:10px 11px!important;

    border-radius:10px!important;

    background:
        rgba(0,149,218,.05)!important;

    font-size:.83rem!important;
    line-height:1.85!important;
}


/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media(max-width:640px){

    .numbers-sidebar
    .p912-position-search--numbers
    .p912-position-search__fields::before{
        min-width:104px;
        min-height:40px;

        padding:6px 13px;

        font-size:1rem;
    }

    .numbers-sidebar
    .p912-position-search--numbers
    .p912-position-search__group{
        gap:6px!important;
    }

    .numbers-sidebar
    .p912-position-search--numbers
    .p912-position-search__digit{
        min-height:50px!important;
        height:50px!important;

        font-size:1rem!important;

        border-radius:10px!important;
    }
}

@media(max-width:390px){

    .numbers-sidebar
    .p912-position-search--numbers
    .p912-position-search__group{
        gap:4px!important;
    }

    .numbers-sidebar
    .p912-position-search--numbers
    .p912-position-search__digit{
        min-height:47px!important;
        height:47px!important;

        font-size:.94rem!important;
    }
}


/* =========================================================
   P912_NUMBERS_POSITION_SEARCH_SEGMENTED_V4

   Final exact-number search presentation for /numbers.

   - all 11 digit fields remain visible and editable
   - first 4 digits remain real inputs
   - last 7 digits remain real inputs
   - no fake 0912 pseudo element
   - visually connected segmented controls
   - two readable rows inside the narrow sidebar
   - JS/backend/search semantics unchanged

   This block intentionally supersedes V2/V3 presentation.
   ========================================================= */

.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__fields{
    display:grid!important;

    grid-template-columns:
        minmax(0,1fr)!important;

    grid-template-rows:
        auto
        auto!important;

    width:100%!important;
    min-width:0!important;
    max-width:100%!important;

    row-gap:10px!important;
    column-gap:0!important;

    overflow:visible!important;
}


/*
 * V3 fixed pseudo prefix is completely retired.
 */
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__fields::before{
    content:none!important;
    display:none!important;
}


/*
 * Restore the real first four editable fields.
 */
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__group:first-child{
    display:grid!important;

    width:min(100%,240px)!important;
    max-width:240px!important;

    justify-self:start!important;
}


/*
 * Both groups behave as connected segmented controls.
 */
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__group{
    display:grid!important;

    grid-auto-flow:column!important;
    grid-auto-columns:
        minmax(0,1fr)!important;

    width:100%!important;
    min-width:0!important;
    max-width:100%!important;

    gap:0!important;

    overflow:hidden!important;

    border:
        1px solid
        rgba(15,23,42,.14)!important;

    border-radius:14px!important;

    background:#fff!important;

    box-shadow:
        0 2px 8px
        rgba(15,23,42,.035)!important;
}


/*
 * Seven-digit body uses full sidebar width.
 */
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__group:last-child{
    width:100%!important;
    max-width:100%!important;
}


/*
 * Old divider is unnecessary because the two groups have
 * their own rows.
 */
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__divider{
    display:none!important;
}


/*
 * Digit inputs form one continuous segmented surface.
 */
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__digit{
    position:relative!important;

    width:100%!important;
    min-width:0!important;
    max-width:none!important;

    min-height:56px!important;
    height:56px!important;

    padding:0 2px!important;
    margin:0!important;

    border:0!important;
    border-radius:0!important;

    background:#fff!important;

    color:#0f172a!important;

    font-size:
        clamp(
            1.02rem,
            1.5vw,
            1.16rem
        )!important;

    font-weight:850!important;
    line-height:1!important;

    text-align:center!important;

    font-variant-numeric:
        tabular-nums!important;

    box-shadow:none!important;

    transition:
        background-color .15s ease,
        box-shadow .15s ease,
        color .15s ease!important;
}


/*
 * Internal separators only.
 */
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__digit
+
.p912-position-search__digit{
    border-left:
        1px solid
        rgba(15,23,42,.11)!important;
}


/*
 * Hover keeps the connected-field appearance.
 */
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__digit:hover{
    background:
        rgba(0,149,218,.025)!important;
}


/*
 * Active digit is obvious without breaking the shared border.
 */
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__digit:focus{
    z-index:2!important;

    outline:none!important;

    background:
        rgba(0,149,218,.055)!important;

    box-shadow:
        inset 0 0 0 2px
        rgba(0,149,218,.68)!important;
}


/*
 * Placeholder remains quiet.
 */
.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__digit::placeholder{
    color:
        rgba(15,23,42,.27)!important;

    opacity:1!important;
}


/* ---------------------------------------------------------
   COPY / TYPOGRAPHY
   --------------------------------------------------------- */

.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__head{
    margin-bottom:13px!important;
}

.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__title{
    margin:0!important;

    font-size:1.08rem!important;
    font-weight:900!important;
    line-height:1.55!important;

    color:#0f172a!important;
}

.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__subtitle{
    margin-top:4px!important;

    font-size:.89rem!important;
    font-weight:500!important;
    line-height:1.8!important;

    color:
        rgba(15,23,42,.64)!important;
}

.numbers-sidebar
.p912-position-search--numbers
.p912-position-search__hint{
    margin-top:12px!important;

    padding:10px 11px!important;

    border:
        1px solid
        rgba(0,149,218,.08)!important;

    border-radius:10px!important;

    background:
        rgba(0,149,218,.045)!important;

    color:
        rgba(15,23,42,.67)!important;

    font-size:.82rem!important;
    line-height:1.85!important;
}


/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media(max-width:640px){

    .numbers-sidebar
    .p912-position-search--numbers
    .p912-position-search__fields{
        row-gap:8px!important;
    }

    .numbers-sidebar
    .p912-position-search--numbers
    .p912-position-search__group:first-child{
        width:min(100%,224px)!important;
        max-width:224px!important;
    }

    .numbers-sidebar
    .p912-position-search--numbers
    .p912-position-search__digit{
        min-height:52px!important;
        height:52px!important;

        font-size:1rem!important;
    }
}


@media(max-width:390px){

    .numbers-sidebar
    .p912-position-search--numbers
    .p912-position-search__group:first-child{
        width:min(100%,210px)!important;
        max-width:210px!important;
    }

    .numbers-sidebar
    .p912-position-search--numbers
    .p912-position-search__digit{
        min-height:49px!important;
        height:49px!important;

        font-size:.95rem!important;
    }
}
