/* Completed It Mate — member settings + connection nudge polish
   Scoped to settings/profile components only. Does not replace app.css. */

.settings-tabs-polished{
    display:flex;
    gap:8px;
    overflow-x:auto;
    scrollbar-width:none;
    padding:4px 0 10px;
    -webkit-overflow-scrolling:touch;
}
.settings-tabs-polished::-webkit-scrollbar{display:none}
.settings-tabs-polished a{
    flex:0 0 auto;
    white-space:nowrap;
}

.settings-intro-row{
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    gap:20px;
}
.profile-completion-badge{
    flex:0 0 auto;
    min-width:118px;
    padding:12px 14px;
    border:1px solid rgba(250,204,21,.34);
    border-radius:16px;
    background:linear-gradient(145deg,rgba(250,204,21,.11),rgba(255,255,255,.025));
    text-align:right;
}
.profile-completion-badge span{
    display:block;
    color:#facc15;
    font-size:1.7rem;
    line-height:1;
    font-weight:950;
    letter-spacing:-.04em;
}
.profile-completion-badge small{
    display:block;
    margin-top:5px;
    color:#9b9ba3;
    font-size:.62rem;
    font-weight:850;
    letter-spacing:.11em;
}

.private-details-card{
    display:grid;
    gap:22px;
}
.private-data-banner{
    display:flex;
    align-items:center;
    gap:12px;
    padding:14px 15px;
    border:1px solid #303036;
    border-radius:15px;
    background:linear-gradient(135deg,#151518,#111113);
}
.private-data-icon{
    display:grid;
    place-items:center;
    flex:0 0 38px;
    width:38px;
    height:38px;
    border-radius:12px;
    background:#facc15;
    color:#111;
    font-size:1rem;
}
.private-data-banner strong,
.private-data-banner span{display:block}
.private-data-banner strong{color:#fff;font-size:.84rem}
.private-data-banner span{margin-top:2px;color:#96969f;font-size:.74rem;line-height:1.45}

.settings-subsection{
    padding-top:2px;
}
.settings-subsection + .settings-subsection{
    padding-top:20px;
    border-top:1px solid #29292e;
}
.settings-subsection-head{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:16px;
    margin-bottom:14px;
}
.settings-subsection-head>div{
    display:flex;
    align-items:center;
    gap:9px;
}
.settings-subsection-head h3{
    margin:0;
    color:#fff;
    font-size:1rem;
}
.settings-subsection-head small{
    max-width:390px;
    color:#85858e;
    text-align:right;
    font-size:.7rem;
    line-height:1.4;
}
.settings-step{
    display:grid;
    place-items:center;
    width:28px;
    height:28px;
    border-radius:9px;
    background:#202024;
    color:#facc15;
    font-weight:900;
    font-size:.68rem;
}

.settings-form-grid,
.settings-address-grid{
    gap:13px;
}
.settings-address-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
}
.settings-address-grid .span-two{grid-column:1/-1}

.private-details-card label{
    min-width:0;
}
.private-details-card input,
.private-details-card select{
    width:100%;
}

.age-readiness{
    min-height:47px;
    display:grid;
    grid-template-columns:auto 1fr;
    grid-template-rows:auto auto;
    column-gap:9px;
    align-content:center;
    padding:9px 11px;
    border:1px solid #303036;
    border-radius:11px;
    background:#121214;
}
.age-dot{
    grid-row:1/3;
    align-self:center;
    width:9px;
    height:9px;
    border-radius:50%;
    background:#64646d;
    box-shadow:0 0 0 4px rgba(100,100,109,.12);
}
.age-readiness.has-dob .age-dot{
    background:#facc15;
    box-shadow:0 0 0 4px rgba(250,204,21,.12);
}
.age-readiness strong{
    color:#fff;
    font-size:.76rem;
}
.age-readiness small{
    color:#85858e;
    font-size:.65rem;
}

.settings-save-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:18px;
    padding-top:18px;
    border-top:1px solid #29292e;
}
.settings-save-row strong,
.settings-save-row small{display:block}
.settings-save-row strong{color:#fff;font-size:.82rem}
.settings-save-row small{margin-top:3px;color:#85858e;font-size:.69rem}
.settings-save-row .button{flex:0 0 auto}

/* Compact, brand-led connection nudge */
.mate-nudge-bar{
    display:grid;
    grid-template-columns:minmax(260px,.78fr) minmax(360px,1.22fr);
    align-items:center;
    gap:18px;
    margin-top:14px;
    padding:14px 16px;
    border:1px solid rgba(250,204,21,.32);
    border-radius:16px;
    background:
        radial-gradient(circle at 0 50%,rgba(250,204,21,.09),transparent 34%),
        linear-gradient(135deg,#171719,#111113);
    box-shadow:0 12px 34px rgba(0,0,0,.16);
}
.mate-nudge-copy{
    display:flex;
    align-items:center;
    gap:12px;
    min-width:0;
}
.mate-nudge-bolt{
    display:grid;
    place-items:center;
    flex:0 0 42px;
    width:42px;
    height:42px;
    border-radius:13px;
    background:#facc15;
    color:#111;
    font-size:1.05rem;
}
.mate-nudge-copy .eyebrow{
    margin:0 0 2px;
    font-size:.58rem;
}
.mate-nudge-copy strong,
.mate-nudge-copy small{display:block}
.mate-nudge-copy strong{
    color:#fff;
    font-size:.88rem;
    line-height:1.2;
}
.mate-nudge-copy small{
    margin-top:3px;
    color:#8e8e97;
    font-size:.67rem;
    line-height:1.35;
}
.mate-nudge-form{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:9px;
    align-items:center;
    min-width:0;
}
.mate-nudge-form label{min-width:0}
.mate-nudge-form select{
    width:100%;
    min-width:0;
    height:42px;
    padding:0 38px 0 12px;
    border:1px solid #36363c;
    border-radius:11px;
    background:#0f0f11;
    color:#f3f3f5;
    font-size:.72rem;
    text-overflow:ellipsis;
}
.mate-nudge-form .button{
    height:42px;
    padding:0 14px;
    white-space:nowrap;
    font-size:.69rem;
}
.sr-only{
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    padding:0!important;
    margin:-1px!important;
    overflow:hidden!important;
    clip:rect(0,0,0,0)!important;
    white-space:nowrap!important;
    border:0!important;
}

@media (max-width:900px){
    .mate-nudge-bar{
        grid-template-columns:1fr;
        gap:12px;
    }
    .mate-nudge-copy small{max-width:520px}
}

@media (max-width:720px){
    .settings-intro-row{
        align-items:flex-start;
    }
    .profile-completion-badge{
        min-width:94px;
        padding:10px 11px;
    }
    .profile-completion-badge span{font-size:1.35rem}

    .settings-subsection-head{
        align-items:flex-start;
        flex-direction:column;
        gap:7px;
    }
    .settings-subsection-head small{
        text-align:left;
        max-width:none;
        padding-left:37px;
    }
    .settings-address-grid{
        grid-template-columns:1fr;
    }
    .settings-address-grid .span-two{grid-column:auto}
    .settings-save-row{
        align-items:stretch;
        flex-direction:column;
    }
    .settings-save-row .button{
        width:100%;
    }

    .mate-nudge-bar{
        padding:13px;
        border-radius:14px;
    }
    .mate-nudge-form{
        grid-template-columns:1fr;
    }
    .mate-nudge-form select,
    .mate-nudge-form .button{
        width:100%;
        height:44px;
    }
}

@media (max-width:480px){
    .settings-intro-row{
        display:grid;
        grid-template-columns:1fr auto;
        gap:12px;
    }
    .private-data-banner{
        align-items:flex-start;
    }
    .mate-nudge-copy{
        align-items:flex-start;
    }
    .mate-nudge-bolt{
        width:38px;
        height:38px;
        flex-basis:38px;
    }
}


/* =========================================================
   038 — SOCIAL / DECK / STORY / CATEGORY POLISH
   ========================================================= */

/* PEOPLE */
.people-shell{max-width:1180px}
.people-shell .people-hero{padding-block:26px 18px}
.people-shell .people-grid{
    grid-template-columns:repeat(auto-fit,minmax(290px,1fr));
    gap:10px;
}
.people-card-polished{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:12px!important;
    min-height:78px!important;
    padding:11px 12px!important;
}
.person-main-link{
    display:flex;
    align-items:center;
    gap:10px;
    min-width:0;
    text-decoration:none;
    color:inherit;
}
.people-card-polished .person-avatar{
    width:46px!important;
    height:46px!important;
    flex:0 0 46px!important;
}
.people-card-polished .person-copy{min-width:0}
.people-card-polished .person-copy strong{font-size:.88rem}
.people-card-polished .person-copy span{font-size:.68rem}
.people-card-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:7px;
}
.relationship-form select{
    height:34px;
    width:auto;
    min-width:88px;
    padding:0 28px 0 9px;
    border-radius:9px;
    font-size:.65rem;
    font-weight:800;
}
.people-mini-link{
    display:inline-flex;
    align-items:center;
    height:34px;
    padding:0 9px;
    border:1px solid #34343a;
    border-radius:9px;
    color:#dedee3;
    text-decoration:none;
    font-size:.62rem;
    font-weight:850;
    letter-spacing:.04em;
}
.people-mini-link:hover{border-color:#facc15;color:#facc15}
.people-manage{position:relative}
.people-manage summary{
    list-style:none;
    display:grid;
    place-items:center;
    width:34px;
    height:34px;
    border:1px solid #34343a;
    border-radius:9px;
    color:#9b9ba5;
    cursor:pointer;
    font-weight:900;
}
.people-manage summary::-webkit-details-marker{display:none}
.people-manage-popover{
    position:absolute;
    z-index:20;
    right:0;
    top:40px;
    width:230px;
    padding:13px;
    border:1px solid #38383f;
    border-radius:13px;
    background:#171719;
    box-shadow:0 18px 42px rgba(0,0,0,.42);
}
.people-manage-popover strong,
.people-manage-popover small{display:block}
.people-manage-popover strong{font-size:.76rem;color:#fff}
.people-manage-popover small{margin:4px 0 11px;color:#898993;font-size:.64rem;line-height:1.4}
.people-remove-button{
    width:100%;
    border-color:#5b2c31!important;
    background:#261417!important;
    color:#ef9ba3!important;
    font-size:.64rem!important;
}

/* MY DECK — smaller, denser on mobile without losing Card art */
.my-deck-shell{max-width:1180px}
.my-deck-shell .my-deck-hero{
    padding-block:24px 18px;
}
.my-deck-shell .deck-grid{
    grid-template-columns:repeat(auto-fill,minmax(210px,1fr));
    gap:12px;
}
.my-deck-shell .deck-card{
    border-radius:15px;
    overflow:hidden;
}
.my-deck-shell .deck-card-art{
    aspect-ratio:1/1;
}
.my-deck-shell .deck-card-copy{
    padding:11px 12px 12px;
}
.my-deck-shell .deck-card-copy h2{
    font-size:.9rem;
    line-height:1.12;
    margin:.22rem 0 .45rem;
}
.my-deck-shell .deck-card-copy>span,
.my-deck-shell .deck-card-copy small{font-size:.61rem}
.my-deck-shell .deck-card-copy strong{font-size:.66rem}

/* CARDS CATEGORY STRIP — compact, predictable and horizontally scrollable */
.interactive-category-strip{
    display:flex!important;
    grid-template-columns:none!important;
    gap:8px!important;
    overflow-x:auto!important;
    padding:4px 0 10px!important;
    scroll-snap-type:x proximity;
    scrollbar-width:none;
}
.interactive-category-strip::-webkit-scrollbar{display:none}
.interactive-category-strip>a{
    flex:0 0 auto!important;
    width:auto!important;
    min-width:116px!important;
    max-width:160px!important;
    min-height:72px!important;
    padding:10px 11px!important;
    border-radius:13px!important;
    scroll-snap-align:start;
}
.interactive-category-strip .category-tile-icon{
    width:27px!important;
    height:27px!important;
    font-size:.82rem!important;
    margin-bottom:5px!important;
}
.interactive-category-strip .category-tile-label{
    font-size:.72rem!important;
    line-height:1.05!important;
}
.interactive-category-strip .category-tile-count{
    margin-top:3px!important;
    font-size:.56rem!important;
}

/* DASHBOARD PARTNER CARDS — keep them special without dominating Home */
.home-partner-card-grid{
    display:grid!important;
    grid-template-columns:repeat(auto-fit,minmax(260px,420px))!important;
    gap:10px!important;
}
.home-partner-card{
    display:grid!important;
    grid-template-columns:88px minmax(0,1fr)!important;
    min-height:88px!important;
    border-radius:14px!important;
}
.home-partner-card-art{
    width:88px!important;
    min-height:88px!important;
    aspect-ratio:1/1!important;
}
.home-partner-card-copy{
    padding:10px 12px!important;
}
.home-partner-card-copy strong{
    font-size:.82rem!important;
    line-height:1.15!important;
}
.home-partner-card-copy small,
.home-partner-card-copy em{font-size:.56rem!important}
.home-partner-card-copy .progress-track{margin-top:7px!important}

/* STORY — compact timeline, stronger hierarchy */
.story-polished{max-width:1060px}
.story-polished .story-profile-hero{
    max-width:900px;
    margin-inline:auto;
    padding:18px 20px!important;
    min-height:auto!important;
}
.story-polished .story-philosophy{
    max-width:900px;
    margin:12px auto 22px!important;
    padding:11px 14px!important;
}
.story-polished .story-stream{
    max-width:800px!important;
    margin-inline:auto!important;
}
.story-polished .story-month-divider{
    margin:20px 0 10px!important;
}
.story-polished .story-card-v2{
    border-radius:16px!important;
    padding:14px!important;
    margin-bottom:12px!important;
}
.story-polished .story-user-line{
    gap:8px!important;
    margin-bottom:11px!important;
}
.story-polished .story-mini-avatar{
    width:34px!important;
    height:34px!important;
    flex:0 0 34px!important;
}
.story-polished .story-user-line strong{font-size:.75rem!important}
.story-polished .story-user-line small{font-size:.59rem!important}
.story-polished .story-card-main{
    gap:10px!important;
    margin-bottom:10px!important;
}
.story-polished .story-card-icon{
    width:37px!important;
    height:37px!important;
    min-width:37px!important;
}
.story-polished .story-card-main h2{
    font-size:1.05rem!important;
    line-height:1.12!important;
    margin:.15rem 0!important;
}
.story-polished .story-action-label,
.story-polished .story-item-type{font-size:.57rem!important}
.story-polished .story-hero-photo{
    width:100%;
    max-height:390px!important;
    object-fit:cover;
    border-radius:12px!important;
    margin:9px 0!important;
}
.story-polished .story-memory-v2{
    font-size:.82rem!important;
    line-height:1.48!important;
    margin:9px 0!important;
}
.story-with-people{
    display:flex;
    align-items:center;
    gap:7px;
    margin:8px 0;
    color:#a5a5ad;
    font-size:.62rem;
}
.story-with-people span{
    color:#facc15;
    font-weight:900;
    letter-spacing:.08em;
}
.story-with-people strong{font-weight:750;color:#dddde2}
.story-tagged-pill{
    margin-left:auto;
    padding:4px 7px;
    border:1px solid rgba(250,204,21,.32);
    border-radius:999px;
    color:#facc15;
    font-size:.54rem;
    font-weight:900;
    letter-spacing:.06em;
}
.story-polished .story-detail-chips{
    gap:6px!important;
    margin-top:8px!important;
}
.story-polished .story-detail-chips span{
    padding:5px 7px!important;
    font-size:.58rem!important;
}
.story-polished .story-card-footer{
    margin-top:10px!important;
    padding-top:9px!important;
}
.story-card-secondary-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:7px;
}
.story-hide-button{
    appearance:none;
    border:0;
    background:none;
    color:#777781;
    padding:6px 4px;
    cursor:pointer;
    font:inherit;
    font-size:.56rem;
    font-weight:800;
    letter-spacing:.04em;
}
.story-hide-button:hover{color:#ef9ba3}
.story-polished .story-share-button{
    padding:7px 9px!important;
    font-size:.6rem!important;
}

/* NUDGE: now two compact selects + button */
.mate-nudge-bar{
    grid-template-columns:minmax(230px,.65fr) minmax(440px,1.35fr)!important;
}
.mate-nudge-form{
    grid-template-columns:minmax(0,1fr) minmax(0,.85fr) auto!important;
}

/* Small screens */
@media(max-width:820px){
    .people-shell .people-grid{grid-template-columns:1fr}
    .people-card-polished{
        grid-template-columns:1fr!important;
        gap:9px!important;
    }
    .people-card-actions{
        display:grid;
        grid-template-columns:minmax(100px,1fr) auto auto auto;
        width:100%;
        justify-content:stretch;
    }
    .relationship-form select{width:100%}
    .people-mini-link{justify-content:center}
    .people-manage-popover{right:0}

    .mate-nudge-bar{
        grid-template-columns:1fr!important;
    }
    .mate-nudge-form{
        grid-template-columns:1fr 1fr!important;
    }
    .mate-nudge-form .button{grid-column:1/-1}

    .story-polished .story-profile-hero{
        margin-inline:0;
    }
}

@media(max-width:620px){
    .people-shell .people-hero{
        padding-top:18px;
    }
    .people-shell .people-search{
        display:grid!important;
        grid-template-columns:auto minmax(0,1fr)!important;
        gap:7px!important;
    }
    .people-shell .people-search .button{
        grid-column:1/-1;
        width:100%;
    }
    .people-card-polished{
        padding:10px!important;
        min-height:0!important;
    }
    .people-card-actions{
        grid-template-columns:1fr 1fr auto;
    }
    .relationship-form{grid-column:1/-1}
    .people-mini-link{height:32px}
    .people-manage summary{width:32px;height:32px}

    .my-deck-shell .my-deck-hero{
        padding-top:17px;
    }
    .my-deck-shell .deck-score-card{
        padding:11px 12px!important;
    }
    .my-deck-shell .deck-toolbar{
        padding:9px!important;
    }
    .my-deck-shell .deck-view-tabs{
        overflow-x:auto;
        flex-wrap:nowrap!important;
        scrollbar-width:none;
    }
    .my-deck-shell .deck-view-tabs a{
        flex:0 0 auto;
        padding:7px 9px!important;
        font-size:.59rem!important;
    }
    .my-deck-shell .deck-grid{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        gap:8px!important;
    }
    .my-deck-shell .deck-card-copy{
        padding:8px 9px 9px!important;
    }
    .my-deck-shell .deck-card-copy h2{
        font-size:.76rem!important;
    }
    .my-deck-shell .deck-card-copy>span{
        display:none;
    }
    .my-deck-shell .deck-card-copy strong{
        font-size:.56rem!important;
    }
    .my-deck-shell .deck-card-copy small{
        font-size:.53rem!important;
    }
    .my-deck-shell .deck-earned-tick{
        width:26px!important;
        height:26px!important;
        font-size:.72rem!important;
    }
    .my-deck-shell .deck-awaiting-badge{
        font-size:.5rem!important;
        padding:4px 6px!important;
    }

    .interactive-category-strip>a{
        min-width:102px!important;
        max-width:130px!important;
        min-height:64px!important;
        padding:8px 9px!important;
    }

    .home-partner-card-grid{
        grid-template-columns:1fr!important;
    }
    .home-partner-card{
        grid-template-columns:74px minmax(0,1fr)!important;
        min-height:74px!important;
    }
    .home-partner-card-art{
        width:74px!important;
        min-height:74px!important;
    }

    .story-polished .story-profile-hero{
        padding:13px!important;
    }
    .story-polished .story-profile-avatar{
        width:50px!important;
        height:50px!important;
    }
    .story-polished .story-profile-copy h1{
        font-size:1.4rem!important;
    }
    .story-polished .story-profile-stats{
        gap:7px!important;
    }
    .story-polished .story-profile-stats>div{
        padding:8px!important;
    }
    .story-polished .story-philosophy{
        display:none!important;
    }
    .story-polished .story-card-v2{
        padding:11px!important;
        border-radius:13px!important;
    }
    .story-polished .story-card-main h2{
        font-size:.92rem!important;
    }
    .story-polished .story-hero-photo{
        max-height:300px!important;
        margin:7px 0!important;
    }
    .story-polished .story-card-footer{
        align-items:flex-start!important;
        gap:8px!important;
    }
    .story-card-secondary-actions{
        gap:4px;
        flex-wrap:wrap;
        justify-content:flex-end;
    }
    .story-hide-button{font-size:.5rem}
    .story-tagged-pill{font-size:.49rem}
}

@media(max-width:430px){
    .my-deck-shell .deck-grid{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
    }
    .mate-nudge-form{
        grid-template-columns:1fr!important;
    }
    .mate-nudge-form .button{grid-column:auto}
}