@font-face { font-family: 'Poppins'; src: url('../fonts/poppins/Poppins-Thin.ttf') format('truetype'); font-weight: 100; font-style: normal; font-display: swap; }
@font-face { font-family: 'Poppins'; src: url('../fonts/poppins/Poppins-ExtraLight.ttf') format('truetype'); font-weight: 200; font-style: normal; font-display: swap; }
@font-face { font-family: 'Poppins'; src: url('../fonts/poppins/Poppins-Light.ttf') format('truetype'); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: 'Poppins'; src: url('../fonts/poppins/Poppins-Regular.ttf') format('truetype'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'Poppins'; src: url('../fonts/poppins/Poppins-Medium.ttf') format('truetype'); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: 'Poppins'; src: url('../fonts/poppins/Poppins-SemiBold.ttf') format('truetype'); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: 'Poppins'; src: url('../fonts/poppins/Poppins-Bold.ttf') format('truetype'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'Poppins'; src: url('../fonts/poppins/Poppins-ExtraBold.ttf') format('truetype'); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: 'Poppins'; src: url('../fonts/poppins/Poppins-Black.ttf') format('truetype'); font-weight: 900; font-style: normal; font-display: swap; }
@font-face { font-family: 'Poppins'; src: url('../fonts/poppins/Poppins-Italic.ttf') format('truetype'); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: 'Poppins'; src: url('../fonts/poppins/Poppins-BoldItalic.ttf') format('truetype'); font-weight: 700; font-style: italic; font-display: swap; }

/* Shared by CDN Tailwind layouts and the Vite portal. */
html, body, body *, body *::before, body *::after,
input::placeholder, textarea::placeholder, input::file-selector-button {
    font-family: 'Poppins', sans-serif !important;
}
:where(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="button"]):not([type="submit"]):not([type="reset"]), select, textarea) {
    min-height: 2.625rem;
    border: 1px solid #cbd5e1;
    border-radius: .75rem;
    background-color: #f8fafc;
    padding: .625rem 1rem;
    color: #1e293b;
    font-size: .875rem;
    line-height: 1.25rem;
    transition: border-color .2s, box-shadow .2s;
}
:where(textarea) { min-height: 6rem; resize: vertical; }
input:not([type="hidden"]):not([type="button"]):not([type="submit"]):not([type="reset"]):focus,
select:focus, textarea:focus {
    border-color: #facc15 !important;
    outline: 2px solid #facc15 !important;
    outline-offset: 2px;
    box-shadow: 0 0 0 4px rgb(250 204 21 / .18) !important;
}
input[type="checkbox"], input[type="radio"], input[type="range"] { accent-color: #eab308; }
:where(input, select, textarea):disabled { cursor: not-allowed; opacity: .65; }

/* Comfortable application density at normal browser zoom. Public/auth pages keep their own scale. */
html:has(body.mobile-shell-page){font-size:14px}
body.mobile-shell-page{font-size:14px;line-height:1.5}
body.mobile-shell-page #app-main,body.mobile-shell-page .portal-main{min-width:0;max-width:100%}
body.mobile-shell-page main,body.mobile-shell-page main .grid>*,body.mobile-shell-page .mobile-shell-header>*{min-width:0}
body.mobile-shell-page main img,body.mobile-shell-page main canvas{max-width:100%}
body.mobile-shell-page main .overflow-x-auto{max-width:100%;overscroll-behavior-x:contain}
body.mobile-shell-page .mobile-shell-header{gap:12px;padding:10px 24px}
body.mobile-shell-page .mobile-shell-header input[type=search],body.mobile-shell-page .mobile-shell-header input[placeholder^="Search"]{width:clamp(140px,15vw,225px);min-height:34px}
body.mobile-shell-page #app-main>main,body.mobile-shell-page .portal-main>main{padding:24px 24px 62px}
body.mobile-shell-page #app-sidebar nav,body.mobile-shell-page .portal-sidebar nav{padding-top:16px;padding-bottom:16px}
@media(min-width:1024px){
    body.mobile-shell-page #app-sidebar .nav-link,body.mobile-shell-page #app-sidebar .nav-group-btn,body.mobile-shell-page .portal-sidebar .nav-link,body.mobile-shell-page .portal-sidebar .nav-group-btn{padding-top:9px;padding-bottom:9px}
    body.mobile-shell-page #app-main>main>.mb-8,body.mobile-shell-page .portal-main>main>.mb-8{margin-bottom:20px}
    body.mobile-shell-page #app-main>main .gap-6{gap:18px}
    body.mobile-shell-page #app-main>main .p-8{padding:24px}
}
@media(min-width:1024px) and (max-width:1366px){body.mobile-shell-page .mobile-shell-header{flex-wrap:wrap;row-gap:8px}body.mobile-shell-page .mobile-shell-header input[placeholder^="Search"]{width:160px}}
@media(max-width:1023px){
    body.mobile-shell-page .mobile-shell-header{padding:10px 16px;flex-wrap:wrap}
    body.mobile-shell-page #app-main>main,body.mobile-shell-page .portal-main>main{padding:18px 16px 62px}
    body.mobile-shell-page input,body.mobile-shell-page select,body.mobile-shell-page textarea{font-size:16px}
}

/* Keep the messaging workspace within the viewport; only its lists scroll. */
body.mobile-shell-page.messages-page{height:100dvh;min-height:0;overflow:hidden}
body.mobile-shell-page.messages-page #app-main{height:100%;min-height:0;display:flex;flex-direction:column;overflow:hidden}
body.mobile-shell-page.messages-page #app-main>main{display:flex;flex:1;flex-direction:column;min-height:0;overflow:hidden;padding:16px}
body.mobile-shell-page.messages-page .messages-workspace{min-height:0;min-width:0}
body.mobile-shell-page.messages-page #chat-body{min-height:44px;max-height:96px;resize:none}
body.mobile-shell-page.messages-page .chat-composer #chat-body{border:0;background:transparent;padding:10px 8px;box-shadow:none!important;outline:none!important}
@media(max-width:767px){
    body.mobile-shell-page.messages-page #app-main>main{padding:10px}
    body.mobile-shell-page.messages-page .messages-workspace>header{padding:12px}
}