:root {
    --brand-blue: #5a86b0;
    --brand-orange: #ffac2a;
    --navy-950: #071725;
    --navy-900: #0b2032;
    --navy-800: #112d45;
    --navy-700: #1d4058;
    --teal-700: #244e6d;
    --teal-600: #315f83;
    --teal-100: #e8f0f6;
    --sand-500: #b57a3b;
    --sand-200: #d6b273;
    --sand-100: #f4ead9;
    --copper-700: #8f592a;
    --copper-500: #b97838;
    --champagne: #dfc18a;
    --paper: #f5f3f2;
    --surface: #fffdfa;
    --muted: #6e7479;
    --line: #ddd7cf;
    --line-soft: #ebe6df;
    --danger: #a83d48;
    --danger-soft: #fbedef;
    --success: #237257;
    --success-soft: #e8f5ef;
    --shadow: 0 22px 60px rgba(7, 23, 37, 0.1);
    --field-content-inset: 15px;
    --font-sans: Inter, Aptos, "Segoe UI", Arial, sans-serif;
    --font-serif: "Iowan Old Style", "Palatino Linotype", Georgia, serif;
}

/* PRE Core collaborator picker */
.task-people-picker{position:relative;z-index:8;min-width:280px}.task-people-picker>summary{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:52px;padding:8px 13px;border:1px solid #d9e2e3;border-radius:14px;background:#fff;box-shadow:0 4px 16px rgba(11,32,50,.06);cursor:pointer;list-style:none}.task-people-picker>summary::-webkit-details-marker{display:none}.task-people-picker[open]>summary{border-color:#86a9a1;box-shadow:0 0 0 3px rgba(72,144,117,.12)}.task-people-picker__current{display:flex;align-items:center;gap:10px;min-width:0}.task-people-picker__current>span{display:grid;min-width:0}.task-people-picker__current small{color:#76858b;font-size:10px;font-weight:800;letter-spacing:.05em;text-transform:uppercase}.task-people-picker__current strong{overflow:hidden;color:#173343;font-size:13px;text-overflow:ellipsis;white-space:nowrap}.task-people-picker__chevron{transform:rotate(90deg);transition:.18s}.task-people-picker[open] .task-people-picker__chevron{transform:rotate(-90deg)}.task-people-menu{position:absolute;top:calc(100% + 9px);right:0;width:min(390px,calc(100vw - 32px));padding:10px;border:1px solid #dde5e5;border-radius:18px;background:#fff;box-shadow:0 22px 55px rgba(7,31,46,.2)}.task-people-menu>header{display:flex;align-items:end;justify-content:space-between;padding:7px 8px 12px}.task-people-menu>header strong{color:#173343;font-size:14px}.task-people-menu>header small{color:#819096}.task-people-menu__list{max-height:310px;overflow:auto;padding-top:5px;border-top:1px solid #edf1f1}.task-person-option{display:grid;grid-template-columns:38px minmax(0,1fr) auto auto;align-items:center;gap:10px;margin:2px 0;padding:9px;border-radius:12px;color:inherit;text-decoration:none;transition:.15s}.task-person-option:hover,.task-person-option:focus{background:#f0f6f4;outline:none}.task-person-option.is-selected{background:#e8f2ef}.task-person-option>span:nth-child(2){display:grid;min-width:0}.task-person-option strong,.task-person-option small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.task-person-option strong{color:#183442;font-size:13px}.task-person-option small{color:#7a888e;font-size:11px}.task-person-avatar{display:grid;place-items:center;width:36px;height:36px;overflow:hidden;border-radius:11px;background:linear-gradient(145deg,#dbeae6,#edf4f2);color:#326655;font-size:13px;font-weight:850}.task-person-avatar img{width:100%;height:100%;object-fit:cover}.task-person-avatar--all{background:#e7eff5;color:#315c78}.task-account-status{padding:4px 7px;border-radius:999px;background:#f1f3f3;color:#6d7a7f;font-size:9px;font-style:normal;font-weight:850;text-transform:uppercase}.task-account-status--active{background:#e5f3ed;color:#39745e}.task-account-status--disabled{background:#f8e9e7;color:#99514c}.task-account-status--suspended{background:#fff0d9;color:#956719}@media(max-width:700px){.task-people-picker{width:100%;min-width:0}.task-people-menu{left:0;right:auto}.task-person-option{grid-template-columns:38px minmax(0,1fr) auto}.task-account-status{grid-column:2}.task-person-option>.icon{grid-column:3;grid-row:1/3}}

/* Task manager */
.task-page{display:grid;gap:18px}.task-hero{display:flex;align-items:center;justify-content:space-between;gap:24px}.task-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px}.task-scope-tabs{display:flex;padding:4px;background:#e9eff0;border-radius:12px}.task-scope-tabs a{padding:9px 15px;border-radius:9px;color:#52636b;font-weight:700;text-decoration:none}.task-scope-tabs a.is-active{background:#fff;color:#0b2032;box-shadow:0 2px 8px #17333f14}.task-filter select{min-width:210px}.task-board{display:grid;grid-template-columns:repeat(4,minmax(250px,1fr));gap:14px;align-items:stretch;overflow-x:auto;padding-bottom:8px;min-width:0;max-width:100%}.task-column{display:flex;flex-direction:column;min-height:440px;background:#edf2f2;border:1px solid #dde5e5;border-radius:16px;padding:12px;transition:.18s}.task-column.is-drop-target{background:#e4efec;border-color:#82aa9e}.task-column>header{display:flex;align-items:center;gap:9px;padding:4px 4px 13px}.task-column h2{font-size:.9rem;margin:0;flex:1}.task-column header strong{display:grid;place-items:center;min-width:25px;height:25px;border-radius:8px;background:#fff;color:#607178;font-size:.78rem}.task-column__dot{width:9px;height:9px;border-radius:50%;background:#9daeb3}.task-column[data-task-column=in_progress] .task-column__dot{background:#d59f35}.task-column[data-task-column=waiting] .task-column__dot{background:#7388a3}.task-column[data-task-column=done] .task-column__dot{background:#489075}.task-column__cards{display:grid;align-content:start;flex:1;gap:10px}.task-card{background:#fff;border:1px solid #e0e6e6;border-radius:13px;padding:14px;box-shadow:0 3px 10px #17333f0a;cursor:grab}.task-card.is-dragging{opacity:.48}.task-card.is-overdue{border-left:3px solid #b94943}.task-card__top,.task-card footer{display:flex;align-items:center;justify-content:space-between;gap:8px}.task-card h3{font-size:.95rem;line-height:1.35;margin:11px 0 7px;color:#102b3a}.task-card p{font-size:.82rem;color:#627077;line-height:1.45;margin:0 0 12px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.task-card footer{padding-top:10px;border-top:1px solid #edf1f1;font-size:.72rem;color:#718087}.task-priority,.task-automatic{font-size:.65rem;font-weight:800;text-transform:uppercase;letter-spacing:.045em}.task-priority{padding:4px 7px;border-radius:6px;background:#edf1f1;color:#64747a}.task-priority--high{background:#fff0d6;color:#986312}.task-priority--urgent{background:#fde5e3;color:#a33d38}.task-priority--low{background:#e7f1ee;color:#3e7867}.task-automatic{display:flex;align-items:center;gap:3px;color:#6e668d}.task-assignee{display:flex;align-items:center;gap:6px;min-width:0}.task-assignee img,.task-assignee i{width:22px;height:22px;border-radius:50%;object-fit:cover}.task-assignee i{display:grid;place-items:center;background:#dce8e5;color:#315f53;font-style:normal;font-weight:800}.task-card time{display:flex;align-items:center;gap:4px;white-space:nowrap}.task-card time.is-overdue{color:#ae3f39;font-weight:800}.task-column__empty{text-align:center;color:#849298;font-size:.8rem;padding:32px 10px}.task-dialog{width:min(650px,calc(100vw - 28px));border:0;border-radius:18px;padding:0;box-shadow:0 30px 80px #0b203250}.task-dialog::backdrop{background:#0b203285}.task-dialog form{padding:24px}.task-dialog header,.task-dialog footer{display:flex;align-items:center;justify-content:space-between;gap:16px}.task-dialog header{margin-bottom:20px}.task-dialog h2{margin:3px 0 0}.task-dialog footer{justify-content:flex-end;margin-top:22px}.task-toast{position:fixed;right:24px;bottom:24px;background:#153b34;color:#fff;padding:13px 18px;border-radius:10px;box-shadow:0 10px 30px #0003;z-index:50}
@media(max-width:900px){.task-board{grid-template-columns:repeat(4,minmax(280px,80vw))}.task-hero,.task-toolbar{align-items:stretch;flex-direction:column}.task-hero .button{align-self:start}.task-filter select{width:100%}}

/* V0.14 live sales bridge in Budget & objectives */
.budget-live-sales{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}.budget-live-sales article{display:grid;grid-template-columns:42px 1fr;gap:4px 10px;align-items:center;min-height:92px;padding:14px;border:1px solid #d8e0e3;border-radius:17px;background:#fff}.budget-live-sales article>span{grid-row:1/3;display:flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:12px;background:#eaf3f7;color:#174e6b;font-weight:850}.budget-live-sales small{font-size:13px;color:#64727a}.budget-live-sales strong{font-size:19px;color:#0b3049}.budget-live-sales .is-cost>span{background:#fff0e5;color:#a85620}.budget-live-sales .is-net>span{background:#e5f5ed;color:#176a4b}@media(max-width:1250px){.budget-live-sales{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:660px){.budget-live-sales{grid-template-columns:1fr 1fr}.budget-live-sales article{grid-template-columns:36px 1fr;padding:11px}.budget-live-sales article>span{width:36px;height:36px}.budget-live-sales strong{font-size:16px}}@media(max-width:420px){.budget-live-sales{grid-template-columns:1fr}}

.button--danger{border-color:#b93a3a!important;background:#a92f2f!important;color:#fff!important}.commercial-lead-card{position:relative}.commercial-lead-card__archive{position:absolute!important;top:9px;right:9px;z-index:3;display:flex!important;align-items:center;justify-content:center;width:30px;height:30px;padding:0!important;border:1px solid #d5dfe2;border-radius:9px;background:#fff;color:#49606c;opacity:.25;transition:.18s}.commercial-lead-card:hover .commercial-lead-card__archive,.commercial-lead-card__archive:focus{opacity:1}.commercial-lead-card__sale{display:flex!important;align-items:center;justify-content:center;margin:0 12px 12px!important;padding:9px!important;border-radius:10px;background:#0e4969!important;color:#fff!important;font-weight:800!important}.commercial-archive-panel{border-color:#e4b9a6!important}.operations-table-shell{padding:0;overflow:hidden}.table-responsive{width:100%;overflow:auto}.operations-table{width:100%;border-collapse:collapse}.operations-table th,.operations-table td{padding:14px 16px;border-bottom:1px solid #e3e8ea;text-align:left;vertical-align:top}.operations-table th{background:#f4f7f8;color:#54636b;font-size:13px;text-transform:uppercase}.operations-table td small{display:block;margin-top:3px;color:#6b787e}.table-empty{text-align:center!important;padding:34px!important}.payment-plan-external-trigger{margin-top:8px}.payment-plan-external-dialog{width:min(820px,calc(100vw - 28px));max-height:calc(100vh - 30px);padding:0;border:0;border-radius:22px;background:#fff;box-shadow:0 26px 80px rgba(3,28,45,.3)}.payment-plan-external-dialog::backdrop{background:rgba(2,25,40,.62);backdrop-filter:blur(4px)}.payment-plan-external-dialog__shell{padding:25px;overflow:auto}.payment-plan-external-dialog__shell>header,.payment-plan-external-dialog__shell>footer{display:flex;align-items:center;justify-content:space-between;gap:18px}.payment-plan-external-dialog__shell>header{margin-bottom:20px}.payment-plan-external-dialog__shell>header h2{margin:4px 0}.payment-plan-external-dialog__shell>header p{margin:0}.payment-plan-external-dialog__shell>header>button{width:40px;height:40px;border:1px solid #d7dfe2;border-radius:12px;background:#fff;font-size:25px}.payment-plan-external-dialog__shell>footer{justify-content:flex-end;margin-top:20px}@media(max-width:700px){.commercial-lead-card__archive{opacity:1}.operations-table thead{display:none}.operations-table,.operations-table tbody,.operations-table tr,.operations-table td{display:block}.operations-table tr{margin:12px;border:1px solid #d9e1e3;border-radius:15px;overflow:hidden}.operations-table td{display:grid;grid-template-columns:42% 1fr;gap:10px}.operations-table td::before{content:attr(data-label);font-weight:800;color:#5a6970}.payment-plan-external-dialog__shell{padding:18px}.payment-plan-external-dialog__shell>footer{align-items:stretch;flex-direction:column}.payment-plan-external-dialog__shell>footer .button{width:100%}}

/* Commercial pipeline and 360-degree prospect record — v0.11.0 */
.commercial-pipeline-page,
.commercial-lead-page {
    display: grid;
    width: 100%;
    max-width: 1920px;
    gap: 20px;
}

.app-main.commercial-pipeline-page,
.app-main.commercial-lead-page {
    width: 100%;
}

.commercial-pipeline-hero,
.commercial-lead-hero {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    overflow: hidden;
    padding: 30px 34px;
    border: 1px solid rgba(185, 120, 56, 0.36);
    border-radius: 24px;
    background:
        radial-gradient(circle at 92% -10%, rgba(199, 132, 65, 0.34), transparent 34%),
        linear-gradient(135deg, #071927 0%, #0c2e47 62%, #174762 100%);
    color: #fff;
    box-shadow: 0 24px 55px rgba(7, 29, 46, 0.18);
}

.commercial-pipeline-hero::after,
.commercial-lead-hero::after {
    position: absolute;
    right: -90px;
    bottom: -180px;
    width: 390px;
    height: 390px;
    border: 1px solid rgba(223, 193, 138, 0.2);
    border-radius: 50%;
    content: "";
}

.commercial-pipeline-hero > *,
.commercial-lead-hero > * {
    position: relative;
    z-index: 1;
}

.commercial-pipeline-hero .eyebrow,
.commercial-lead-hero .eyebrow {
    color: #dda568;
}

.commercial-pipeline-hero h1,
.commercial-lead-hero h1 {
    margin: 5px 0 7px;
    font-family: var(--font-serif);
    font-size: clamp(36px, 3.4vw, 54px);
    line-height: 1.02;
    letter-spacing: -0.035em;
}

.commercial-pipeline-hero p,
.commercial-lead-hero p {
    max-width: 850px;
    margin: 0;
    color: rgba(255, 255, 255, 0.8);
    font-size: 15px;
    line-height: 1.65;
}

.commercial-pipeline-hero__actions,
.commercial-lead-hero__actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.commercial-pipeline-hero .button,
.commercial-lead-hero .button {
    min-height: 46px;
    white-space: nowrap;
}

.commercial-pipeline-hero .button--secondary,
.commercial-lead-hero .button--secondary {
    border-color: rgba(255, 255, 255, 0.35);
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
}

.commercial-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.commercial-summary-grid > a {
    display: flex;
    align-items: center;
    gap: 14px;
    min-height: 88px;
    padding: 17px 20px;
    border: 1px solid #d7dee3;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.92);
    color: var(--navy-900);
    text-decoration: none;
    box-shadow: 0 10px 25px rgba(7, 29, 46, 0.05);
    transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.commercial-summary-grid > a:hover {
    transform: translateY(-2px);
    border-color: #9fb8c9;
    box-shadow: 0 14px 32px rgba(7, 29, 46, 0.1);
}

.commercial-summary-grid > a > span {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 15px;
    background: #e7f0f5;
    color: #285b7b;
}

.commercial-summary-grid > a.is-alert > span {
    background: #fff0e5;
    color: #aa5529;
}

.commercial-summary-grid small {
    display: block;
    margin-bottom: 2px;
    color: #596976;
    font-size: 13px;
    font-weight: 700;
}

.commercial-summary-grid strong {
    display: block;
    font-family: var(--font-serif);
    font-size: 31px;
    line-height: 1;
}

.commercial-filter-bar {
    display: grid;
    grid-template-columns: minmax(300px, 1.8fr) repeat(4, minmax(150px, 0.7fr)) auto auto;
    gap: 10px;
    align-items: center;
    padding: 14px;
    border: 1px solid #d8dee2;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.92);
}

.commercial-filter-bar select,
.commercial-filter-bar input {
    min-height: 46px;
    font-size: 14px;
}

.commercial-filter-bar select {
    padding-left: var(--field-content-inset);
    padding-right: 42px;
}

.commercial-board-shell {
    position: relative;
    overflow: hidden;
    border: 1px solid #ced8df;
    border-radius: 22px;
    background: #eef3f5;
    box-shadow: 0 18px 45px rgba(7, 29, 46, 0.08);
}

.commercial-board-shell > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 18px 20px;
    border-bottom: 1px solid #ced8df;
    background: #fff;
}

.commercial-board-shell > header h2 {
    margin: 0 0 2px;
    font-size: 18px;
}

.commercial-board-shell > header p {
    margin: 0;
    color: #65727b;
    font-size: 13px;
}

.commercial-board-nav {
    display: flex;
    gap: 8px;
}

.commercial-board-nav button {
    width: 40px;
    height: 40px;
    border: 1px solid #cbd7df;
    border-radius: 12px;
    background: #f8fbfc;
    color: var(--navy-900);
    cursor: pointer;
    font-size: 18px;
}

.commercial-board {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: clamp(286px, 20vw, 360px);
    gap: 14px;
    overflow-x: auto;
    min-height: 610px;
    padding: 16px;
    scroll-snap-type: x proximity;
    scrollbar-color: #8299a8 transparent;
}

.commercial-stage {
    display: flex;
    flex-direction: column;
    min-width: 0;
    border: 1px solid #d5dde2;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.76);
    scroll-snap-align: start;
}

.commercial-stage > header {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-height: 78px;
    padding: 13px 14px;
    border-top: 4px solid #315f83;
    border-bottom: 1px solid #d9e1e6;
    border-radius: 17px 17px 0 0;
    background: #fff;
}

.commercial-stage--new > header,
.commercial-stage--reservation > header {
    border-top-color: #b97838;
}

.commercial-stage--qualification > header,
.commercial-stage--needs > header {
    border-top-color: #4c7f70;
}

.commercial-stage__index {
    display: grid;
    width: 31px;
    height: 31px;
    place-items: center;
    border-radius: 10px;
    background: var(--navy-900);
    color: #fff;
    font-size: 13px;
    font-weight: 800;
}

.commercial-stage > header h3 {
    overflow: hidden;
    margin: 0 0 2px;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 15px;
}

.commercial-stage > header small {
    display: block;
    overflow: hidden;
    color: #6d7880;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.commercial-stage > header > strong {
    display: grid;
    min-width: 30px;
    height: 30px;
    place-items: center;
    border-radius: 10px;
    background: #e9f0f4;
    color: #163a52;
    font-size: 13px;
}

.commercial-stage__cards {
    display: grid;
    align-content: start;
    gap: 10px;
    min-height: 510px;
    padding: 10px;
    transition: background 140ms ease, outline-color 140ms ease;
}

.commercial-stage__cards.is-drag-over {
    outline: 2px dashed #b97838;
    outline-offset: -6px;
    background: rgba(185, 120, 56, 0.09);
}

.commercial-stage__empty {
    display: grid;
    min-height: 98px;
    place-items: center;
    padding: 15px;
    border: 1px dashed #cbd6dd;
    border-radius: 14px;
    color: #7b878f;
    font-size: 13px;
    text-align: center;
}

.commercial-lead-card {
    position: relative;
    overflow: hidden;
    border: 1px solid #d7e0e5;
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 7px 18px rgba(7, 29, 46, 0.06);
    transition: transform 150ms ease, box-shadow 150ms ease, opacity 150ms ease;
}

.commercial-lead-card[draggable="true"] {
    cursor: grab;
}

.commercial-lead-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 25px rgba(7, 29, 46, 0.11);
}

.commercial-lead-card.is-dragging {
    opacity: 0.38;
    cursor: grabbing;
}

.commercial-lead-card::before {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: #7693a5;
    content: "";
}

.commercial-lead-card--urgent::before,
.commercial-lead-card--overdue::before {
    background: #bd5539;
}

.commercial-lead-card--watch::before {
    background: #c98a3f;
}

.commercial-lead-card > a {
    display: block;
    padding: 14px 14px 13px 17px;
    color: inherit;
    text-decoration: none;
}

.commercial-lead-card__top {
    display: flex;
    align-items: center;
    gap: 7px;
}

.commercial-lead-card__top small {
    overflow: hidden;
    margin-right: auto;
    color: #71808a;
    font-size: 11px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.commercial-lead-card h4 {
    margin: 11px 0 4px;
    color: #0d3049;
    font-size: 15px;
    line-height: 1.25;
}

.commercial-lead-card > a > p {
    min-height: 34px;
    margin: 0 0 12px;
    color: #60707b;
    font-size: 12px;
    line-height: 1.4;
}

.commercial-lead-card__agent {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-top: 10px;
    border-top: 1px solid #edf0f2;
    color: #334d5f;
    font-size: 12px;
    font-weight: 700;
}

.commercial-lead-card__meta {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    margin-top: 9px;
    color: #6d7c85;
    font-size: 11px;
}

.commercial-lead-card__meta span {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.commercial-lead-card__meta .is-overdue {
    color: #ad3f36;
    font-weight: 800;
}

.commercial-board-toast {
    position: absolute;
    right: 20px;
    bottom: 20px;
    z-index: 10;
    max-width: 440px;
    padding: 13px 17px;
    border-radius: 13px;
    background: #1f6d56;
    color: #fff;
    box-shadow: 0 14px 35px rgba(7, 29, 46, 0.24);
    font-size: 13px;
    font-weight: 700;
}

.commercial-board-toast.is-error {
    background: #9f3d44;
}

.commercial-lead-hero__identity .lead-language {
    margin-right: 9px;
}

.commercial-lead-hero__actions > .lead-priority {
    min-height: 38px;
    padding: 0 14px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.09);
    color: #fff;
}

.commercial-stage-stepper {
    display: grid;
    grid-template-columns: repeat(8, minmax(122px, 1fr));
    overflow-x: auto;
    padding: 10px;
    border: 1px solid #d7dee3;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 10px 25px rgba(7, 29, 46, 0.05);
}

.commercial-stage-step {
    position: relative;
}

.commercial-stage-step:not(:last-child)::after {
    position: absolute;
    top: 22px;
    right: -8px;
    left: calc(50% + 24px);
    height: 2px;
    background: #dbe2e6;
    content: "";
}

.commercial-stage-step button {
    position: relative;
    z-index: 1;
    display: grid;
    width: 100%;
    justify-items: center;
    gap: 5px;
    padding: 5px 7px 8px;
    border: 0;
    background: transparent;
    color: #66747c;
    cursor: pointer;
}

.commercial-stage-step button > span {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;
    border: 2px solid #cfd9df;
    border-radius: 50%;
    background: #fff;
    font-size: 12px;
    font-weight: 800;
}

.commercial-stage-step button small {
    min-height: 30px;
    color: inherit;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.25;
    text-align: center;
}

.commercial-stage-step.is-complete button,
.commercial-stage-step.is-current button {
    color: #174762;
}

.commercial-stage-step.is-complete button > span {
    border-color: #5d8ba6;
    background: #e5f0f5;
}

.commercial-stage-step.is-current button > span {
    border-color: #b97838;
    background: #b97838;
    color: #fff;
    box-shadow: 0 0 0 5px rgba(185, 120, 56, 0.12);
}

.commercial-lead-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(330px, 390px);
    align-items: start;
    gap: 18px;
}

.commercial-lead-main,
.commercial-lead-aside {
    display: grid;
    gap: 18px;
}

.commercial-lead-aside {
    position: sticky;
    top: 90px;
}

.commercial-record-card,
.commercial-task-card,
.commercial-audit-card {
    padding: 24px;
}

.commercial-record-card > header,
.commercial-task-card > header,
.commercial-audit-card > header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 20px;
}

.commercial-record-card > header h2,
.commercial-task-card > header h2,
.commercial-audit-card > header h2 {
    margin: 3px 0 0;
    font-family: var(--font-serif);
    font-size: clamp(22px, 2vw, 28px);
    line-height: 1.1;
}

.commercial-record-card > header p {
    max-width: 760px;
    margin: 6px 0 0;
    color: #68747c;
    font-size: 13px;
    line-height: 1.55;
}

.commercial-record-card > header > span,
.commercial-task-card > header > span {
    display: grid;
    width: 44px;
    height: 44px;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 14px;
    background: #e7f0f5;
    color: #285b7b;
}

.commercial-contact-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 11px;
}

.commercial-contact-grid > div {
    min-width: 0;
    padding: 14px 15px;
    border: 1px solid #e1e6e9;
    border-radius: 13px;
    background: #fbfcfc;
}

.commercial-contact-grid small {
    display: block;
    margin-bottom: 5px;
    color: #75818a;
    font-size: 12px;
    font-weight: 700;
}

.commercial-contact-grid strong,
.commercial-contact-grid a {
    overflow-wrap: anywhere;
    color: #14384f;
    font-size: 14px;
}

.commercial-inline-editor {
    margin-top: 17px;
    border: 1px solid #d9e1e6;
    border-radius: 14px;
    background: #fbfcfc;
}

.commercial-inline-editor > summary {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 14px 16px;
    color: #1b4b69;
    cursor: pointer;
    font-size: 13px;
    font-weight: 800;
    list-style: none;
}

.commercial-inline-editor > summary::-webkit-details-marker {
    display: none;
}

.commercial-inline-editor > summary::after {
    margin-left: auto;
    color: #7c8991;
    content: "+";
    font-size: 20px;
}

.commercial-inline-editor[open] > summary::after {
    content: "−";
}

.commercial-inline-editor > form {
    padding: 2px 16px 17px;
}

.commercial-inline-editor .field > span,
.commercial-needs-form .field > span,
.commercial-task-form .field > span {
    font-size: 13px;
}

.commercial-inline-editor input,
.commercial-inline-editor select,
.commercial-inline-editor textarea,
.commercial-needs-form input,
.commercial-needs-form select,
.commercial-needs-form textarea,
.commercial-task-form input,
.commercial-task-form select,
.commercial-task-form textarea {
    font-size: 14px;
}

.commercial-needs-summary {
    display: grid;
    grid-template-columns: auto auto 1fr;
    align-items: center;
    gap: 10px;
    margin-bottom: 18px;
    padding: 13px 15px;
    border: 1px solid #d9e4e1;
    border-radius: 14px;
    background: #f4f9f7;
}

.qualification,
.commercial-interest-status {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    min-height: 27px;
    padding: 0 10px;
    border-radius: 999px;
    background: #e7edf1;
    color: #425a69;
    font-size: 11px;
    font-weight: 800;
}

.qualification--qualified,
.commercial-interest-status--selected,
.commercial-interest-status--favorite {
    background: #e4f3ec;
    color: #1d6f52;
}

.qualification--unqualified,
.commercial-interest-status--rejected {
    background: #fae9eb;
    color: #9d3945;
}

.commercial-needs-summary > strong {
    font-family: var(--font-serif);
    font-size: 21px;
}

.commercial-needs-summary > small {
    color: #6f7d85;
    font-size: 12px;
}

.commercial-needs-form {
    padding-top: 4px;
    border-top: 1px solid #e7ebe8;
}

.commercial-interest-list {
    display: grid;
    gap: 9px;
}

.commercial-interest-list article {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 16px;
    border: 1px solid #dfe5e8;
    border-radius: 14px;
    background: #fbfcfc;
}

.commercial-interest-list h3 {
    margin: 7px 0 3px;
    color: #12374e;
    font-size: 15px;
}

.commercial-interest-list p {
    margin: 0;
    color: #6c7981;
    font-size: 12px;
}

.commercial-interest-list article > strong {
    color: #94572a;
    white-space: nowrap;
    font-family: var(--font-serif);
    font-size: 18px;
}

.commercial-timeline {
    display: grid;
    margin-top: 18px;
}

.commercial-timeline article {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 13px;
    padding: 0 0 19px;
}

.commercial-timeline article:not(:last-child)::before {
    position: absolute;
    top: 39px;
    bottom: 0;
    left: 18px;
    width: 1px;
    background: #d8e1e6;
    content: "";
}

.commercial-timeline__icon {
    display: grid;
    width: 37px;
    height: 37px;
    place-items: center;
    border: 1px solid #d5e0e6;
    border-radius: 12px;
    background: #edf4f7;
    color: #2a6182;
}

.commercial-timeline article > div > div {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}

.commercial-timeline strong {
    color: #15394f;
    font-size: 14px;
}

.commercial-timeline small,
.commercial-timeline p {
    color: #718089;
    font-size: 12px;
}

.commercial-timeline p {
    margin: 3px 0 0;
}

.commercial-timeline blockquote {
    margin: 8px 0 0;
    padding: 9px 11px;
    border-left: 3px solid #bc7a3d;
    border-radius: 0 8px 8px 0;
    background: #faf6f0;
    color: #4d5f69;
    font-size: 13px;
    line-height: 1.5;
}

.commercial-stage-history {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.commercial-stage-history article {
    padding: 9px 11px;
    border: 1px solid #dfe5e8;
    border-radius: 11px;
    background: #fbfcfc;
}

.commercial-stage-history span {
    color: #15394f;
    font-size: 12px;
    font-weight: 800;
}

.commercial-stage-history p {
    margin: 3px 0 0;
    color: #75818a;
    font-size: 10px;
}

.commercial-task-list {
    display: grid;
    gap: 9px;
}

.commercial-task {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    padding: 11px;
    border: 1px solid #dfe5e8;
    border-radius: 12px;
    background: #fbfcfc;
}

.commercial-task.is-overdue {
    border-color: #e5b3b8;
    background: #fff7f8;
}

.commercial-task--done {
    opacity: 0.62;
}

.commercial-task--done strong {
    text-decoration: line-through;
}

.commercial-task form button {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    border: 2px solid #9fb1bd;
    border-radius: 9px;
    background: #fff;
    color: #1d7154;
    cursor: pointer;
    font-size: 15px;
    font-weight: 900;
}

.commercial-task strong {
    display: block;
    color: #17394f;
    font-size: 13px;
}

.commercial-task small {
    display: block;
    margin-top: 4px;
    color: #77838b;
    font-size: 11px;
    line-height: 1.4;
}

.commercial-task-form {
    display: grid;
    gap: 10px;
}

.commercial-audit-card .lead-history-list {
    max-height: 280px;
    overflow-y: auto;
}

@media (max-width: 1260px) {
    .commercial-filter-bar {
        grid-template-columns: minmax(270px, 1.4fr) repeat(3, minmax(155px, 0.7fr));
    }

    .commercial-filter-bar .button {
        width: 100%;
    }

    .commercial-lead-layout {
        grid-template-columns: minmax(0, 1fr) 330px;
    }

    .commercial-contact-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 980px) {
    .commercial-pipeline-hero,
    .commercial-lead-hero {
        align-items: flex-start;
        flex-direction: column;
        padding: 25px;
    }

    .commercial-pipeline-hero__actions,
    .commercial-lead-hero__actions {
        justify-content: flex-start;
    }

    .commercial-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .commercial-filter-bar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .commercial-filter-bar .lead-search-field {
        grid-column: 1 / -1;
    }

    .commercial-lead-layout {
        grid-template-columns: 1fr;
    }

    .commercial-lead-aside {
        position: static;
    }
}

@media (max-width: 640px) {
    .commercial-pipeline-page,
    .commercial-lead-page {
        gap: 14px;
    }

    .commercial-pipeline-hero,
    .commercial-lead-hero {
        padding: 21px 18px;
        border-radius: 18px;
    }

    .commercial-pipeline-hero h1,
    .commercial-lead-hero h1 {
        font-size: 34px;
    }

    .commercial-pipeline-hero__actions,
    .commercial-lead-hero__actions,
    .commercial-pipeline-hero__actions .button,
    .commercial-lead-hero__actions .button {
        width: 100%;
    }

    .commercial-summary-grid,
    .commercial-filter-bar,
    .commercial-contact-grid {
        grid-template-columns: 1fr;
    }

    .commercial-filter-bar .lead-search-field {
        grid-column: auto;
    }

    .commercial-summary-grid > a {
        min-height: 76px;
    }

    .commercial-board {
        grid-auto-columns: min(86vw, 318px);
        min-height: 560px;
        padding: 11px;
    }

    .commercial-stage__cards {
        min-height: 450px;
    }

    .commercial-record-card,
    .commercial-task-card,
    .commercial-audit-card {
        padding: 18px;
    }

    .commercial-needs-summary {
        grid-template-columns: 1fr;
    }

    .commercial-interest-list article,
    .commercial-timeline article > div > div {
        align-items: flex-start;
        flex-direction: column;
    }

    .commercial-interest-list article {
        display: flex;
    }
}

/* Events, registrations and six-month planning — v0.10.2 */
.events-page,
.registrations-page,
.planning-page {
    display: grid;
    width: 100%;
    max-width: 1900px;
    gap: 20px;
}

.app-main.events-page,
.app-main.registrations-page,
.app-main.planning-page {
    width: 100%;
}

.event-hero {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    overflow: hidden;
    padding: 30px 34px;
    border: 1px solid rgba(185, 120, 56, 0.34);
    border-radius: 24px;
    background:
        radial-gradient(circle at 93% 4%, rgba(197, 128, 62, 0.3), transparent 32%),
        linear-gradient(135deg, #071c2c 0%, #0d3049 62%, #164461 100%);
    color: #fff;
    box-shadow: 0 24px 55px rgba(7, 29, 46, 0.19);
}

.event-hero::after {
    position: absolute;
    right: -84px;
    bottom: -142px;
    width: 350px;
    height: 350px;
    border: 1px solid rgba(223, 193, 138, 0.24);
    border-radius: 50%;
    content: "";
}

.event-hero > * {
    position: relative;
    z-index: 1;
}

.event-hero .eyebrow {
    color: #dda568;
}

.event-hero h1 {
    margin: 5px 0 5px;
    font-family: var(--font-serif);
    font-size: clamp(34px, 3.2vw, 50px);
    line-height: 1.05;
    letter-spacing: -0.035em;
}

.event-hero p {
    max-width: 760px;
    margin: 0;
    color: rgba(255, 255, 255, 0.79);
    font-size: 15px;
    line-height: 1.65;
}

.event-hero .button--primary {
    min-height: 48px;
    border-color: #c8894f;
    background: linear-gradient(135deg, #a76430, #ca8c51);
    white-space: nowrap;
}

.event-year-tabs {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding: 3px 1px;
}

.event-year-tabs a {
    min-width: 84px;
    padding: 10px 18px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--surface);
    color: var(--navy-800);
    text-align: center;
    text-decoration: none;
    font-size: 14px;
    font-weight: 800;
}

.event-year-tabs a.is-active {
    border-color: var(--navy-800);
    background: var(--navy-800);
    color: #fff;
    box-shadow: 0 8px 20px rgba(11, 32, 50, 0.16);
}

.event-year-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.event-year-summary article {
    display: grid;
    gap: 5px;
    min-height: 108px;
    padding: 17px 19px;
    border: 1px solid var(--line);
    border-radius: 17px;
    background: var(--surface);
    box-shadow: 0 9px 25px rgba(7, 23, 37, .05);
}

.event-year-summary small,
.event-year-summary span,
.event-year-summary a {
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
}

.event-year-summary strong {
    color: var(--navy-900);
    font-family: var(--font-serif);
    font-size: clamp(20px, 1.7vw, 27px);
    line-height: 1.15;
}

.event-year-summary a {
    color: var(--copper-700);
    text-decoration: none;
}

.event-card-rail {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 14px;
}

.event-selector-card {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 5px 12px;
    min-height: 178px;
    padding: 19px;
    border: 1px solid var(--line);
    border-radius: 19px;
    background: var(--surface);
    color: var(--navy-900);
    text-decoration: none;
    box-shadow: 0 10px 28px rgba(7, 23, 37, 0.055);
    transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.event-selector-card:hover,
.event-selector-card.is-active {
    border-color: rgba(181, 122, 59, 0.75);
    transform: translateY(-2px);
    box-shadow: 0 16px 34px rgba(7, 23, 37, 0.1);
}

.event-selector-card.is-active {
    background: linear-gradient(145deg, #fffdfa, #f8f0e5);
}

.event-selector-card > .event-status {
    grid-column: 1 / -1;
    justify-self: start;
}

.event-selector-card > strong {
    grid-column: 1 / -1;
    margin-top: 5px;
    font-family: var(--font-serif);
    font-size: 20px;
    line-height: 1.2;
}

.event-selector-card > small {
    grid-column: 1 / -1;
    color: var(--muted);
    font-size: 13px;
}

.event-selector-card__date {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 6px;
    color: var(--navy-700);
    font-size: 13px;
    font-weight: 700;
}

.event-mini-progress {
    grid-column: 1 / -1;
    margin-top: 7px;
}

.event-mini-progress,
.event-session-capacity progress,
.registration-capacity-strip progress {
    width: 100%;
    height: 6px;
    overflow: hidden;
    border: 0;
    border-radius: 999px;
    appearance: none;
    background: #e9e5df;
}

.event-mini-progress::-webkit-progress-bar,
.event-session-capacity progress::-webkit-progress-bar,
.registration-capacity-strip progress::-webkit-progress-bar { border-radius: 999px; background: #e9e5df; }
.event-mini-progress::-webkit-progress-value,
.event-session-capacity progress::-webkit-progress-value,
.registration-capacity-strip progress::-webkit-progress-value { border-radius: 999px; background: linear-gradient(90deg, #a86631, #d29a60); }
.event-mini-progress::-moz-progress-bar,
.event-session-capacity progress::-moz-progress-bar,
.registration-capacity-strip progress::-moz-progress-bar { border-radius: 999px; background: linear-gradient(90deg, #a86631, #d29a60); }

.event-selector-card__stats {
    grid-column: 1 / -1;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
}

.event-selector-card__stats small {
    color: var(--muted);
    font-size: 12px;
}

.event-selector-card--empty {
    appearance: none;
    place-items: center;
    cursor: pointer;
    border-style: dashed;
}

.event-status {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    padding: 4px 10px;
    border-radius: 999px;
    background: #e9edf0;
    color: #425463;
    font-size: 11px;
    font-weight: 850;
    letter-spacing: .025em;
    text-transform: uppercase;
}

.event-status--open { background: #e4f5ed; color: #176a4a; }
.event-status--full { background: #f5eadc; color: #8b5528; }
.event-status--completed { background: #e5edf5; color: #285d82; }
.event-status--cancelled { background: var(--danger-soft); color: var(--danger); }

.event-detail-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 23px 26px;
}

.event-detail-hero h2 {
    margin: 8px 0 4px;
    color: var(--navy-900);
    font-family: var(--font-serif);
    font-size: clamp(27px, 2.2vw, 38px);
}

.event-detail-hero p {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 0;
    color: var(--muted);
    font-size: 14px;
}

.event-detail-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 9px;
}

.event-kpi-grid,
.registration-kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 13px;
}

.event-kpi-grid article,
.registration-kpi-grid article {
    display: flex;
    align-items: center;
    gap: 14px;
    min-height: 92px;
    padding: 17px 19px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: var(--surface);
    box-shadow: 0 9px 25px rgba(7, 23, 37, 0.055);
}

.event-kpi-grid article > span,
.registration-kpi-grid article > span {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 13px;
    background: var(--teal-100);
    color: var(--teal-600);
}

.event-kpi-grid small,
.registration-kpi-grid small {
    display: block;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.event-kpi-grid strong,
.registration-kpi-grid strong {
    display: block;
    margin-top: 2px;
    color: var(--navy-900);
    font-family: var(--font-serif);
    font-size: 25px;
}

.event-kpi-grid article.is-positive > span { background: var(--success-soft); color: var(--success); }
.event-kpi-grid article.is-negative > span { background: var(--danger-soft); color: var(--danger); }
.registration-kpi-grid article.is-warning > span { background: #fff0e2; color: #a85d25; }

.event-workspace {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(440px, .72fr);
    align-items: start;
    gap: 18px;
}

.event-overview-stack {
    display: grid;
    gap: 18px;
}

.event-sessions-panel,
.event-team-panel,
.event-projection-panel,
.event-financial-form,
.registration-list-panel,
.planning-agenda-panel {
    padding: 23px;
}

.event-panel-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 17px;
}

.event-panel-heading h2 {
    margin: 3px 0 0;
    color: var(--navy-900);
    font-family: var(--font-serif);
    font-size: 24px;
}

.event-session-list {
    display: grid;
    gap: 10px;
}

.event-session-list > article {
    display: grid;
    grid-template-columns: auto minmax(130px, 1fr) minmax(160px, .8fr);
    align-items: center;
    gap: 15px;
    padding: 13px;
    border: 1px solid var(--line-soft);
    border-radius: 15px;
    background: #fff;
}

.event-session-date {
    display: grid;
    width: 54px;
    min-height: 55px;
    place-items: center;
    border-radius: 13px;
    background: var(--navy-900);
    color: #fff;
}

.event-session-date b { font-family: var(--font-serif); font-size: 21px; line-height: 1; }
.event-session-date small { font-size: 10px; }
.event-session-list article > div:nth-child(2) strong,
.event-session-list article > div:nth-child(2) small { display: block; }
.event-session-list article > div:nth-child(2) small { margin-top: 4px; color: var(--muted); font-size: 12px; }

.event-session-capacity {
    text-align: right;
}

.event-session-capacity b { color: var(--navy-800); font-size: 13px; }
.event-session-capacity progress {
    display: block;
    margin-top: 7px;
}

.event-avatar-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 9px;
}

.event-avatar-list > span {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px;
    border: 1px solid var(--line-soft);
    border-radius: 13px;
}

.event-avatar-list > span > b {
    display: grid;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 11px;
    background: var(--navy-900);
    color: #fff;
    font-size: 11px;
}

.event-avatar-list strong,
.event-avatar-list small { display: block; }
.event-avatar-list strong { color: var(--navy-900); font-size: 13px; }
.event-avatar-list small { margin-top: 2px; color: var(--muted); font-size: 11px; text-transform: capitalize; }

.event-projection-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.event-projection-grid > div {
    min-height: 92px;
    padding: 15px;
    border: 1px solid var(--line-soft);
    border-radius: 14px;
    background: #fff;
}

.event-projection-grid small,
.event-projection-grid strong { display: block; }
.event-projection-grid small { min-height: 30px; color: var(--muted); font-size: 11px; font-weight: 700; }
.event-projection-grid strong { margin-top: 6px; color: var(--navy-900); font-family: var(--font-serif); font-size: 21px; }
.event-projection-grid .is-primary { border-color: transparent; background: var(--navy-900); }
.event-projection-grid .is-primary small { color: rgba(255,255,255,.65); }
.event-projection-grid .is-primary strong { color: #fff; }

.event-financial-form {
    position: sticky;
    top: 86px;
    display: grid;
    gap: 14px;
}

.event-form-grid,
.event-create-grid,
.registration-form-grid,
.planning-entry-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.event-financial-form details,
.registration-followup-details {
    border: 1px solid var(--line-soft);
    border-radius: 14px;
    background: #fff;
}

.event-financial-form details > summary,
.registration-followup-details > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 13px 15px;
    cursor: pointer;
    color: var(--navy-900);
    font-size: 13px;
    font-weight: 850;
    list-style: none;
}

.event-financial-form details[open] > summary .icon,
.registration-followup-details[open] > summary .icon { transform: rotate(90deg); }
.event-financial-form details .event-form-grid { padding: 0 13px 13px; }
.event-save-button { width: 100%; min-height: 47px; }

.pre-dialog {
    width: min(920px, calc(100vw - 30px));
    max-height: calc(100vh - 30px);
    padding: 0;
    overflow: hidden auto;
    border: 0;
    border-radius: 22px;
    background: transparent;
    box-shadow: 0 32px 90px rgba(3, 15, 24, .35);
}

.pre-dialog::backdrop { background: rgba(4, 17, 28, .68); backdrop-filter: blur(4px); }
.pre-dialog__surface { display: grid; gap: 18px; padding: 25px; background: var(--surface); }
.pre-dialog__surface > header,
.pre-dialog__surface > footer { display: flex; align-items: center; justify-content: space-between; gap: 15px; }
.pre-dialog__surface > header h2 { margin: 4px 0 0; color: var(--navy-900); font-family: var(--font-serif); font-size: 30px; }
.pre-dialog__surface > footer { justify-content: flex-end; padding-top: 17px; border-top: 1px solid var(--line); }

.event-session-builder,
.event-participant-picker,
.registration-session-counts {
    min-width: 0;
    margin: 0;
    padding: 17px;
    border: 1px solid var(--line);
    border-radius: 16px;
}

.event-session-builder legend,
.event-participant-picker legend,
.registration-session-counts legend {
    padding: 0 8px;
    color: var(--navy-900);
    font-family: var(--font-serif);
    font-size: 20px;
    font-weight: 750;
}

.event-session-builder__row {
    display: grid;
    grid-template-columns: 75px repeat(4, minmax(100px, 1fr));
    align-items: end;
    gap: 9px;
    padding: 11px 0;
    border-bottom: 1px solid var(--line-soft);
}

.event-session-builder__row:last-child { border-bottom: 0; }
.event-session-builder__row > b { align-self: center; color: var(--navy-700); font-size: 12px; }
.event-participant-picker > p,
.registration-session-counts > p { margin: 0 0 12px; color: var(--muted); font-size: 13px; line-height: 1.5; }
.event-participant-picker > div { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.event-participant-picker label { position: relative; cursor: pointer; }
.event-participant-picker input { position: absolute; opacity: 0; }
.event-participant-picker label span { display: flex; min-height: 42px; align-items: center; padding: 9px 13px; border: 1px solid var(--line); border-radius: 11px; color: var(--navy-800); font-size: 13px; font-weight: 700; }
.event-participant-picker input:checked + span { border-color: #9b6635; background: var(--sand-100); color: var(--copper-700); box-shadow: inset 3px 0 #ac713b; }

.event-picker { min-width: min(430px, 38vw); color: #fff; }
.event-picker > span { color: rgba(255,255,255,.75); }

.registration-capacity-strip {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 13px;
}

.registration-capacity-strip article {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 13px;
    padding: 15px;
}

.registration-session-index {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 12px;
    background: var(--navy-900);
    color: #fff;
    font-family: var(--font-serif);
    font-size: 18px;
    font-weight: 800;
}

.registration-capacity-strip article > div strong,
.registration-capacity-strip article > div small { display: block; }
.registration-capacity-strip article > div small { margin-top: 3px; color: var(--muted); font-size: 12px; }
.registration-capacity-strip article > div > progress { display: block; margin-top: 8px; }
.registration-capacity-strip article > b { color: var(--copper-700); font-size: 14px; }

.registration-create-card { padding: 0; overflow: hidden; }
.registration-create-card > summary { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 19px 22px; cursor: pointer; list-style: none; }
.registration-create-card > summary > span { display: flex; align-items: center; gap: 12px; }
.registration-create-card > summary > span > .icon { padding: 10px; border-radius: 11px; background: var(--sand-100); color: var(--copper-700); box-sizing: content-box; }
.registration-create-card > summary strong,
.registration-create-card > summary small { display: block; }
.registration-create-card > summary strong { color: var(--navy-900); font-family: var(--font-serif); font-size: 22px; }
.registration-create-card > summary small { margin-top: 2px; color: var(--muted); font-size: 12px; }
.registration-create-card[open] > summary > .icon { transform: rotate(90deg); }
.registration-create-card > form { display: grid; gap: 16px; padding: 0 22px 22px; border-top: 1px solid var(--line-soft); }
.registration-form-grid { padding-top: 18px; }
.registration-session-counts > div,
.registration-followup-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.registration-followup-details > div { padding: 0 13px 13px; }
.registration-form-actions { display: flex; justify-content: flex-end; }

.registration-list-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.registration-list-header h2 { margin: 4px 0 0; color: var(--navy-900); font-family: var(--font-serif); font-size: 25px; }
.registration-filter-bar { display: grid; grid-template-columns: minmax(260px, 1fr) 220px auto; gap: 10px; margin: 18px 0 12px; }
.registration-filter-bar > label { position: relative; }
.registration-filter-bar > label > span { position: absolute; z-index: 1; top: 50%; left: 14px; transform: translateY(-50%); color: var(--muted); }
.registration-filter-bar input { width: 100%; min-height: 45px; padding: 10px 15px 10px 45px; border: 1px solid var(--line); border-radius: 12px; }
.registration-filter-bar select { min-height: 45px; padding-left: var(--field-content-inset); border: 1px solid var(--line); border-radius: 12px; background-color: #fff; }

.registration-table { display: grid; }
.registration-row { display: grid; grid-template-columns: auto minmax(220px, 1.4fr) minmax(150px, .8fr) 100px 190px; align-items: center; gap: 14px; padding: 14px 4px; border-top: 1px solid var(--line-soft); }
.registration-row__avatar { display: grid; width: 40px; height: 40px; place-items: center; border-radius: 12px; background: var(--teal-100); color: var(--teal-600); font-size: 11px; font-weight: 900; }
.registration-row strong,
.registration-row small { display: block; }
.registration-row strong { color: var(--navy-900); font-size: 13px; }
.registration-row small { color: var(--muted); font-size: 11px; line-height: 1.4; }
.registration-status-form select { width: 100%; min-height: 42px; padding-left: var(--field-content-inset); border: 1px solid var(--line); border-radius: 11px; background-color: #fff; }
.registration-empty { display: grid; min-height: 160px; place-items: center; align-content: center; gap: 8px; color: var(--muted); text-align: center; }
.registration-empty .icon { width: 30px; height: 30px; color: var(--teal-600); }
.registration-empty p { margin: 0; }

.planning-toolbar { display: grid; grid-template-columns: auto 1fr auto auto; align-items: end; gap: 16px; padding: 14px 16px; }
.planning-view-switch { display: flex; gap: 5px; padding: 4px; border-radius: 12px; background: #eeebe6; }
.planning-view-switch a { display: flex; align-items: center; gap: 7px; min-height: 38px; padding: 8px 13px; border-radius: 9px; color: var(--muted); text-decoration: none; font-size: 13px; font-weight: 800; }
.planning-view-switch a.is-active { background: #fff; color: var(--navy-900); box-shadow: 0 5px 15px rgba(7,23,37,.09); }
.planning-period-nav { display: flex; align-items: center; justify-content: center; gap: 9px; }
.planning-period-nav > strong { min-width: 190px; color: var(--navy-900); font-family: var(--font-serif); font-size: 22px; text-align: center; }
.planning-period-nav > .icon-button:first-child .icon { transform: rotate(180deg); }
.planning-user-picker { min-width: 220px; }
.planning-export-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }

.planning-semester-legend { display: flex; align-items: center; gap: 8px; padding: 0 4px; overflow-x: auto; scrollbar-width: thin; }
.planning-legend-chip { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 7px; min-height: 34px; padding: 6px 10px; border: 1px solid currentColor; border-radius: 999px; background: #e7eff6; color: #1d536f; font-size: 11px; font-weight: 800; }
.planning-legend-chip i { width: 8px; height: 8px; min-height: 0; border-radius: 50%; background: currentColor; }
.planning-legend-chip b { display: grid; min-width: 22px; height: 22px; place-items: center; padding: 0 5px; border-radius: 999px; background: rgba(255,255,255,.72); color: inherit; font-size: 10px; }
.planning-semester-legend > small { display: inline-flex; flex: 1 0 210px; align-items: center; justify-content: flex-end; gap: 7px; color: var(--muted); font-size: 11px; font-weight: 700; }

.planning-semester-shell { overflow: hidden; padding: 0; background: #edf1f3; }
.planning-semester-viewport { width: 100%; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-color: var(--copper-500) #e1e6e8; scrollbar-width: thin; }
.planning-semester-track { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 56px) / 6); gap: 8px; min-width: 100%; padding: 8px; }
.planning-month-column { min-width: 0; overflow: hidden; border: 1px solid #cfd9df; border-radius: 12px; background: #fff; box-shadow: 0 5px 15px rgba(7,31,49,.06); scroll-snap-align: start; }
.planning-month-column > header { display: flex; min-height: 45px; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 12px; background: linear-gradient(135deg, #153f5b, #286b8e); color: #fff; }
.planning-month-column > header strong { overflow: hidden; font-size: 13px; font-weight: 900; letter-spacing: .045em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.planning-month-column > header span { color: rgba(255,255,255,.74); font-size: 10px; font-weight: 800; }
.planning-month-days { display: grid; grid-template-rows: repeat(31, 34px); }
.planning-month-day { display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: center; min-width: 0; border-bottom: 1px solid #e3e9ec; background: #fff; }
.planning-month-day:last-child { border-bottom: 0; }
.planning-month-day:nth-child(even) { background: #fafbfb; }
.planning-month-day.is-weekend { background: #edf1f3; }
.planning-month-day.is-padding { background: #e3e8eb; opacity: .58; }
.planning-month-day.is-today { position: relative; background: #fff6e9; box-shadow: inset 3px 0 var(--copper-500); }
.planning-month-day > button { display: grid; width: 100%; height: 100%; grid-template-columns: auto auto; place-content: center; align-items: baseline; gap: 3px; padding: 0; border: 0; border-right: 1px solid #dde5e9; background: transparent; color: #6e7e87; cursor: pointer; }
.planning-month-day > button b { color: var(--navy-900); font-size: 11px; }
.planning-month-day > button small { font-size: 8px; font-weight: 800; text-transform: uppercase; }
.planning-month-day > button span { display: none; color: var(--copper-700); }
.planning-month-day:hover > button span { display: inline-flex; }
.planning-month-day:hover > button small { display: none; }
.planning-month-day__entries { display: flex; min-width: 0; align-items: center; gap: 3px; padding: 3px 4px; overflow: hidden; }
.planning-month-day__entries .planning-entry { display: block; flex: 1 1 auto; min-width: 0; padding: 4px 6px; overflow: hidden; border-radius: 5px; font-size: 10px; font-weight: 750; line-height: 1.1; text-overflow: ellipsis; white-space: nowrap; }
.planning-month-day__entries .planning-entry strong { font: inherit; }
.planning-month-day__entries .planning-more { flex: 0 0 auto; padding: 0 2px; font-size: 9px; }

.planning-entry { display: grid; grid-template-columns: 5px 1fr auto; align-items: center; gap: 6px; min-width: 0; padding: 5px 7px; overflow: hidden; border-radius: 7px; background: #e7eff6; color: #1d536f; font-size: 10px; }
.planning-entry i { width: 5px; height: 100%; min-height: 13px; border-radius: 4px; background: currentColor; }
.planning-entry strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.planning-entry small { opacity: .76; font-size: 9px; white-space: nowrap; }
.planning-entry--vacation { background: #e4f4e9; color: #26734c; }
.planning-entry--travel { background: #eee7f7; color: #7650a4; }
.planning-entry--holiday_do { background: #eceff1; color: #5f6d75; }
.planning-entry--holiday_es { background: #f8e8e3; color: #a5533e; }
.planning-entry--conference { background: #f8ead8; color: #a46127; }
.planning-entry--personal { background: #f2e9ef; color: #8f5274; }
.planning-more { padding-left: 7px; color: var(--muted); font-size: 10px; font-weight: 800; }

.planning-agenda-list { display: grid; }
.planning-agenda-list > article { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; padding: 12px 2px; border-top: 1px solid var(--line-soft); }
.planning-agenda-type { display: grid; width: 40px; height: 40px; place-items: center; border-radius: 11px; }
.planning-agenda-list strong,
.planning-agenda-list small { display: block; }
.planning-agenda-list > article > div > strong { color: var(--navy-900); font-size: 13px; }
.planning-agenda-list > article > div > small { margin-top: 3px; color: var(--muted); font-size: 11px; }
.planning-event-lock { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 10px; background: #f0ede8; color: var(--muted); }

.planning-team-board { display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); gap: 14px; }
.planning-person-card { padding: 16px; }
.planning-person-card > header { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; padding-bottom: 12px; border-bottom: 1px solid var(--line-soft); }
.planning-person-card > header > span { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 12px; background: var(--navy-900); color: #fff; font-size: 11px; font-weight: 850; }
.planning-person-card > header strong,
.planning-person-card > header small { display: block; }
.planning-person-card > header strong { color: var(--navy-900); font-size: 14px; }
.planning-person-card > header small { margin-top: 2px; color: var(--muted); font-size: 10px; }
.planning-person-card > header a { color: var(--copper-700); }
.planning-person-card > div { display: grid; gap: 5px; padding-top: 12px; }
.planning-person-empty { padding: 18px 4px; color: var(--muted); text-align: center; }
.planning-entry-dialog { width: min(700px, calc(100vw - 30px)); }

.budget-category.is-synchronized { border-color: rgba(181, 122, 59, .45); box-shadow: inset 4px 0 #b5793d; }
.budget-event-sync-note { margin: -4px 16px 13px; padding: 10px 12px; border-radius: 10px; background: var(--sand-100); color: var(--copper-700); font-size: 12px; line-height: 1.5; }
.budget-table tr.is-synchronized { background: #fffaf2; }
.budget-table tr.is-synchronized input[readonly] { color: var(--navy-900); cursor: default; }

@media (max-width: 1250px) {
    .event-workspace { grid-template-columns: 1fr; }
    .event-financial-form { position: static; }
    .event-kpi-grid,
    .registration-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .event-year-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .registration-row { grid-template-columns: auto minmax(200px, 1fr) minmax(140px, .8fr) 80px; }
    .registration-status-form { grid-column: 2 / -1; }
    .planning-toolbar { grid-template-columns: 1fr auto; }
    .planning-period-nav { justify-content: flex-end; }
    .planning-user-picker { grid-column: 1 / -1; }
    .planning-export-actions { grid-column: 1 / -1; }
    .planning-semester-track { grid-auto-columns: calc((100% - 56px) / 6); }
}

@media (max-width: 760px) {
    .event-hero { align-items: stretch; flex-direction: column; padding: 23px; }
    .event-hero .button { width: 100%; }
    .event-picker { min-width: 0; width: 100%; }
    .event-detail-hero { align-items: stretch; flex-direction: column; }
    .event-detail-actions { justify-content: stretch; }
    .event-detail-actions .button { flex: 1 1 100%; }
    .event-kpi-grid,
    .registration-kpi-grid,
    .event-projection-grid { grid-template-columns: 1fr 1fr; }
    .event-sessions-panel,
    .event-team-panel,
    .event-projection-panel,
    .event-financial-form,
    .registration-list-panel,
    .planning-agenda-panel { padding: 17px; }
    .event-session-list > article { grid-template-columns: auto 1fr; }
    .event-session-capacity { grid-column: 1 / -1; text-align: left; }
    .event-form-grid,
    .event-create-grid,
    .registration-form-grid,
    .planning-entry-grid,
    .registration-session-counts > div,
    .registration-followup-grid { grid-template-columns: 1fr; }
    .event-session-builder__row { grid-template-columns: 1fr 1fr; }
    .event-session-builder__row > b { grid-column: 1 / -1; }
    .event-participant-picker > div { grid-template-columns: 1fr 1fr; }
    .pre-dialog__surface { padding: 18px; }
    .pre-dialog__surface > footer { align-items: stretch; flex-direction: column-reverse; }
    .pre-dialog__surface > footer .button { width: 100%; }
    .registration-list-header { align-items: stretch; flex-direction: column; }
    .registration-filter-bar { grid-template-columns: 1fr; }
    .registration-row { grid-template-columns: auto 1fr; }
    .registration-row > div:not(.registration-row__identity) { grid-column: 2; }
    .registration-status-form { grid-column: 1 / -1; }
    .planning-toolbar { grid-template-columns: 1fr; align-items: stretch; }
    .planning-view-switch { justify-content: stretch; }
    .planning-view-switch a { flex: 1; justify-content: center; }
    .planning-period-nav { justify-content: space-between; flex-wrap: wrap; }
    .planning-period-nav > strong { order: -1; width: 100%; }
    .planning-export-actions { justify-content: stretch; }
    .planning-export-actions .button { flex: 1; }
    .planning-semester-track { grid-auto-columns: calc((100% - 32px) / 2); }
    .planning-semester-legend > small { flex-basis: 100%; justify-content: flex-start; }
}

@media (max-width: 480px) {
    .event-kpi-grid,
    .registration-kpi-grid,
    .event-projection-grid,
    .event-year-summary { grid-template-columns: 1fr; }
    .event-participant-picker > div { grid-template-columns: 1fr; }
    .planning-semester-track { grid-auto-columns: calc(100% - 16px); }
}

@media print {
    .app-sidebar,
    .app-header,
    .sidebar-scrim,
    .planning-hero,
    .planning-export-actions,
    .planning-entry-dialog,
    .planning-agenda-panel { display: none !important; }
    .app-frame,
    .app-main.planning-page { display: block; width: 100%; max-width: none; margin: 0; padding: 0; }
    .planning-toolbar { border: 0; box-shadow: none; }
    .planning-semester-legend > small { display: none; }
    .planning-semester-shell,
    .planning-semester-viewport { overflow: visible; border: 0; box-shadow: none; }
    .planning-semester-track { grid-template-columns: repeat(6, minmax(0, 1fr)); grid-auto-flow: row; gap: 3px; padding: 0; }
    .planning-month-column.is-buffer { display: none; }
    .planning-month-days { grid-template-rows: repeat(31, 22px); }
    .planning-month-day { grid-template-columns: 25px minmax(0, 1fr); }
    .planning-month-day__entries .planning-entry { font-size: 7px; }
}

/* Payment plan generator — v0.9.3 */
.payment-plan-page {
    display: grid;
    width: 100%;
    max-width: 1900px;
    gap: 20px;
}

.app-main.payment-plan-page {
    width: 100%;
}

.payment-plan-hero {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    overflow: hidden;
    padding: 30px 34px;
    border: 1px solid rgba(177, 112, 54, 0.3);
    border-radius: 24px;
    background:
        radial-gradient(circle at 92% 10%, rgba(191, 125, 63, 0.25), transparent 33%),
        linear-gradient(135deg, #071d2e 0%, #0d304a 64%, #123c57 100%);
    color: #fff;
    box-shadow: 0 24px 55px rgba(7, 29, 46, 0.2);
}

.payment-plan-hero::after {
    position: absolute;
    right: -75px;
    bottom: -120px;
    width: 330px;
    height: 330px;
    border: 1px solid rgba(220, 166, 108, 0.25);
    border-radius: 50%;
    content: "";
}

.payment-plan-hero > * {
    position: relative;
    z-index: 1;
}

.payment-plan-hero .eyebrow {
    color: #d9a46d;
}

.payment-plan-hero h1 {
    margin: 5px 0 4px;
    font-family: var(--font-serif);
    font-size: clamp(32px, 3vw, 48px);
    font-weight: 700;
    letter-spacing: -0.035em;
}

.payment-plan-hero p {
    max-width: 720px;
    margin: 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 15px;
    line-height: 1.65;
}

.payment-plan-toolbar {
    display: flex;
    flex: 0 0 auto;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

.payment-plan-toolbar .button {
    min-height: 46px;
    white-space: nowrap;
}

.payment-plan-toolbar .button--secondary {
    border-color: rgba(255, 255, 255, 0.28);
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
}

.payment-plan-toolbar .button--secondary:hover {
    background: rgba(255, 255, 255, 0.15);
}

.payment-plan-workspace {
    display: grid;
    grid-template-columns: minmax(430px, 0.68fr) minmax(700px, 1.5fr);
    align-items: start;
    gap: 20px;
}

.payment-plan-editor {
    display: grid;
    gap: 0;
    overflow: hidden;
    padding: 0;
}

.payment-plan-form-section {
    display: grid;
    gap: 12px;
    padding: 19px 21px;
    border-bottom: 1px solid var(--line);
}

.payment-plan-form-section:last-child {
    border-bottom: 0;
}

.payment-plan-form-section > header {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.payment-plan-form-section > header h2 {
    margin: 0;
    color: var(--navy-900);
    font-family: var(--font-serif);
    font-size: 21px;
    line-height: 1.25;
}

.payment-plan-form-section > header small {
    display: block;
    margin-top: 3px;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.35;
}

.payment-plan-form-step {
    display: grid;
    flex: 0 0 30px;
    width: 30px;
    height: 30px;
    place-items: center;
    border-radius: 9px;
    background: var(--navy-900);
    color: #fff;
    font-size: 13px;
    font-weight: 850;
}

.payment-plan-form-section .field {
    margin: 0;
}

.payment-plan-form-section .field > span {
    font-size: 14px;
}

.payment-plan-form-section .field > small {
    margin-top: 6px;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.45;
}

.payment-plan-form-section input,
.payment-plan-form-section select {
    width: 100%;
    min-width: 0;
    min-height: 44px;
    font-size: 14px;
}

.payment-plan-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.payment-plan-form-grid--people,
.payment-plan-form-grid--schedule {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.payment-plan-form-grid > .field {
    min-width: 0;
}

.payment-plan-client-other {
    margin-top: 8px;
}

.payment-plan-advisor-collaborator {
    margin-top: 8px;
}

.payment-plan-unit-card {
    display: grid;
    grid-template-columns: 1fr;
    align-items: center;
    gap: 14px;
    min-height: 64px;
    padding: 12px 14px;
    border: 1px solid rgba(39, 97, 133, 0.16);
    border-radius: 14px;
    background: #f2f7fa;
}

.payment-plan-unit-card:empty {
    display: none;
}

.payment-plan-unit-card__code {
    display: grid;
    min-width: 56px;
    min-height: 42px;
    padding: 5px 8px;
    place-items: center;
    border-radius: 10px;
    background: var(--navy-900);
    color: #fff;
    font-size: 11px;
    font-weight: 850;
    text-align: center;
}

.payment-plan-unit-card__identity,
.payment-plan-unit-card__commercial {
    display: flex;
    align-items: center;
}

.payment-plan-unit-card__identity {
    min-width: 0;
    gap: 12px;
}

.payment-plan-unit-card__commercial {
    justify-content: space-between;
    width: 100%;
    padding-top: 10px;
    border-top: 1px solid rgba(39, 97, 133, 0.13);
    gap: 10px;
}

.payment-plan-unit-card__details {
    display: grid;
    min-width: 0;
    gap: 2px;
}

.payment-plan-unit-card strong,
.payment-plan-unit-card small {
    display: block;
}

.payment-plan-unit-card strong {
    color: var(--navy-900);
    font-size: 14px;
    line-height: 1.25;
}

.payment-plan-unit-card small {
    margin-top: 0;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.payment-plan-unit-card em {
    padding: 5px 8px;
    border-radius: 999px;
    background: var(--success-soft);
    color: var(--success);
    font-size: 11px;
    font-style: normal;
    font-weight: 800;
}

.payment-plan-unit-card em.is-reserved {
    background: #fff1e6;
    color: #a75225;
}

.payment-plan-unit-card__price {
    display: grid;
    gap: 2px;
    text-align: right;
}

.payment-plan-unit-card__price small {
    margin: 0;
    color: var(--muted);
    font-size: 10px;
    font-weight: 750;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.payment-plan-unit-card__price strong {
    color: var(--copper-700);
    font-size: 14px;
    white-space: nowrap;
}

.payment-plan-money-input,
.payment-plan-suffix-input {
    display: grid;
    overflow: hidden;
    align-items: stretch;
    border: 1px solid #d7d3cd;
    border-radius: 12px;
    background: #fff;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.payment-plan-money-input {
    grid-template-columns: auto 1fr;
}

.payment-plan-suffix-input {
    grid-template-columns: 1fr auto;
}

.payment-plan-money-input:focus-within,
.payment-plan-suffix-input:focus-within {
    border-color: #30749b;
    box-shadow: 0 0 0 3px rgba(48, 116, 155, 0.12);
}

.payment-plan-money-input b,
.payment-plan-suffix-input b {
    display: grid;
    min-width: 50px;
    place-items: center;
    background: #f2f4f5;
    color: var(--navy-700);
    font-size: 13px;
}

.payment-plan-money-input b {
    border-right: 1px solid #d7d3cd;
}

.payment-plan-suffix-input b {
    min-width: 42px;
    border-left: 1px solid #d7d3cd;
}

.payment-plan-money-input input,
.payment-plan-suffix-input input {
    width: 100%;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.payment-plan-percent-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.payment-plan-percent-grid .field {
    grid-template-rows: minmax(2.5em, auto) 48px;
    align-content: start;
}

.payment-plan-percent-grid .field > span {
    display: flex;
    align-items: flex-end;
    line-height: 1.25;
}

.payment-plan-percent-grid .payment-plan-suffix-input {
    width: 100%;
    min-width: 0;
    min-height: 48px;
}

.payment-plan-validation,
.payment-plan-computed {
    padding: 11px 13px;
    border: 1px solid rgba(35, 114, 87, 0.2);
    border-radius: 11px;
    background: var(--success-soft);
    color: var(--success);
    font-size: 13px;
    font-weight: 750;
    line-height: 1.45;
}

.payment-plan-validation.is-invalid,
.payment-plan-computed.is-warning {
    border-color: rgba(184, 75, 47, 0.2);
    background: #fff0ed;
    color: #a54029;
}

.payment-plan-computed {
    border-color: rgba(39, 97, 133, 0.18);
    background: #edf5fa;
    color: var(--navy-700);
}

.payment-plan-preview-shell {
    min-width: 0;
    overflow: auto;
    padding: 18px;
    border: 1px solid #d8dee2;
    border-radius: 20px;
    background: #e9eef1;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.payment-plan-preview-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    width: min(100%, 794px);
    margin: 0 auto 14px;
    color: var(--navy-700);
}

.payment-plan-preview-label > div,
.payment-plan-preview-label > div > span {
    display: flex;
    align-items: center;
    gap: 9px;
}

.payment-plan-preview-label > div > span {
    display: grid;
    gap: 1px;
}

.payment-plan-preview-label strong,
.payment-plan-preview-label small {
    display: block;
}

.payment-plan-preview-label strong {
    font-size: 13px;
}

.payment-plan-preview-label small {
    color: var(--muted);
    font-size: 12px;
}

.payment-plan-preview-label > span {
    padding: 5px 9px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.7);
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.06em;
}

.payment-plan-document {
    position: relative;
    width: min(100%, 794px);
    min-height: 1123px;
    overflow: hidden;
    margin: 0 auto;
    background: #fff;
    color: #13283a;
    box-shadow: 0 22px 55px rgba(8, 30, 46, 0.14);
}

.payment-plan-document.is-exporting {
    width: 740px !important;
    min-height: 0 !important;
    max-width: none !important;
    overflow: hidden !important;
    margin: 0 !important;
    box-shadow: none;
}

.payment-document__accent {
    height: 8px;
    background: linear-gradient(90deg, #9d4f20, #de8844 50%, #9d4f20);
}

.payment-document__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 30px;
    padding: 38px 42px 28px;
    background:
        radial-gradient(circle at 8% 15%, rgba(200, 144, 85, 0.16), transparent 27%),
        linear-gradient(140deg, #071d2e, #0d3049 72%, #133e58);
    color: #fff;
}

.payment-document__brand {
    display: flex;
    align-items: center;
    gap: 12px;
}

.payment-document__brand img {
    display: block;
    width: 102px;
    height: auto !important;
    max-height: none;
}

.payment-document__brand > span {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border: 1px solid rgba(218, 166, 111, 0.75);
    border-radius: 50%;
    color: #e2b681;
    font-family: var(--font-serif);
    font-size: 16px;
    font-weight: 800;
}

.payment-document__brand strong,
.payment-document__brand small {
    display: block;
}

.payment-document__brand strong {
    font-family: var(--font-serif);
    font-size: 21px;
    letter-spacing: 0.12em;
}

.payment-document__brand small {
    margin-top: 2px;
    color: #d5a36f;
    font-size: 9px;
    font-weight: 750;
    letter-spacing: 0.36em;
}

.payment-document__title {
    text-align: right;
}

.payment-document__title small {
    display: block;
    color: rgba(255, 255, 255, 0.64);
    font-size: 9px;
    font-weight: 750;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.payment-document__title h2 {
    margin: 6px 0 4px;
    color: #fff;
    font-family: var(--font-serif);
    font-size: 30px;
    letter-spacing: -0.025em;
}

.payment-document__title span {
    color: #d9a56e;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.08em;
}

.payment-document__project {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 24px 42px 19px;
    border-bottom: 1px solid #e2e6e8;
}

.payment-document__project small,
.payment-document__project strong,
.payment-document__project span {
    display: block;
}

.payment-document__project small,
.payment-document__meta small,
.payment-document__summary small {
    color: #6c7780;
    font-size: 10px;
    font-weight: 750;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.payment-document__project strong {
    margin: 3px 0 2px;
    color: #0a2a42;
    font-family: var(--font-serif);
    font-size: 22px;
}

.payment-document__project span {
    color: #68747d;
    font-size: 11px;
}

.payment-document__project em {
    padding: 9px 13px;
    border: 1px solid rgba(162, 99, 44, 0.28);
    border-radius: 9px;
    background: #fbf4ed;
    color: #8c5429;
    font-size: 11px;
    font-style: normal;
    font-weight: 850;
}

.payment-document__meta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 26px;
    padding: 0 42px;
}

.payment-document__meta > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    min-height: 47px;
    border-bottom: 1px solid #e3e6e8;
}

.payment-document__meta strong {
    overflow: hidden;
    color: #172d3e;
    font-size: 12px;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.payment-document__currency {
    margin: 22px 42px 17px;
    padding: 10px 14px;
    border-radius: 7px;
    background: linear-gradient(90deg, #a55727, #d48242);
    color: #fff;
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.1em;
    text-align: center;
    text-transform: uppercase;
}

.payment-document__summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 26px;
    padding: 0 42px 18px;
}

.payment-document__summary article {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    min-height: 38px;
    border-bottom: 1px solid #e1e5e7;
}

.payment-document__summary article.is-price strong {
    color: #a36532;
    font-size: 17px;
}

.payment-document__summary strong {
    color: #102d43;
    font-size: 12px;
    text-align: right;
    white-space: nowrap;
}

.payment-document__schedule {
    padding: 0 42px 26px;
}

.payment-document__schedule table {
    width: 100%;
    border-collapse: collapse;
    font-size: 11px;
}

.payment-document__schedule-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
}

.payment-document__schedule-grid.is-split {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.payment-document__schedule-grid.is-split table {
    table-layout: fixed;
    font-size: 9px;
}

.payment-document__schedule-grid.is-split th,
.payment-document__schedule-grid.is-split td {
    padding-right: 7px;
    padding-left: 7px;
}

.payment-document__schedule-grid.is-split th:first-child,
.payment-document__schedule-grid.is-split td:first-child {
    width: 35%;
}

.payment-document__schedule-grid.is-split th:nth-child(2),
.payment-document__schedule-grid.is-split td:nth-child(2) {
    width: 37%;
}

.payment-document__schedule-total {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 10px 13px;
    border-top: 2px solid #0a2b43;
    color: #0a2b43;
    font-size: 12px;
    font-weight: 900;
}

.payment-document__schedule th {
    padding: 11px 13px;
    background: #0a2b43;
    color: #fff;
    font-size: 10px;
    letter-spacing: 0.08em;
    text-align: left;
    text-transform: uppercase;
}

.payment-document__schedule th:nth-child(n+2),
.payment-document__schedule td:nth-child(n+2) {
    text-align: right;
}

.payment-document__schedule td {
    padding: 8px 13px;
    border-bottom: 1px solid #e2e5e7;
    color: #354754;
}

.payment-document__schedule tr.is-key td:first-child {
    color: #1f678e;
    font-weight: 850;
}

.payment-document__schedule tr.is-delivery td {
    border-top: 1px solid #c58a55;
    background: #fcf5ee;
    color: #8f562a;
    font-weight: 850;
}

.payment-document__schedule tfoot td {
    border-top: 2px solid #0a2b43;
    border-bottom: 0;
    color: #0a2b43;
    font-size: 11px;
    font-weight: 900;
}

.payment-document__footer {
    margin: 0 42px;
    padding: 19px 0 30px;
    border-top: 1px solid #d9dfe2;
}

.payment-document__footer > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.payment-document__footer strong {
    color: #0b2d45;
    font-family: var(--font-serif);
    font-size: 11px;
    letter-spacing: 0.08em;
}

.payment-document__footer span,
.payment-document__footer p {
    color: #6c7880;
    font-size: 9px;
}

.payment-document__footer p {
    margin: 8px 0 0;
    line-height: 1.55;
}

.payment-plan-document__empty {
    display: grid;
    min-height: 1123px;
    padding: 40px;
    place-items: center;
    color: var(--muted);
    font-family: var(--font-serif);
    font-size: 24px;
    text-align: center;
}

@media (min-width: 1850px) {
    .payment-plan-workspace {
        grid-template-columns: minmax(420px, 0.7fr) minmax(820px, 1.65fr);
    }
}

@media (max-width: 1500px) {
    .payment-plan-workspace {
        grid-template-columns: 1fr;
    }

    .payment-plan-editor {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .payment-plan-form-section:last-child:nth-child(odd) {
        grid-column: 1 / -1;
    }

    .payment-plan-form-section {
        border-right: 1px solid var(--line);
    }
}

@media (max-width: 820px) {
    .payment-plan-hero {
        align-items: flex-start;
        flex-direction: column;
        padding: 25px 23px;
    }

    .payment-plan-toolbar {
        justify-content: flex-start;
        width: 100%;
    }

    .payment-plan-editor {
        grid-template-columns: 1fr;
    }

    .payment-plan-form-section:last-child:nth-child(odd) {
        grid-column: auto;
    }

    .payment-plan-form-section {
        border-right: 0;
    }

    .payment-plan-preview-shell {
        padding: 12px;
    }

    .payment-plan-document {
        min-height: 0;
    }

    .payment-document__header,
    .payment-document__project {
        padding-right: 25px;
        padding-left: 25px;
    }

    .payment-document__meta,
    .payment-document__summary,
    .payment-document__schedule {
        padding-right: 25px;
        padding-left: 25px;
    }

    .payment-document__currency {
        margin-right: 25px;
        margin-left: 25px;
    }

    .payment-document__footer {
        margin-right: 25px;
        margin-left: 25px;
    }
}

@media (max-width: 580px) {
    .payment-plan-toolbar .button {
        flex: 1 1 140px;
    }

    .payment-plan-form-section {
        padding: 21px 18px;
    }

    .payment-plan-form-grid,
    .payment-plan-percent-grid,
    .payment-document__meta,
    .payment-document__summary {
        grid-template-columns: 1fr;
    }

    .payment-plan-unit-card {
        grid-template-columns: 1fr;
    }

    .payment-plan-unit-card__commercial {
        justify-content: space-between;
        width: 100%;
    }

    .payment-plan-unit-card em {
        justify-self: end;
    }

    .payment-document__header {
        align-items: flex-start;
        flex-direction: column;
    }

    .payment-document__title {
        text-align: left;
    }

    .payment-document__project em {
        display: none;
    }

    .payment-document__footer > div {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
    }

    .payment-plan-document.is-exporting .payment-document__header {
        align-items: flex-start;
        flex-direction: row;
        padding-right: 42px;
        padding-left: 42px;
    }

    .payment-plan-document.is-exporting .payment-document__title {
        text-align: right;
    }

    .payment-plan-document.is-exporting .payment-document__project {
        padding-right: 42px;
        padding-left: 42px;
    }

    .payment-plan-document.is-exporting .payment-document__project em {
        display: block;
    }

    .payment-plan-document.is-exporting .payment-document__meta,
    .payment-plan-document.is-exporting .payment-document__summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        padding-right: 42px;
        padding-left: 42px;
    }

    .payment-plan-document.is-exporting .payment-document__schedule {
        padding-right: 42px;
        padding-left: 42px;
    }

    .payment-plan-document.is-exporting .payment-document__currency {
        margin-right: 42px;
        margin-left: 42px;
    }

    .payment-plan-document.is-exporting .payment-document__footer {
        margin-right: 42px;
        margin-left: 42px;
    }

    .payment-plan-document.is-exporting .payment-document__footer > div {
        align-items: center;
        flex-direction: row;
        gap: 20px;
    }
}

/* The export layout is an A4 composition, independent from the viewport. */
.payment-plan-document.is-exporting .payment-document__accent {
    height: 6px;
}

.payment-plan-document.is-exporting .payment-document__header {
    align-items: center;
    flex-direction: row;
    padding: 19px 26px 14px;
}

.payment-plan-document.is-exporting .payment-document__brand img {
    width: 96px;
    height: auto !important;
}

.payment-plan-document.is-exporting .payment-document__title {
    text-align: right;
}

.payment-plan-document.is-exporting .payment-document__title h2 {
    margin: 4px 0 2px;
    font-size: 27px;
}

.payment-plan-document.is-exporting .payment-document__project {
    padding: 13px 26px 11px;
}

.payment-plan-document.is-exporting .payment-document__project strong {
    font-size: 20px;
}

.payment-plan-document.is-exporting .payment-document__project em {
    display: block;
    padding: 7px 10px;
}

.payment-plan-document.is-exporting .payment-document__meta {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 18px;
    padding: 0 26px;
}

.payment-plan-document.is-exporting .payment-document__meta > div {
    min-height: 34px;
}

.payment-plan-document.is-exporting .payment-document__currency {
    margin: 10px 26px 8px;
    padding: 6px 11px;
}

.payment-plan-document.is-exporting .payment-document__summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 18px;
    padding: 0 26px 8px;
}

.payment-plan-document.is-exporting .payment-document__summary article {
    min-height: 28px;
}

.payment-plan-document.is-exporting .payment-document__schedule {
    padding: 0 26px 10px;
}

.payment-plan-document.is-exporting .payment-document__schedule-grid {
    gap: 10px;
}

.payment-plan-document.is-exporting .payment-document__schedule th {
    padding: 7px 8px;
}

.payment-plan-document.is-exporting .payment-document__schedule td {
    padding: 6px 8px;
}

.payment-plan-document.is-exporting .payment-document__schedule-grid.is-split th,
.payment-plan-document.is-exporting .payment-document__schedule-grid.is-split td {
    padding: 5px 6px;
}

.payment-plan-document.is-exporting .payment-document__schedule-total {
    padding: 7px 8px;
}

.payment-plan-document.is-exporting .payment-document__footer {
    margin: 0 26px;
    padding: 9px 0 12px;
}

.payment-plan-document.is-exporting .payment-document__footer > div {
    align-items: center;
    flex-direction: row;
    gap: 20px;
}

.payment-plan-document.is-exporting .payment-document__footer p {
    margin-top: 4px;
    line-height: 1.35;
}

.payment-plan-document.is-exporting--dense .payment-document__header {
    padding-top: 13px;
    padding-bottom: 9px;
}

.payment-plan-document.is-exporting--dense .payment-document__brand img {
    width: 84px;
    height: auto !important;
}

.payment-plan-document.is-exporting--dense .payment-document__project {
    padding-top: 9px;
    padding-bottom: 8px;
}

.payment-plan-document.is-exporting--dense .payment-document__meta > div {
    min-height: 29px;
}

.payment-plan-document.is-exporting--dense .payment-document__currency {
    margin-top: 7px;
    margin-bottom: 6px;
    padding-top: 4px;
    padding-bottom: 4px;
}

.payment-plan-document.is-exporting--dense .payment-document__summary article {
    min-height: 24px;
}

.payment-plan-document.is-exporting--dense .payment-document__schedule th,
.payment-plan-document.is-exporting--dense .payment-document__schedule td {
    padding-top: 3px;
    padding-bottom: 3px;
}

.payment-plan-document.is-exporting--dense .payment-document__footer {
    padding-top: 6px;
    padding-bottom: 8px;
}

@media print {
    @page {
        size: A4 portrait;
        margin: 5mm;
    }

    .payment-plan-page {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
    }

    .payment-plan-hero,
    .payment-plan-editor,
    .payment-plan-preview-label {
        display: none !important;
    }

    .payment-plan-workspace,
    .payment-plan-preview-shell {
        display: block !important;
        padding: 0 !important;
        border: 0 !important;
        background: #fff !important;
        box-shadow: none !important;
    }

    .payment-plan-document {
        width: 740px !important;
        min-height: 0 !important;
        overflow: hidden !important;
        box-shadow: none !important;
    }

    .payment-document__schedule thead {
        display: table-header-group;
    }

    .payment-document__schedule tr,
    .payment-document__summary article,
    .payment-document__footer {
        break-inside: avoid;
        page-break-inside: avoid;
    }
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    min-width: 320px;
    background: var(--paper);
    color: var(--navy-700);
    font-family: var(--font-sans);
    line-height: 1.5;
    text-rendering: optimizeLegibility;
}

body {
    min-width: 320px;
    min-height: 100vh;
    margin: 0;
    background:
        radial-gradient(circle at 90% 0, rgba(185, 120, 56, 0.055), transparent 30%),
        var(--paper);
}

button,
input,
select,
textarea {
    color: inherit;
    font: inherit;
}

button,
a,
input,
select,
textarea {
    -webkit-tap-highlight-color: transparent;
}

a {
    color: inherit;
    text-decoration: none;
}

button {
    border: 0;
}

button,
a,
input,
select,
textarea {
    outline-offset: 3px;
}

/*
 * Global form ergonomics rule: typed values and placeholders must never touch
 * a control edge. Compact native controls and visually hidden inputs are
 * deliberately excluded; specialised controls may increase this inset.
 */
:where(
    input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="hidden"]),
    select,
    textarea
) {
    padding-left: var(--field-content-inset);
    padding-right: var(--field-content-inset);
}

:focus-visible {
    outline: 3px solid rgba(49, 95, 131, 0.35);
}

.icon {
    display: inline-block;
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    vertical-align: middle;
}

.icon--small {
    width: 16px;
    height: 16px;
}

.icon--tiny {
    width: 13px;
    height: 13px;
}

.icon--gold {
    color: var(--sand-500);
}

.brand {
    display: inline-flex;
    align-items: center;
    padding-left: 13px;
    border-left: 2px solid var(--copper-500);
    color: #fff;
}

.brand__copy {
    display: grid;
    min-width: 0;
    line-height: 1.15;
}

.brand__copy strong {
    font-family: var(--font-serif);
    font-size: 22px;
    font-weight: 700;
    letter-spacing: 0.045em;
}

.brand__copy small {
    margin-top: 4px;
    color: rgba(255, 255, 255, 0.58);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.1em;
    line-height: 1.35;
    text-transform: uppercase;
}

.brand__version {
    justify-self: start;
    margin: 7px 0 3px;
    color: var(--sand-200);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.4;
}

.brand--dark {
    color: var(--navy-800);
}

.brand--dark .brand__copy small {
    color: var(--muted);
}

.language-switcher {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 4px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: rgba(255, 253, 250, 0.94);
    box-shadow: 0 3px 14px rgba(7, 23, 37, 0.045);
}

.language-switcher > .icon {
    margin: 0 5px;
    color: var(--muted);
}

.language-switcher__link {
    padding: 5px 9px;
    border-radius: 8px;
    color: var(--muted);
    font-size: 13px;
    font-weight: 800;
    transition: 150ms ease;
}

.language-switcher__link:hover {
    background: #f0f3f1;
    color: var(--navy-700);
}

.language-switcher__link.is-active {
    background: var(--teal-600);
    color: #fff;
    box-shadow: 0 4px 12px rgba(49, 95, 131, 0.22);
}

.language-switcher--inverted {
    border-color: rgba(255, 255, 255, 0.16);
    background: rgba(255, 255, 255, 0.08);
    box-shadow: none;
}

.language-switcher--inverted > .icon,
.language-switcher--inverted .language-switcher__link {
    color: rgba(255, 255, 255, 0.68);
}

.language-switcher--inverted .language-switcher__link:hover {
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
}

.language-switcher--inverted .language-switcher__link.is-active {
    background: #fff;
    color: var(--navy-800);
}

.button {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 10px 18px;
    border-radius: 12px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 750;
    transition: 150ms ease;
}

.button--primary {
    border: 1px solid rgba(223, 193, 138, 0.18);
    background: linear-gradient(135deg, var(--teal-600), var(--navy-800));
    color: #fff;
    box-shadow: 0 12px 28px rgba(17, 45, 69, 0.2);
}

.button--primary:hover {
    background: linear-gradient(135deg, var(--teal-700), var(--navy-900));
    box-shadow: 0 15px 32px rgba(17, 45, 69, 0.25);
    transform: translateY(-1px);
}

.button--primary:disabled {
    cursor: wait;
    opacity: 0.72;
    transform: none;
}

.button--secondary {
    border: 1px solid var(--line);
    background: var(--surface);
    color: var(--navy-700);
}

.button--secondary:hover {
    border-color: #cdbda9;
    background: var(--sand-100);
}

.button--full {
    width: 100%;
}

.icon-button {
    display: inline-grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 11px;
    background: var(--surface);
    color: var(--muted);
    cursor: pointer;
    transition: 150ms ease;
}

.icon-button:hover {
    background: #f0f3f1;
    color: var(--navy-700);
}

.badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    width: fit-content;
    padding: 5px 9px;
    border-radius: 999px;
    font-size: 13px;
    font-style: normal;
    font-weight: 750;
}

.badge--glass {
    border: 1px solid rgba(223, 193, 138, 0.27);
    background: rgba(255, 255, 255, 0.075);
    color: #fff;
}

.badge--soft {
    background: var(--teal-100);
    color: var(--teal-700);
}

.badge--release {
    background: var(--teal-600);
    color: #fff;
}

.eyebrow {
    display: block;
    color: var(--copper-700);
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.17em;
    text-transform: uppercase;
}

.alert {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 18px 0;
    padding: 13px 14px;
    border: 1px solid var(--line);
    border-radius: 12px;
    font-size: 13px;
    line-height: 1.45;
}

.alert--error {
    border-color: #efcbd0;
    background: var(--danger-soft);
    color: var(--danger);
}

.alert--success {
    border-color: #bee3d3;
    background: var(--success-soft);
    color: var(--success);
}

.alert--info {
    border-color: #d1dfdc;
    background: #eef6f3;
    color: var(--teal-700);
}

.field {
    display: grid;
    gap: 7px;
    min-width: 0;
    color: var(--navy-700);
    font-size: 13px;
    font-weight: 700;
}

.field input,
.field select,
.field textarea {
    width: 100%;
    height: 47px;
    padding: 0 13px;
    border: 1px solid #d4cec6;
    border-radius: 11px;
    background: var(--surface);
    box-shadow: 0 3px 12px rgba(7, 23, 37, 0.03);
    font-weight: 450;
}

.field textarea {
    min-height: 96px;
    padding: 12px 13px;
    resize: vertical;
    line-height: 1.6;
}

.field input:focus,
.field select:focus,
.field textarea:focus {
    border-color: var(--teal-600);
    box-shadow: 0 0 0 3px rgba(90, 134, 176, 0.15);
    outline: 0;
}

.field > small {
    color: var(--muted);
    font-size: 13px;
    font-weight: 450;
    line-height: 1.45;
}

.field .field__error {
    color: var(--danger);
    font-weight: 650;
}

.form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 17px;
}

.form-grid--database {
    grid-template-columns: minmax(0, 1fr) 110px;
}

.field--wide {
    grid-column: 1 / -1;
}

/* Installer */
.installer-shell {
    min-height: 100vh;
    padding: 28px;
    background:
        radial-gradient(circle at 85% 0, rgba(185, 120, 56, 0.18), transparent 31%),
        linear-gradient(140deg, #faf7f2, var(--paper));
}

.installer-topbar {
    display: flex;
    max-width: 900px;
    align-items: center;
    justify-content: space-between;
    margin: 0 auto 28px;
}

.installer-card {
    width: min(100%, 900px);
    margin: 0 auto;
    padding: 34px;
    border: 1px solid rgba(214, 203, 189, 0.95);
    border-radius: 24px;
    background: rgba(255, 253, 250, 0.96);
    box-shadow: var(--shadow);
}

.installer-card__intro h1 {
    margin: 10px 0 8px;
    color: var(--navy-800);
    font-family: var(--font-serif);
    font-size: clamp(32px, 5vw, 44px);
    line-height: 1.05;
}

.installer-card__intro p {
    max-width: 680px;
    margin: 0;
    color: var(--muted);
    font-size: 14px;
}

.installer-form {
    display: grid;
    gap: 27px;
    margin-top: 28px;
}

.installer-form fieldset {
    min-width: 0;
    margin: 0;
    padding: 22px;
    border: 1px solid var(--line);
    border-radius: 17px;
    background: #fcfaf7;
}

.installer-form legend {
    padding: 0 8px;
    color: var(--navy-800);
    font-family: var(--font-serif);
    font-size: 20px;
    font-weight: 700;
}

/* Login */
.login-shell {
    position: relative;
    display: flex;
    min-height: 100vh;
    background: var(--navy-950);
}

.login-language {
    position: absolute;
    z-index: 10;
    top: 28px;
    right: 30px;
}

.login-brand-panel {
    position: relative;
    display: flex;
    width: 48%;
    min-height: 100vh;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
    padding: 48px 56px;
    background:
        radial-gradient(circle at 83% 18%, rgba(90, 134, 176, 0.2), transparent 28%),
        radial-gradient(circle at 12% 92%, rgba(185, 120, 56, 0.17), transparent 30%),
        linear-gradient(145deg, var(--navy-950), var(--navy-900) 56%, #102b43);
    color: #fff;
}

.brand-orbit {
    position: absolute;
    border: 1px solid rgba(90, 134, 176, 0.16);
    border-radius: 50%;
}

.brand-orbit::after {
    position: absolute;
    inset: 13%;
    border: 1px solid rgba(223, 193, 138, 0.18);
    border-radius: inherit;
    content: "";
}

.brand-orbit--one {
    top: 4%;
    right: -340px;
    width: 650px;
    height: 650px;
}

.brand-orbit--two {
    bottom: -180px;
    left: -270px;
    width: 440px;
    height: 440px;
}

.login-brand-panel__content {
    position: relative;
    z-index: 1;
    width: min(100%, 580px);
    padding-bottom: 30px;
}

.login-brand-panel__content h1 {
    max-width: 560px;
    margin: 24px 0 20px;
    font-family: var(--font-serif);
    font-size: clamp(46px, 5vw, 66px);
    font-weight: 700;
    letter-spacing: -0.035em;
    line-height: 1.02;
}

.login-brand-panel__content > p {
    max-width: 520px;
    margin: 0;
    color: rgba(255, 255, 255, 0.7);
    font-size: 15px;
    line-height: 1.75;
}

.login-feature-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    max-width: 530px;
    margin-top: 34px;
}

.login-feature-grid article {
    display: grid;
    min-height: 145px;
    grid-template-rows: auto auto 1fr;
    gap: 9px;
    padding: 17px;
    border: 1px solid rgba(223, 193, 138, 0.16);
    border-radius: 17px;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.075), rgba(90, 134, 176, 0.035));
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.04);
}

.login-feature-grid article .icon {
    margin-bottom: 10px;
}

.login-feature-grid article strong {
    font-size: 13px;
}

.login-feature-grid article span {
    color: rgba(255, 255, 255, 0.54);
    font-size: 13px;
    line-height: 1.55;
}

.login-copyright {
    position: relative;
    z-index: 1;
    color: rgba(255, 255, 255, 0.38);
    font-size: 13px;
}

.login-form-panel {
    display: grid;
    width: 52%;
    min-height: 100vh;
    place-items: center;
    padding: 90px 48px 60px;
    background:
        radial-gradient(circle at 100% 0, rgba(185, 120, 56, 0.09), transparent 28%),
        linear-gradient(150deg, #fbf9f6, var(--paper));
}

.login-form-card {
    width: min(100%, 430px);
}

.login-form-card h2 {
    margin: 10px 0 26px;
    color: var(--navy-800);
    font-family: var(--font-serif);
    font-size: 41px;
    letter-spacing: -0.025em;
    line-height: 1.06;
}

.login-mobile-brand,
.login-mobile-intro,
.login-public-note {
    display: none;
}

.login-form {
    display: grid;
    gap: 19px;
}

.input-with-icon {
    position: relative;
    display: block;
}

.input-with-icon > .icon {
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 14px;
    width: 17px;
    height: 17px;
    color: #839095;
    transform: translateY(-50%);
}

.field .input-with-icon input {
    padding-left: 43px;
}

.login-options {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    color: var(--muted);
    font-size: 12px;
}

.checkbox {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.checkbox input {
    width: 16px;
    height: 16px;
    accent-color: var(--teal-600);
}

.tooltip {
    display: grid;
    width: 23px;
    height: 23px;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 50%;
    cursor: help;
    font-weight: 800;
}

/* Application shell */
.app-sidebar {
    position: fixed;
    z-index: 50;
    inset: 0 auto 0 0;
    display: flex;
    width: 254px;
    flex-direction: column;
    overflow-y: auto;
    padding: 20px;
    border-right: 1px solid rgba(223, 193, 138, 0.12);
    background:
        radial-gradient(circle at 10% 95%, rgba(185, 120, 56, 0.14), transparent 28%),
        linear-gradient(165deg, var(--navy-950), var(--navy-900) 58%, #102b43);
    color: #fff;
    transition: transform 180ms ease;
}

.app-sidebar__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.app-sidebar__close {
    display: none;
    border-color: rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.7);
}

.app-nav {
    display: grid;
    gap: 6px;
    margin-top: 38px;
}

.app-nav-section {
    min-width: 0;
    margin-top: 8px;
    padding-top: 14px;
    border-top: 1px solid rgba(223, 193, 138, 0.18);
}

.app-nav-section__title {
    margin: 0 11px 8px;
    color: var(--champagne);
    font-size: 10px;
    font-weight: 750;
    line-height: 1.5;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.app-nav-section__items {
    display: grid;
    min-width: 0;
    gap: 4px;
}

.app-nav-group {
    min-width: 0;
}

.app-nav-group > summary {
    list-style: none;
}

.app-nav-group > summary::-webkit-details-marker {
    display: none;
}

.app-nav__trigger {
    width: 100%;
    cursor: pointer;
    user-select: none;
}

.app-nav__trigger:hover {
    background: rgba(255, 255, 255, 0.07);
    color: #fff;
}

.app-nav__group-chevron {
    transition: transform 160ms ease;
}

.app-nav-group[open] .app-nav__group-chevron {
    transform: rotate(90deg);
}

.app-nav__submenu {
    display: grid;
    gap: 4px;
    margin: 7px 0 9px 20px;
    padding: 4px 0 4px 12px;
    border-left: 1px solid rgba(223, 193, 138, 0.2);
}

.app-nav__subitem {
    display: grid;
    min-height: 36px;
    grid-template-columns: 16px minmax(0, 1fr);
    align-items: center;
    gap: 9px;
    padding: 7px 9px;
    border-radius: 8px;
    color: rgba(255, 255, 255, 0.52);
    font-size: 12px;
    font-weight: 650;
    line-height: 1.35;
    transition: 150ms ease;
}

.app-nav__subitem:hover {
    background: rgba(255, 255, 255, 0.065);
    color: rgba(255, 255, 255, 0.9);
}

.app-nav__subitem.is-active {
    background: rgba(90, 134, 176, 0.16);
    color: #fff;
}

.app-nav__subdot {
    width: 5px;
    height: 5px;
    margin-left: 3px;
    border-radius: 50%;
    background: currentColor;
    opacity: 0.7;
}

.app-nav__subitem--utility {
    color: rgba(255, 255, 255, 0.68);
}

.app-nav__subitem--create {
    color: var(--champagne);
}

.app-nav__item {
    display: grid;
    min-height: 43px;
    grid-template-columns: 21px minmax(0, 1fr) auto;
    align-items: center;
    gap: 11px;
    padding: 9px 11px;
    border-radius: 11px;
    color: rgba(255, 255, 255, 0.7);
    font-size: 13px;
    font-weight: 650;
}

a.app-nav__item:hover {
    background: rgba(255, 255, 255, 0.07);
    color: #fff;
}

.app-nav__item.is-active {
    background: linear-gradient(90deg, rgba(90, 134, 176, 0.2), rgba(255, 255, 255, 0.075));
    color: #fff;
    box-shadow: inset 3px 0 var(--sand-500);
}

.app-nav__item.is-muted,
.app-nav__item.is-locked {
    color: rgba(255, 255, 255, 0.34);
}

.app-sidebar__future {
    display: grid;
    gap: 5px;
    margin-top: 26px;
    padding-top: 22px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.app-sidebar__future > p {
    margin: 0 11px 7px;
    color: rgba(255, 255, 255, 0.35);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.15em;
    text-transform: uppercase;
}

.profile-card {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    margin-top: auto;
    padding: 12px;
    border: 1px solid rgba(223, 193, 138, 0.15);
    border-radius: 15px;
    background: rgba(255, 255, 255, 0.055);
}

.profile-card__avatar {
    display: grid;
    width: 36px;
    height: 36px;
    place-items: center;
    border-radius: 11px;
    background: linear-gradient(145deg, var(--champagne), var(--copper-500));
    color: var(--navy-950);
    font-size: 13px;
    font-weight: 850;
}

.profile-card__copy {
    display: grid;
    min-width: 0;
    color: inherit;
    line-height: 1.25;
    text-decoration: none;
}

.profile-card__copy strong,
.profile-card__copy small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.profile-card__copy strong {
    font-size: 12px;
}

.profile-card__copy small {
    margin-top: 3px;
    color: rgba(255, 255, 255, 0.47);
    font-size: 12px;
}

.profile-card .icon-button {
    width: 34px;
    height: 34px;
    border: 0;
    background: transparent;
    color: rgba(255, 255, 255, 0.45);
}

.profile-card .icon-button:hover {
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
}

.sidebar-scrim {
    display: none;
}

.app-frame {
    min-height: 100vh;
    padding-left: 254px;
}

.app-header {
    position: sticky;
    z-index: 30;
    top: 0;
    display: flex;
    height: 74px;
    align-items: center;
    gap: 16px;
    padding: 0 34px;
    border-bottom: 1px solid var(--line);
    background: rgba(255, 253, 250, 0.92);
    backdrop-filter: blur(16px);
}

.app-header__menu {
    display: none;
}

.breadcrumbs {
    display: flex;
    align-items: center;
    gap: 9px;
    color: var(--muted);
    font-size: 12px;
}

.breadcrumbs > .icon {
    color: var(--teal-600);
}

.breadcrumbs strong {
    color: var(--navy-700);
}

.app-header__actions {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-left: auto;
}

.header-profile-menu {
    position: relative;
    flex: 0 0 auto;
}

.header-profile-menu > summary {
    display: flex;
    min-height: 46px;
    align-items: center;
    gap: 9px;
    padding: 4px 11px 4px 5px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--surface);
    box-shadow: 0 4px 16px rgba(7, 23, 37, 0.055);
    cursor: pointer;
    list-style: none;
    transition: 150ms ease;
}

.header-profile-menu > summary::-webkit-details-marker {
    display: none;
}

.header-profile-menu > summary:hover,
.header-profile-menu[open] > summary {
    border-color: #c6b49d;
    box-shadow: 0 8px 22px rgba(7, 23, 37, 0.09);
}

.header-profile-menu__avatar {
    display: grid;
    width: 36px;
    height: 36px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 10px;
    object-fit: cover;
}

.header-profile-menu__avatar--initials {
    background: linear-gradient(145deg, var(--navy-700), var(--teal-600));
    color: #fff;
    font-family: var(--font-serif);
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.04em;
}

.header-profile-menu__copy {
    display: grid;
    max-width: 150px;
    line-height: 1.2;
}

.header-profile-menu__copy strong,
.header-profile-menu__copy small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.header-profile-menu__copy strong {
    color: var(--navy-800);
    font-size: 13px;
}

.header-profile-menu__copy small {
    margin-top: 2px;
    color: var(--muted);
    font-size: 13px;
}

.header-profile-menu__chevron {
    color: var(--muted);
    transition: transform 150ms ease;
}

.header-profile-menu[open] .header-profile-menu__chevron {
    transform: rotate(180deg);
}

.header-profile-menu__dropdown {
    position: absolute;
    z-index: 80;
    top: calc(100% + 9px);
    right: 0;
    display: grid;
    width: min(290px, calc(100vw - 30px));
    padding: 8px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--surface);
    box-shadow: 0 20px 46px rgba(7, 23, 37, 0.17);
}

.header-profile-menu__identity {
    display: grid;
    gap: 2px;
    margin-bottom: 5px;
    padding: 10px 11px 13px;
    border-bottom: 1px solid var(--line-soft);
}

.header-profile-menu__identity strong {
    color: var(--navy-800);
    font-size: 14px;
}

.header-profile-menu__identity small {
    overflow: hidden;
    color: var(--muted);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.header-profile-menu__dropdown > a,
.header-profile-menu__dropdown button {
    display: flex;
    width: 100%;
    min-height: 43px;
    align-items: center;
    gap: 10px;
    padding: 9px 11px;
    border-radius: 10px;
    background: transparent;
    color: var(--navy-700);
    cursor: pointer;
    font-size: 13px;
    font-weight: 700;
    text-align: left;
}

.header-profile-menu__dropdown > a:hover,
.header-profile-menu__dropdown button:hover {
    background: var(--teal-100);
    color: var(--teal-700);
}

.header-profile-menu__dropdown form {
    margin-top: 5px;
    padding-top: 5px;
    border-top: 1px solid var(--line-soft);
}

.header-profile-menu__dropdown form button {
    color: var(--danger);
}

.has-dot {
    position: relative;
}

.has-dot::after {
    position: absolute;
    top: 7px;
    right: 7px;
    width: 6px;
    height: 6px;
    border: 2px solid #fff;
    border-radius: 50%;
    background: #d19b3d;
    content: "";
}

.app-main {
    width: min(100%, 1500px);
    margin: 0 auto;
    padding: 34px;
}

/* Wiki */
.wiki-hero {
    position: relative;
    overflow: hidden;
    padding: 39px 44px;
    border-radius: 25px;
    border: 1px solid rgba(223, 193, 138, 0.13);
    background-color: var(--navy-800);
    background-image:
        linear-gradient(135deg, rgba(90, 134, 176, 0.13), transparent 45%),
        linear-gradient(rgba(255, 255, 255, 0.027) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.027) 1px, transparent 1px);
    background-size: 34px 34px;
    color: #fff;
}

.wiki-hero__glow {
    position: absolute;
    top: -280px;
    right: -170px;
    width: 510px;
    height: 510px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(185, 120, 56, 0.36), transparent 66%);
}

.wiki-hero__content {
    position: relative;
    z-index: 1;
    width: min(100%, 760px);
}

.wiki-hero h1 {
    margin: 14px 0 4px;
    font-family: var(--font-serif);
    font-size: clamp(33px, 4.5vw, 44px);
    letter-spacing: -0.025em;
    line-height: 1.05;
}

.wiki-hero__content > p {
    margin: 0;
    color: rgba(255, 255, 255, 0.65);
    font-size: 14px;
}

.wiki-search {
    display: grid;
    grid-template-columns: 25px minmax(0, 1fr) auto;
    align-items: center;
    gap: 6px;
    max-width: 680px;
    margin-top: 27px;
    padding: 6px 6px 6px 13px;
    border-radius: 15px;
    background: var(--surface);
    box-shadow: 0 18px 42px rgba(4, 16, 26, 0.17);
}

.wiki-search > .icon {
    color: #819095;
}

.wiki-search input {
    min-width: 0;
    height: 42px;
    border: 0;
    outline: 0;
}

.wiki-search__mobile-icon {
    display: none;
}

.wiki-section-block {
    margin-top: 29px;
}

.section-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.section-heading h2 {
    margin: 0;
    color: var(--navy-700);
    font-family: var(--font-serif);
    font-size: 22px;
}

.section-heading > a,
.section-heading > span {
    color: var(--teal-600);
    font-size: 13px;
    font-weight: 750;
}

.section-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
    margin-top: 14px;
}

.section-card {
    display: flex;
    min-width: 0;
    min-height: 223px;
    flex-direction: column;
    padding: 19px;
    border: 1px solid var(--line);
    border-radius: 17px;
    background: var(--surface);
    box-shadow: 0 6px 18px rgba(7, 23, 37, 0.035);
    transition: 150ms ease;
}

.section-card:hover {
    border-color: #cdbda9;
    box-shadow: 0 16px 32px rgba(7, 23, 37, 0.09);
    transform: translateY(-2px);
}

.section-card__icon,
.article-row__icon,
.validation-panel__icon {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 13px;
}

.section-card__icon--blue { background: #e8eff6; color: #315f83; }
.section-card__icon--green { background: #eaf1ef; color: #4d756d; }
.section-card__icon--violet { background: #eeeaf2; color: #6d5c75; }
.section-card__icon--amber { background: #f5ead9; color: #9a632f; }
.section-card__icon--rose { background: #f3e8e7; color: #8b5c5c; }

.section-card > strong {
    min-height: 43px;
    margin-top: 14px;
    color: var(--navy-700);
    font-size: 13px;
    line-height: 1.4;
}

.section-card > p {
    min-height: 49px;
    margin: 7px 0 14px;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.5;
}

.section-card__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: auto;
    color: var(--muted);
    font-size: 12px;
    font-weight: 650;
}

.section-card__meta .icon {
    color: var(--teal-600);
}

.wiki-columns {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(310px, 0.72fr);
    gap: 22px;
    margin-top: 27px;
}

.content-panel {
    padding: 22px;
    border: 1px solid var(--line);
    border-radius: 21px;
    background: var(--surface);
    box-shadow: 0 6px 18px rgba(7, 23, 37, 0.03);
}

.article-list {
    margin-top: 10px;
}

.article-row {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) auto;
    align-items: center;
    gap: 13px;
    min-height: 76px;
    padding: 13px 2px;
    border-top: 1px solid var(--line-soft);
}

.article-row:first-child {
    border-top: 0;
}

.article-row:hover .article-row__copy > strong {
    color: var(--teal-600);
}

.article-row__icon {
    background: var(--teal-100);
    color: var(--teal-600);
}

.article-row__copy {
    display: grid;
    min-width: 0;
    gap: 6px;
}

.article-row__copy > strong {
    overflow: hidden;
    color: var(--navy-700);
    font-size: 13px;
    text-overflow: ellipsis;
    transition: 150ms ease;
    white-space: nowrap;
}

.article-row__copy > span {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;
    color: var(--muted);
    font-size: 12px;
}

.article-row__copy em {
    padding: 2px 6px;
    border-radius: 999px;
    background: #f1f2ee;
    font-style: normal;
    font-weight: 700;
}

.article-row__action {
    display: flex;
    align-items: center;
    gap: 4px;
    color: var(--teal-600);
    font-size: 13px;
    font-weight: 750;
}

.empty-state {
    display: grid;
    min-height: 180px;
    place-items: center;
    align-content: center;
    gap: 9px;
    color: var(--muted);
    text-align: center;
}

.empty-state p {
    margin: 0;
    font-size: 13px;
}

.wiki-side-column {
    display: grid;
    align-content: start;
    gap: 20px;
}

.release-panel {
    overflow: hidden;
    border: 1px solid #d9c1a2;
    border-radius: 21px;
    background: #fbf7f1;
    box-shadow: 0 10px 26px rgba(104, 67, 31, 0.055);
}

.release-panel > header {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 21px;
    border-bottom: 1px solid #eadbc6;
}

.release-panel > header > .icon {
    box-sizing: content-box;
    padding: 10px;
    border-radius: 11px;
    background: linear-gradient(145deg, #ead7b7, var(--champagne));
    color: #75491f;
}

.release-panel h2 {
    margin: 0;
    color: #44392f;
    font-family: var(--font-serif);
    font-size: 20px;
}

.release-panel header p {
    margin: 4px 0 0;
    color: #7d6a55;
    font-size: 12px;
    line-height: 1.5;
}

.release-list > a {
    display: grid;
    gap: 8px;
    padding: 17px 21px;
    border-top: 1px solid #eadbc6;
}

.release-list > a:first-child {
    border-top: 0;
}

.release-list > a:hover {
    background: rgba(223, 193, 138, 0.18);
}

.release-list__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.release-list__top em {
    padding: 3px 7px;
    border-radius: 999px;
    background: var(--teal-600);
    color: #fff;
    font-size: 12px;
    font-style: normal;
    font-weight: 800;
}

.release-list__top small,
.release-list__status {
    color: #8a7159;
    font-size: 12px;
}

.release-list > a > strong {
    color: #44392f;
    font-size: 12px;
    line-height: 1.45;
}

.release-list__status {
    display: flex;
    align-items: center;
    gap: 5px;
    color: var(--copper-700);
    font-weight: 700;
}

.validation-panel {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    align-items: start;
    gap: 13px;
    padding: 20px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: var(--surface);
}

.validation-panel__icon {
    background: #eef1f8;
    color: #596b9a;
}

.validation-panel > span:last-child {
    display: grid;
}

.validation-panel small {
    color: var(--muted);
    font-size: 12px;
    font-weight: 750;
    text-transform: uppercase;
}

.validation-panel strong {
    color: var(--navy-700);
    font-family: var(--font-serif);
    font-size: 31px;
    line-height: 1.1;
}

.validation-panel p {
    margin: 5px 0 0;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.5;
}

/* Article and release details */
.article-page {
    width: min(100%, 1040px);
}

.back-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 18px;
    color: var(--teal-600);
    font-size: 12px;
    font-weight: 750;
}

.article-document {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 24px;
    background: var(--surface);
    box-shadow: var(--shadow);
}

.article-document > header {
    padding: clamp(28px, 5vw, 52px);
    border-bottom: 1px solid var(--line-soft);
    background:
        radial-gradient(circle at 95% 0, rgba(185, 120, 56, 0.17), transparent 34%),
        #fcfaf7;
}

.article-document h1 {
    max-width: 780px;
    margin: 16px 0 12px;
    color: var(--navy-800);
    font-family: var(--font-serif);
    font-size: clamp(35px, 5vw, 53px);
    letter-spacing: -0.03em;
    line-height: 1.05;
}

.article-document header > p {
    max-width: 720px;
    margin: 0;
    color: var(--muted);
    font-size: 15px;
    line-height: 1.7;
}

.article-document__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 18px;
    color: #849095;
    font-size: 13px;
}

.article-document > .alert {
    margin: 25px clamp(25px, 5vw, 52px) 0;
}

.article-document__body {
    max-width: 800px;
    padding: clamp(28px, 5vw, 52px);
    color: #324c55;
    font-family: var(--font-serif);
    font-size: 18px;
    line-height: 1.9;
}

.article-document > footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 20px clamp(28px, 5vw, 52px);
    border-top: 1px solid var(--line-soft);
    background: #fcfaf7;
    color: var(--muted);
    font-size: 13px;
}

.article-document > footer > span {
    display: flex;
    gap: 7px;
}

.language-chip {
    padding: 5px 8px;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: var(--surface);
    font-weight: 800;
}

.language-chip.is-active {
    border-color: var(--teal-600);
    background: var(--teal-600);
    color: #fff;
}

.article-empty {
    display: grid;
    min-height: 360px;
    place-items: center;
    align-content: center;
    gap: 10px;
    text-align: center;
}

.article-empty h1,
.article-empty p {
    margin: 0;
}

.article-empty h1 {
    color: var(--navy-800);
    font-family: var(--font-serif);
    font-size: 35px;
}

.article-empty p {
    color: var(--muted);
}

.release-document > header {
    background:
        radial-gradient(circle at 90% 0, rgba(185, 120, 56, 0.3), transparent 36%),
        #fbf7f1;
}

/* Wiki editorial pages */
.page-intro-card {
    margin-bottom: 22px;
    padding: clamp(25px, 4vw, 38px);
    border: 1px solid var(--line);
    border-radius: 22px;
    background:
        radial-gradient(circle at 95% 0, rgba(185, 120, 56, 0.16), transparent 36%),
        var(--surface);
    box-shadow: 0 8px 24px rgba(7, 23, 37, 0.035);
}

.page-intro-card h1 {
    margin: 8px 0 9px;
    color: var(--navy-800);
    font-family: var(--font-serif);
    font-size: clamp(32px, 5vw, 45px);
    letter-spacing: -0.025em;
    line-height: 1.05;
}

.page-intro-card p {
    max-width: 720px;
    margin: 0;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.65;
}

.release-index {
    padding: 8px 22px;
}

.release-index__item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto 18px;
    align-items: center;
    gap: 15px;
    min-height: 92px;
    padding: 17px 4px;
    border-top: 1px solid var(--line-soft);
}

.release-index__item:first-child {
    border-top: 0;
}

.release-index__item:hover .release-index__copy strong {
    color: var(--teal-600);
}

.release-index__copy {
    display: grid;
    gap: 5px;
}

.release-index__copy strong {
    color: var(--navy-700);
    font-size: 13px;
    transition: 150ms ease;
}

.release-index__copy small {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.5;
}

.release-index__meta {
    display: grid;
    justify-items: end;
    gap: 4px;
    color: var(--muted);
    font-size: 12px;
}

.release-index__meta em {
    color: var(--copper-700);
    font-style: normal;
    font-weight: 750;
}

.note-editor-card {
    padding: clamp(22px, 4vw, 34px);
}

.editor-access-note {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    align-items: start;
    gap: 12px;
    margin-bottom: 26px;
    padding: 14px;
    border: 1px solid #dac5a7;
    border-radius: 13px;
    background: var(--sand-100);
    color: var(--copper-700);
}

.editor-access-note > .icon {
    margin: 2px auto 0;
}

.editor-access-note > span {
    display: grid;
    gap: 3px;
}

.editor-access-note strong {
    font-size: 12px;
}

.editor-access-note small {
    color: #725e48;
    font-size: 12px;
    line-height: 1.5;
}

.note-editor-form {
    display: grid;
    gap: 24px;
}

.note-editor-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 11px;
    padding-top: 4px;
}

/* Tickets & assistance */
.header-ticket-button {
    display: inline-flex;
    min-height: 35px;
    align-items: center;
    gap: 7px;
    padding: 0 12px;
    border: 1px solid #d5c29f;
    border-radius: 10px;
    background: var(--sand-100);
    color: var(--copper-700);
    font-size: 12px;
    font-weight: 850;
    transition: 150ms ease;
}

.header-ticket-button:hover {
    border-color: var(--copper-500);
    background: #f7e6c9;
}

.ticket-page {
    width: min(100%, 1480px);
}

.ticket-create-page {
    width: min(100%, 1050px);
}

.ticket-create-intro {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    align-items: center;
    gap: 20px;
}

.ticket-intro-icon {
    display: grid;
    width: 64px;
    height: 64px;
    place-items: center;
    border: 1px solid #d9bf91;
    border-radius: 18px;
    background: linear-gradient(145deg, #f7ead4, #ead0a5);
    color: var(--copper-700);
}

.ticket-intro-icon .icon {
    width: 27px;
    height: 27px;
}

.ticket-create-form {
    display: grid;
    gap: 17px;
}

.ticket-form-card {
    padding: clamp(20px, 3vw, 29px);
}

.ticket-form-heading {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    align-items: start;
    gap: 13px;
    margin-bottom: 20px;
}

.ticket-form-heading > span {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border-radius: 10px;
    background: var(--navy-800);
    color: #fff;
    font-family: var(--font-serif);
    font-size: 14px;
    font-weight: 700;
}

.ticket-form-heading h2,
.ticket-content-card h2,
.ticket-management-card h2,
.ticket-context-card h2,
.ticket-history-card h2 {
    margin: 0;
    color: var(--navy-800);
    font-family: var(--font-serif);
    font-size: 22px;
}

.ticket-form-heading p,
.ticket-content-card header p,
.ticket-management-card header p {
    margin: 4px 0 0;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.55;
}

.ticket-product-grid,
.ticket-type-grid,
.ticket-urgency-grid {
    display: grid;
    gap: 10px;
}

.ticket-product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ticket-type-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ticket-urgency-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.ticket-choice-card,
.ticket-urgency-card {
    position: relative;
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) 20px;
    align-items: center;
    gap: 11px;
    min-height: 76px;
    padding: 13px;
    border: 1px solid var(--line);
    border-radius: 15px;
    background: #fffefb;
    cursor: pointer;
    transition: 150ms ease;
}

.ticket-choice-card:hover,
.ticket-urgency-card:hover {
    border-color: #cbbba5;
    box-shadow: 0 8px 21px rgba(7, 23, 37, 0.055);
}

.ticket-choice-card > input,
.ticket-urgency-card > input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
}

.ticket-choice-card:has(input:checked),
.ticket-urgency-card:has(input:checked) {
    border-color: var(--teal-600);
    background: #f5f9fb;
    box-shadow: inset 0 0 0 1px var(--teal-600);
}

.ticket-choice-card__visual {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    background: var(--teal-100);
    color: var(--teal-700);
}

.ticket-choice-card > span:nth-of-type(2),
.ticket-urgency-card > span:first-of-type {
    display: grid;
    min-width: 0;
    gap: 3px;
}

.ticket-choice-card strong,
.ticket-urgency-card strong {
    color: var(--navy-800);
    font-size: 13px;
}

.ticket-choice-card small,
.ticket-urgency-card small {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.45;
}

.ticket-choice-card__check {
    width: 17px;
    height: 17px;
    padding: 3px;
    border-radius: 50%;
    background: var(--teal-600);
    color: #fff;
    opacity: 0;
    transform: scale(0.7);
    transition: 150ms ease;
}

.ticket-choice-card:has(input:checked) .ticket-choice-card__check,
.ticket-urgency-card:has(input:checked) .ticket-choice-card__check {
    opacity: 1;
    transform: scale(1);
}

.ticket-urgency-card {
    grid-template-columns: minmax(0, 1fr) 20px;
}

.ticket-urgency-card--urgent:has(input:checked) {
    border-color: var(--danger);
    background: var(--danger-soft);
    box-shadow: inset 0 0 0 1px var(--danger);
}

.ticket-urgency-card--urgent:has(input:checked) .ticket-choice-card__check {
    background: var(--danger);
}

.ticket-main-fields textarea {
    min-height: 132px;
}

.ticket-upload-zone {
    position: relative;
    display: grid;
    grid-template-columns: 45px minmax(0, 1fr);
    align-items: center;
    gap: 13px;
    min-height: 91px;
    padding: 17px;
    border: 1px dashed #bda98b;
    border-radius: 15px;
    background: var(--sand-100);
    cursor: pointer;
}

.ticket-upload-zone > .icon {
    width: 25px;
    height: 25px;
    color: var(--copper-700);
}

.ticket-upload-zone > span {
    display: grid;
    gap: 4px;
}

.ticket-upload-zone strong {
    color: var(--navy-800);
    font-size: 12px;
}

.ticket-upload-zone small {
    color: #78664f;
    font-size: 12px;
    line-height: 1.45;
}

.ticket-upload-zone input {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
}

.ticket-security-note {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: 11px;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.5;
}

.ticket-optional-card {
    padding: 0;
}

.ticket-optional-card > summary {
    display: flex;
    min-height: 74px;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    padding: 17px 22px;
    cursor: pointer;
    list-style: none;
}

.ticket-optional-card > summary::-webkit-details-marker {
    display: none;
}

.ticket-optional-card > summary > span {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    column-gap: 9px;
}

.ticket-optional-card > summary strong {
    color: var(--navy-800);
    font-size: 13px;
}

.ticket-optional-card > summary small {
    grid-column: 2;
    color: var(--muted);
    font-size: 12px;
}

.ticket-optional-card[open] > summary > .icon {
    transform: rotate(90deg);
}

.ticket-optional-grid {
    padding: 0 22px 22px;
    border-top: 1px solid var(--line-soft);
    padding-top: 20px;
}

.ticket-client-check {
    align-self: end;
    min-height: 48px;
}

.ticket-submit-bar {
    position: sticky;
    z-index: 10;
    bottom: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 13px 14px 13px 18px;
    border: 1px solid #d5c6b2;
    border-radius: 16px;
    background: rgba(255, 253, 250, 0.96);
    box-shadow: 0 16px 40px rgba(7, 23, 37, 0.12);
    backdrop-filter: blur(10px);
}

.ticket-submit-bar > span {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--muted);
    font-size: 12px;
}

.ticket-list-intro {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 25px;
}

.ticket-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 17px;
}

.ticket-stats article {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    align-items: center;
    gap: 11px;
    min-height: 72px;
    padding: 13px 16px;
    border: 1px solid var(--line);
    border-radius: 15px;
    background: var(--surface);
}

.ticket-stats article > span {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 11px;
    background: var(--teal-100);
    color: var(--teal-700);
}

.ticket-stats small {
    color: var(--muted);
    font-size: 12px;
}

.ticket-stats strong {
    color: var(--navy-800);
    font-family: var(--font-serif);
    font-size: 25px;
}

.ticket-stats .ticket-stat--urgent > span {
    background: var(--danger-soft);
    color: var(--danger);
}

.ticket-filter-panel {
    margin-bottom: 17px;
    padding: 12px;
}

.ticket-filter-panel form {
    display: grid;
    grid-template-columns: minmax(220px, 1.5fr) repeat(3, minmax(130px, 0.65fr)) auto;
    gap: 8px;
}

.ticket-filter-panel select,
.ticket-search-field {
    min-height: 41px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
}

.ticket-filter-panel select {
    min-width: 0;
    padding: 0 9px;
    font-size: 12px;
}

.ticket-search-field {
    display: grid;
    grid-template-columns: 17px minmax(0, 1fr);
    align-items: center;
    gap: 7px;
    padding: 0 10px;
    color: var(--muted);
}

.ticket-search-field input {
    min-width: 0;
    height: 39px;
    border: 0;
    outline: 0;
    font-size: 13px;
}

.ticket-kanban {
    display: grid;
    grid-template-columns: repeat(5, minmax(235px, 1fr));
    gap: 11px;
    overflow-x: auto;
    padding-bottom: 12px;
}

.ticket-kanban-column {
    min-height: 430px;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 15px;
    background: #eeece9;
}

.ticket-kanban-column > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 3px 4px 11px;
    color: var(--navy-700);
    font-size: 12px;
    font-weight: 850;
}

.ticket-kanban-column > header em {
    display: grid;
    min-width: 23px;
    height: 23px;
    place-items: center;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.75);
    font-size: 12px;
    font-style: normal;
}

.ticket-kanban-stack {
    display: grid;
    align-content: start;
    gap: 8px;
}

.ticket-board-card {
    display: grid;
    gap: 9px;
    padding: 12px;
    border: 1px solid #dbd5cd;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 4px 12px rgba(7, 23, 37, 0.035);
}

.ticket-board-card:hover {
    border-color: #baa789;
    box-shadow: 0 10px 22px rgba(7, 23, 37, 0.08);
}

.ticket-board-card__top,
.ticket-board-card__footer,
.ticket-board-card__tags {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
}

.ticket-board-card__top em {
    color: var(--teal-600);
    font-size: 12px;
    font-style: normal;
    font-weight: 850;
}

.ticket-board-card__top i {
    color: var(--danger);
}

.ticket-board-card > strong {
    color: var(--navy-800);
    font-size: 13px;
    line-height: 1.4;
}

.ticket-board-card__tags {
    justify-content: flex-start;
    flex-wrap: wrap;
}

.ticket-board-card__tags small {
    padding: 3px 5px;
    border-radius: 6px;
    background: var(--teal-100);
    color: var(--teal-700);
    font-size: 12px;
    font-weight: 750;
}

.ticket-board-card__footer {
    padding-top: 8px;
    border-top: 1px solid var(--line-soft);
    color: var(--muted);
    font-size: 12px;
}

.ticket-kanban-empty {
    padding: 24px;
    color: #a6a19a;
    text-align: center;
}

.ticket-list-panel {
    padding: 8px 21px;
}

.ticket-list-row {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 15px 5px;
    border-bottom: 1px solid var(--line-soft);
}

.ticket-list-row:last-child {
    border-bottom: 0;
}

.ticket-list-row__icon {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 11px;
    background: var(--teal-100);
    color: var(--teal-700);
}

.ticket-list-row__main {
    display: grid;
    min-width: 0;
    gap: 4px;
}

.ticket-list-row__main > span:first-child {
    display: flex;
    align-items: center;
    gap: 7px;
}

.ticket-list-row__main em {
    color: var(--teal-600);
    font-size: 12px;
    font-style: normal;
    font-weight: 850;
}

.ticket-list-row__main strong {
    overflow: hidden;
    color: var(--navy-800);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ticket-list-row__main small,
.ticket-list-row__meta {
    color: var(--muted);
    font-size: 12px;
}

.ticket-list-row__meta {
    display: flex;
    align-items: center;
    gap: 10px;
}

.ticket-list-row__meta > span {
    display: inline-flex;
    align-items: center;
    gap: 3px;
}

.ticket-status-badge,
.ticket-confidential-badge,
.ticket-number-badge {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 5px;
    padding: 4px 7px;
    border-radius: 999px;
    font-size: 12px;
    font-style: normal;
    font-weight: 850;
}

.ticket-status-badge {
    background: var(--teal-100);
    color: var(--teal-700);
}

.ticket-status-badge--closed,
.ticket-status-badge--deployed {
    background: var(--success-soft);
    color: var(--success);
}

.ticket-status-badge--rejected,
.ticket-status-badge--duplicate {
    background: #efefef;
    color: #6c7478;
}

.ticket-status-badge--info_requested,
.ticket-status-badge--validation {
    background: #f8eedc;
    color: var(--copper-700);
}

.ticket-number-badge {
    background: var(--navy-800);
    color: #fff;
}

.ticket-confidential-badge {
    background: var(--danger-soft);
    color: var(--danger);
}

.ticket-empty {
    min-height: 260px;
}

.ticket-detail-hero {
    margin-bottom: 17px;
    padding: clamp(22px, 4vw, 34px);
    border: 1px solid rgba(215, 187, 139, 0.35);
    border-radius: 22px;
    background:
        radial-gradient(circle at 100% 0, rgba(185, 120, 56, 0.18), transparent 34%),
        linear-gradient(140deg, var(--navy-900), var(--navy-800));
    color: #fff;
    box-shadow: 0 18px 40px rgba(7, 23, 37, 0.14);
}

.ticket-detail-hero__top,
.ticket-detail-hero__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.ticket-detail-hero .ticket-status-badge {
    border: 1px solid rgba(255, 255, 255, 0.16);
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
}

.ticket-detail-hero h1 {
    max-width: 960px;
    margin: 17px 0 15px;
    font-family: var(--font-serif);
    font-size: clamp(26px, 4vw, 39px);
    line-height: 1.12;
}

.ticket-detail-hero__meta {
    color: rgba(255, 255, 255, 0.64);
    font-size: 12px;
}

.ticket-detail-hero__meta > span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.ticket-detail-hero__meta strong {
    color: rgba(255, 255, 255, 0.9);
}

.ticket-detail-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.75fr) minmax(300px, 0.75fr);
    align-items: start;
    gap: 17px;
}

.ticket-detail-main,
.ticket-detail-side {
    display: grid;
    gap: 17px;
}

.ticket-content-card,
.ticket-management-card,
.ticket-context-card,
.ticket-history-card {
    padding: clamp(19px, 3vw, 27px);
}

.ticket-content-card > header,
.ticket-management-card > header,
.ticket-context-card > header,
.ticket-history-card > header {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    align-items: start;
    gap: 12px;
    margin-bottom: 20px;
}

.ticket-content-card > header > span,
.ticket-management-card > header > span,
.ticket-context-card > header > span,
.ticket-history-card > header > span {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 11px;
    background: var(--teal-100);
    color: var(--teal-700);
}

.ticket-rich-text {
    color: #334b5b;
    font-size: 13px;
    line-height: 1.75;
}

.ticket-detail-block {
    margin-top: 20px;
    padding-top: 17px;
    border-top: 1px solid var(--line-soft);
}

.ticket-detail-block h3 {
    margin: 0 0 8px;
    color: var(--navy-800);
    font-size: 13px;
}

.ticket-detail-block p {
    margin: 0;
    color: #405766;
    font-size: 13px;
    line-height: 1.7;
}

.ticket-source-link {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 7px;
    margin-top: 18px;
    color: var(--teal-600);
    font-size: 12px;
    font-weight: 750;
}

.ticket-source-link span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ticket-attachment-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
}

.ticket-attachment-list a {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr) 17px;
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fffefb;
}

.ticket-attachment-list a > span:first-child {
    display: grid;
    width: 36px;
    height: 36px;
    place-items: center;
    border-radius: 9px;
    background: var(--sand-100);
    color: var(--copper-700);
}

.ticket-attachment-list a > span:nth-child(2) {
    display: grid;
    min-width: 0;
}

.ticket-attachment-list strong {
    overflow: hidden;
    color: var(--navy-800);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ticket-attachment-list small {
    color: var(--muted);
    font-size: 12px;
}

.ticket-comments {
    display: grid;
    gap: 12px;
}

.ticket-comment {
    display: grid;
    grid-template-columns: 35px minmax(0, 1fr);
    gap: 10px;
    padding: 13px;
    border: 1px solid var(--line-soft);
    border-radius: 13px;
    background: #fffefb;
}

.ticket-comment--internal {
    border-color: #dfcba8;
    background: var(--sand-100);
}

.ticket-comment__avatar {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;
    border-radius: 10px;
    background: var(--navy-800);
    color: #fff;
    font-size: 12px;
    font-weight: 850;
}

.ticket-comment header {
    display: flex;
    align-items: center;
    gap: 7px;
}

.ticket-comment header strong {
    color: var(--navy-800);
    font-size: 12px;
}

.ticket-comment header em {
    padding: 2px 5px;
    border-radius: 5px;
    background: #ecd6ad;
    color: var(--copper-700);
    font-size: 12px;
    font-style: normal;
    font-weight: 800;
}

.ticket-comment header small {
    margin-left: auto;
    color: var(--muted);
    font-size: 12px;
}

.ticket-comment p {
    margin: 7px 0 0;
    color: #405766;
    font-size: 12px;
    line-height: 1.65;
}

.ticket-comment-form {
    display: grid;
    gap: 10px;
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid var(--line-soft);
}

.ticket-comment-form .button {
    justify-self: end;
}

.ticket-internal-check {
    min-height: 46px;
}

.ticket-management-card form {
    display: grid;
    gap: 12px;
}

.ticket-context-card .profile-data-list dd {
    word-break: break-word;
}

.ticket-history-list {
    display: grid;
    gap: 0;
}

.ticket-history-list article {
    display: grid;
    grid-template-columns: 12px minmax(0, 1fr);
    gap: 8px;
    padding: 0 0 15px;
}

.ticket-history-list article > span {
    position: relative;
    width: 7px;
    height: 7px;
    margin-top: 5px;
    border-radius: 50%;
    background: var(--copper-500);
}

.ticket-history-list article:not(:last-child) > span::after {
    position: absolute;
    top: 9px;
    left: 3px;
    width: 1px;
    height: calc(100% + 12px);
    background: var(--line);
    content: "";
}

.ticket-history-list article div {
    display: grid;
    gap: 2px;
}

.ticket-history-list strong {
    color: var(--navy-700);
    font-size: 12px;
}

.ticket-history-list small,
.ticket-history-list p {
    margin: 0;
    color: var(--muted);
    font-size: 12px;
}

/* Account */
.account-page {
    width: min(100%, 1120px);
}

.account-intro {
    display: grid;
    grid-template-columns: 78px minmax(0, 1fr);
    align-items: center;
    gap: 21px;
}

.account-avatar {
    display: grid;
    width: 78px;
    height: 78px;
    place-items: center;
    border: 2px solid #f2dfbf;
    border-radius: 21px;
    background: linear-gradient(145deg, var(--navy-700), var(--teal-600));
    box-shadow: 0 12px 26px rgba(7, 31, 47, 0.17);
    color: #fff;
    font-family: var(--font-serif);
    font-size: 25px;
    letter-spacing: 0.05em;
}

.account-avatar--photo {
    object-fit: cover;
}

.account-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.88fr) minmax(0, 1.12fr);
    align-items: start;
    gap: 18px;
}

.account-grid--profile {
    grid-template-columns: minmax(0, 1.55fr) minmax(320px, 0.75fr);
}

.account-card {
    padding: clamp(20px, 3vw, 29px);
}

.account-card > header {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    align-items: start;
    gap: 13px;
    margin-bottom: 23px;
}

.account-card > header > span {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    background: var(--sand-100);
    color: var(--copper-700);
}

.account-card h2 {
    margin: 0;
    color: var(--navy-800);
    font-family: var(--font-serif);
    font-size: 22px;
}

.account-card header p {
    margin: 4px 0 0;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.55;
}

.account-profile-form {
    display: grid;
    gap: 20px;
}

.account-profile-photo-row {
    display: grid;
    grid-template-columns: 68px minmax(0, 1fr);
    align-items: center;
    gap: 15px;
    padding: 14px;
    border: 1px solid var(--line-soft);
    border-radius: 14px;
    background: #fcfaf7;
}

.account-profile-photo-row > img,
.account-profile-photo-row > span {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border-radius: 15px;
    background: linear-gradient(145deg, var(--navy-700), var(--teal-600));
    color: #fff;
    font-family: var(--font-serif);
    font-size: 21px;
    font-weight: 800;
    object-fit: cover;
}

.account-photo-control {
    position: relative;
    display: grid;
    min-height: 58px;
    align-content: center;
    gap: 3px;
    padding: 10px 13px;
    border: 1px dashed #c7b69f;
    border-radius: 11px;
    color: var(--teal-700);
    cursor: pointer;
}

.account-photo-control strong {
    font-size: 13px;
}

.account-photo-control small {
    color: var(--muted);
    font-size: 12px;
}

.account-photo-control input {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
    opacity: 0;
}

.account-profile-grid {
    gap: 17px;
}

.account-profile-grid input[readonly] {
    background: #f1f0ed;
    color: var(--muted);
    cursor: not-allowed;
}

.account-role-field {
    align-content: start;
}

.account-role-field strong {
    min-height: 47px;
    padding: 13px;
    border: 1px solid var(--line-soft);
    border-radius: 11px;
    background: var(--sand-100);
    color: var(--copper-700);
    font-size: 12px;
    line-height: 1.5;
}

.account-save-profile {
    justify-self: end;
}

.account-password-form {
    display: grid;
    gap: 15px;
}

.account-password-form .button {
    justify-self: end;
    margin-top: 4px;
}

.account-password-help {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.55;
}

/* Collaborators */
.collaborator-page {
    width: min(100%, 1320px);
}

.collaborator-intro {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 28px;
}

.collaborator-intro .button {
    flex: 0 0 auto;
}

.collaborator-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 22px;
}

.collaborator-stats article {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    min-height: 82px;
    padding: 16px 18px;
    border: 1px solid var(--line);
    border-radius: 17px;
    background: var(--surface);
    box-shadow: 0 7px 20px rgba(7, 23, 37, 0.035);
}

.collaborator-stats article > span {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    background: var(--teal-100);
    color: var(--teal-700);
}

.collaborator-stats small {
    color: var(--muted);
    font-size: 13px;
}

.collaborator-stats strong {
    color: var(--navy-800);
    font-family: var(--font-serif);
    font-size: 29px;
}

.collaborator-directory {
    padding: clamp(19px, 3vw, 28px);
}

.collaborator-toolbar {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 22px;
    margin-bottom: 23px;
}

.collaborator-toolbar h2 {
    margin: 0 0 4px;
    color: var(--navy-800);
    font-family: var(--font-serif);
    font-size: 23px;
}

.collaborator-toolbar p {
    margin: 0;
    color: var(--muted);
    font-size: 13px;
}

.collaborator-toolbar form {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) 155px auto;
    gap: 8px;
}

.collaborator-toolbar select,
.collaborator-search {
    min-height: 42px;
    border: 1px solid var(--line);
    border-radius: 11px;
    background: var(--surface);
}

.collaborator-toolbar select {
    padding: 0 11px;
    color: var(--navy-700);
    font-size: 12px;
}

.collaborator-search {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    padding: 0 11px;
    color: var(--muted);
}

.collaborator-search input {
    min-width: 0;
    height: 40px;
    border: 0;
    outline: 0;
    font-size: 12px;
}

.collaborator-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.collaborator-card {
    display: flex;
    min-width: 0;
    min-height: 355px;
    flex-direction: column;
    padding: 19px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0, rgba(185, 120, 56, 0.11), transparent 32%),
        #fffdf9;
    transition: 150ms ease;
}

.collaborator-card:hover {
    border-color: #cdbda9;
    box-shadow: 0 17px 32px rgba(7, 23, 37, 0.08);
    transform: translateY(-2px);
}

.collaborator-card__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.collaborator-card__badges,
.collaborator-profile-hero__badges {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: flex-end;
    gap: 6px;
}

.collaborator-card__badges {
    max-width: 62%;
}

.collaborator-type-pill {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    padding: 5px 9px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
}

.collaborator-type-pill--agent {
    background: var(--teal-100);
    color: var(--teal-700);
}

.collaborator-type-pill--staff {
    background: #f4e4c9;
    color: var(--copper-700);
}

.collaborator-avatar,
.collaborator-profile-photo {
    display: grid;
    overflow: hidden;
    place-items: center;
    border: 2px solid #f3e6d2;
    border-radius: 16px;
    background: var(--navy-800);
    color: #fff;
    object-fit: cover;
}

.collaborator-avatar {
    width: 66px;
    height: 66px;
}

.collaborator-avatar--initials {
    font-family: var(--font-serif);
    font-size: 22px;
    letter-spacing: 0.04em;
}

.status-pill {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    padding: 5px 8px;
    border-radius: 999px;
    background: #eef1f2;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}

.status-pill--active {
    background: var(--success-soft);
    color: var(--success);
}

.status-pill--onboarding {
    background: #f8eedc;
    color: var(--copper-700);
}

.status-pill--inactive,
.status-pill--departed {
    background: #f1f1f1;
    color: #6c7478;
}

.collaborator-card__identity {
    margin-top: 15px;
}

.collaborator-card__identity h3 {
    margin: 0;
    color: var(--navy-800);
    font-family: var(--font-serif);
    font-size: 20px;
}

.collaborator-card__identity p {
    margin: 4px 0 0;
    color: var(--teal-600);
    font-size: 12px;
    font-weight: 750;
}

.collaborator-card__functions {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 12px;
}

.collaborator-card__functions span {
    padding: 4px 7px;
    border-radius: 999px;
    background: var(--sand-100);
    color: #725e48;
    font-size: 12px;
    font-weight: 700;
}

.collaborator-card__meta {
    display: grid;
    gap: 9px;
    margin: 18px 0 0;
    padding: 14px 0;
    border-top: 1px solid var(--line-soft);
}

.collaborator-card__meta > div {
    display: grid;
    grid-template-columns: 16px 70px minmax(0, 1fr);
    align-items: center;
    gap: 7px;
}

.collaborator-card__meta .icon {
    color: var(--teal-600);
}

.collaborator-card__meta dt {
    color: var(--muted);
    font-size: 12px;
}

.collaborator-card__meta dd {
    overflow: hidden;
    margin: 0;
    color: var(--navy-700);
    font-size: 12px;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.collaborator-card__link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: auto;
    padding-top: 10px;
    color: var(--teal-600);
    font-size: 12px;
    font-weight: 800;
}

.collaborator-empty {
    min-height: 250px;
}

.collaborator-form {
    display: grid;
    gap: 18px;
}

.collaborator-form-section {
    min-width: 0;
    padding: clamp(21px, 4vw, 31px);
}

.collaborator-form-section legend {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 0 8px;
    color: var(--navy-800);
    font-family: var(--font-serif);
    font-size: 21px;
    font-weight: 800;
}

.collaborator-form-section legend span {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    border-radius: 9px;
    background: var(--navy-800);
    color: var(--champagne);
    font-family: var(--font-sans);
    font-size: 13px;
}

.collaborator-form-section > p {
    margin: 0 0 22px;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.55;
}

.collaborator-form-grid {
    gap: 19px;
}

.file-input-shell {
    position: relative;
    display: grid;
    min-height: 82px;
    grid-template-columns: 46px minmax(0, 1fr);
    align-items: center;
    gap: 13px;
    padding: 13px;
    border: 1px dashed #cdbda9;
    border-radius: 13px;
    background: #fcfaf7;
    color: var(--teal-600);
    cursor: pointer;
}

.file-input-shell > .icon {
    width: 26px;
    height: 26px;
    margin: auto;
}

.file-input-shell > span {
    display: grid;
    gap: 3px;
}

.file-input-shell strong {
    color: var(--navy-700);
    font-size: 12px;
}

.file-input-shell small {
    color: var(--muted);
    font-size: 12px;
    font-weight: 450;
}

.file-input-shell input {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
    opacity: 0;
}

.choice-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    margin-top: 4px;
}

.choice-card {
    min-width: 0;
    cursor: pointer;
}

.choice-card input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
}

.choice-card > span {
    display: flex;
    min-height: 49px;
    align-items: center;
    gap: 8px;
    padding: 11px 14px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--surface);
    color: var(--muted);
    font-size: 13px;
    font-weight: 700;
    transition: 150ms ease;
}

/* Form usability rule: keep every select arrow away from the border. */
select {
    padding-left: var(--field-content-inset);
    appearance: none;
    padding-right: 48px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23112d45' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 17px center !important;
    background-size: 16px 16px !important;
}

.choice-card > span .icon {
    opacity: 0;
}

.choice-card input:focus-visible + span {
    outline: 3px solid rgba(90, 134, 176, 0.2);
}

.choice-card input:checked + span {
    border-color: var(--teal-600);
    background: var(--teal-100);
    color: var(--teal-700);
}

.choice-card input:checked + span .icon {
    opacity: 1;
}

.collaborator-form-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    padding: 3px 0 8px;
}

.back-link__icon {
    transform: rotate(180deg);
}

.collaborator-profile-hero {
    display: grid;
    grid-template-columns: 118px minmax(0, 1fr) auto;
    align-items: center;
    gap: 24px;
    margin-bottom: 18px;
    padding: clamp(24px, 4vw, 36px);
    border: 1px solid rgba(223, 193, 138, 0.2);
    border-radius: 23px;
    background:
        radial-gradient(circle at 92% 0, rgba(185, 120, 56, 0.3), transparent 36%),
        linear-gradient(135deg, #102c42, var(--navy-900));
    color: #fff;
    box-shadow: 0 16px 38px rgba(7, 23, 37, 0.16);
}

.collaborator-profile-photo {
    width: 118px;
    height: 118px;
    border-color: rgba(223, 193, 138, 0.7);
    border-radius: 22px;
    font-size: 35px;
}

.collaborator-profile-hero .eyebrow {
    color: var(--champagne);
}

.collaborator-profile-hero h1 {
    margin: 7px 0 4px;
    font-family: var(--font-serif);
    font-size: clamp(31px, 5vw, 44px);
    line-height: 1.05;
}

.collaborator-profile-hero__copy > p {
    margin: 0;
    color: rgba(255, 255, 255, 0.65);
    font-size: 12px;
}

.collaborator-profile-hero .collaborator-card__functions span {
    background: rgba(255, 255, 255, 0.09);
    color: rgba(255, 255, 255, 0.78);
}

.collaborator-profile-hero > .status-pill,
.collaborator-profile-hero__badges {
    align-self: start;
}

.collaborator-danger-zone {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-top: 14px;
    border-color: #e5c3c7;
    background: linear-gradient(135deg, #fff, var(--danger-soft));
}

.collaborator-danger-zone h2 {
    margin: 5px 0;
    color: var(--danger);
    font-family: var(--font-serif);
    font-size: 23px;
}

.collaborator-danger-zone p {
    max-width: 760px;
    margin: 0;
    color: var(--muted);
    font-size: 14px;
    line-height: 1.55;
}

.collaborator-danger-zone__self {
    padding: 10px 13px;
    border-radius: 12px;
    background: #fff;
    color: var(--danger) !important;
    font-weight: 750;
}

@media (max-width: 700px) {
    .collaborator-danger-zone {
        align-items: stretch;
        flex-direction: column;
    }

    .collaborator-danger-zone .button,
    .collaborator-danger-zone form {
        width: 100%;
    }
}

.collaborator-profile-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.profile-information-card {
    padding: 23px;
}

.profile-information-card > header {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: start;
    gap: 11px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--line-soft);
}

.profile-information-card > header > .icon {
    padding: 9px;
    border-radius: 11px;
    background: var(--teal-100);
    color: var(--teal-700);
}

.profile-information-card h2 {
    margin: 0;
    color: var(--navy-800);
    font-family: var(--font-serif);
    font-size: 20px;
}

.profile-information-card header p {
    margin: 3px 0 0;
    color: var(--muted);
    font-size: 12px;
}

.profile-data-list {
    display: grid;
    margin: 0;
}

.profile-data-list > div {
    display: grid;
    grid-template-columns: 145px minmax(0, 1fr);
    gap: 13px;
    padding: 11px 0;
    border-bottom: 1px solid var(--line-soft);
}

.profile-data-list > div:last-child {
    border-bottom: 0;
}

.profile-data-list dt {
    color: var(--muted);
    font-size: 12px;
}

.profile-data-list dd {
    margin: 0;
    color: var(--navy-700);
    font-size: 13px;
    font-weight: 700;
    overflow-wrap: anywhere;
}

.profile-data-list a {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: var(--teal-600);
}

.social-link-list {
    display: grid;
    gap: 7px;
    padding-top: 15px;
}

.social-link-list a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 11px;
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    color: var(--teal-600);
    font-size: 13px;
    font-weight: 750;
}

.profile-empty-value {
    margin: 18px 0 0;
    color: var(--muted);
    font-size: 13px;
}

/* Personalized dashboards */
.dashboard-page {
    display: grid;
    gap: 18px;
}

.dashboard-hero {
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 28px;
    min-height: 225px;
    padding: 34px 36px;
    overflow: hidden;
    border: 1px solid rgba(223, 193, 138, 0.22);
    border-radius: 25px;
    background:
        linear-gradient(120deg, rgba(255, 255, 255, 0.045), transparent 43%),
        linear-gradient(135deg, var(--navy-950), #123651 72%, #1b4863);
    color: #fff;
    box-shadow: 0 20px 46px rgba(7, 23, 37, 0.16);
}

.dashboard-hero::before,
.dashboard-hero::after {
    position: absolute;
    content: "";
    pointer-events: none;
}

.dashboard-hero::before {
    top: -95px;
    right: -45px;
    width: 300px;
    height: 300px;
    border: 1px solid rgba(223, 193, 138, 0.19);
    border-radius: 50%;
    box-shadow: 0 0 0 42px rgba(185, 120, 56, 0.035), 0 0 0 84px rgba(185, 120, 56, 0.025);
}

.dashboard-hero::after {
    inset: auto 0 0;
    height: 3px;
    background: linear-gradient(90deg, var(--copper-700), var(--champagne), transparent 75%);
}

.dashboard-hero--direction {
    background:
        radial-gradient(circle at 85% 16%, rgba(223, 193, 138, 0.18), transparent 28%),
        linear-gradient(135deg, #102536, #173e53 68%, #75502f);
}

.dashboard-hero--personal {
    background:
        radial-gradient(circle at 86% 12%, rgba(90, 134, 176, 0.2), transparent 29%),
        linear-gradient(135deg, var(--navy-950), #193c53);
}

.dashboard-hero__copy,
.dashboard-hero__actions {
    position: relative;
    z-index: 1;
}

.dashboard-hero__copy {
    max-width: 720px;
}

.dashboard-profile-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 11px;
    border: 1px solid rgba(223, 193, 138, 0.38);
    border-radius: 999px;
    background: rgba(7, 23, 37, 0.3);
    color: var(--champagne);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.dashboard-hero h1 {
    max-width: 690px;
    margin: 17px 0 8px;
    font-family: var(--font-serif);
    font-size: clamp(34px, 4vw, 49px);
    line-height: 1.02;
}

.dashboard-hero__copy > p {
    max-width: 650px;
    margin: 0;
    color: rgba(255, 255, 255, 0.7);
    font-size: 13px;
}

.dashboard-hero__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 9px;
}

.dashboard-hero .button--secondary {
    border-color: rgba(255, 255, 255, 0.24);
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
    backdrop-filter: blur(8px);
}

.dashboard-hero .button--secondary:hover {
    border-color: rgba(255, 255, 255, 0.4);
    background: rgba(255, 255, 255, 0.14);
}

.dashboard-hero .button--primary {
    background: linear-gradient(135deg, var(--copper-500), #d2a05e);
    color: #fff;
    box-shadow: 0 10px 24px rgba(7, 23, 37, 0.22);
}

.dashboard-metrics {
    display: grid;
    gap: 11px;
}

.dashboard-metrics--six {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

.dashboard-metrics--four {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.dashboard-metrics > a {
    position: relative;
    display: grid;
    min-height: 126px;
    padding: 16px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--surface);
    box-shadow: 0 9px 25px rgba(7, 23, 37, 0.045);
    transition: 160ms ease;
}

.dashboard-metrics > a::after {
    position: absolute;
    right: -22px;
    bottom: -31px;
    width: 76px;
    height: 76px;
    border-radius: 50%;
    background: rgba(49, 95, 131, 0.045);
    content: "";
}

.dashboard-metrics > a:hover {
    transform: translateY(-2px);
    border-color: #cbbda9;
    box-shadow: 0 14px 32px rgba(7, 23, 37, 0.08);
}

.dashboard-metric__icon {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border-radius: 10px;
    background: var(--teal-100);
    color: var(--teal-600);
}

.dashboard-metrics small {
    align-self: end;
    margin-top: 14px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 750;
    line-height: 1.35;
}

.dashboard-metrics strong {
    color: var(--navy-800);
    font-family: var(--font-serif);
    font-size: 29px;
    line-height: 1;
}

.dashboard-metric--urgent {
    border-color: #dfbcc1 !important;
    background: linear-gradient(145deg, var(--surface), #fff7f7) !important;
}

.dashboard-metric--urgent .dashboard-metric__icon {
    background: var(--danger-soft);
    color: var(--danger);
}

.dashboard-metric--urgent strong {
    color: var(--danger);
}

.dashboard-metric--assigned .dashboard-metric__icon {
    background: var(--sand-100);
    color: var(--copper-700);
}

.dashboard-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(290px, 0.8fr);
    gap: 14px;
}

.dashboard-grid--personal {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dashboard-panel {
    min-width: 0;
    padding: 22px;
}

.dashboard-panel--wide {
    grid-row: span 2;
}

.dashboard-panel--urgent {
    border-color: #e3c7c9;
}

.dashboard-panel__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 13px;
    padding-bottom: 15px;
    border-bottom: 1px solid var(--line-soft);
}

.dashboard-panel__header .eyebrow {
    color: var(--copper-700);
}

.dashboard-panel__header h2 {
    margin: 4px 0 2px;
    color: var(--navy-800);
    font-family: var(--font-serif);
    font-size: 23px;
    line-height: 1.15;
}

.dashboard-panel__header p {
    margin: 0;
    color: var(--muted);
    font-size: 12px;
}

.dashboard-panel__header > a {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 5px;
    padding-top: 4px;
    color: var(--teal-600);
    font-size: 12px;
    font-weight: 800;
}

.dashboard-ticket-list,
.dashboard-compact-list,
.dashboard-team-list,
.dashboard-article-list {
    display: grid;
}

.dashboard-ticket-row {
    display: grid;
    grid-template-columns: 39px minmax(0, 1fr) 18px;
    align-items: center;
    gap: 11px;
    padding: 12px 3px;
    border-bottom: 1px solid var(--line-soft);
}

.dashboard-ticket-row:last-child,
.dashboard-compact-list > a:last-child,
.dashboard-team-list > a:last-child,
.dashboard-article-list > a:last-child {
    border-bottom: 0;
}

.dashboard-ticket-row:hover,
.dashboard-compact-list > a:hover,
.dashboard-team-list > a:hover,
.dashboard-article-list > a:hover {
    color: var(--teal-600);
}

.dashboard-ticket-row__signal,
.dashboard-article-list > a > span:first-child {
    display: grid;
    width: 36px;
    height: 36px;
    place-items: center;
    border-radius: 11px;
    background: var(--teal-100);
    color: var(--teal-600);
}

.dashboard-ticket-row__signal.is-urgent {
    background: var(--danger-soft);
    color: var(--danger);
}

.dashboard-ticket-row__copy {
    display: grid;
    min-width: 0;
    gap: 2px;
}

.dashboard-ticket-row__copy > span {
    display: flex;
    align-items: center;
    gap: 7px;
}

.dashboard-ticket-row em,
.dashboard-compact-list em {
    color: var(--copper-700);
    font-size: 12px;
    font-style: normal;
    font-weight: 850;
    letter-spacing: 0.04em;
}

.dashboard-ticket-row strong,
.dashboard-compact-list strong,
.dashboard-team-list strong,
.dashboard-article-list strong {
    min-width: 0;
    overflow: hidden;
    color: var(--navy-800);
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-ticket-row small,
.dashboard-compact-list small,
.dashboard-team-list small,
.dashboard-article-list small {
    color: var(--muted);
    font-size: 12px;
}

.dashboard-ticket-row .ticket-status-badge,
.dashboard-compact-list .ticket-status-badge {
    padding: 3px 6px;
    font-size: 12px;
}

.dashboard-compact-list > a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 11px 2px;
    border-bottom: 1px solid var(--line-soft);
}

.dashboard-compact-list > a > span {
    display: grid;
    min-width: 0;
    gap: 2px;
}

.dashboard-panel--urgent .dashboard-compact-list > a > .icon {
    color: var(--danger);
}

.dashboard-empty {
    margin: 0;
    padding: 24px 12px;
    color: var(--muted);
    font-size: 12px;
    text-align: center;
}

.dashboard-team-list > a {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    align-items: center;
    gap: 11px;
    padding: 11px 2px;
    border-bottom: 1px solid var(--line-soft);
}

.dashboard-team-list > a > img,
.dashboard-team-list > a > span:first-child:not(:nth-last-child(2)) {
    display: grid;
    width: 36px;
    height: 36px;
    place-items: center;
    border-radius: 50%;
    background: var(--teal-100);
    color: var(--teal-600);
    font-size: 12px;
    font-weight: 850;
    object-fit: cover;
}

.dashboard-team-list > a > span:nth-child(2) {
    display: grid;
    min-width: 0;
}

.dashboard-team-list .status-pill {
    padding: 4px 7px;
    font-size: 12px;
}

.dashboard-article-list > a {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) 15px;
    align-items: center;
    gap: 10px;
    padding: 11px 2px;
    border-bottom: 1px solid var(--line-soft);
}

.dashboard-article-list > a > span:nth-child(2) {
    display: grid;
    min-width: 0;
}

@media (max-width: 1250px) {
    .section-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .section-card {
        min-height: 205px;
    }

    .collaborator-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard-metrics--six {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 1023px) {
    .login-shell {
        background: var(--paper);
    }

    .login-brand-panel {
        display: none;
    }

    .login-form-panel {
        width: 100%;
        padding: 95px 24px 50px;
    }

    .login-language .language-switcher--inverted {
        border-color: var(--line);
        background: var(--surface);
    }

    .login-language .language-switcher--inverted > .icon,
    .login-language .language-switcher--inverted .language-switcher__link {
        color: var(--muted);
    }

    .login-language .language-switcher--inverted .language-switcher__link.is-active {
        background: var(--teal-600);
        color: #fff;
    }

    .login-mobile-brand {
        display: block;
        margin-bottom: 36px;
    }

    .login-mobile-intro {
        display: block;
        margin: -16px 0 24px;
        color: var(--muted);
        font-size: 13px;
        line-height: 1.6;
    }

    .login-public-note {
        display: flex;
        align-items: flex-start;
        gap: 9px;
        margin-top: 25px;
        padding: 13px;
        border: 1px solid #ddc6a8;
        border-radius: 11px;
        background: var(--sand-100);
        color: #725334;
        font-size: 13px;
        line-height: 1.5;
    }

    .app-sidebar {
        transform: translateX(-100%);
    }

    body.menu-open {
        overflow: hidden;
    }

    body.menu-open .app-sidebar {
        transform: translateX(0);
    }

    .app-sidebar__close {
        display: grid;
    }

    .sidebar-scrim {
        position: fixed;
        z-index: 40;
        inset: 0;
        width: 100%;
        background: rgba(5, 31, 43, 0.54);
        backdrop-filter: blur(3px);
    }

    body.menu-open .sidebar-scrim {
        display: block;
    }

    .app-frame {
        padding-left: 0;
    }

    .app-header__menu {
        display: grid;
    }

    .app-main {
        padding: 27px;
    }

    .wiki-columns {
        grid-template-columns: 1fr;
    }

    .wiki-side-column {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .collaborator-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .choice-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .account-grid {
        grid-template-columns: 1fr;
    }

    .ticket-filter-panel form {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ticket-search-field {
        grid-column: 1 / -1;
    }

    .ticket-detail-layout {
        grid-template-columns: 1fr;
    }

    .ticket-detail-side {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard-hero {
        align-items: flex-start;
        flex-direction: column;
    }

    .dashboard-hero__actions {
        justify-content: flex-start;
    }

    .dashboard-grid,
    .dashboard-grid--personal {
        grid-template-columns: 1fr;
    }

    .dashboard-panel--wide {
        grid-row: auto;
    }
}

@media (max-width: 720px) {
    .installer-shell {
        padding: 17px;
    }

    .installer-topbar {
        align-items: flex-start;
        gap: 18px;
    }

    .installer-card {
        padding: 23px;
        border-radius: 20px;
    }

    .installer-form fieldset {
        padding: 17px;
    }

    .form-grid,
    .form-grid--database {
        grid-template-columns: 1fr;
    }

    .field--wide {
        grid-column: auto;
    }

    .login-language {
        top: 18px;
        right: 18px;
    }

    .login-form-panel {
        padding-inline: 19px;
    }

    .login-form-card h2 {
        font-size: 35px;
    }

    .app-header {
        height: 67px;
        padding: 0 15px;
    }

    .breadcrumbs,
    .app-header__secondary {
        display: none;
    }

    .app-header__actions {
        gap: 5px;
    }

    .header-profile-menu > summary {
        width: 46px;
        padding: 4px;
        justify-content: center;
    }

    .header-profile-menu__copy,
    .header-profile-menu__chevron {
        display: none;
    }

    .app-main {
        padding: 15px;
    }

    .dashboard-hero {
        min-height: 0;
        padding: 27px 21px;
        border-radius: 20px;
    }

    .dashboard-hero h1 {
        font-size: 33px;
    }

    .dashboard-hero__actions {
        width: 100%;
    }

    .dashboard-hero__actions .button {
        flex: 1 1 210px;
    }

    .dashboard-metrics--six,
    .dashboard-metrics--four {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard-metrics > a {
        min-height: 118px;
    }

    .dashboard-panel {
        padding: 18px;
    }

    .dashboard-panel__header {
        align-items: flex-start;
        flex-direction: column;
    }

    .wiki-hero {
        padding: 26px 20px;
        border-radius: 20px;
    }

    .wiki-hero h1 {
        font-size: 31px;
    }

    .wiki-search {
        grid-template-columns: 21px minmax(0, 1fr) 42px;
        padding-left: 10px;
    }

    .wiki-search .button {
        width: 42px;
        padding: 0;
    }

    .wiki-search .button > span {
        display: none;
    }

    .wiki-search__mobile-icon {
        display: inline-block;
    }

    .section-grid {
        grid-template-columns: 1fr;
    }

    .section-card {
        min-height: 0;
    }

    .section-card > strong,
    .section-card > p {
        min-height: 0;
    }

    .wiki-side-column {
        grid-template-columns: 1fr;
    }

    .content-panel {
        padding: 17px;
    }

    .article-row {
        grid-template-columns: 42px minmax(0, 1fr);
    }

    .article-row__action {
        display: none;
    }

    .article-document {
        border-radius: 19px;
    }

    .article-document__body {
        font-size: 17px;
    }

    .article-document > footer {
        align-items: flex-start;
        flex-direction: column;
    }

    .release-index {
        padding: 5px 16px;
    }

    .release-index__item {
        grid-template-columns: auto minmax(0, 1fr) 16px;
        gap: 10px;
    }

    .release-index__meta {
        display: none;
    }

    .note-editor-actions {
        align-items: stretch;
        flex-direction: column-reverse;
    }

    .collaborator-intro {
        align-items: stretch;
        flex-direction: column;
    }

    .collaborator-intro .button {
        width: 100%;
    }

    .collaborator-stats,
    .collaborator-grid,
    .collaborator-profile-grid {
        grid-template-columns: 1fr;
    }

    .collaborator-toolbar form {
        grid-template-columns: 1fr;
    }

    .collaborator-card {
        min-height: 0;
    }

    .choice-grid {
        grid-template-columns: 1fr;
    }

    .collaborator-form-actions {
        align-items: stretch;
        flex-direction: column-reverse;
    }

    .collaborator-profile-hero {
        grid-template-columns: 82px minmax(0, 1fr);
        gap: 16px;
    }

    .collaborator-profile-photo {
        width: 82px;
        height: 82px;
        border-radius: 17px;
        font-size: 26px;
    }

    .collaborator-profile-hero > .status-pill {
        grid-column: 1 / -1;
    }

    .profile-data-list > div {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    .account-intro {
        grid-template-columns: 62px minmax(0, 1fr);
        gap: 15px;
    }

    .account-avatar {
        width: 62px;
        height: 62px;
        border-radius: 17px;
        font-size: 20px;
    }

    .account-password-form .button {
        width: 100%;
        justify-self: stretch;
    }

    .account-save-profile {
        width: 100%;
        justify-self: stretch;
    }

    .account-profile-photo-row {
        grid-template-columns: 56px minmax(0, 1fr);
        padding: 11px;
    }

    .account-profile-photo-row > img,
    .account-profile-photo-row > span {
        width: 56px;
        height: 56px;
        border-radius: 13px;
    }

    .header-ticket-button {
        width: 40px;
        padding: 0;
    }

    .header-ticket-button span {
        display: none;
    }

    .ticket-create-intro {
        grid-template-columns: 52px minmax(0, 1fr);
        padding: 18px;
    }

    .ticket-intro-icon {
        width: 52px;
        height: 52px;
    }

    .ticket-product-grid,
    .ticket-type-grid,
    .ticket-urgency-grid,
    .ticket-stats,
    .ticket-attachment-list,
    .ticket-detail-side,
    .ticket-optional-grid {
        grid-template-columns: 1fr;
    }

    .ticket-filter-panel form {
        grid-template-columns: 1fr;
    }

    .ticket-search-field {
        grid-column: auto;
    }

    .ticket-list-intro {
        align-items: stretch;
        flex-direction: column;
    }

    .ticket-list-intro .button {
        width: 100%;
    }

    .ticket-list-row {
        grid-template-columns: 36px minmax(0, 1fr);
    }

    .ticket-list-row__meta {
        grid-column: 2;
    }

    .ticket-list-row__meta > small,
    .ticket-list-row__meta > .icon {
        display: none;
    }

    .ticket-submit-bar {
        position: static;
        align-items: stretch;
        flex-direction: column;
    }

    .ticket-submit-bar .button {
        width: 100%;
    }

    .ticket-detail-hero {
        padding: 20px;
    }

    .ticket-detail-hero__top,
    .ticket-detail-hero__meta {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}

/* Agents · directory, hierarchy and supervision */
.agents-page {
    display: grid;
    gap: 22px;
}

.agent-page-hero {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 190px;
    padding: 34px 38px;
    overflow: hidden;
    border: 1px solid rgba(223, 193, 138, 0.28);
    border-radius: 26px;
    background:
        linear-gradient(120deg, rgba(7, 23, 37, 0.97), rgba(17, 45, 69, 0.94)),
        radial-gradient(circle at 85% 25%, rgba(185, 120, 56, 0.3), transparent 42%);
    box-shadow: 0 24px 55px rgba(7, 23, 37, 0.17);
    color: #fff;
}

.agent-page-hero::after {
    position: absolute;
    right: -75px;
    bottom: -115px;
    width: 330px;
    height: 330px;
    border: 1px solid rgba(223, 193, 138, 0.18);
    border-radius: 50%;
    content: "";
}

.agent-page-hero__copy {
    position: relative;
    z-index: 1;
    max-width: 720px;
}

.agent-page-hero .eyebrow {
    color: var(--champagne);
}

.agent-page-hero h1 {
    margin: 7px 0 9px;
    font-family: var(--font-serif);
    font-size: clamp(34px, 4vw, 49px);
    line-height: 1.05;
}

.agent-page-hero p {
    max-width: 650px;
    margin: 0;
    color: rgba(255, 255, 255, 0.74);
    font-size: 16px;
}

.agent-page-hero__mark {
    position: relative;
    z-index: 1;
    display: grid;
    width: 104px;
    height: 104px;
    place-items: center;
    border: 1px solid rgba(223, 193, 138, 0.33);
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.055);
    color: var(--champagne);
}

.agent-page-hero__mark .icon {
    width: 35px;
    height: 35px;
}

.agent-page-hero__mark span {
    margin-top: -19px;
    font-family: var(--font-serif);
    font-size: 14px;
    font-weight: 800;
    letter-spacing: 0.16em;
}

.agent-scope-notice,
.agent-demo-metrics-note {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 14px 17px;
    border: 1px solid #cadbe7;
    border-radius: 15px;
    background: #eef5f9;
    color: var(--navy-700);
}

.agent-scope-notice p,
.agent-demo-metrics-note p {
    margin: 0;
    font-size: 14px;
}

.agent-demo-notice {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) auto;
    align-items: center;
    gap: 15px;
    padding: 17px 19px;
    border: 1px solid #e3cda8;
    border-radius: 18px;
    background: linear-gradient(105deg, #fff8ec, #fffdfa);
    box-shadow: 0 10px 28px rgba(143, 89, 42, 0.06);
}

.agent-demo-notice__icon {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 14px;
    background: #f4e4c9;
    color: var(--copper-700);
}

.agent-demo-notice strong {
    color: var(--navy-800);
    font-family: var(--font-serif);
    font-size: 19px;
}

.agent-demo-notice p {
    margin: 2px 0 0;
    color: var(--muted);
    font-size: 14px;
}

.button--quiet-danger {
    gap: 8px;
    border: 1px solid #deb9bd;
    background: #fff;
    color: var(--danger);
    font-size: 13px;
}

.button--quiet-danger:hover {
    background: var(--danger-soft);
}

.button--text {
    padding-inline: 11px;
    background: transparent;
    color: var(--teal-600);
    font-size: 13px;
}

.agent-summary-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 13px;
}

.agent-summary-grid > :is(article, a) {
    position: relative;
    display: grid;
    grid-template-columns: 43px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    min-height: 105px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: var(--surface);
    box-shadow: 0 9px 24px rgba(7, 23, 37, 0.05);
    color: inherit;
}

.agent-summary-grid > :is(article, a) > span {
    display: grid;
    width: 43px;
    height: 43px;
    place-items: center;
    border-radius: 13px;
    background: var(--teal-100);
    color: var(--teal-600);
}

.agent-summary-grid > :is(article, a).has-warning > span {
    background: #fff0e2;
    color: #a85c24;
}

.agent-summary-grid > :is(article, a) > div {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.agent-summary-grid small {
    color: var(--muted);
    font-size: 12px;
    font-weight: 750;
}

.agent-summary-grid strong {
    overflow: hidden;
    color: var(--navy-800);
    font-family: var(--font-serif);
    font-size: 22px;
    line-height: 1.15;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.agent-summary-grid > a,
.agent-detail-kpis > a,
.agent-card__metrics > a {
    transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.agent-summary-grid > a:hover,
.agent-summary-grid > a:focus-visible,
.agent-detail-kpis > a:hover,
.agent-detail-kpis > a:focus-visible {
    border-color: rgba(24, 100, 118, 0.48);
    box-shadow: 0 12px 28px rgba(7, 31, 50, 0.1);
    outline: none;
    transform: translateY(-2px);
}

.agent-kpi-link__arrow {
    position: absolute;
    right: 12px;
    bottom: 12px;
    color: var(--teal-600);
}

.agent-directory-panel {
    padding: 27px;
}

.agent-directory-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 20px;
}

.agent-directory-header h2,
.agent-team-panel h2 {
    margin: 2px 0 3px;
    color: var(--navy-800);
    font-family: var(--font-serif);
    font-size: 27px;
}

.agent-directory-header p {
    margin: 0;
    color: var(--muted);
    font-size: 14px;
}

.agent-directory-count {
    flex: 0 0 auto;
    padding: 7px 12px;
    border-radius: 999px;
    background: var(--navy-900);
    color: #fff;
    font-size: 13px;
    font-weight: 800;
}

.agent-filter-bar {
    display: grid;
    grid-template-columns: minmax(240px, 1.7fr) repeat(3, minmax(155px, 0.7fr)) auto auto;
    gap: 10px;
    margin-bottom: 23px;
    padding: 13px;
    border: 1px solid var(--line-soft);
    border-radius: 17px;
    background: #f8f7f5;
}

.agent-filter-bar select {
    min-height: 47px;
    padding: 0 45px 0 14px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background-color: #fff;
    font-size: 13px;
}

.agent-search-field {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    min-height: 47px;
    padding: 0 13px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
    color: var(--muted);
}

.agent-search-field input {
    min-width: 0;
    border: 0;
    background: transparent;
    font-size: 14px;
}

.agent-card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(270px, 1fr));
    gap: 16px;
}

.agent-card {
    position: relative;
    display: flex;
    min-width: 0;
    min-height: 435px;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(7, 23, 37, 0.055);
    transition: 170ms ease;
}

.agent-card:hover {
    transform: translateY(-2px);
    border-color: #c9b897;
    box-shadow: 0 17px 35px rgba(7, 23, 37, 0.09);
}

.agent-card::before {
    position: absolute;
    inset: 0 0 auto;
    height: 4px;
    background: linear-gradient(90deg, var(--teal-600), var(--sand-200));
    content: "";
}

.agent-card--leader::before {
    height: 5px;
    background: linear-gradient(90deg, var(--copper-700), var(--champagne));
}

.agent-card__header {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 21px 19px 14px;
}

.agent-avatar,
.agent-profile-avatar {
    display: grid;
    overflow: hidden;
    place-items: center;
    object-fit: cover;
    border-radius: 16px;
    background: linear-gradient(140deg, var(--navy-800), var(--teal-600));
    color: #fff;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.14);
}

.agent-avatar {
    width: 58px;
    height: 58px;
    font-size: 17px;
    font-weight: 850;
    letter-spacing: 0.06em;
}

.agent-card--leader .agent-avatar {
    background: linear-gradient(140deg, var(--copper-700), #c99a5a);
}

.agent-card__identity {
    min-width: 0;
}

.agent-card__identity h3 {
    overflow: hidden;
    margin: 0;
    color: var(--navy-800);
    font-family: var(--font-serif);
    font-size: 20px;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.agent-card__identity p {
    overflow: hidden;
    margin: 3px 0 0;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.agent-status {
    display: inline-flex;
    align-items: center;
    min-height: 27px;
    padding: 4px 9px;
    border-radius: 999px;
    background: #eef1f2;
    color: var(--navy-700);
    font-size: 12px;
    font-weight: 800;
}

.agent-status--active {
    background: var(--success-soft);
    color: var(--success);
}

.agent-status--onboarding {
    background: #fff1df;
    color: #9c5c20;
}

.agent-status--paused {
    background: #f1ebf7;
    color: #72568b;
}

.agent-status--inactive {
    color: var(--muted);
}

.agent-card__badges,
.agent-profile-hero__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.agent-card__badges {
    min-height: 62px;
    padding: 0 19px 13px;
}

.agent-card__badges > span,
.agent-demo-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    align-self: flex-start;
    padding: 5px 8px;
    border-radius: 8px;
    background: #f2f5f6;
    color: var(--navy-700);
    font-size: 12px;
    font-weight: 700;
}

.agent-demo-badge {
    background: #fff1da !important;
    color: var(--copper-700) !important;
}

.agent-card__team {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0 19px 14px;
    padding: 11px 12px;
    border-left: 3px solid var(--sand-200);
    border-radius: 0 10px 10px 0;
    background: #faf7f1;
}

.agent-card__team small {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.agent-card__team strong {
    overflow: hidden;
    color: var(--navy-800);
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.agent-card__metrics {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    margin: 0 19px;
    overflow: hidden;
    border: 1px solid var(--line-soft);
    border-radius: 13px;
}

.agent-card__metrics > :is(div, a) {
    display: grid;
    gap: 2px;
    min-width: 0;
    padding: 10px 8px;
    text-align: center;
    color: inherit;
}

.agent-card__metrics > :is(div, a) + :is(div, a) {
    border-left: 1px solid var(--line-soft);
}

.agent-card__metrics > a:hover,
.agent-card__metrics > a:focus-visible {
    background: #edf5f7;
    outline: none;
}

.agent-card__metrics strong {
    color: var(--navy-800);
    font-family: var(--font-serif);
    font-size: 20px;
}

.agent-card__metrics .has-warning strong {
    color: #a85c24;
}

.agent-card__metrics small {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.25;
}

.agent-goal-mini {
    display: grid;
    gap: 7px;
    padding: 16px 19px;
}

.agent-goal-mini > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    font-size: 12px;
}

.agent-goal-mini > div span,
.agent-goal-mini > small {
    color: var(--muted);
}

.agent-goal-mini > div strong {
    color: var(--navy-800);
    font-size: 13px;
}

.agent-goal-mini > small {
    font-size: 12px;
}

.agent-progress {
    appearance: none;
    display: block;
    width: 100%;
    height: 7px;
    overflow: hidden;
    border: 0;
    border-radius: 999px;
    background: #e7e7e4;
}

.agent-progress::-webkit-progress-bar {
    border-radius: inherit;
    background: #e7e7e4;
}

.agent-progress::-webkit-progress-value,
.agent-progress::-moz-progress-bar {
    border-radius: inherit;
    background: linear-gradient(90deg, var(--teal-600), var(--sand-200));
}

.agent-card footer {
    margin-top: auto;
    border-top: 1px solid var(--line-soft);
}

.agent-card footer a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 51px;
    padding: 0 19px;
    color: var(--teal-600);
    font-size: 13px;
    font-weight: 850;
}

.agent-empty-state {
    min-height: 220px;
}

.agent-profile-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 370px);
    align-items: center;
    gap: 28px;
    padding: 29px 31px;
    border: 1px solid rgba(223, 193, 138, 0.24);
    border-radius: 25px;
    background: linear-gradient(115deg, var(--navy-950), var(--navy-800));
    box-shadow: 0 22px 55px rgba(7, 23, 37, 0.16);
    color: #fff;
}

.agent-profile-hero__identity {
    display: grid;
    grid-template-columns: 104px minmax(0, 1fr);
    align-items: center;
    gap: 21px;
}

.agent-profile-avatar {
    width: 104px;
    height: 104px;
    border: 2px solid rgba(223, 193, 138, 0.45);
    font-size: 29px;
    font-weight: 850;
}

.agent-profile-hero .eyebrow {
    color: var(--champagne);
}

.agent-profile-hero h1 {
    margin: 4px 0 5px;
    font-family: var(--font-serif);
    font-size: clamp(30px, 4vw, 43px);
    line-height: 1.08;
}

.agent-profile-hero__identity p {
    margin: 0 0 12px;
    color: rgba(255, 255, 255, 0.68);
    font-size: 14px;
}

.agent-profile-hero .agent-status {
    background: rgba(232, 245, 239, 0.13);
    color: #c8f3df;
}

.agent-profile-hero .agent-demo-badge {
    background: rgba(223, 193, 138, 0.15) !important;
    color: var(--champagne) !important;
}

.agent-profile-hero__goal {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 11px 16px;
    padding: 18px 19px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 17px;
    background: rgba(255, 255, 255, 0.055);
}

.agent-profile-hero__goal > div {
    display: grid;
}

.agent-profile-hero__goal span {
    color: rgba(255, 255, 255, 0.62);
    font-size: 12px;
    font-weight: 700;
}

.agent-profile-hero__goal strong {
    font-family: var(--font-serif);
    font-size: 24px;
}

.agent-profile-hero__goal b {
    color: var(--champagne);
    font-size: 17px;
}

.agent-profile-hero__goal .agent-progress {
    grid-column: 1 / -1;
    background: rgba(255, 255, 255, 0.14);
}

.agent-profile-hero__goal .agent-progress::-webkit-progress-bar {
    background: rgba(255, 255, 255, 0.14);
}

.agent-detail-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 11px;
}

.agent-detail-kpis > :is(article, a) {
    position: relative;
    display: grid;
    min-height: 120px;
    padding: 15px;
    border: 1px solid var(--line);
    border-radius: 17px;
    background: var(--surface);
    box-shadow: 0 8px 22px rgba(7, 23, 37, 0.045);
    color: inherit;
}

.agent-detail-kpis > :is(article, a) > span {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;
    border-radius: 10px;
    background: var(--teal-100);
    color: var(--teal-600);
}

.agent-detail-kpis > :is(article, a).has-warning > span {
    background: #fff0e2;
    color: #a85c24;
}

.agent-detail-kpis small {
    align-self: end;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.agent-detail-kpis strong {
    color: var(--navy-800);
    font-family: var(--font-serif);
    font-size: 27px;
    line-height: 1;
}

.agent-detail-layout {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.agent-detail-card {
    min-width: 0;
    padding: 23px;
}

.agent-detail-card > header {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}

.agent-detail-card > header > .icon {
    width: 40px;
    height: 40px;
    padding: 9px;
    border-radius: 12px;
    background: var(--teal-100);
    color: var(--teal-600);
}

.agent-detail-card h2 {
    margin: 0;
    color: var(--navy-800);
    font-family: var(--font-serif);
    font-size: 23px;
}

.agent-detail-card header p {
    margin: 2px 0 0;
    color: var(--muted);
    font-size: 13px;
}

.agent-detail-list,
.agent-revenue-breakdown {
    display: grid;
    margin: 0;
}

.agent-detail-list > div,
.agent-revenue-breakdown > div {
    display: grid;
    grid-template-columns: minmax(125px, 0.7fr) minmax(0, 1.3fr);
    gap: 16px;
    padding: 11px 0;
    border-top: 1px solid var(--line-soft);
}

.agent-detail-list dt,
.agent-revenue-breakdown dt {
    color: var(--muted);
    font-size: 13px;
}

.agent-detail-list dd,
.agent-revenue-breakdown dd {
    min-width: 0;
    margin: 0;
    overflow-wrap: anywhere;
    color: var(--navy-800);
    font-size: 13px;
    font-weight: 750;
}

.agent-detail-list dd a {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: var(--teal-600);
}

.agent-revenue-main {
    display: grid;
    margin: 7px 0 15px;
}

.agent-revenue-main span {
    color: var(--muted);
    font-size: 13px;
}

.agent-revenue-main strong {
    color: var(--navy-800);
    font-family: var(--font-serif);
    font-size: 35px;
}

.agent-progress--large {
    height: 10px;
    margin-bottom: 14px;
}

.agent-specialty-list {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

.agent-specialty-list span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 9px 11px;
    border: 1px solid #d9e4eb;
    border-radius: 10px;
    background: #f1f6f8;
    color: var(--navy-700);
    font-size: 13px;
    font-weight: 750;
}

.agent-team-panel {
    padding: 25px;
}

.agent-team-panel > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 13px;
}

.agent-team-panel > header > strong {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 50%;
    background: var(--navy-900);
    color: #fff;
    font-family: var(--font-serif);
    font-size: 19px;
}

.agent-team-list {
    display: grid;
}

.agent-team-list > a {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) auto 18px;
    align-items: center;
    gap: 12px;
    min-height: 70px;
    padding: 10px 7px;
    border-top: 1px solid var(--line-soft);
}

.agent-team-list > a:hover {
    background: #faf9f6;
}

.agent-team-list__avatar {
    display: grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border-radius: 12px;
    background: var(--teal-100);
    color: var(--teal-600);
    font-size: 13px;
    font-weight: 850;
}

.agent-team-list > a > span:nth-child(2),
.agent-team-list__metric {
    display: grid;
    min-width: 0;
}

.agent-team-list > a strong {
    color: var(--navy-800);
    font-size: 14px;
}

.agent-team-list > a small {
    overflow: hidden;
    color: var(--muted);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.agent-team-list__metric {
    text-align: right;
}

@media (max-width: 1240px) {
    .agent-summary-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .agent-filter-bar {
        grid-template-columns: minmax(230px, 1.5fr) repeat(2, minmax(150px, 0.7fr)) auto;
    }

    .agent-card-grid {
        grid-template-columns: repeat(2, minmax(280px, 1fr));
    }

    .agent-detail-kpis {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 820px) {
    .agent-page-hero {
        padding: 28px;
    }

    .agent-page-hero__mark {
        display: none;
    }

    .agent-demo-notice {
        grid-template-columns: 46px minmax(0, 1fr);
    }

    .agent-demo-notice form {
        grid-column: 1 / -1;
    }

    .agent-demo-notice .button {
        width: 100%;
    }

    .agent-filter-bar,
    .agent-profile-hero,
    .agent-detail-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 620px) {
    .agents-page {
        gap: 17px;
    }

    .agent-page-hero,
    .agent-profile-hero {
        padding: 21px;
        border-radius: 20px;
    }

    .agent-page-hero h1 {
        font-size: 34px;
    }

    .agent-summary-grid,
    .agent-card-grid,
    .agent-detail-kpis {
        grid-template-columns: 1fr;
    }

    .agent-directory-panel {
        padding: 18px;
    }

    .agent-directory-header {
        align-items: flex-start;
    }

    .agent-card {
        min-height: 0;
    }

    .agent-card__header {
        grid-template-columns: 54px minmax(0, 1fr);
    }

    .agent-card__header .agent-status {
        grid-column: 1 / -1;
        justify-self: start;
    }

    .agent-profile-hero__identity {
        grid-template-columns: 76px minmax(0, 1fr);
        gap: 15px;
    }

    .agent-profile-avatar {
        width: 76px;
        height: 76px;
        border-radius: 15px;
        font-size: 22px;
    }

    .agent-profile-hero h1 {
        font-size: 29px;
    }

    .agent-detail-list > div,
    .agent-revenue-breakdown > div {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    .agent-team-list > a {
        grid-template-columns: 44px minmax(0, 1fr) 18px;
    }

    .agent-team-list__metric {
        display: none;
    }
}

/* Budget & sales targets — v0.8.0 */
.budget-page {
    display: grid;
    width: min(100%, 1780px);
    gap: 20px;
}

.budget-hero {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 28px;
    overflow: hidden;
    padding: 36px 40px;
    border: 1px solid rgba(223, 193, 138, 0.18);
    border-radius: 25px;
    background:
        radial-gradient(circle at 90% -20%, rgba(185, 120, 56, 0.34), transparent 36%),
        linear-gradient(135deg, #0b2032, #173a55 72%, #244e6d);
    color: #fff;
    box-shadow: 0 20px 48px rgba(7, 23, 37, 0.14);
}

.budget-hero > div:first-child { max-width: 850px; }
.budget-hero .eyebrow { color: var(--champagne); }
.budget-hero h1,
.budget-section-header h2,
.budget-analysis-grid h2 {
    font-family: var(--font-serif);
}
.budget-hero h1 {
    margin: 8px 0 7px;
    font-size: clamp(32px, 3.2vw, 49px);
    letter-spacing: -0.03em;
    line-height: 1.05;
}
.budget-hero p {
    margin: 0;
    color: rgba(255, 255, 255, 0.72);
    font-size: 15px;
}

.budget-save-state {
    display: inline-flex;
    min-width: 190px;
    align-items: center;
    gap: 9px;
    padding: 10px 14px;
    border: 1px solid rgba(255, 255, 255, 0.17);
    border-radius: 13px;
    background: rgba(5, 19, 30, 0.42);
    font-size: 13px;
}
.budget-save-state > span {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #8abfa9;
    box-shadow: 0 0 0 5px rgba(138, 191, 169, 0.1);
}
.budget-save-state.is-dirty > span { background: var(--champagne); box-shadow: 0 0 0 5px rgba(223, 193, 138, 0.1); }
.budget-save-state.is-saving > span { background: #89b6d4; animation: budget-pulse 900ms infinite alternate; }
.budget-save-state.is-error > span { background: #ee8b91; box-shadow: 0 0 0 5px rgba(238, 139, 145, 0.12); }
@keyframes budget-pulse { to { opacity: 0.35; transform: scale(0.7); } }

.budget-scenario-bar {
    display: grid;
    grid-template-columns: minmax(240px, 0.8fr) minmax(270px, 1.25fr) 125px auto;
    align-items: end;
    gap: 15px;
}
.budget-scenario-bar .field { margin: 0; }
.budget-scenario-bar .button { min-height: 48px; }
.budget-scenario-bar input,
.budget-scenario-bar select,
.budget-summary-panel input,
.budget-ratio-panel input,
.budget-sales-panel input,
.budget-ad-panel input {
    min-height: 48px;
    border: 1px solid #d7d3cd;
    border-radius: 12px;
    background-color: #fff;
    font-size: 14px;
}
.budget-scenario-bar select,
.budget-table select {
    padding-right: 43px;
    background-position: right 15px center;
}

.budget-rate-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(280px, 0.55fr);
    gap: 20px;
}
.budget-section-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 22px;
    margin-bottom: 18px;
}
.budget-section-header h2,
.budget-analysis-grid h2 {
    margin: 3px 0 4px;
    color: var(--navy-900);
    font-size: 24px;
}
.budget-section-header p {
    max-width: 780px;
    margin: 0;
    color: var(--muted);
    font-size: 13px;
}
.budget-rate-cards {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}
.budget-rate-cards article {
    display: grid;
    gap: 6px;
    padding: 16px;
    border: 1px solid #dce4e7;
    border-radius: 16px;
    background: linear-gradient(145deg, #f8fbfc, #fffdfa);
}
.budget-rate-cards article > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.budget-rate-cards small,
.budget-revenue-card small,
.budget-summary-metrics small,
.budget-ad-inputs small,
.budget-ad-results small,
.budget-gap-waterfall small {
    color: var(--muted);
    font-size: 12px;
    font-weight: 750;
}
.budget-rate-cards article > div span {
    padding: 4px 7px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
}
.budget-rate-cards .is-official { background: var(--success-soft); color: var(--success); }
.budget-rate-cards .is-fallback { background: var(--danger-soft); color: var(--danger); }
.budget-rate-cards strong { color: var(--navy-900); font-family: var(--font-serif); font-size: 28px; }
.budget-rate-cards a { width: fit-content; color: var(--teal-600); font-size: 12px; font-weight: 750; }
.budget-rate-cards p { margin: 0; color: var(--muted); font-size: 12px; }

.budget-revenue-card {
    display: flex;
    align-items: center;
    gap: 16px;
    background:
        radial-gradient(circle at 100% 0, rgba(185, 120, 56, 0.16), transparent 45%),
        var(--surface);
}
.budget-revenue-card > span {
    display: grid;
    width: 48px;
    height: 48px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 15px;
    background: var(--sand-100);
    color: var(--copper-700);
}
.budget-revenue-card strong { display: block; margin: 3px 0; color: var(--navy-900); font-family: var(--font-serif); font-size: 27px; }
.budget-revenue-card p { margin: 0; color: var(--muted); font-size: 12px; }

.budget-expense-panel { padding: 26px; }
.budget-section-header--expenses { align-items: center; }
.budget-display-currency { display: grid; flex: 0 0 auto; gap: 6px; }
.budget-display-currency > span { color: var(--muted); font-size: 12px; font-weight: 750; }
.budget-display-currency > div { display: flex; padding: 4px; border: 1px solid var(--line); border-radius: 12px; background: #f1efec; }
.budget-display-currency button {
    min-width: 58px;
    padding: 7px 11px;
    border-radius: 9px;
    background: transparent;
    cursor: pointer;
    font-size: 13px;
    font-weight: 800;
}
.budget-display-currency button.is-active { background: var(--navy-800); color: #fff; box-shadow: 0 5px 15px rgba(7, 23, 37, 0.16); }

.budget-category-list { display: grid; gap: 14px; }
.budget-category {
    overflow: hidden;
    border: 1px solid #d9d5ce;
    border-radius: 17px;
    background: #fff;
}
.budget-category > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 13px 15px;
    border-top: 3px solid var(--copper-500);
    border-bottom: 1px solid var(--line-soft);
    background: linear-gradient(90deg, #fbf7f0, #fff);
}
.budget-category > header > div:first-child { display: flex; min-width: 0; flex: 1 1 auto; align-items: center; gap: 14px; }
.budget-category > header input {
    width: min(100%, 420px);
    min-width: 0;
    padding: 7px 9px;
    border: 1px solid transparent;
    border-radius: 9px;
    background: transparent;
    color: var(--navy-900);
    font-family: var(--font-serif);
    font-size: 19px;
    font-weight: 700;
}
.budget-category > header input:hover,
.budget-category > header input:focus { border-color: var(--line); background: #fff; }
.budget-category > header strong { margin-left: auto; color: var(--copper-700); font-size: 15px; white-space: nowrap; }
.budget-category > header > div:last-child { display: flex; gap: 5px; }
.budget-icon-action,
.budget-mini-action {
    display: grid;
    place-items: center;
    border: 1px solid #d7dcde;
    background: #fff;
    color: var(--navy-700);
    cursor: pointer;
    font-weight: 850;
}
.budget-icon-action { width: 34px; height: 34px; border-radius: 9px; font-size: 15px; }
.budget-mini-action { width: 29px; height: 29px; border-radius: 8px; font-size: 13px; }
.budget-icon-action:hover,
.budget-mini-action:hover { border-color: #aebfc8; background: var(--teal-100); }
.budget-icon-action.is-add { background: var(--navy-800); color: #fff; }
.budget-icon-action.is-delete,
.budget-mini-action.is-delete { color: var(--danger); }

.budget-table-wrap { overflow-x: auto; }
.budget-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.budget-table th { padding: 10px 11px; background: #f6f5f3; color: var(--muted); font-size: 12px; text-align: left; }
.budget-table th:first-child { width: 38%; }
.budget-table th:nth-child(2) { width: 9%; }
.budget-table th:nth-child(3) { width: 15%; }
.budget-table th:nth-child(4) { width: 11%; }
.budget-table th:nth-child(5) { width: 16%; }
.budget-table th:last-child { width: 110px; }
.budget-table td { padding: 9px 11px; border-top: 1px solid var(--line-soft); font-size: 13px; }
.budget-table input,
.budget-table select {
    width: 100%;
    min-height: 40px;
    padding: 7px 10px;
    border: 1px solid #ddd9d2;
    border-radius: 10px;
    background-color: #fff;
    font-size: 13px;
}
.budget-table td:first-child small { display: block; margin: 4px 2px 0; color: var(--muted); font-size: 12px; }
.budget-table tr.is-calculated td { background: #faf7f1; }
.budget-row-total { color: var(--navy-900); font-weight: 800; white-space: nowrap; }
.budget-row-actions { display: flex; justify-content: flex-end; gap: 4px; }

.budget-editor-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-top: 18px;
}
.budget-editor-actions > div { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.budget-import-button { position: relative; overflow: hidden; }
.budget-import-button input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.budget-reset-button { color: var(--danger); }

.budget-analysis-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 20px;
}
.budget-analysis-grid > section { min-width: 0; }
.budget-analysis-grid header { margin-bottom: 17px; }
.budget-summary-panel { grid-column: span 7; }
.budget-ratio-panel { grid-column: span 5; }
.budget-alert-panel { grid-column: span 5; }
.budget-sales-panel { grid-column: span 7; }
.budget-ad-panel { grid-column: span 7; }
.budget-gap-panel { grid-column: span 5; }

.budget-summary-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}
.budget-summary-metrics article,
.budget-summary-metrics label,
.budget-ad-inputs article,
.budget-ad-inputs label {
    display: grid;
    align-content: space-between;
    gap: 9px;
    min-height: 95px;
    padding: 14px;
    border: 1px solid var(--line-soft);
    border-radius: 14px;
    background: #fbfaf8;
}
.budget-summary-metrics article strong,
.budget-ad-inputs article strong { color: var(--navy-900); font-family: var(--font-serif); font-size: 19px; }
.budget-summary-metrics article.is-primary { border-color: rgba(185, 120, 56, 0.33); background: var(--sand-100); }
.budget-summary-metrics label > span,
.budget-sales-panel label > span,
.budget-ad-inputs label > span { color: var(--muted); font-size: 12px; font-weight: 750; }
.budget-input-suffix { display: grid; grid-template-columns: 1fr auto; align-items: center; }
.budget-input-suffix input { border-radius: 12px 0 0 12px; }
.budget-input-suffix b { display: grid; min-width: 38px; min-height: 48px; place-items: center; border: 1px solid #d7d3cd; border-left: 0; border-radius: 0 12px 12px 0; background: #f3f1ee; font-size: 13px; }

.budget-ratio-panel .field { margin: 0; }
.budget-ratio-panel .field small { margin-top: 3px; color: var(--muted); font-size: 12px; }
.budget-reference-value { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin: 14px 0; padding: 13px 14px; border-radius: 13px; background: var(--teal-100); }
.budget-reference-value span { font-size: 13px; font-weight: 750; }
.budget-reference-value strong { color: var(--navy-900); font-family: var(--font-serif); font-size: 20px; }
.budget-category-ratios { display: grid; gap: 10px; }
.budget-category-ratios > div > div { display: flex; justify-content: space-between; gap: 12px; font-size: 12px; }
.budget-category-ratios > div strong { color: var(--navy-800); }
.budget-category-ratios i { display: block; overflow: hidden; height: 7px; margin-top: 5px; border-radius: 99px; background: #ece9e5; }
.budget-category-ratios i b { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--teal-600), var(--copper-500)); }

.budget-ratio-alerts { display: grid; gap: 9px; }
.budget-ratio-alerts article {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 12px;
    padding: 12px 13px;
    border: 1px solid var(--line-soft);
    border-left: 4px solid var(--success);
    border-radius: 12px;
    background: #fff;
}
.budget-ratio-alerts article.is-warning { border-left-color: #bf6c34; background: #fff8f0; }
.budget-ratio-alerts article > div { display: grid; }
.budget-ratio-alerts span { color: var(--navy-900); font-size: 13px; font-weight: 750; }
.budget-ratio-alerts small { color: var(--muted); font-size: 12px; }
.budget-ratio-alerts > article > strong { font-size: 15px; }
.budget-ratio-alerts > article > b { color: var(--success); font-size: 12px; }
.budget-ratio-alerts article.is-warning > b { color: #a65729; }

.budget-sales-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.budget-sales-cards > article { padding: 17px; border: 1px solid var(--line-soft); border-radius: 16px; background: #fbfaf8; }
.budget-sales-cards h3 { margin: 0 0 13px; color: var(--navy-900); font-family: var(--font-serif); font-size: 20px; }
.budget-sales-cards label { display: grid; gap: 6px; margin-top: 9px; }
.budget-sales-result { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 13px; }
.budget-sales-result > span { display: grid; padding: 12px; border-radius: 12px; background: var(--navy-800); color: #fff; text-align: center; }
.budget-sales-result strong { font-family: var(--font-serif); font-size: 25px; }
.budget-sales-result small { color: rgba(255, 255, 255, 0.65); font-size: 12px; }

.budget-ad-inputs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; }
.budget-ad-results { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; margin-top: 11px; }
.budget-ad-results article,
.budget-gap-waterfall article { display: grid; gap: 5px; padding: 13px; border: 1px solid var(--line-soft); border-radius: 13px; background: #fff; }
.budget-ad-results strong,
.budget-gap-waterfall strong { color: var(--navy-900); font-family: var(--font-serif); font-size: 18px; }
.budget-ad-results article.is-positive { background: var(--success-soft); }
.budget-ad-results article.is-negative { background: var(--danger-soft); }
.budget-gap-waterfall { display: grid; gap: 9px; }
.budget-gap-waterfall article { grid-template-columns: 1fr auto; align-items: center; }
.budget-gap-waterfall article.is-warning { border-color: rgba(185, 120, 56, 0.35); background: var(--sand-100); }
.budget-gap-waterfall article.is-positive { border-color: rgba(35, 114, 87, 0.25); background: var(--success-soft); }

@media (min-width: 1501px) {
    .budget-page { max-width: none; }
}

@media (max-width: 1250px) {
    .budget-scenario-bar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .budget-scenario-bar .button { width: 100%; }
    .budget-summary-panel,
    .budget-ratio-panel,
    .budget-alert-panel,
    .budget-sales-panel,
    .budget-ad-panel,
    .budget-gap-panel { grid-column: 1 / -1; }
}

@media (max-width: 900px) {
    .budget-hero,
    .budget-section-header { align-items: flex-start; flex-direction: column; }
    .budget-save-state { min-width: 0; }
    .budget-rate-layout { grid-template-columns: 1fr; }
    .budget-section-header--expenses { align-items: stretch; }
    .budget-display-currency { width: 100%; }
    .budget-display-currency > div { width: 100%; }
    .budget-display-currency button { flex: 1; }
    .budget-summary-metrics,
    .budget-ad-inputs,
    .budget-ad-results { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 680px) {
    .budget-page { gap: 14px; }
    .budget-hero { padding: 25px 22px; border-radius: 20px; }
    .budget-hero h1 { font-size: 32px; }
    .budget-scenario-bar,
    .budget-rate-cards,
    .budget-sales-cards,
    .budget-summary-metrics,
    .budget-ad-inputs,
    .budget-ad-results { grid-template-columns: 1fr; }
    .budget-expense-panel { padding: 18px; }
    .budget-category > header { align-items: flex-start; flex-direction: column; }
    .budget-category > header > div:first-child { width: 100%; align-items: flex-start; flex-direction: column; gap: 5px; }
    .budget-category > header input { width: 100%; }
    .budget-category > header strong { margin-left: 8px; }
    .budget-category > header > div:last-child { width: 100%; justify-content: flex-end; }
    .budget-table,
    .budget-table tbody,
    .budget-table tr,
    .budget-table td { display: block; width: 100%; }
    .budget-table thead { display: none; }
    .budget-table tr { padding: 11px; border-top: 1px solid var(--line-soft); }
    .budget-table td { display: grid; grid-template-columns: 112px minmax(0, 1fr); align-items: center; gap: 10px; padding: 5px 0; border: 0; }
    .budget-table td::before { color: var(--muted); content: attr(data-label); font-size: 12px; font-weight: 750; }
    .budget-table td:first-child { display: block; }
    .budget-table td:first-child::before { display: none; }
    .budget-row-actions { display: flex !important; justify-content: flex-end; }
    .budget-row-actions::before { margin-right: auto; }
    .budget-editor-actions { align-items: stretch; flex-direction: column; }
    .budget-editor-actions > div { justify-content: stretch; }
    .budget-editor-actions .button { flex: 1 1 45%; }
    .budget-analysis-grid { display: grid; grid-template-columns: 1fr; gap: 14px; }
    .budget-analysis-grid > section { grid-column: 1; }
    .budget-ratio-alerts article { grid-template-columns: 1fr auto; }
    .budget-ratio-alerts article > b { grid-column: 1 / -1; }
}

@media print {
    .app-sidebar,
    .app-header,
    .sidebar-scrim,
    .budget-save-state,
    .budget-scenario-bar .button,
    .budget-section-header button,
    .budget-category > header > div:last-child,
    .budget-row-actions,
    .budget-editor-actions { display: none !important; }
    .app-frame { display: block; }
    .app-main.budget-page { width: 100%; padding: 0; }
    .budget-hero { padding: 20px; background: #fff; color: var(--navy-900); box-shadow: none; }
    .budget-hero p { color: var(--muted); }
    .budget-rate-layout,
    .budget-analysis-grid { display: block; }
    .budget-rate-layout > *,
    .budget-analysis-grid > *,
    .budget-expense-panel { margin-bottom: 14px; break-inside: avoid; box-shadow: none; }
    .budget-table-wrap { overflow: visible; }
}

/* Lead Distributor · v0.7.3 */
.lead-distributor-page,
.lead-form-page,
.lead-detail-page {
    display: grid;
    gap: 20px;
    max-width: none;
}

.app-main.lead-distributor-page {
    width: 100%;
}

.lead-distributor-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 25px 28px;
    border: 1px solid #d4dde3;
    border-radius: 22px;
    background: linear-gradient(122deg, #fff 0%, #fbf8f2 72%, #f1e3d2 100%);
    box-shadow: 0 12px 34px rgba(7, 31, 50, 0.07);
}

.lead-distributor-heading h1,
.lead-detail-hero h1 {
    margin: 3px 0 5px;
    color: var(--navy-900);
    font-family: var(--font-serif);
    font-size: clamp(32px, 4vw, 46px);
    line-height: 1.02;
}

.lead-distributor-heading p,
.lead-detail-hero p,
.lead-form-intro p {
    max-width: 800px;
    margin: 0;
    color: var(--muted);
    font-size: 14px;
    line-height: 1.55;
}

.lead-summary-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(170px, 1fr));
    gap: 12px;
}

.lead-summary-strip > a {
    position: relative;
    display: flex;
    align-items: center;
    gap: 13px;
    min-height: 78px;
    padding: 14px 17px;
    border: 1px solid #d8e1e6;
    border-radius: 16px;
    background: #fff;
    color: inherit;
    box-shadow: 0 8px 22px rgba(7, 31, 50, 0.04);
    transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.lead-summary-strip > a > span {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    background: #e8f1f5;
    color: var(--teal-600);
}

.lead-summary-strip > a.has-warning > span {
    background: #fff0e2;
    color: #a65324;
}

.lead-summary-strip > a div {
    display: grid;
}

.lead-summary-strip small {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.lead-summary-strip strong {
    color: var(--navy-900);
    font-family: var(--font-serif);
    font-size: 27px;
    line-height: 1;
}

.lead-summary-strip > a:hover,
.lead-summary-strip > a:focus-visible {
    border-color: rgba(24, 100, 118, 0.52);
    box-shadow: 0 12px 28px rgba(7, 31, 50, 0.1);
    outline: none;
    transform: translateY(-2px);
}

.lead-summary-strip__arrow {
    margin-left: auto;
    color: var(--teal-600);
}

.lead-filter-bar {
    display: grid;
    grid-template-columns: minmax(250px, 1.7fr) repeat(4, minmax(145px, 0.7fr)) auto auto;
    gap: 10px;
    padding: 14px;
    border: 1px solid #d8e1e6;
    border-radius: 17px;
    background: #fff;
}

.lead-filter-bar select,
.lead-filter-bar input {
    width: 100%;
    min-height: 46px;
    border: 1px solid #cbd7de;
    border-radius: 11px;
    background-color: #fff;
    color: var(--navy-800);
    font-size: 13px;
    padding-left: 18px;
}

.lead-filter-bar select {
    padding-right: 40px;
}

.lead-search-field {
    position: relative;
    display: flex;
    align-items: center;
}

.lead-search-field .icon {
    position: absolute;
    left: 14px;
    color: var(--muted);
    pointer-events: none;
}

.lead-search-field input {
    padding-left: 42px;
}

.lead-board-shell {
    min-width: 0;
    overflow: hidden;
    border: 1px solid #ccd8df;
    border-radius: 22px;
    background: #eaf0f3;
    box-shadow: 0 14px 38px rgba(7, 31, 50, 0.08);
}

.lead-board-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 20px;
    border-bottom: 1px solid #cbd7de;
    background: #fff;
}

.lead-board-header > div:first-child {
    display: grid;
}

.lead-board-header strong {
    color: var(--navy-900);
    font-size: 16px;
}

.lead-board-header span {
    color: var(--muted);
    font-size: 12px;
}

.lead-board-scroll-controls {
    display: flex;
    gap: 8px;
}

.lead-board-scroll-controls button {
    width: 38px;
    height: 38px;
    border: 1px solid #c6d3da;
    border-radius: 10px;
    background: #f8fafb;
    color: var(--navy-800);
    font-size: 19px;
    cursor: pointer;
}

.lead-board-scroll-controls button:hover {
    border-color: var(--copper-500);
    background: #fffaf3;
}

.lead-board {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    min-height: 580px;
    padding: 16px 16px 22px;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x proximity;
    scrollbar-color: var(--copper-500) #dce5e9;
    scrollbar-width: auto;
}

.lead-board::-webkit-scrollbar {
    height: 13px;
}

.lead-board::-webkit-scrollbar-track {
    border-radius: 10px;
    background: #dce5e9;
}

.lead-board::-webkit-scrollbar-thumb {
    border: 3px solid #dce5e9;
    border-radius: 10px;
    background: var(--copper-500);
}

.lead-column {
    flex: 0 0 clamp(300px, 18vw, 360px);
    min-height: 525px;
    overflow: hidden;
    border: 1px solid #d0dbe1;
    border-radius: 17px;
    background: #f6f8f9;
    scroll-snap-align: start;
    transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

@media (min-width: 1920px) {
    .app-main.lead-distributor-page {
        padding-right: clamp(38px, 2.2vw, 64px);
        padding-left: clamp(38px, 2.2vw, 64px);
    }

    .lead-board {
        gap: 16px;
        padding-right: 20px;
        padding-left: 20px;
    }
}

.lead-column--unassigned {
    border-top: 4px solid var(--copper-500);
    background: #fffaf4;
}

.lead-column--agent {
    border-top: 4px solid var(--teal-600);
}

.lead-column--absent {
    border-top: 4px solid #9a694d;
    background: #f5efeb;
}

.lead-column.is-drop-target {
    border-color: var(--copper-500);
    box-shadow: 0 0 0 3px rgba(188, 126, 62, 0.2);
    transform: translateY(-2px);
}

.lead-column__header {
    display: grid;
    grid-template-columns: 43px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-height: 78px;
    padding: 13px 14px 11px;
    border-bottom: 1px solid #d8e1e6;
    background: rgba(255, 255, 255, 0.86);
}

.lead-agent-avatar,
.lead-column__symbol {
    display: grid;
    width: 43px;
    height: 43px;
    place-items: center;
    border-radius: 12px;
    background: var(--navy-900);
    color: #fff;
    font-size: 13px;
    font-weight: 850;
}

.lead-column__symbol {
    background: #fff0df;
    color: #9c5c27;
}

.lead-column__symbol--absent {
    background: #efe0d7;
    color: #855035;
}

.lead-column__identity {
    min-width: 0;
}

.lead-column__identity h2 {
    overflow: hidden;
    margin: 0 0 2px;
    color: var(--navy-900);
    font-size: 15px;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lead-column__identity p {
    overflow: hidden;
    margin: 0;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lead-column__count {
    display: grid;
    min-width: 31px;
    height: 31px;
    padding: 0 8px;
    place-items: center;
    border-radius: 10px;
    background: #e7eef2;
    color: var(--navy-800);
    font-size: 14px;
}

.lead-column__metrics {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px;
    border-bottom: 1px solid #d8e1e6;
    background: #d8e1e6;
}

.lead-column__metrics a {
    display: grid;
    min-width: 0;
    padding: 8px 5px;
    background: #fff;
    color: var(--muted);
    font-size: 12px;
    text-align: center;
    transition: background-color 150ms ease, color 150ms ease;
}

.lead-column__metrics a:hover,
.lead-column__metrics a:focus-visible {
    background: #edf5f7;
    color: var(--teal-600);
    outline: none;
}

.lead-column__metrics strong {
    color: var(--navy-900);
    font-size: 14px;
}

.lead-column__metrics .is-warning strong {
    color: #ad492f;
}

.lead-column__cards {
    display: grid;
    gap: 10px;
    padding: 11px;
}

.lead-column__empty {
    margin: 28px 8px;
    color: var(--muted);
    font-size: 13px;
    text-align: center;
}

.lead-card {
    position: relative;
    padding: 13px;
    border: 1px solid #d8e0e4;
    border-left: 4px solid #7d9aab;
    border-radius: 13px;
    background: #fff;
    box-shadow: 0 5px 14px rgba(7, 31, 50, 0.05);
    cursor: pointer;
    transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}

.lead-card--watch { border-left-color: #c9913d; }
.lead-card--urgent { border-left-color: #d36436; }
.lead-card--overdue { border-left-color: #aa3440; }
.lead-card:hover,
.lead-card:focus-visible {
    border-color: rgba(24, 100, 118, 0.55);
    box-shadow: 0 10px 24px rgba(7, 31, 50, 0.12);
    outline: none;
    transform: translateY(-2px);
}

.lead-card.is-dragging {
    opacity: 0.58;
    cursor: grabbing;
    transform: scale(0.985);
}

.lead-touch-dragging {
    overscroll-behavior: none;
    user-select: none;
}

.lead-card > header,
.lead-card > footer,
.lead-card > header > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 7px;
}

.lead-language {
    display: inline-flex;
    padding: 4px 7px;
    border-radius: 7px;
    background: #e3eef3;
    color: #13566a;
    font-size: 12px;
    font-weight: 850;
}

.lead-code {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.lead-priority {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}

.lead-priority i {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #7d9aab;
}

.lead-priority--watch i { background: #c9913d; }
.lead-priority--urgent i { background: #d36436; }
.lead-priority--overdue i { background: #aa3440; }

.lead-card h3 {
    margin: 10px 0 8px;
    font-size: 15px;
    line-height: 1.25;
}

.lead-card h3 a {
    color: var(--navy-900);
}

.lead-card h3 a:hover {
    color: var(--teal-600);
}

.lead-card__tags,
.lead-card__signals {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.lead-card__tags span {
    padding: 5px 7px;
    border-radius: 7px;
    background: #f0f3f4;
    color: #506572;
    font-size: 12px;
    font-weight: 700;
}

.lead-card__area,
.lead-absent-owner {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin: 9px 0;
    color: var(--navy-700);
    font-size: 13px;
    line-height: 1.35;
}

.lead-absent-owner {
    padding: 7px 8px;
    border-radius: 8px;
    background: #fff0e8;
    color: #8e432f;
    font-weight: 750;
}

.lead-card__timing {
    display: grid;
    gap: 5px;
    margin: 10px 0;
}

.lead-card__timing div {
    display: grid;
    grid-template-columns: 88px minmax(0, 1fr);
    gap: 7px;
}

.lead-card__timing dt,
.lead-card__timing dd {
    margin: 0;
    font-size: 12px;
    line-height: 1.35;
}

.lead-card__timing dt { color: var(--muted); }
.lead-card__timing dd { color: var(--navy-700); font-weight: 650; }

.lead-card > footer {
    margin-top: 10px;
    padding-top: 9px;
    border-top: 1px solid #e5eaed;
}

.lead-card__signals span {
    display: grid;
    width: 29px;
    height: 29px;
    place-items: center;
    border-radius: 8px;
    background: #edf3f5;
    color: #35687b;
}

.lead-card__signals span.is-warning {
    background: #fff0e2;
    color: #a65324;
}

.lead-transfer-button {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 7px 8px;
    border: 0;
    background: transparent;
    color: var(--teal-600);
    font-size: 12px;
    font-weight: 850;
    cursor: pointer;
}

.lead-transfer-dialog {
    width: min(610px, calc(100vw - 30px));
    max-height: calc(100vh - 30px);
    padding: 0;
    overflow: auto;
    border: 0;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 28px 80px rgba(3, 21, 35, 0.3);
}

.lead-transfer-dialog::backdrop {
    background: rgba(4, 25, 40, 0.64);
    backdrop-filter: blur(3px);
}

.lead-transfer-dialog header {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) 36px;
    gap: 13px;
    padding: 21px 22px 17px;
    border-bottom: 1px solid #dce4e8;
    background: linear-gradient(120deg, #f8fbfc, #fff7ed);
}

.lead-transfer-dialog header h2 {
    margin: 2px 0;
    color: var(--navy-900);
    font-family: var(--font-serif);
    font-size: 27px;
}

.lead-transfer-dialog header p {
    margin: 0;
    color: var(--muted);
    font-size: 13px;
}

.lead-transfer-dialog header > button {
    width: 36px;
    height: 36px;
    border: 1px solid #cdd8de;
    border-radius: 10px;
    background: #fff;
    color: var(--navy-800);
    font-size: 22px;
    cursor: pointer;
}

.lead-transfer-dialog__icon {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    background: var(--navy-900);
    color: #fff;
}

.lead-transfer-dialog__body {
    display: grid;
    gap: 15px;
    padding: 20px 22px;
}

.lead-transfer-dialog footer {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 15px 22px 20px;
    border-top: 1px solid #e0e7ea;
}

.lead-transfer-error {
    margin: 0;
    padding: 10px 12px;
    border-radius: 9px;
    background: #fff0f1;
    color: #9d2f3d;
    font-size: 13px;
}

.lead-toast {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 80;
    max-width: 390px;
    padding: 14px 17px;
    border-radius: 12px;
    background: var(--navy-900);
    color: #fff;
    box-shadow: 0 16px 40px rgba(4, 25, 40, 0.3);
    font-size: 13px;
    font-weight: 750;
}

.lead-create-form,
.lead-detail-main {
    display: grid;
    gap: 17px;
}

.lead-form-card,
.lead-detail-card,
.lead-history-card,
.lead-transfer-panel {
    padding: 24px;
}

.lead-form-card > header,
.lead-detail-card > header,
.lead-transfer-panel > header {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 19px;
}

.lead-form-card > header > span {
    display: grid;
    width: 34px;
    height: 34px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 10px;
    background: var(--navy-900);
    color: #fff;
    font-size: 13px;
    font-weight: 850;
}

.lead-form-card h2,
.lead-detail-card h2,
.lead-history-card h2,
.lead-transfer-panel h2 {
    margin: 0 0 3px;
    color: var(--navy-900);
    font-family: var(--font-serif);
    font-size: 23px;
}

.lead-form-card header p,
.lead-transfer-panel header p {
    margin: 0;
    color: var(--muted);
    font-size: 13px;
}

.lead-form-submit {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding-bottom: 20px;
}

.lead-detail-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    padding: 26px 28px;
    border: 1px solid #d6e0e5;
    border-radius: 22px;
    background: linear-gradient(125deg, #fff 0%, #f9fbfc 70%, #f5e9dc 100%);
}

.lead-detail-hero > div > .lead-language {
    margin-right: 9px;
}

.lead-detail-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.65fr) minmax(310px, 0.75fr);
    align-items: start;
    gap: 18px;
}

.lead-detail-layout--single {
    grid-template-columns: minmax(0, 1fr);
}

.lead-detail-list {
    display: grid;
    gap: 1px;
    margin: 0;
    border: 1px solid #dce4e8;
    border-radius: 12px;
    overflow: hidden;
    background: #dce4e8;
}

.lead-detail-list > div {
    display: grid;
    grid-template-columns: 160px minmax(0, 1fr);
    gap: 14px;
    padding: 11px 13px;
    background: #fff;
}

.lead-detail-list dt,
.lead-detail-list dd {
    margin: 0;
    font-size: 13px;
}

.lead-detail-list dt { color: var(--muted); }
.lead-detail-list dd { color: var(--navy-800); font-weight: 700; overflow-wrap: anywhere; }
.lead-detail-list a { color: var(--teal-600); }

.lead-detail-note {
    margin-top: 14px;
    padding: 14px;
    border-left: 4px solid var(--copper-500);
    border-radius: 9px;
    background: #fff8ef;
}

.lead-detail-note strong,
.lead-detail-note p {
    color: var(--navy-800);
    font-size: 13px;
}

.lead-detail-note p { margin: 5px 0 0; line-height: 1.55; }

.lead-history-card > header { margin-bottom: 12px; }
.lead-history-list { display: grid; }

.lead-history-list article {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 11px;
    padding: 14px 3px;
    border-top: 1px solid #e0e6e9;
}

.lead-history-list article > span {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border-radius: 10px;
    background: #e8f1f5;
    color: var(--teal-600);
}

.lead-history-list strong { color: var(--navy-800); font-size: 13px; }
.lead-history-list p { margin: 3px 0; color: var(--muted); font-size: 13px; }
.lead-history-list small { color: var(--muted); font-size: 12px; }
.lead-history-list blockquote { margin: 8px 0; padding: 9px 11px; border-left: 3px solid var(--copper-500); background: #fbf7f1; color: var(--navy-700); font-size: 13px; }

.lead-transfer-panel {
    position: sticky;
    top: 92px;
}

.lead-transfer-panel > header > span {
    display: grid;
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 12px;
    background: var(--navy-900);
    color: #fff;
}

.lead-transfer-panel form {
    display: grid;
    gap: 14px;
}

.lead-current-assignment {
    display: block;
    padding: 12px;
    border-radius: 10px;
    background: #edf3f5;
    color: var(--navy-800);
    font-size: 14px;
}

.lead-list-page {
    display: grid;
    gap: 18px;
    width: min(100%, 1720px);
    max-width: none;
}

.lead-list-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 25px 28px;
    border: 1px solid #d6e0e5;
    border-radius: 22px;
    background: linear-gradient(125deg, #fff 0%, #f8fbfc 72%, #f4e7d8 100%);
}

.lead-list-hero h1 {
    margin: 5px 0 7px;
    color: var(--navy-900);
    font-family: var(--font-serif);
    font-size: clamp(29px, 3vw, 42px);
}

.lead-list-hero p {
    max-width: 780px;
    margin: 0;
    color: var(--muted);
    font-size: 14px;
    line-height: 1.55;
}

.lead-list-hero__count {
    display: grid;
    min-width: 128px;
    padding: 16px 20px;
    border: 1px solid rgba(188, 126, 62, 0.35);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.82);
    text-align: center;
}

.lead-list-hero__count strong {
    color: var(--navy-900);
    font-family: var(--font-serif);
    font-size: 32px;
    line-height: 1;
}

.lead-list-hero__count span {
    margin-top: 4px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 750;
}

.lead-list-filter-bar {
    grid-template-columns: minmax(250px, 1.65fr) repeat(5, minmax(130px, 0.72fr)) auto auto;
}

.lead-list {
    display: grid;
    gap: 10px;
}

.lead-list-row {
    position: relative;
    display: grid;
    grid-template-columns: minmax(210px, 1.2fr) repeat(4, minmax(125px, 0.72fr)) auto 31px;
    align-items: center;
    gap: 14px;
    min-height: 105px;
    padding: 16px 17px;
    border: 1px solid #d7e0e5;
    border-left: 5px solid #7d9aab;
    border-radius: 16px;
    background: #fff;
    color: inherit;
    box-shadow: 0 6px 18px rgba(7, 31, 50, 0.045);
    transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.lead-list-row--watch { border-left-color: #c9913d; }
.lead-list-row--urgent { border-left-color: #d36436; }
.lead-list-row--overdue { border-left-color: #aa3440; }

.lead-list-row:hover,
.lead-list-row:focus-visible {
    border-color: rgba(24, 100, 118, 0.5);
    border-left-color: var(--copper-500);
    box-shadow: 0 12px 28px rgba(7, 31, 50, 0.11);
    outline: none;
    transform: translateY(-2px);
}

.lead-list-row__identity,
.lead-list-row__cell {
    display: grid;
    min-width: 0;
}

.lead-list-row__identity > div {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 7px;
}

.lead-list-row__identity > strong {
    overflow: hidden;
    color: var(--navy-900);
    font-size: 15px;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lead-list-row__cell {
    gap: 3px;
}

.lead-list-row__cell small {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.lead-list-row__cell strong,
.lead-list-row__cell span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lead-list-row__cell strong {
    color: var(--navy-800);
    font-size: 13px;
}

.lead-list-row__cell span {
    color: var(--muted);
    font-size: 12px;
}

.lead-list-row__open {
    display: grid;
    width: 31px;
    height: 31px;
    place-items: center;
    border-radius: 9px;
    background: #e8f1f5;
    color: var(--teal-600);
}

.lead-list-empty {
    min-height: 260px;
}

@media (max-width: 1240px) {
    .lead-filter-bar {
        grid-template-columns: minmax(240px, 1.5fr) repeat(2, minmax(145px, 0.7fr)) auto;
    }

    .lead-list-filter-bar {
        grid-template-columns: minmax(240px, 1.4fr) repeat(3, minmax(140px, 0.72fr)) auto;
    }

    .lead-list-row {
        grid-template-columns: repeat(3, minmax(0, 1fr)) 34px;
        align-items: start;
    }

    .lead-list-row__identity {
        grid-column: 1 / 3;
    }

    .lead-detail-layout {
        grid-template-columns: 1fr;
    }

    .lead-transfer-panel {
        position: static;
    }
}

@media (max-width: 820px) {
    .lead-distributor-toolbar {
        align-items: flex-start;
        flex-direction: column;
    }

    .lead-distributor-toolbar .button {
        width: 100%;
    }

    .lead-summary-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .lead-filter-bar {
        grid-template-columns: 1fr 1fr;
    }

    .lead-list-hero {
        align-items: flex-start;
    }

    .lead-list-filter-bar {
        grid-template-columns: 1fr 1fr;
    }

    .lead-list-row {
        grid-template-columns: 1fr 1fr 34px;
    }

    .lead-list-row__identity {
        grid-column: 1 / 3;
    }

    .lead-search-field {
        grid-column: 1 / -1;
    }
}

@media (max-width: 620px) {
    .lead-distributor-page,
    .lead-form-page,
    .lead-detail-page {
        gap: 15px;
    }

    .lead-distributor-toolbar,
    .lead-detail-hero {
        padding: 21px;
        border-radius: 18px;
    }

    .lead-summary-strip,
    .lead-filter-bar,
    .lead-detail-hero {
        grid-template-columns: 1fr;
    }

    .lead-summary-strip > a {
        min-height: 70px;
    }

    .lead-list-hero {
        align-items: stretch;
        flex-direction: column;
        padding: 21px;
    }

    .lead-list-hero__count {
        grid-template-columns: auto 1fr;
        align-items: baseline;
        justify-content: start;
        gap: 9px;
        min-width: 0;
        text-align: left;
    }

    .lead-list-filter-bar {
        grid-template-columns: 1fr;
    }

    .lead-list-row {
        grid-template-columns: 1fr 34px;
        gap: 12px;
    }

    .lead-list-row__identity {
        grid-column: 1;
    }

    .lead-list-row__cell,
    .lead-list-row > .lead-priority {
        grid-column: 1 / -1;
    }

    .lead-list-row__open {
        grid-column: 2;
        grid-row: 1;
    }

    .lead-filter-bar {
        display: grid;
    }

    .lead-search-field {
        grid-column: auto;
    }

    .lead-board-header {
        padding: 13px 14px;
    }

    .lead-column {
        flex-basis: min(85vw, 316px);
    }

    .lead-form-card,
    .lead-detail-card,
    .lead-history-card,
    .lead-transfer-panel {
        padding: 18px;
    }

    .lead-detail-hero {
        display: grid;
    }

    .lead-detail-list > div {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    .lead-transfer-dialog footer,
    .lead-form-submit {
        flex-direction: column-reverse;
    }

    .lead-transfer-dialog footer .button,
    .lead-form-submit .button {
        width: 100%;
    }
}

.agent-team-assignment {
    display: flex;
    align-items: end;
    gap: 12px;
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid #e2e7e8;
}

.agent-team-assignment .field {
    flex: 1;
}

.agent-team-assignment .button {
    min-height: 48px;
}

@media (max-width: 640px) {
    .agent-team-assignment {
        align-items: stretch;
        flex-direction: column;
    }

    .agent-team-assignment .button {
        width: 100%;
    }
}



/* Lead contact actions */
.lead-whatsapp {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 40px;
    padding: 9px 11px;
    border: 1px solid #a9d5bf;
    border-radius: 10px;
    background: #e9f6ef;
    color: #16623f;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.3;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
}
.lead-whatsapp:hover { background: #d7edde; color: #104e31; }
.lead-whatsapp:focus-visible { outline: 3px solid #176d48; outline-offset: 3px; }
.lead-whatsapp.is-unavailable {
    border-color: #dbe2e5;
    background: #f1f4f5;
    color: #6d7980;
    cursor: help;
}
.lead-whatsapp .icon { flex-shrink: 0; }
.lead-card__actions, .lead-contact-actions, .lead-list-row__actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}
.lead-card__actions { justify-content: flex-end; }
.lead-card > footer { flex-wrap: wrap; }
.commercial-lead-card__contact { padding: 0 12px 12px; }
.commercial-lead-card__contact .lead-whatsapp { width: 100%; }
.commercial-lead-hero__actions .lead-whatsapp { min-height: 44px; font-size: 14px; }
.lead-list-row { grid-template-columns: minmax(180px, 1.2fr) repeat(4, minmax(105px, .72fr)) auto auto; }
.lead-list-row__link { color: inherit; }
.lead-list-row__link::after { position: absolute; inset: 0; border-radius: 16px; content: ''; }
.lead-list-row__link:focus-visible { outline: none; }
.lead-list-row__link:focus-visible::after { outline: 3px solid var(--teal-600); outline-offset: 3px; }
.lead-list-row__actions { flex-wrap: nowrap; }
.lead-phone-hint { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
@media (max-width: 1440px) {
    .lead-list-row { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; }
    .lead-list-row__identity { grid-column: 1 / 3; }
    .lead-list-row__actions { grid-column: 3; grid-row: 1; justify-self: end; }
}
@media (max-width: 820px) {
    .lead-list-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .lead-list-row__identity { grid-column: 1 / -1; }
    .lead-list-row__actions { grid-column: 1 / -1; grid-row: auto; justify-self: stretch; justify-content: space-between; }
    .lead-list-row__actions .lead-whatsapp { min-height: 44px; }
}
@media (max-width: 620px) {
    .lead-list-row { grid-template-columns: minmax(0, 1fr); }
    .lead-list-row__identity, .lead-list-row__cell, .lead-list-row > .lead-priority { grid-column: 1; }
}
