/*
 * V23 — Final mobile browser "Desktop site" mode treatment
 * Readable split hero, simplified dashboard and no invisible reveal gaps.
 */
@media (pointer:coarse) and (min-width:768px) and (max-width:1100px){

    /* Reveal animations can leave large blank spaces in mobile Desktop mode. */
    .reveal{
        opacity:1 !important;
        transform:none !important;
        transition:none !important;
    }

    .container{
        width:min(952px, calc(100% - 30px)) !important;
    }

    .hero{
        padding:28px 0 32px !important;
    }

    .hero-grid{
        grid-template-columns:minmax(0, .92fr) minmax(0, 1.08fr) !important;
        align-items:center !important;
        gap:30px !important;
    }

    .hero-copy{
        max-width:none !important;
        margin:0 !important;
        padding:0 !important;
        text-align:left !important;
    }

    .hero h1{
        font-size:38px !important;
        line-height:1.09 !important;
        letter-spacing:-.035em !important;
        max-width:430px !important;
        margin:0 0 14px !important;
    }

    .hero-break{
        display:block !important;
    }

    .hero h1 .accent-word{
        color:#16967f !important;
        -webkit-text-fill-color:#16967f !important;
    }

    .hero-lead{
        font-size:14.5px !important;
        line-height:1.63 !important;
        max-width:420px !important;
        margin:0 0 18px !important;
    }

    .hero-actions{
        display:flex !important;
        align-items:center !important;
        flex-wrap:wrap !important;
        gap:10px !important;
        margin:0 !important;
    }

    .hero-actions .button-primary{
        min-height:43px !important;
        padding:10px 16px !important;
        border-radius:10px !important;
        font-size:13px !important;
        white-space:nowrap !important;
    }

    .hero-actions .button-secondary{
        background:transparent !important;
        border:0 !important;
        width:auto !important;
        min-height:0 !important;
        padding:0 !important;
        border-radius:0 !important;
        font-size:13px !important;
        color:var(--ink) !important;
        text-decoration:underline !important;
        text-underline-offset:4px !important;
        white-space:nowrap !important;
    }

    .dashboard-shell{
        width:100% !important;
        max-width:none !important;
        margin:0 !important;
        padding:0 !important;
        align-self:center !important;
    }

    .floating-note.note-one{
        top:-12px !important;
        left:0 !important;
        font-size:9px !important;
        padding:6px 10px !important;
    }

    .dashboard-card{
        width:100% !important;
        max-width:none !important;
        padding:15px !important;
        border-radius:16px !important;
    }

    .dashboard-topbar{
        margin-bottom:11px !important;
    }

    .avatar{
        width:42px !important;
        height:42px !important;
        flex-basis:42px !important;
        border-radius:11px !important;
    }

    .dashboard-user h2{
        font-size:14px !important;
        line-height:1.25 !important;
    }

    .dashboard-user p{
        font-size:9px !important;
    }

    .verified-pill{
        font-size:8px !important;
        padding:5px 9px !important;
    }

    .dashboard-metrics{
        grid-template-columns:repeat(3,minmax(0,1fr)) !important;
        gap:7px !important;
        margin-bottom:8px !important;
    }

    .dashboard-metrics article{
        padding:10px 8px !important;
        border-radius:11px !important;
    }

    .dashboard-metrics span{
        font-size:8px !important;
        line-height:1.25 !important;
        margin-bottom:4px !important;
    }

    .dashboard-metrics strong{
        font-size:15px !important;
        line-height:1.2 !important;
    }

    .chart-card{
        margin:0 !important;
        padding:10px !important;
        border-radius:12px !important;
    }

    .chart-head > div > span{
        font-size:7.5px !important;
    }

    .chart-head strong{
        font-size:10px !important;
    }

    .chart-head small,
    .chart-labels{
        display:none !important;
    }

    .performance-chart{
        height:112px !important;
        margin-top:2px !important;
    }

    .dashboard-bottom{
        display:flex !important;
        justify-content:flex-end !important;
        margin-top:7px !important;
    }

    .dashboard-bottom > div:first-child{
        display:none !important;
    }

    .rank-box{
        min-width:70px !important;
        padding:7px 9px !important;
        border-radius:10px !important;
    }

    .rank-box span{
        font-size:7.5px !important;
    }

    .rank-box strong{
        font-size:16px !important;
        margin-top:1px !important;
    }

    .positioning-line{
        display:none !important;
    }

    .journey-section{
        padding-top:44px !important;
    }

    /* Keep the application form visible instead of a blank green block. */
    .application-form,
    .application-heading,
    .application-fit,
    .form-alert,
    .success-card{
        opacity:1 !important;
        transform:none !important;
    }
}