.mobile-home, .mobile-profile { display: none; }

@media screen and (max-width: 767.98px) {
    html:has(.workspace-page) { scroll-padding-top: calc(4.75rem + env(safe-area-inset-top, 0px)); }
    .mobile-header {
        position: sticky;
        top: 0;
        z-index: 11;
        justify-content: space-between;
        gap: .5rem;
        min-height: 4.75rem;
        padding: calc(.6rem + env(safe-area-inset-top, 0px))
            max(.9rem, env(safe-area-inset-right, 0px)) .6rem max(.9rem, env(safe-area-inset-left, 0px));
        background: linear-gradient(110deg, #00493c, #007b67 78%, #005446);
    }
    .mobile-brand { display: inline-flex; align-items: center; min-height: 44px; }
    .mobile-brand img { width: clamp(100px, 30vw, 140px); height: auto; }
    .mobile-header-date { color: #f3fff9; font-size: .77rem; text-align: center; }
    .mobile-nav-ready .mobile-profile {
        display: grid;
        place-items: center;
        flex: none;
        width: 44px;
        height: 44px;
        padding: 0;
        border: 2px solid #ffdc6c;
        border-radius: 50%;
        background: #e5fbf2;
        overflow: hidden;
    }
    .mobile-art { display: block; object-fit: contain; flex: none; }
    .mobile-tabs {
        gap: .2rem;
        border-top-color: #0d7862;
        background: linear-gradient(115deg, #00493c, #00705d);
        box-shadow: 0 -.25rem .85rem #00382a30;
    }
    .mobile-tab, .mobile-tab:hover, .mobile-tab:focus-visible { color: #f4fff9; }
    .mobile-tab { gap: .2rem; }
    .mobile-tab-icon {
        width: 31px;
        height: 31px;
        border-radius: .55rem;
        background: #e4f7ee;
    }
    .mobile-tab-icon .mobile-art { border-radius: .4rem; }
    .mobile-tab[aria-current], .mobile-tab[aria-expanded="true"] {
        color: #ffe78f;
        background: linear-gradient(140deg, #319782, #006450);
        box-shadow: inset 0 1px #fff6;
    }

    .mobile-panel[open] {
        color: #123c30;
        background: #f0fcf7;
        box-shadow: 0 -.4rem 1.4rem #003b2a33;
    }
    .mobile-panel::backdrop { background: #002b22a1; }
    .mobile-panel-heading { background: #f0fcf7; border-bottom-color: #c9e9dc; }
    .mobile-panel-close { color: #005849; background: #d8f0e6; }
    .mobile-panel-links .mobile-panel-link {
        display: flex;
        align-items: center;
        gap: .6rem;
        width: 100%;
        min-height: 3.2rem;
        padding: .35rem .45rem;
        border: 0;
        border-bottom: 1px solid #d7eee4;
        color: inherit;
        text-align: start;
        text-decoration: none;
        background: transparent;
    }
    .mobile-panel-link .mobile-art, .mobile-panel-summary .mobile-art {
        border-radius: .55rem;
        background: #e3f5ec;
    }
    .mobile-panel-link-label { flex: 1; min-width: 0; font-weight: 650; overflow-wrap: anywhere; }
    .mobile-panel-links .mobile-panel-link[aria-current] { background: #d7f1e6; }
    .mobile-panel-summary {
        display: flex;
        align-items: center;
        gap: .65rem;
        margin: .75rem 0 .35rem;
        padding: .65rem;
        border-radius: .8rem;
        background: #dff5ea;
    }
    .mobile-panel-summary :is(span, strong) { display: block; overflow-wrap: anywhere; }
    .mobile-panel-summary strong { font-size: 1.08rem; color: #005644; }
    .mobile-logout-button { display: inline-flex; align-items: center; gap: .45rem; min-height: 44px; }

    .mobile-nav-ready .dashboard-standard { display: none; }
    .mobile-nav-ready .workspace-content:has(.mobile-home) {
        padding-inline: clamp(.6rem, 3vw, 1rem);
        padding-top: .68rem;
        background: radial-gradient(ellipse at 45% 8%, #f4fffb, #e0f5ee 58%, #cfece2);
    }
    .mobile-nav-ready .mobile-home { display: block; color: #103e31; }
    .mobile-stock-hero {
        position: relative;
        display: grid;
        grid-template-columns: minmax(0,1fr) 42%;
        align-items: center;
        gap: .2rem;
        min-height: clamp(96px, 28vw, 123px);
        padding: .36rem .68rem .42rem;
        overflow: hidden;
        border: 1px solid #fff;
        border-radius: 1.22rem;
        background: linear-gradient(140deg, #fff, #cef4e8 69%, #a7e4d5);
        box-shadow: 0 6px 12px #00624b28;
    }
    .mobile-stock-hero::after {
        content: "";
        position: absolute;
        left: -1.2rem;
        bottom: -.2rem;
        width: 5.25rem;
        height: .8rem;
        transform: rotate(30deg);
        background: linear-gradient(110deg, #efb51b, #ffedab);
        pointer-events: none;
    }
    .mobile-stock-hero h2 { margin: 0 0 .15rem; font-size: clamp(.92rem, 4vw, 1.25rem); font-weight: 800; }
    .mobile-stock-value { font-size: clamp(1.75rem, 8.4vw, 2.6rem); letter-spacing: -.045em; line-height: 1; overflow-wrap: anywhere; }
    .mobile-stock-hero span { font-size: .73rem; font-weight: 650; }
    .mobile-stock-hero .mobile-art {
        width: 100%;
        height: clamp(82px, 25vw, 110px);
        max-width: 137px;
        object-fit: cover;
        margin-inline: auto;
        border-radius: .95rem;
        mix-blend-mode: multiply;
    }
    .mobile-home-metrics {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: .4rem;
        margin-top: .64rem;
    }
    .mobile-home-metric {
        display: grid;
        justify-items: center;
        align-content: center;
        gap: .08rem;
        min-height: 70px;
        padding: .26rem .12rem;
        border: 1px solid #fff;
        border-radius: .83rem;
        color: #174639;
        text-decoration: none;
        text-align: center;
        font-size: clamp(.62rem, 2.65vw, .74rem);
        line-height: 1.19;
        background: linear-gradient(#f7fffc, #d8f0e7);
        box-shadow: 0 4px 8px #00624b1d;
    }
    .mobile-home-metric .mobile-art { border-radius: .35rem; mix-blend-mode: multiply; }
    .mobile-home-metric strong {
        color: #00634b;
        font-size: clamp(.68rem, 3vw, .86rem);
        overflow-wrap: anywhere;
    }
    .mobile-shortcuts {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: .48rem .45rem;
        margin-block: .67rem;
    }
    .mobile-shortcut {
        position: relative;
        display: grid;
        justify-items: center;
        align-content: start;
        gap: .24rem;
        min-height: 44px;
        padding: 0;
        border: 0;
        color: #103e31;
        text-decoration: none;
        text-align: center;
        font-size: clamp(.69rem, 3.05vw, .84rem);
        line-height: 1.2;
        font-weight: 750;
        background: transparent;
    }
    .mobile-shortcut-face {
        display: grid;
        place-items: center;
        width: 92%;
        max-width: 105px;
        aspect-ratio: 1.43;
        border: 1px solid #fffb;
        border-radius: clamp(.8rem, 4vw, 1.08rem);
        background: linear-gradient(145deg, #fafffd, #b8e9dc);
        box-shadow: 0 5px 8px #00624b31;
    }
    .mobile-shortcut:nth-child(odd) .mobile-shortcut-face {
        background: linear-gradient(145deg, #10a98f, #00604d 75%, #004134);
    }
    .mobile-shortcut-face .mobile-art { width: 68%; height: auto; border-radius: .68rem; }
    .mobile-shortcut:nth-child(even) .mobile-art { mix-blend-mode: multiply; }
    .mobile-shortcut-badge {
        position: absolute;
        top: -.24rem;
        right: .12rem;
        min-width: 1.25rem;
        padding: .12rem .27rem;
        border-radius: 2rem;
        background: #b82d20;
        color: #fff;
        font-size: .68rem;
        box-shadow: 0 2px 4px #432a2340;
    }
    .mobile-home-activity {
        padding: .38rem .65rem;
        border: 1px solid #fff;
        border-radius: 1rem;
        background: #f5fffb;
        box-shadow: 0 4px 10px #00624b19;
    }
    .mobile-home-activity > header { display: flex; align-items: center; justify-content: space-between; gap: .45rem; }
    .mobile-home-activity h2 { margin: 0; font-size: clamp(.85rem, 3.7vw, 1.05rem); font-weight: 800; }
    .mobile-activity-more {
        flex: none;
        min-height: 44px;
        padding: 0;
        border: 0;
        color: #87510b;
        font-size: .73rem;
        font-weight: 750;
        background: transparent;
    }
    .mobile-activity-list { margin: 0; padding: 0; list-style: none; }
    .mobile-activity-list li + li { border-top: 1px solid #dbece6; }
    .mobile-activity-list a {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr) auto auto;
        align-items: center;
        gap: .35rem;
        min-height: 44px;
        padding-block: .29rem;
        color: #103e31;
        text-decoration: none;
    }
    .mobile-activity-icon .mobile-art { border-radius: .48rem; }
    .mobile-activity-copy { display: grid; gap: .05rem; overflow-wrap: anywhere; }
    .mobile-activity-copy strong { font-size: clamp(.72rem, 3.18vw, .87rem); }
    .mobile-activity-copy > span, .mobile-activity-list time { color: #44655b; font-size: .68rem; }
}
