:root {
    --llg-teal: #009b90;
    --llg-teal-dark: #006c65;
    --llg-mint: #e8f7f4;
    --llg-ink: #17233c;
    --llg-muted: #667085;
    --llg-canvas: #f3f5f9;
    --llg-border: #dfe5ec;
    --llg-success: #177b5b;
    --llg-warning: #a55b08;
    --llg-danger: #b42318;
    --llg-radius: 16px;
    --llg-shadow: 0 10px 30px rgba(23, 35, 60, 0.06);
}

.llg-page {
    color: var(--llg-ink);
    margin: 0 auto;
    max-width: 1480px;
    padding: 0 18px;
}

.llg-eyebrow {
    color: var(--llg-teal-dark);
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    margin: 0 0 5px;
    text-transform: uppercase;
}

.llg-page-title {
    color: var(--llg-ink);
    font-size: clamp(1.55rem, 2vw, 2rem);
    font-weight: 750;
    letter-spacing: -0.025em;
    margin: 0;
}

.llg-page-copy {
    color: var(--llg-muted);
    margin: 6px 0 0;
    max-width: 760px;
}

.llg-panel {
    background: #fff;
    border: 1px solid var(--llg-border);
    border-radius: var(--llg-radius);
    box-shadow: var(--llg-shadow);
}

.llg-icon {
    align-items: center;
    background: var(--llg-mint);
    border-radius: 13px;
    color: var(--llg-teal-dark);
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 1.45rem;
    height: 48px;
    justify-content: center;
    width: 48px;
}

.llg-btn-primary,
.llg-btn-secondary {
    align-items: center;
    border-radius: 10px;
    display: inline-flex;
    font-weight: 700;
    gap: 8px;
    justify-content: center;
    min-height: 44px;
    padding: 10px 16px;
    text-decoration: none;
    transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.llg-btn-primary {
    background: var(--llg-teal);
    border: 1px solid var(--llg-teal);
    color: #fff;
    box-shadow: 0 8px 18px rgba(0, 155, 144, .18);
}

.llg-btn-primary:hover,
.llg-btn-primary:focus {
    background: var(--llg-teal-dark);
    border-color: var(--llg-teal-dark);
    color: #fff;
    transform: translateY(-1px);
}

.llg-btn-secondary {
    background: #fff;
    border: 1px solid #9bcfc9;
    color: var(--llg-teal-dark);
}

.llg-btn-secondary:hover,
.llg-btn-secondary:focus {
    background: var(--llg-mint);
    color: var(--llg-teal-dark);
}

.llg-status-chip {
    align-items: center;
    background: #eef2f6;
    border-radius: 999px;
    color: #475467;
    display: inline-flex;
    font-size: .76rem;
    font-weight: 750;
    line-height: 1;
    min-height: 26px;
    padding: 6px 10px;
    white-space: nowrap;
}

.llg-status-chip[data-status="Approved"],
.llg-status-chip[data-status="Released"],
.llg-status-chip[data-status="Succeeded"],
.llg-status-chip[data-status="Completed"],
.llg-status-chip[data-status="Delivered"],
.llg-status-chip[data-status="Active"] {
    background: #e8f7ef;
    color: var(--llg-success);
}

.llg-status-chip[data-status="Pending"],
.llg-status-chip[data-status="Draft"],
.llg-status-chip[data-status="Quarantined"],
.llg-status-chip[data-status="Held"] {
    background: #fff5e6;
    color: var(--llg-warning);
}

.llg-status-chip[data-status="Failed"],
.llg-status-chip[data-status="Rejected"],
.llg-status-chip[data-status="DeadLetter"] {
    background: #fff0ee;
    color: var(--llg-danger);
}

/* Landing */
.llg-landing {
    background: linear-gradient(140deg, #fff 0%, #f7fbfb 64%, #eaf8f6 100%);
    color: var(--llg-ink);
    min-height: 100vh;
}

.llg-landing-inner {
    margin: 0 auto;
    max-width: 1440px;
    padding: 28px clamp(20px, 5vw, 72px) 54px;
}

.llg-landing-brand {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin-bottom: clamp(34px, 5vw, 70px);
}

.llg-landing-logo {
    height: auto;
    width: 154px;
}

.llg-secure-note {
    align-items: center;
    color: var(--llg-teal-dark);
    display: flex;
    font-size: .86rem;
    font-weight: 700;
    gap: 8px;
}

.llg-hero-grid {
    align-items: center;
    display: grid;
    gap: clamp(36px, 6vw, 88px);
    grid-template-columns: minmax(0, .9fr) minmax(520px, 1.1fr);
}

.llg-hero-title {
    color: var(--llg-ink);
    font-size: clamp(3.1rem, 6vw, 6rem);
    font-weight: 800;
    letter-spacing: -.055em;
    line-height: .96;
    margin: 17px 0 22px;
}

.llg-hero-copy {
    color: #465266;
    font-size: clamp(1rem, 1.3vw, 1.15rem);
    line-height: 1.75;
    max-width: 650px;
}

.llg-trust-line {
    align-items: center;
    color: var(--llg-teal-dark);
    display: flex;
    font-size: .92rem;
    font-weight: 700;
    gap: 10px;
    margin: 24px 0;
}

.llg-trust-line i {
    align-items: center;
    background: var(--llg-mint);
    border-radius: 50%;
    display: inline-flex;
    font-size: 1.15rem;
    height: 34px;
    justify-content: center;
    width: 34px;
}

.llg-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 11px;
}

.llg-flow-visual {
    background: rgba(255,255,255,.88);
    border: 1px solid rgba(0,108,101,.18);
    border-radius: 22px;
    box-shadow: 0 24px 65px rgba(23,35,60,.08);
    overflow: hidden;
    padding: clamp(22px, 3vw, 38px);
    position: relative;
}

.llg-flow-label {
    color: var(--llg-teal-dark);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .13em;
    margin-bottom: 24px;
    text-transform: uppercase;
}

.llg-flow-grid {
    display: grid;
    gap: 20px 12px;
    grid-template-columns: repeat(4, 1fr);
    position: relative;
}

.llg-flow-grid::before,
.llg-flow-grid::after {
    background: var(--llg-teal-dark);
    content: "";
    height: 2px;
    left: 9%;
    opacity: .55;
    position: absolute;
    right: 9%;
}

.llg-flow-grid::before { top: 27px; }
.llg-flow-grid::after { bottom: 52px; }

.llg-flow-node {
    min-width: 0;
    position: relative;
    text-align: center;
    z-index: 1;
}

.llg-flow-node i {
    align-items: center;
    background: #fff;
    border: 1px solid #a8d5d1;
    border-radius: 50%;
    color: var(--llg-teal-dark);
    display: inline-flex;
    font-size: 1.45rem;
    height: 54px;
    justify-content: center;
    width: 54px;
}

.llg-flow-node strong,
.llg-flow-node small {
    display: block;
}

.llg-flow-node strong {
    font-size: .78rem;
    margin-top: 9px;
}

.llg-flow-node small {
    color: var(--llg-muted);
    font-size: .7rem;
    margin-top: 3px;
}

.llg-flow-core {
    align-items: center;
    background: var(--llg-mint);
    border: 1px solid #b9ded9;
    border-radius: 14px;
    display: flex;
    gap: 14px;
    grid-column: 2 / span 2;
    padding: 14px 18px;
    text-align: left;
}

.llg-flow-core i { border: 0; font-size: 1.8rem; height: auto; width: auto; }
.llg-flow-core strong { color: var(--llg-teal-dark); margin: 0; }
.llg-flow-core small { color: var(--llg-muted); display: block; font-size: .72rem; line-height: 1.45; margin-top: 3px; }

.llg-value-band {
    background: rgba(232,247,244,.72);
    border: 1px solid rgba(0,108,101,.12);
    border-radius: 18px;
    display: grid;
    gap: 0;
    grid-template-columns: repeat(3, 1fr);
    margin-top: clamp(42px, 6vw, 76px);
}

.llg-value-item {
    align-items: center;
    display: flex;
    gap: 14px;
    padding: 24px;
}

.llg-value-item + .llg-value-item { border-left: 1px solid rgba(0,108,101,.15); }
.llg-value-item i { color: var(--llg-teal-dark); font-size: 1.8rem; }
.llg-value-item strong { display: block; font-size: .95rem; }
.llg-value-item span { color: var(--llg-muted); display: block; font-size: .82rem; margin-top: 3px; }

.llg-pillars { padding-top: 52px; }
.llg-section-heading { margin: 0 auto 24px; max-width: 660px; text-align: center; }
.llg-section-heading h2 { color: var(--llg-ink); font-size: clamp(1.6rem, 3vw, 2.35rem); margin-bottom: 8px; }
.llg-section-heading p { color: var(--llg-muted); }
.llg-pillar-grid { display: grid; gap: 18px; grid-template-columns: repeat(3, 1fr); }
.llg-pillar-card { background: #fff; border: 1px solid var(--llg-border); border-radius: 16px; display: flex; gap: 18px; padding: 25px; }
.llg-pillar-card h3 { color: var(--llg-teal-dark); font-size: 1rem; margin: 0 0 7px; }
.llg-pillar-card p { color: var(--llg-muted); font-size: .88rem; line-height: 1.6; margin: 0; }

.llg-landing-footer {
    align-items: center;
    border-top: 1px solid var(--llg-border);
    color: var(--llg-muted);
    display: flex;
    font-size: .82rem;
    justify-content: space-between;
    margin-top: 48px;
    padding-top: 22px;
}

@keyframes llg-rise {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}

.llg-hero-copy-block { animation: llg-rise .55s ease-out both; }
.llg-flow-visual { animation: llg-rise .6s .08s ease-out both; }
.llg-value-band { animation: llg-rise .55s .16s ease-out both; }

/* Dashboard */
.llg-dashboard-header,
.llg-workspace-header,
.llg-form-header {
    align-items: flex-end;
    display: flex;
    gap: 24px;
    justify-content: space-between;
    margin-bottom: 22px;
}

.llg-date-chip {
    color: var(--llg-muted);
    font-size: .86rem;
    font-weight: 650;
    white-space: nowrap;
}

.llg-kpi-grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); margin-bottom: 16px; }
.llg-kpi { align-items: center; display: flex; gap: 15px; min-height: 116px; padding: 20px; }
.llg-kpi-label { color: var(--llg-muted); font-size: .82rem; }
.llg-kpi-value { color: var(--llg-ink); font-size: 2rem; font-weight: 800; line-height: 1; margin-top: 6px; }

.llg-workflow { margin-bottom: 16px; overflow: hidden; padding: 20px; }
.llg-panel-title { color: var(--llg-ink); font-size: 1rem; font-weight: 750; margin: 0; }
.llg-workflow-rail { align-items: stretch; display: grid; grid-template-columns: repeat(7, 1fr); margin-top: 18px; }
.llg-workflow-step { align-items: center; display: flex; gap: 10px; min-width: 0; padding-right: 18px; position: relative; }
.llg-workflow-step:not(:last-child)::after { color: #98a2b3; content: "\2192"; font-size: 1.3rem; position: absolute; right: 3px; }
.llg-workflow-step i { color: var(--llg-teal-dark); font-size: 1.45rem; }
.llg-workflow-step strong { display: block; font-size: .76rem; line-height: 1.2; }
.llg-workflow-step span { color: var(--llg-muted); display: block; font-size: .68rem; margin-top: 3px; }

.llg-dashboard-grid { display: grid; gap: 16px; grid-template-columns: 260px minmax(0, 1fr) 290px; }
.llg-quick-actions,
.llg-attention { padding: 20px; }
.llg-action-list,
.llg-attention-list { list-style: none; margin: 14px 0 0; padding: 0; }
.llg-action-list li + li,
.llg-attention-list li + li { border-top: 1px solid #edf0f3; }
.llg-action-list a { align-items: center; color: var(--llg-teal-dark); display: flex; font-size: .84rem; font-weight: 700; gap: 9px; justify-content: space-between; padding: 12px 0; text-decoration: none; }
.llg-action-list a i:first-child { font-size: 1.15rem; }
.llg-action-list a i:last-child { color: #98a2b3; }
.llg-attention-list li { align-items: center; color: #475467; display: flex; font-size: .82rem; gap: 12px; justify-content: space-between; padding: 12px 0; }
.llg-attention-count { background: #eef2f6; border-radius: 7px; color: var(--llg-ink); font-weight: 800; min-width: 28px; padding: 4px 8px; text-align: center; }
.llg-attention-count.has-items { background: #fff1dd; color: var(--llg-warning); }
.llg-activity { overflow: hidden; }
.llg-activity .llg-panel-heading { padding: 20px 20px 10px; }
.llg-table { color: var(--llg-ink); font-size: .81rem; margin: 0; }
.llg-table thead th { border-bottom: 1px solid var(--llg-border); color: #475467; font-size: .72rem; letter-spacing: .02em; padding: 11px 16px; text-transform: uppercase; }
.llg-table tbody td { border-color: #edf0f3; padding: 13px 16px; vertical-align: middle; }
.llg-empty { color: var(--llg-muted); padding: 32px 20px; text-align: center; }
.llg-empty i { color: #aab4c3; display: block; font-size: 2rem; margin-bottom: 8px; }

/* Workspaces */
.llg-workspace-summary { display: grid; gap: 14px; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-bottom: 16px; }
.llg-summary-card { align-items: center; display: flex; gap: 14px; min-height: 98px; padding: 17px; }
.llg-summary-card > div > strong { color: var(--llg-ink); display: block; font-size: 1.45rem; line-height: 1; }
.llg-summary-card > div > span { color: var(--llg-muted); display: block; font-size: .8rem; margin-top: 5px; }
.llg-register { margin-bottom: 16px; overflow: hidden; }
.llg-register-primary { border-color: rgba(0,155,144,.3); }
.llg-register-header { align-items: center; border-bottom: 1px solid var(--llg-border); display: flex; gap: 16px; justify-content: space-between; padding: 18px 20px; }
.llg-register-header h2 { color: var(--llg-ink); font-size: 1.05rem; margin: 0; }
.llg-register-header p { color: var(--llg-muted); font-size: .78rem; margin: 3px 0 0; }
.llg-support-grid { display: grid; gap: 16px; grid-template-columns: repeat(2, minmax(0,1fr)); }
.llg-register-primary + .llg-register:last-child { grid-column: 1 / -1; }
.llg-row-meta { color: var(--llg-muted); font-size: .74rem; margin-top: 3px; }
.llg-governed-action { min-width: 170px; }
.llg-governed-action form { margin: 0; }
.llg-governed-action .btn { border-radius: 8px; min-height: 34px; }

/* Create forms */
.llg-breadcrumb { color: var(--llg-muted); font-size: .8rem; margin-bottom: 10px; }
.llg-breadcrumb a { color: var(--llg-teal-dark); font-weight: 700; text-decoration: none; }
.llg-breadcrumb i { margin: 0 8px; }
.llg-draft-badge { background: var(--llg-mint); border: 1px solid #a8d5d1; border-radius: 8px; color: var(--llg-teal-dark); font-size: .72rem; font-weight: 800; letter-spacing: .08em; padding: 7px 13px; }
.llg-form-steps { display: grid; grid-template-columns: repeat(3, 1fr); margin-bottom: 16px; padding: 16px 20px; }
.llg-form-step { align-items: center; display: flex; gap: 11px; }
.llg-form-step-number { align-items: center; background: #eef2f6; border-radius: 50%; color: #475467; display: inline-flex; font-size: .8rem; font-weight: 800; height: 34px; justify-content: center; width: 34px; }
.llg-form-step:first-child .llg-form-step-number { background: var(--llg-teal); color: #fff; }
.llg-form-step strong { display: block; font-size: .82rem; }
.llg-form-step > div > span { color: var(--llg-muted); display: block; font-size: .72rem; }
.llg-form-section { margin-bottom: 16px; padding: 20px; }
.llg-form-section-heading { align-items: center; border-bottom: 1px solid var(--llg-border); display: flex; gap: 10px; margin-bottom: 18px; padding-bottom: 13px; }
.llg-form-section-heading i { color: var(--llg-teal); font-size: 1.4rem; }
.llg-form-section-heading h2 { color: var(--llg-ink); font-size: 1rem; margin: 0; }
.llg-form .form-label { color: #344054; font-size: .79rem; font-weight: 700; margin-bottom: 7px; }
.llg-form .form-control,
.llg-form .form-select { border-color: #d0d7e2; border-radius: 9px; min-height: 44px; }
.llg-form textarea.form-control { height: 108px; min-height: 108px; }
.llg-form .form-control:focus,
.llg-form .form-select:focus { border-color: var(--llg-teal); box-shadow: 0 0 0 .2rem rgba(0,155,144,.12); }
.llg-line-card { border: 1px solid #cfd7e2; border-radius: 13px; padding: 18px; position: relative; }
.llg-line-card + .llg-line-card { margin-top: 12px; }
.llg-line-number { align-items: center; background: var(--llg-teal); border-radius: 50%; color: #fff; display: flex; font-size: .78rem; font-weight: 800; height: 30px; justify-content: center; left: 14px; position: absolute; top: 14px; width: 30px; }
.llg-line-card .row { padding-left: 34px; }
.llg-form-actions { align-items: center; display: flex; gap: 16px; justify-content: space-between; padding: 14px 16px; }
.llg-form-note { align-items: center; color: #475467; display: flex; font-size: .8rem; gap: 9px; }
.llg-form-note i { color: var(--llg-teal-dark); font-size: 1.25rem; }
.llg-action-buttons { display: flex; gap: 9px; }

@media (max-width: 1199.98px) {
    .llg-hero-grid { grid-template-columns: 1fr; }
    .llg-dashboard-grid { grid-template-columns: 230px minmax(0, 1fr); }
    .llg-attention { grid-column: 1 / -1; }
    .llg-attention-list { display: grid; gap: 0 18px; grid-template-columns: repeat(2, 1fr); }
    .llg-workflow-rail { gap: 12px; grid-template-columns: repeat(4, 1fr); row-gap: 20px; }
    .llg-workflow-step::after { display: none; }
}

@media (max-width: 767.98px) {
    .llg-page { padding: 0 12px; }
    .llg-landing-inner { padding: 20px 18px 34px; }
    .llg-landing-brand { margin-bottom: 38px; }
    .llg-landing-logo { width: 118px; }
    .llg-secure-note span { display: none; }
    .llg-hero-title { font-size: 3.4rem; }
    .llg-hero-actions { flex-direction: column; }
    .llg-hero-actions a { width: 100%; }
    .llg-flow-visual { padding: 20px 14px; }
    .llg-flow-grid { grid-template-columns: repeat(2, 1fr); }
    .llg-flow-grid::before,
    .llg-flow-grid::after { display: none; }
    .llg-flow-core { grid-column: 1 / -1; }
    .llg-value-band,
    .llg-pillar-grid { grid-template-columns: 1fr; }
    .llg-value-item + .llg-value-item { border-left: 0; border-top: 1px solid rgba(0,108,101,.15); }
    .llg-landing-footer,
    .llg-dashboard-header,
    .llg-workspace-header,
    .llg-form-header { align-items: stretch; flex-direction: column; }
    .llg-landing-footer { gap: 6px; }
    .llg-kpi-grid,
    .llg-workspace-summary { grid-template-columns: repeat(2, 1fr); }
    .llg-kpi { min-height: 98px; padding: 15px; }
    .llg-kpi .llg-icon { height: 42px; width: 42px; }
    .llg-workflow-rail { grid-template-columns: repeat(2, 1fr); }
    .llg-dashboard-grid { grid-template-columns: 1fr; }
    .llg-attention { grid-column: auto; }
    .llg-attention-list { display: block; }
    .llg-support-grid { grid-template-columns: 1fr; }
    .llg-register-primary + .llg-register:last-child { grid-column: auto; }
    .llg-register-header { align-items: stretch; flex-direction: column; }
    .llg-register-header .llg-btn-primary,
    .llg-register-header .llg-btn-secondary { width: 100%; }
    .llg-form-steps { gap: 12px; grid-template-columns: 1fr; }
    .llg-form-step:not(:first-child) { border-top: 1px solid #edf0f3; padding-top: 12px; }
    .llg-line-card .row { padding-left: 0; padding-top: 36px; }
    .llg-form-actions { align-items: stretch; flex-direction: column; }
    .llg-action-buttons { flex-direction: column-reverse; }
    .llg-action-buttons .btn,
    .llg-action-buttons .llg-btn-primary { width: 100%; }
    .llg-governed-action { min-width: 210px; }
}

@media (max-width: 479.98px) {
    .llg-kpi-grid,
    .llg-workspace-summary { grid-template-columns: 1fr; }
    .llg-table { min-width: 680px; }
}

@media (prefers-reduced-motion: reduce) {
    .llg-btn-primary,
    .llg-btn-secondary { transition: none; }
    .llg-hero-copy-block,
    .llg-flow-visual,
    .llg-value-band { animation: none; }
}
