:root {
    --input-bg: #0d181e;
    --input-focus-bg: #101d23;
    --error-text: #ffc1c1;
    --success-text: #a9efd7;
    --bg: #0b1318;
    --panel: #111d24;
    --panel-soft: #17262e;
    --panel-hover: #1d3039;
    --border: #29404a;
    --text: #edf5f2;
    --muted: #9fb2b8;
    --mint: #64d9b2;
    --mint-dark: #173e35;
    --blue: #78b7db;
    --amber: #f2bd67;
    --rose: #ef8d8d;
    --radius: 1.05rem;
    --shadow: 0 1.4rem 4rem rgba(0, 0, 0, .26);
}

html[data-bs-theme="dark"] { color-scheme: dark; }
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { min-height: 100%; }
body { min-height: 100vh; margin: 0; background: var(--bg); color: var(--text); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }

.auth-body {
    --bg: #f3f6f5;
    --panel: #ffffff;
    --panel-soft: #f0f4f2;
    --panel-hover: #e6f4f1;
    --border: #dfe6e3;
    --text: #14252f;
    --muted: #687a82;
    --mint: #126d67;
    --mint-dark: #e6f4f1;
    --input-bg: #ffffff;
    --input-focus-bg: #ffffff;
    --error-text: #9f302b;
    --success-text: #126d67;
    --primary-bg: #e8ff6a;
    --primary-hover: #d9f157;
    --primary-text: #14252f;
    --shadow: 0 16px 42px rgba(20, 37, 47, .08);
    display: grid;
    place-items: center;
    padding: 1.5rem;
    background:
        radial-gradient(circle at 14% 16%, rgba(232, 255, 106, .14), transparent 28rem),
        radial-gradient(circle at 90% 85%, rgba(18, 109, 103, .06), transparent 30rem),
        var(--bg);
}

.auth-shell { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(320px, .8fr); width: min(100%, 960px); border: 1px solid var(--border); border-radius: 1.5rem; overflow: hidden; background: var(--panel); box-shadow: var(--shadow); }
.auth-story { display: flex; flex-direction: column; justify-content: center; min-height: 590px; padding: clamp(2.2rem, 6vw, 5rem); background: linear-gradient(145deg, rgba(232, 255, 106, .14), rgba(230, 244, 241, .55) 68%, transparent); }
.brand-mark { display: inline-grid; place-items: center; width: 3.2rem; height: 3.2rem; margin-bottom: 1.6rem; border-radius: 1rem; background: var(--mint); color: #14252f; font-weight: 900; box-shadow: none; }
.brand-mark.small { width: 2.25rem; height: 2.25rem; margin: 0; border-radius: .72rem; font-size: 1.22rem; }
.login-brand { display: flex; align-items: center; gap: .85rem; margin-bottom: 1.4rem; }
.login-brand .brand-mark { flex: 0 0 3.2rem; margin: 0; background: #e8ff6a; color: #14252f; font-size: 1.5rem; font-weight: 900; }
.login-brand strong { color: var(--text); font-size: clamp(2rem, 5vw, 2.65rem); font-weight: 800; letter-spacing: -.045em; }
.eyebrow { margin: 0 0 .5rem; color: var(--mint); font-size: .72rem; font-weight: 800; letter-spacing: .13em; }
.auth-story h1 { margin: 0; font-size: clamp(3.5rem, 9vw, 6.2rem); font-weight: 760; letter-spacing: -.075em; line-height: .95; }
.auth-story h1 span, .side-brand strong span { color: var(--mint); }
.auth-lead { max-width: 29rem; margin: 1.4rem 0 2rem; color: var(--muted); font-size: clamp(1.25rem, 2.4vw, 1.65rem); line-height: 1.42; }
.trust-line { display: flex; align-items: center; gap: .7rem; max-width: 28rem; color: var(--muted); font-size: .93rem; }
.trust-line i { color: var(--mint); font-size: 1.15rem; }
.language-switcher { color: var(--muted); font-size: .78rem; }
.language-flags { display: flex; align-items: center; gap: .35rem; }
.language-flag { position: relative; display: inline-grid; place-items: center; width: 2.15rem; height: 2rem; border: 1px solid var(--border); border-radius: .62rem; padding: 0; background: var(--input-bg); font-size: 1.15rem; line-height: 1; cursor: pointer; transition: border-color .15s, background .15s, transform .15s, opacity .15s; }
.language-flag:hover { border-color: #49616b; background: var(--panel-soft); transform: translateY(-1px); }
.language-flag.active, .language-flag[aria-pressed="true"] { border-color: var(--mint); background: var(--mint-dark); }
.language-flag:disabled { cursor: wait; opacity: .55; transform: none; }
.language-flag::after { position: absolute; z-index: 30; top: calc(100% + .45rem); left: 50%; width: max-content; max-width: min(15rem, 75vw); border: 1px solid #3c5661; border-radius: .55rem; padding: .45rem .58rem; background: #091218; box-shadow: var(--shadow); color: #dce8e6; content: attr(data-tooltip); font-size: .7rem; font-weight: 650; line-height: 1.2; opacity: 0; pointer-events: none; white-space: nowrap; transform: translate(-50%, -.2rem); transition: opacity .14s, transform .14s; }
.language-flag:hover::after, .language-flag:focus-visible::after { opacity: 1; transform: translate(-50%, 0); }
.auth-language { margin: 0 0 1.3rem; }
.auth-card { align-self: center; margin: 1.5rem; padding: clamp(1.8rem, 4vw, 2.7rem); border: 1px solid var(--border); border-radius: 1.25rem; background: var(--panel); }
.auth-card-icon { display: grid; place-items: center; width: 2.7rem; height: 2.7rem; margin-bottom: 1.4rem; border-radius: .85rem; background: var(--mint-dark); color: var(--mint); }
.auth-card h2 { margin: 0; font-size: 1.55rem; }
.muted { margin: .45rem 0 1.7rem; color: var(--muted); }
.security-note { margin: 1.25rem 0 0; color: var(--muted); font-size: .78rem; text-align: center; }
.security-note i { margin-right: .3rem; color: var(--mint); }

.field-group { display: flex; flex-direction: column; gap: .55rem; margin-bottom: 1.15rem; }
.field-group label { color: var(--text); font-size: .88rem; font-weight: 700; }
.field-group input, .field-group select, .field-group textarea { width: 100%; min-height: 3rem; border: 1px solid var(--border); border-radius: .78rem; outline: none; background: var(--input-bg); color: var(--text); transition: border-color .15s, box-shadow .15s, background .15s; }
.field-group input, .field-group select { padding: .72rem .9rem; }
.field-group textarea { min-height: 7.5rem; padding: .9rem 1rem; line-height: 1.5; resize: vertical; }
.field-group input:focus, .field-group select:focus, .field-group textarea:focus { border-color: var(--mint); background: var(--input-focus-bg); box-shadow: 0 0 0 .2rem rgba(100, 217, 178, .12); }
.input-with-icon, .select-with-icon { position: relative; }
.input-with-icon > i, .select-with-icon > i { position: absolute; z-index: 1; top: 50%; left: 1rem; color: #799096; transform: translateY(-50%); pointer-events: none; }
.input-with-icon input, .select-with-icon select { padding-left: 2.75rem; }
.select-with-icon select { appearance: auto; }
::placeholder { color: #70878d; opacity: 1; }

.primary-button, .ghost-button { display: inline-flex; align-items: center; justify-content: center; gap: .65rem; min-height: 2.85rem; border-radius: .8rem; padding: .68rem 1.1rem; font-weight: 750; transition: transform .15s, background .15s, border-color .15s, opacity .15s; }
.primary-button { border: 0; background: var(--primary-bg, var(--mint)); color: var(--primary-text, #082219); box-shadow: 0 .55rem 1.5rem rgba(100, 217, 178, .15); }
.primary-button:hover { background: var(--primary-hover, #7ce4c2); transform: translateY(-1px); }
.primary-button:disabled { cursor: wait; opacity: .62; transform: none; }
.ghost-button { border: 1px solid var(--border); background: transparent; color: var(--muted); }
.ghost-button:hover { border-color: #49616b; background: var(--panel-soft); color: var(--text); }
.danger-action { display: flex; align-items: center; gap: .35rem; }
.danger-button { display: inline-flex; align-items: center; gap: .5rem; min-height: 2.6rem; border: 1px solid rgba(239, 141, 141, .42); border-radius: .75rem; padding: .58rem .8rem; background: rgba(239, 141, 141, .08); color: #ffb2b2; font-size: .78rem; font-weight: 750; }
.danger-button:hover { border-color: var(--rose); background: rgba(239, 141, 141, .14); }
.danger-button:disabled { opacity: .6; }
.form-message { margin: 0 0 1rem; border: 1px solid rgba(239, 141, 141, .35); border-radius: .75rem; padding: .75rem .85rem; background: rgba(239, 141, 141, .09); color: var(--error-text); font-size: .9rem; }
.form-message.success { border-color: rgba(100, 217, 178, .35); background: rgba(100, 217, 178, .09); color: var(--success-text); }

.app-body {
    --bg: #f3f6f5;
    --panel: #ffffff;
    --panel-soft: #f0f4f2;
    --panel-hover: #e6f4f1;
    --border: #dfe6e3;
    --text: #14252f;
    --muted: #687a82;
    --mint: #126d67;
    --mint-dark: #e6f4f1;
    --blue: #126d67;
    --amber: #9a5b00;
    --rose: #9f302b;
    --shadow: 0 16px 42px rgba(20, 37, 47, .08);
    --input-bg: #ffffff;
    --input-focus-bg: #ffffff;
    --error-text: #9f302b;
    --success-text: #126d67;
    --primary-bg: #e8ff6a;
    --primary-hover: #d9f157;
    --primary-text: #14252f;
    background: var(--bg);
}
.app-layout { min-height: 100vh; }
.side-panel { --border: #384c55; --text: #f7fbfa; --muted: #c8d5d3; --mint: #e8ff6a; --mint-dark: #21353d; --panel-soft: #20333d; --panel-hover: #253e48; --input-bg: #20333d; position: fixed; inset: 0 auto 0 0; z-index: 5; display: flex; flex-direction: column; width: 255px; padding: 1.5rem 1rem; border-right: 1px solid var(--border); background: #14252f; }
.side-brand { display: flex; align-items: center; gap: .8rem; padding: 0 .45rem .85rem; }
.side-brand strong { font-size: 1.32rem; letter-spacing: -.04em; }
.side-nav { display: flex; flex-direction: column; gap: .35rem; }
.nav-item { display: flex; align-items: center; gap: .8rem; width: 100%; min-height: 2.85rem; border: 0; border-radius: .75rem; padding: .72rem .85rem; background: transparent; color: var(--muted); text-align: left; }
.nav-item > i { width: 1.2rem; text-align: center; }
.nav-item:hover { background: var(--panel-soft); color: var(--text); }
.nav-item.active { background: #e8ff6a; color: #14252f; font-weight: 800; }
.count-pill { min-width: 1.3rem; margin-left: auto; border-radius: 999px; padding: .08rem .35rem; background: var(--amber); color: #322007; font-size: .7rem; font-weight: 800; text-align: center; }
.side-language { margin: 0 .45rem 1.05rem; padding: 0 0 1rem; border-bottom: 1px solid var(--border); }
.side-admin { margin-top: auto; padding: 1rem .55rem 0; border-top: 1px solid var(--border); }
.side-section-label { display: block; color: #70878f; font-size: .65rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.side-admin-action { display: flex; align-items: center; gap: .35rem; margin-top: .55rem; }
.side-danger-button { flex: 1; min-width: 0; justify-content: flex-start; }
.side-admin + .side-user { margin-top: .75rem; }
.side-impersonation { margin-top: auto; border-top: 1px solid var(--border); padding: .75rem .35rem 0; }
.side-admin + .side-impersonation { margin-top: .75rem; }
.side-impersonation + .side-user { margin-top: .75rem; }
.side-return-button { width: 100%; min-height: 2.65rem; padding: .65rem .7rem; background: #233a43; color: #f7fbfa; font-size: .76rem; font-weight: 750; }
.side-return-button:hover { background: #2b4953; color: #fff; }
.side-return-button > i { color: #e8ff6a; }
.side-user { display: grid; grid-template-columns: 2.35rem 1fr; gap: .75rem; align-items: center; margin-top: auto; padding: 1rem .55rem 0; border-top: 1px solid var(--border); }
.side-user .avatar { display: grid; place-items: center; width: 2.35rem; height: 2.35rem; border-radius: .8rem; background: #283b45; color: var(--mint); font-weight: 800; }
.side-user strong, .side-user small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.side-user strong { font-size: .86rem; }
.side-user small { margin-top: .12rem; color: var(--muted); font-size: .72rem; }
.main-panel { width: calc(100% - 255px); min-height: 100vh; margin-left: 255px; padding: 2rem clamp(1.25rem, 4vw, 3.5rem) 5rem; }
.platform-body .side-panel { width: 300px; }
.platform-body .main-panel { width: calc(100% - 300px); margin-left: 300px; }
.top-bar { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 2rem; border: 1px solid var(--border); border-radius: 1rem; padding: 1rem 1.2rem; background: var(--panel); }
.top-bar h1 { margin: 0; font-size: clamp(1.65rem, 3vw, 2.25rem); letter-spacing: -.035em; }
.top-heading { min-width: 0; }
.top-heading.is-ask h1 { font-size: clamp(1.45rem, 2.2vw, 2.05rem); font-weight: 850; letter-spacing: -.055em; line-height: 1.16; }
.view-subtitle { max-width: 46rem; margin: .45rem 0 0; color: var(--muted); font-size: .85rem; line-height: 1.45; }
.top-actions { display: flex; align-items: center; gap: .55rem; }
.mobile-language { display: none; }
.global-message { position: sticky; top: 1rem; z-index: 4; box-shadow: var(--shadow); }
.app-view { display: none; max-width: 1280px; }
.app-view.active { display: block; animation: reveal .18s ease-out; }
@keyframes reveal { from { opacity: .25; transform: translateY(4px); } }
.welcome-strip { display: flex; gap: .9rem; align-items: center; margin-bottom: 1rem; border: 1px solid rgba(100, 217, 178, .2); border-radius: var(--radius); padding: 1rem 1.15rem; background: rgba(100, 217, 178, .055); }
.welcome-icon { display: grid; flex: 0 0 2.65rem; place-items: center; width: 2.65rem; height: 2.65rem; border-radius: .85rem; background: var(--mint-dark); color: var(--mint); }
.welcome-strip strong { display: block; margin-bottom: .15rem; }
.welcome-strip p { margin: 0; color: var(--muted); font-size: .9rem; }
.content-card { border: 1px solid var(--border); border-radius: var(--radius); background: var(--panel); box-shadow: 0 .8rem 2.5rem rgba(0, 0, 0, .12); }
.ask-card { padding: clamp(1.15rem, 3vw, 1.7rem); }
.field-footer { display: flex; justify-content: space-between; gap: 1rem; margin-top: -.15rem; color: #799096; font-size: .73rem; }
.suggestions { display: flex; flex-wrap: wrap; gap: .55rem; margin: -.2rem 0 1.3rem; }
.suggestions button { border: 1px solid var(--border); border-radius: 999px; padding: .45rem .72rem; background: transparent; color: var(--muted); font-size: .78rem; }
.suggestions button:hover { border-color: #49616b; background: var(--panel-hover); color: var(--text); }
.suggestions i { margin-right: .22rem; color: var(--mint); }
.ask-button { min-width: 10.5rem; }

.answer-card { margin-top: 1rem; overflow: hidden; }
.answer-status { display: flex; gap: 1rem; align-items: flex-start; padding: 1.5rem; border-bottom: 1px solid var(--border); background: linear-gradient(90deg, rgba(100, 217, 178, .08), transparent); }
.result-icon { display: grid; flex: 0 0 3rem; place-items: center; width: 3rem; height: 3rem; border-radius: .9rem; background: var(--mint-dark); color: var(--mint); font-size: 1.2rem; }
.answer-card.recommend .result-icon { background: rgba(242, 189, 103, .14); color: var(--amber); }
.answer-card.escalate .result-icon { background: rgba(239, 141, 141, .13); color: var(--rose); }
.answer-card h2 { margin: .1rem 0 0; font-size: clamp(1.15rem, 2.4vw, 1.5rem); line-height: 1.42; }
.answer-block { padding: 1.2rem 1.5rem; border-top: 1px solid var(--border); }
.answer-block:first-of-type { border-top: 0; }
.answer-block h3 { margin: 0 0 .55rem; color: var(--text); font-size: .82rem; font-weight: 750; }
.answer-block h3 > i { margin-right: .35rem; color: var(--amber); }
.answer-block p { margin: 0; color: var(--muted); line-height: 1.55; }
.answer-block ul { display: grid; gap: .35rem; margin: 0; padding-left: 1.15rem; color: var(--muted); font-size: .86rem; }
.answer-escalation-note { display: grid; grid-template-columns: auto 1fr auto; gap: .85rem; align-items: center; margin: 0 1.5rem 1.5rem; border: 1px solid rgba(242, 189, 103, .28); border-radius: .85rem; padding: 1rem; background: rgba(242, 189, 103, .075); }
.answer-escalation-note > i { color: var(--amber); font-size: 1.3rem; }
.answer-escalation-note strong { display: block; color: var(--amber); }
.answer-escalation-note p { margin: .2rem 0 0; color: var(--muted); font-size: .84rem; }
.answer-escalation-note .card-action { margin: 0; white-space: nowrap; }

.section-heading { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 1.2rem; }
.section-heading h2 { margin: 0; font-size: clamp(1.45rem, 3vw, 1.9rem); }
.soft-badge { display: inline-flex; align-items: center; gap: .45rem; border-radius: 999px; padding: .45rem .7rem; background: var(--mint-dark); color: var(--mint); font-size: .74rem; font-weight: 700; }
.create-panel { margin-bottom: 1rem; overflow: hidden; }
.create-panel summary { display: flex; justify-content: space-between; align-items: center; cursor: pointer; padding: 1rem 1.2rem; color: var(--text); font-weight: 750; list-style: none; }
.create-panel summary::-webkit-details-marker { display: none; }
.create-panel summary span i { margin-right: .45rem; color: var(--mint); }
.create-panel[open] summary > i { transform: rotate(180deg); }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; padding: 1.2rem; border-top: 1px solid var(--border); }
.form-grid .full { grid-column: 1 / -1; }
.optional { color: var(--muted); font-size: .72rem; font-weight: 500; }
.form-actions { display: flex; justify-content: flex-end; }
.group-manager { padding: 1.2rem; border-top: 1px solid var(--border); }
.group-create-form { display: grid; grid-template-columns: 1.2fr 1fr auto; gap: .75rem; align-items: end; }
.group-create-form .field-group { margin: 0; }
.group-admin-list { display: grid; gap: .6rem; margin-top: 1rem; }
.group-admin-list .empty-state { min-height: 6rem; }
.group-tree { overflow: hidden; border: 1px solid var(--border); border-radius: .75rem; background: var(--panel-soft); }
.group-tree.archived { opacity: .62; }
.group-row { display: flex; align-items: center; gap: .45rem; min-height: 2.7rem; padding: .55rem .7rem; }
.group-row + .group-row { border-top: 1px solid var(--border); }
.group-row.child { padding-left: 1.7rem; background: rgba(255, 255, 255, .012); }
.group-name { display: flex; flex: 1; align-items: center; gap: .5rem; min-width: 0; }
.group-name > i { width: 1rem; color: var(--mint); text-align: center; }
.group-name small { margin-left: auto; color: var(--muted); font-size: .68rem; }
.group-name em { border-radius: 999px; padding: .15rem .4rem; background: var(--panel-soft); color: var(--muted); font-size: .62rem; font-style: normal; }
.icon-action { display: inline-grid; flex: 0 0 2rem; place-items: center; width: 2rem; height: 2rem; border: 1px solid var(--border); border-radius: .55rem; background: transparent; color: var(--muted); }
.icon-action:hover { border-color: var(--mint); color: var(--mint); }
.danger-icon-action:hover { border-color: var(--rose); color: var(--rose); }
.knowledge-filters { display: grid; grid-template-columns: minmax(12rem, 1.5fr) repeat(6, minmax(8rem, 1fr)) auto; gap: .55rem; margin-bottom: 1rem; padding: .8rem; }
.knowledge-filters input, .knowledge-filters select, .guidance-filters input, .guidance-filters select, .operations-filters input, .operations-filters select, .card-select { min-width: 0; min-height: 2.6rem; border: 1px solid var(--border); border-radius: .68rem; padding: .55rem .65rem; background: var(--input-bg); color: var(--text); }
.filter-search { position: relative; }
.filter-search i { position: absolute; top: 50%; left: .8rem; color: var(--muted); transform: translateY(-50%); }
.filter-search input { width: 100%; padding-left: 2.3rem; }
.operations-filters { display: grid; grid-template-columns: minmax(15rem, 1fr) minmax(10rem, auto) auto; gap: .55rem; align-items: center; margin: 1rem 0; padding: .8rem; }
.guidance-filters { display: grid; grid-template-columns: minmax(15rem, 1fr) minmax(11rem, auto) auto; gap: .55rem; margin-bottom: 1rem; padding: .8rem; }
.filter-count { color: var(--muted); font-size: .76rem; font-weight: 700; white-space: nowrap; }
.directory-more { justify-self: center; margin: .2rem auto; }
.card-actions { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin-top: .9rem; }
.card-actions .card-action { margin: 0; }
.move-control { display: flex; gap: .4rem; align-items: center; margin-right: auto; }
.card-select { max-width: 15rem; font-size: .78rem; }
.pagination-bar { display: flex; justify-content: center; align-items: center; gap: 1rem; margin-top: 1rem; color: var(--muted); font-size: .8rem; }
.card-list { display: grid; gap: .75rem; }
.history-group { display: grid; gap: .75rem; }
.history-group + .history-group { margin-top: .9rem; }
.history-group-title { margin: 0; padding: 0 .15rem; color: #8fa4aa; font-size: .74rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.list-card { border: 1px solid var(--border); border-radius: .95rem; padding: 1rem 1.15rem; background: var(--panel); }
.review-due-card { border-color: rgba(242, 189, 103, .34); }
.knowledge-inactive { opacity: .72; }
.pending-card { border-color: rgba(242, 189, 103, .28); }
.resolved-card { border-color: rgba(120, 183, 219, .24); }
.unread-resolution { box-shadow: 0 0 0 2px rgba(120, 183, 219, .12); }
.list-card-head { display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start; }
.status-badges { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .35rem; }
.list-card h3 { margin: 0; font-size: 1rem; line-height: 1.4; }
.list-card p { margin: .65rem 0 0; color: var(--muted); line-height: 1.5; white-space: pre-line; }
.meta-row { display: flex; flex-wrap: wrap; gap: .45rem .85rem; margin-top: .75rem; color: #82989e; font-size: .72rem; }
.meta-row span { display: inline-flex; align-items: center; gap: .3rem; }
.status-badge { flex: 0 0 auto; border-radius: 999px; padding: .3rem .52rem; font-size: .68rem; font-weight: 800; letter-spacing: .04em; }
.status-badge.approved, .status-badge.action { background: var(--mint-dark); color: var(--mint); }
.status-badge.resolved { background: rgba(120, 183, 219, .14); color: var(--blue); }
.status-badge.proposed, .status-badge.recommend { background: rgba(242, 189, 103, .13); color: var(--amber); }
.status-badge.review-due { background: rgba(242, 189, 103, .18); color: var(--amber); }
.status-badge.escalate { background: rgba(239, 141, 141, .12); color: var(--rose); }
.supervisor-answer { margin-top: 1rem; border: 1px solid rgba(120, 183, 219, .28); border-radius: .8rem; padding: .9rem 1rem; background: rgba(120, 183, 219, .075); }
.supervisor-answer-head { display: flex; align-items: center; gap: .5rem; color: var(--blue); font-size: .82rem; }
.supervisor-answer-head i { color: var(--blue); }
.supervisor-answer p { margin: .55rem 0 .5rem; color: var(--text); }
.supervisor-answer small { color: var(--muted); font-size: .72rem; }
.pending-answer { display: flex; align-items: center; gap: .55rem; margin-top: .85rem; border-radius: .72rem; padding: .7rem .8rem; background: rgba(242, 189, 103, .08); color: var(--amber); font-size: .8rem; }
.pending-answer i { animation: pulse 1.8s ease-in-out infinite; }
.knowledge-review-notice { display: flex; gap: .65rem; align-items: center; margin: 0 0 1rem; border: 1px solid rgba(242, 189, 103, .28); border-radius: .8rem; padding: .75rem .9rem; background: rgba(242, 189, 103, .08); color: var(--amber); font-size: .82rem; line-height: 1.4; }
.knowledge-review-notice[hidden] { display: none; }
@keyframes pulse { 50% { opacity: .45; } }
.resolution-alert { position: sticky; top: 1rem; z-index: 4; display: grid; grid-template-columns: auto 1fr auto; gap: .8rem; align-items: center; margin-bottom: 1rem; border: 1px solid rgba(120, 183, 219, .4); border-radius: .9rem; padding: .9rem 1rem; background: var(--panel); box-shadow: var(--shadow); }
.resolution-alert > i { color: var(--blue); font-size: 1.25rem; }
.resolution-alert strong { color: var(--blue); }
.resolution-alert p { margin: .18rem 0 0; color: var(--muted); font-size: .8rem; }
.resolution-alert-actions { display: flex; align-items: center; gap: .45rem; }
.resolution-alert-actions .card-action { margin: 0; }
.resolution-alert-actions .ghost-button { min-height: 2.35rem; padding: .45rem .7rem; font-size: .76rem; }
.card-action { margin-top: .9rem; border: 1px solid var(--mint); border-radius: .65rem; padding: .48rem .75rem; background: transparent; color: var(--mint); font-size: .78rem; font-weight: 750; }
.card-action:hover { background: var(--mint-dark); }
.danger-card-action { margin-left: .5rem; border-color: rgba(239, 141, 141, .55); color: var(--rose); }
.danger-card-action:hover { border-color: var(--rose); background: rgba(239, 141, 141, .12); }
.resolution-form { display: flex; gap: .55rem; margin-top: .9rem; }
.resolution-form input { flex: 1; min-width: 0; border: 1px solid var(--border); border-radius: .7rem; padding: .6rem .75rem; background: var(--input-bg); color: var(--text); }
.empty-state { display: grid; place-items: center; min-height: 11rem; border: 1px dashed var(--border); border-radius: var(--radius); padding: 2rem; color: var(--muted); text-align: center; }
.empty-state i { margin-bottom: .65rem; color: var(--mint); font-size: 1.35rem; }
.empty-state p { margin: 0; }
.platform-list-section { margin-top: 1.25rem; }
.platform-heading-actions { display: flex; align-items: center; gap: .65rem; }
.section-heading-actions { display: flex; align-items: center; gap: .65rem; }
.company-modal { width: min(42rem, calc(100vw - 2rem)); max-width: none; max-height: calc(100vh - 2rem); border: 1px solid var(--border); border-radius: 1.1rem; padding: 0; overflow: hidden; background: var(--panel); color: var(--text); box-shadow: 0 1.5rem 5rem rgba(0, 0, 0, .55); }
.company-modal::backdrop { background: rgba(2, 8, 12, .76); backdrop-filter: blur(4px); }
.company-modal-shell { max-height: calc(100vh - 2rem); overflow-y: auto; }
.company-modal-header { position: sticky; z-index: 2; top: 0; display: flex; justify-content: space-between; align-items: center; gap: 1rem; border-bottom: 1px solid var(--border); padding: 1.05rem 1.2rem; background: var(--panel); }
.company-modal-header h2 { margin: 0; font-size: 1.15rem; }
.company-modal-header .eyebrow { margin: 0 0 .2rem; }
.modal-close-button { display: grid; flex: 0 0 2.5rem; width: 2.5rem; height: 2.5rem; place-items: center; border: 1px solid var(--border); border-radius: .75rem; background: transparent; color: var(--muted); }
.modal-close-button:hover { border-color: var(--mint); color: var(--text); }
.company-modal-form { border-top: 0; }
.company-modal-actions { display: flex; justify-content: flex-end; gap: .65rem; padding-top: .25rem; }
body.modal-open { overflow: hidden; }
.user-modal { width: min(48rem, calc(100vw - 2rem)); }
.user-modal-management { display: flex; flex-wrap: wrap; gap: .55rem; border-top: 1px solid var(--border); padding-top: 1rem; }
.user-modal-management[hidden], .user-modal-management button[hidden] { display: none; }
.user-modal-management .card-action { margin: 0; }
.user-modal-management .danger-card-action { margin-left: auto; }
.user-modal .site-option, .user-modal .permission-option { justify-content: flex-start; text-align: left; }
.user-modal .site-option input, .user-modal .permission-option input { flex: 0 0 1rem; width: 1rem; min-width: 1rem; height: 1rem; min-height: 0; margin: .1rem 0 0; padding: 0; }
.user-modal .site-option span, .user-modal .permission-option span { min-width: 0; text-align: left; }
.company-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 24rem), 1fr)); gap: .9rem; }
.company-card { display: grid; gap: .9rem; padding: 1.1rem; }
.company-card.company-inactive { opacity: .7; }
.company-card-head, .company-card-footer { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.company-card h3 { margin: .16rem 0 0; font-size: 1.08rem; }
.company-code { color: var(--mint); font-size: .66rem; font-weight: 800; letter-spacing: .08em; }
.company-owner-panel { display: grid; grid-template-columns: 1fr; gap: .7rem; border: 1px solid rgba(94, 211, 177, .16); border-radius: .9rem; padding: .85rem; background: rgba(94, 211, 177, .045); }
.company-owner-label { display: flex; align-items: center; gap: .45rem; color: var(--muted); font-size: .72rem; font-weight: 800; letter-spacing: .04em; }
.company-owner-label i { color: #e8c36b; }
.company-owner-select { display: block; width: 100%; min-width: 0; min-height: 2.8rem; border: 1px solid var(--border); border-radius: .72rem; padding: .55rem .7rem; background: var(--input-bg); color: var(--text); font-size: .8rem; }
.company-owner-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem; border-top: 1px solid var(--border); padding-top: .7rem; }
.company-owner-actions[hidden] { display: none; }
.company-owner-actions button { justify-content: center; width: 100%; min-width: 0; min-height: 2.75rem; padding: .55rem .6rem; font-size: .74rem; line-height: 1.2; text-align: center; white-space: normal; }
.company-metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: .45rem; }
.company-metric { display: grid; place-items: center; min-width: 0; border: 1px solid var(--border); border-radius: .7rem; padding: .6rem .3rem; text-align: center; }
.company-metric i { color: var(--blue); font-size: .78rem; }
.company-metric strong { margin-top: .2rem; font-size: 1rem; }
.company-metric small { overflow: hidden; width: 100%; color: var(--muted); font-size: .62rem; text-overflow: ellipsis; white-space: nowrap; }
.company-card-footer small { color: var(--muted); }
.company-card-footer .danger-card-action { margin: 0; }
.company-card-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .5rem; }
.company-delete-button { min-height: 2.5rem; }
.user-card.user-inactive { opacity: .65; }
.user-identity { display: flex; align-items: center; gap: .7rem; min-width: 0; }
.user-identity .avatar { flex: 0 0 2.25rem; width: 2.25rem; height: 2.25rem; }
.user-identity small { display: block; overflow: hidden; margin-top: .15rem; color: var(--muted); font-size: .74rem; text-overflow: ellipsis; }
.user-actions .card-select { margin-right: auto; }
.user-delete-button { margin-left: .15rem; }
.form-hint { color: var(--muted); font-size: .73rem; line-height: 1.4; }
.form-hint i { margin-right: .3rem; color: var(--blue); }
.operations-create-grid, .operations-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem; }
.operations-columns { margin-top: 1.1rem; }
.compact-create-form { display: grid; gap: .9rem; padding: 1.2rem; border-top: 1px solid var(--border); }
.compact-create-form .field-group { margin: 0; }
.compact-create-form .primary-button { justify-self: end; }
.subsection-title { display: flex; align-items: center; gap: .5rem; margin: 0 0 .65rem; color: var(--muted); font-size: .82rem; }
.subsection-title i { color: var(--mint); }
.compact-card { min-height: 4.5rem; }
.muted-line { display: block; margin-top: .25rem; color: var(--muted); font-size: .72rem; }
.managed-site-editor { display: grid; grid-template-columns: 1fr 1fr 1.4fr; gap: .5rem; margin-top: .8rem; }
.managed-site-editor input, .managed-site-editor select { min-width: 0; min-height: 2.6rem; border: 1px solid var(--border); border-radius: .68rem; padding: .55rem .65rem; background: var(--input-bg); color: var(--text); }
.knowledge-editor { display: grid; gap: .8rem; margin-top: 1rem; border-top: 1px solid var(--border); padding-top: 1rem; }
.knowledge-editor .form-actions { gap: .65rem; align-items: stretch; }
.knowledge-editor .form-actions > button { flex: 0 1 13rem; min-height: 2.85rem; margin: 0; padding: .68rem 1.1rem; font-size: .82rem; line-height: 1.2; justify-content: center; }
.user-editor { display: grid; gap: .8rem; margin-top: 1rem; border-top: 1px solid var(--border); padding-top: 1rem; }
.editor-heading { display: flex; align-items: center; gap: .5rem; color: var(--mint); }
.editor-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; }
.editor-field { display: grid; gap: .35rem; color: var(--muted); font-size: .73rem; font-weight: 700; }
.editor-field.full { grid-column: 1 / -1; }
.editor-field input, .editor-field textarea, .editor-field select { width: 100%; min-width: 0; border: 1px solid var(--border); border-radius: .68rem; padding: .6rem .7rem; background: var(--input-bg); color: var(--text); font-size: .82rem; font-weight: 500; }

.info-tip { position: relative; display: inline-grid; place-items: center; width: 1.2rem; height: 1.2rem; margin: 0; border: 0; padding: 0; background: transparent; color: #789098; vertical-align: -.08rem; }
.info-tip:hover, .info-tip:focus-visible { color: var(--mint); outline: none; }
.info-tip::after { position: absolute; z-index: 20; bottom: calc(100% + .55rem); left: 50%; width: min(17rem, 70vw); border: 1px solid #3c5661; border-radius: .65rem; padding: .6rem .7rem; background: #091218; box-shadow: var(--shadow); color: #dce8e6; content: attr(data-tooltip); font-size: .72rem; font-weight: 500; line-height: 1.4; opacity: 0; pointer-events: none; text-align: left; transform: translate(-50%, .25rem); transition: opacity .14s, transform .14s; }
.info-tip:hover::after, .info-tip:focus-visible::after { opacity: 1; transform: translate(-50%, 0); }
.status-card { width: min(100%, 430px); border: 1px solid var(--border); border-radius: 1.2rem; padding: 2rem; background: var(--panel); box-shadow: var(--shadow); text-align: center; }
.status-card .status-icon { color: var(--mint); font-size: 2rem; }
.status-card h1 { margin: 1rem 0 .6rem; font-size: 1.5rem; }
.status-card p { margin: 0; color: var(--muted); }
.mobile-nav { display: none; }

.section-intro { margin: -.35rem 0 1rem; color: var(--muted); }
.settings-block { margin-top: 1.25rem; }
.dashboard-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .85rem; }
.metric-card { display: grid; gap: .4rem; min-height: 8rem; border: 1px solid var(--border); border-radius: 1rem; padding: 1.15rem; background: var(--panel); box-shadow: var(--shadow); }
.metric-card > i { color: var(--mint); font-size: 1.15rem; }
.metric-card strong { font-size: 2rem; line-height: 1; }
.metric-card span { color: var(--muted); font-size: .8rem; }
.context-chip { align-self: flex-start; border: 1px solid rgba(100, 217, 178, .3); border-radius: 999px; padding: .35rem .65rem; background: var(--mint-dark); color: var(--mint); font-size: .75rem; font-weight: 700; }
.site-clarification { display: grid; gap: .65rem; border: 1px solid var(--border); border-radius: .8rem; padding: .8rem; background: rgba(89, 151, 183, .08); }
.clarification-actions { display: flex; flex-wrap: wrap; gap: .45rem; }
.user-badges { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .35rem; }
.status-badge.neutral { background: rgba(126, 155, 166, .12); color: var(--muted); }
.site-access-editor { display: grid; gap: .75rem; margin-top: .85rem; border-top: 1px solid var(--border); padding-top: .85rem; }
.site-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .4rem; }
.site-option { display: flex; align-items: center; gap: .55rem; border: 1px solid var(--border); border-radius: .65rem; padding: .55rem .65rem; color: var(--muted); font-size: .76rem; }
.site-option input { accent-color: var(--mint); }
.permission-option { display: flex; align-items: flex-start; gap: .65rem; border: 1px solid var(--border); border-radius: .75rem; padding: .75rem; background: rgba(100, 217, 178, .04); color: var(--text); }
.permission-option input { flex: 0 0 auto; margin-top: .2rem; accent-color: var(--mint); }
.permission-option span { display: grid; gap: .2rem; }
.permission-option small { color: var(--muted); font-size: .72rem; font-weight: 500; }
.client-card { gap: .85rem; }
.client-card-actions { display: flex; gap: .4rem; }
.client-card.recently-created { border-color: var(--mint); animation: client-created-highlight 1.1s ease-in-out 2; }
@keyframes client-created-highlight { 50% { box-shadow: 0 0 0 .22rem rgba(100, 217, 178, .18), var(--shadow); } }
.client-editor { margin-top: .75rem; border-top: 1px solid var(--border); padding-top: .75rem; }
.client-sites { display: grid; grid-template-columns: repeat(auto-fill, minmax(11.5rem, 1fr)); gap: .4rem; }
.site-tile { display: grid; gap: .22rem; min-width: 0; border: 1px solid var(--border); border-radius: .7rem; padding: .55rem .65rem; background: var(--input-bg); color: var(--text); text-align: left; }
.site-tile:hover { border-color: var(--mint); }
.site-tile span { display: flex; align-items: center; gap: .45rem; font-weight: 750; }
.site-tile span i, .site-tile em { color: var(--mint); }
.site-tile small { overflow: hidden; min-height: 1em; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; }
.site-tile em { font-size: .68rem; font-style: normal; }
.site-tile.inactive { opacity: .55; }
.settings-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr)); gap: 1rem; }
.settings-card { align-content: start; overflow: hidden; }
.settings-card > h3 { display: flex; align-items: center; gap: .55rem; margin: 0; border-bottom: 1px solid var(--border); padding: 1.05rem 1.2rem; background: rgba(255,255,255,.018); font-size: 1rem; }
.settings-card > h3 i { color: var(--mint); }
.settings-card > .form-grid, .settings-card > .group-manager { border-top: 0; }
.guided-site-launch { display:flex; align-items:center; gap:1rem; width:100%; min-height:7rem; border-color:rgba(100,217,178,.32); padding:1.15rem 1.25rem; color:var(--text); text-align:left; }
.guided-site-launch > i:first-child { display:grid; flex:0 0 2.8rem; width:2.8rem; height:2.8rem; place-items:center; border-radius:.85rem; background:var(--mint-dark); color:var(--mint); }
.guided-site-launch span { display:grid; flex:1; gap:.25rem; }
.guided-site-launch small { color:var(--muted); line-height:1.45; }
.guided-site-launch > i:last-child { color:var(--mint); }
.guided-site-modal { width:min(54rem,calc(100vw - 2rem)); }
.guided-site-form { padding:1.2rem; }
.guided-intro { margin:0 0 1rem; border-radius:.8rem; padding:.8rem 1rem; background:var(--mint-dark); color:var(--mint); }
.guided-section { margin:0 0 1rem; border:1px solid var(--border); border-radius:1rem; padding:0; overflow:hidden; }
.guided-section legend { float:none; width:100%; margin:0; border-bottom:1px solid var(--border); padding:.85rem 1rem; background:rgba(255,255,255,.018); color:var(--text); font-size:.9rem; font-weight:800; }
.guided-section .form-grid { border:0; }
.guided-section:disabled { opacity:.45; }
.guided-fields { display:grid; gap:.8rem; padding:1rem; }
.guided-fields label { display:grid; gap:.35rem; }
.guided-fields small { color:var(--muted); }
.field-label { display:block; margin-bottom:.45rem; color:var(--text); font-size:.88rem; font-weight:700; }
.people-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.45rem; margin-top:.55rem; }
.people-option { justify-content:flex-start; }
.people-option input { flex:0 0 1rem; width:1rem; height:1rem; min-height:0; margin:0; padding:0; }
.people-option span { display:grid; gap:.12rem; min-width:0; }
.people-option strong { overflow:hidden; color:var(--text); font-size:.8rem; text-overflow:ellipsis; white-space:nowrap; }
.people-option small { color:var(--muted); font-size:.68rem; }
.guided-fields textarea { width:100%; border:1px solid var(--border); border-radius:.75rem; padding:.7rem .8rem; background:#0d181e; color:var(--text); resize:vertical; }
.guided-auto-note { display:flex; gap:.65rem; align-items:flex-start; border-radius:.75rem; padding:.8rem; background:rgba(120,183,219,.09); color:var(--blue); }
.guided-actions { position:sticky; bottom:0; display:flex; justify-content:flex-end; gap:.6rem; border-top:1px solid var(--border); margin:0 -1.2rem -1.2rem; padding:1rem 1.2rem; background:var(--panel); }
.site-workspace { display: grid; gap: 1rem; }
.site-workspace-heading { display: flex; align-items: center; gap: 1rem; }
.site-workspace-heading h2 { margin: 0; }
.workspace-tabs { display: flex; gap: .35rem; overflow-x: auto; border-bottom: 1px solid var(--border); padding: 0 .25rem; }
.workspace-tab { flex: 0 0 auto; min-height: 2.8rem; border: 0; border-bottom: 2px solid transparent; padding: .75rem 1.05rem; background: transparent; color: var(--muted); font-weight: 750; white-space: nowrap; }
.workspace-tab.active { border-color: var(--mint); color: var(--mint); }
.workspace-panel { display: none; gap: 1rem; }
.workspace-panel.active { display: grid; padding: .15rem .1rem .35rem; }
.site-details-form, .site-knowledge-form { gap: .75rem; }
.site-knowledge-form { display: grid; padding: 1rem; }
.site-knowledge-form > .primary-button { justify-self: end; }
.site-access-form { display:grid; gap:1rem; padding:1rem; }
.site-access-form > h3 { margin:0; }
.access-section-title { display:grid; gap:.25rem; }
.access-section-title small { color:var(--muted); }
.site-access-form > .primary-button { justify-self:end; }
.workspace-summary-card { padding: 1rem; }
.site-details-form input, .site-details-form select, .site-details-form textarea, .client-editor input, .client-editor textarea { min-width: 0; border: 1px solid var(--border); border-radius: .68rem; padding: .65rem .75rem; background: var(--input-bg); color: var(--text); }

button:focus-visible, summary:focus-visible { outline: 2px solid var(--mint); outline-offset: 2px; }

@media (max-width: 760px) {
    .auth-body { padding: 0; place-items: stretch; }
    .auth-shell { grid-template-columns: 1fr; width: 100%; min-height: 100vh; border: 0; border-radius: 0; }
    .auth-story { min-height: auto; padding: 2.2rem 1.4rem 1.2rem; }
    .auth-story .brand-mark { width: 2.65rem; height: 2.65rem; margin-bottom: 1.1rem; }
    .auth-story h1 { font-size: 3.4rem; }
    .auth-lead { margin: .85rem 0 1rem; font-size: 1.15rem; }
    .trust-line { font-size: .8rem; }
    .auth-card { align-self: start; margin: 1rem; padding: 1.45rem; }
    .side-panel { display: none; }
    .main-panel { width: 100%; margin: 0; padding: 1.15rem 1rem 6.5rem; }
    .top-bar { margin-bottom: 1.2rem; }
    .top-heading.is-ask h1 { font-size: clamp(1.35rem, 5vw, 1.7rem); }
    .top-bar .ghost-button span { display: none; }
    .top-bar .ghost-button { min-width: 2.75rem; padding: .6rem; }
    .mobile-language { display: flex; gap: .22rem; }
    .mobile-language .language-flag { width: 1.85rem; height: 1.85rem; border-radius: .52rem; font-size: 1rem; }
    .welcome-strip { align-items: flex-start; }
    .field-footer span:first-child { display: none; }
    .field-footer { justify-content: flex-end; }
    .suggestions { flex-wrap: nowrap; overflow-x: auto; padding-bottom: .25rem; scrollbar-width: none; }
    .suggestions button { flex: 0 0 auto; }
    .ask-button { width: 100%; }
    .section-heading { align-items: flex-start; }
    .section-heading-actions { align-items: flex-end; flex-direction: column; }
    .section-heading-actions .primary-button { min-height: 2.55rem; padding: .55rem .7rem; font-size: .76rem; }
    .soft-badge { display: none; }
    .form-grid { grid-template-columns: 1fr; }
    .form-grid .full { grid-column: 1; }
    .resolution-form { flex-direction: column; }
    .group-create-form, .knowledge-filters, .guidance-filters, .operations-filters, .settings-grid { grid-template-columns: 1fr; }
    .group-create-form .primary-button { width: 100%; }
    .move-control { width: 100%; }
    .move-control .card-select { flex: 1; max-width: none; }
    .answer-escalation-note, .resolution-alert { grid-template-columns: auto 1fr; }
    .answer-escalation-note .card-action, .resolution-alert-actions { grid-column: 1 / -1; }
    .answer-escalation-note .card-action { width: 100%; }
    .resolution-alert-actions { justify-content: stretch; }
    .resolution-alert-actions button { flex: 1; }
    .platform-body .main-panel { width: 100%; margin: 0; padding-bottom: 2rem; }
    .platform-list-section .section-heading { align-items: flex-start; }
    .platform-heading-actions { align-items: flex-end; flex-direction: column; }
    .platform-heading-actions .primary-button { min-height: 2.55rem; padding: .55rem .7rem; font-size: .76rem; }
    .company-owner-actions { grid-template-columns: 1fr; }
    .company-modal { width: calc(100vw - 1rem); max-height: calc(100vh - 1rem); }
    .company-modal-shell { max-height: calc(100vh - 1rem); }
    .company-modal-actions { align-items: stretch; flex-direction: column-reverse; }
    .company-modal-actions button { width: 100%; }
    .user-modal-management { align-items: stretch; flex-direction: column; }
    .user-modal-management .danger-card-action { margin-left: 0; }
    .user-modal-management button { width: 100%; }
    .company-metrics { grid-template-columns: repeat(2, 1fr); }
    .user-actions .card-select { width: 100%; max-width: none; }
    .user-delete-button { margin-left: 0; }
    .operations-create-grid, .operations-columns, .managed-site-editor, .dashboard-grid, .site-options, .client-sites { grid-template-columns: 1fr; }
    .guided-site-form { padding:.8rem; }
    .people-options { grid-template-columns:1fr; }
    .guided-actions { flex-direction:column-reverse; margin:0 -.8rem -.8rem; padding:.8rem; }
    .guided-actions button { width:100%; }
    .compact-create-form .primary-button { width: 100%; }
    .site-knowledge-form > .primary-button { width: 100%; }
    .knowledge-editor .form-actions { flex-direction: column; }
    .knowledge-editor .form-actions > button { flex: none; width: 100%; }
    .editor-grid { grid-template-columns: 1fr; }
    .editor-field.full { grid-column: 1; }
    .mobile-nav { overflow-x: auto; justify-content: flex-start; }
    .mobile-nav button { flex: 0 0 4.15rem; }
    .mobile-nav { position: fixed; z-index: 10; right: .7rem; bottom: .7rem; left: .7rem; display: flex; justify-content: space-around; min-height: 4.25rem; border: 1px solid #384c55; border-radius: 1.05rem; padding: .38rem; background: #14252f; box-shadow: var(--shadow); backdrop-filter: blur(12px); }
    .mobile-nav button { display: grid; flex: 1; place-items: center; gap: .1rem; border: 0; border-radius: .78rem; padding: .35rem .25rem; background: transparent; color: #c8d5d3; font-size: .65rem; }
    .mobile-nav button i { font-size: 1rem; }
    .mobile-nav button.active { background: #e8ff6a; color: #14252f; }
    .mobile-nav button.mobile-return-button { color: #e8ff6a; font-weight: 800; }
    .info-tip::after { position: fixed; right: 1rem; bottom: 5.7rem; left: 1rem; width: auto; transform: translateY(.25rem); }
    .info-tip:hover::after, .info-tip:focus-visible::after { transform: translateY(0); }
}