:root {
        --canary-hero-start: #fde047;
        --canary-hero-end: #f59e0b;
        --canary-risk-critical-bg: #fff3cf;
        --canary-risk-critical-hover: #ffebbb;
        --canary-risk-critical-border: #d02828;
        --canary-risk-critical-icon: #bf1d1d;
        --canary-risk-critical-text: #a71616;
        --canary-risk-warn-bg: #fff6dc;
        --canary-risk-warn-hover: #ffefc8;
        --canary-risk-warn-border: #c98a1e;
        --canary-risk-warn-icon: #92600a;
        --xr-party-color: #0ea5e9;
        --xr-address-color: #6366f1;
        --xr-tax: #f59e0b;
        --xr-money-color: #d97706;
        --xr-tax-color: #d97706;
        --xr-tint-party: rgba(14, 165, 233, 0.08);
        --xr-tint-address: rgba(99, 102, 241, 0.08);
        --xr-tint-money: rgba(217, 119, 6, 0.1);
        --xr-tint-tax: rgba(217, 119, 6, 0.1);
      }

      body.darkmode {
        --xr-party-color: #66bbff;
        --xr-address-color: #a78bfa;
        --xr-tax: #ffe05b;
        --xr-money-color: #d97706;
        --xr-tax-color: #d97706;
        --xr-tint-party: rgba(102, 187, 255, 0.1);
        --xr-tint-address: rgba(167, 139, 250, 0.1);
        --xr-tint-money: rgba(217, 119, 6, 0.12);
        --xr-tint-tax: rgba(217, 119, 6, 0.12);
      }

      .pwa-update {
        position: fixed;
        left: 16px;
        right: 16px;
        bottom: 16px;
        z-index: 9999;
        display: flex;
        align-items: center;
        gap: 0.75rem;
        padding: 0.9rem 1rem;
        border-radius: 14px;
        border: 1px solid rgba(6, 38, 58, 0.16);
        background: rgba(255, 255, 255, 0.92);
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.18);
        backdrop-filter: blur(12px);
      }

      .pwa-update[hidden] {
        display: none !important;
      }

      body.darkmode .pwa-update {
        background: rgba(10, 10, 10, 0.88);
        border-color: rgba(255, 255, 255, 0.14);
        color: rgba(255, 255, 255, 0.92);
      }

      .pwa-update__text {
        flex: 1;
        min-width: 0;
        font-weight: 800;
      }

      .pwa-install-hint {
        font-weight: 900;
        line-height: 1.2;
      }

      .pwa-install-benefit {
        margin-top: 0.25rem;
        font-size: 0.92rem;
        font-weight: 650;
        line-height: 1.35;
        color: rgba(6, 38, 58, 0.82);
      }

      body.darkmode .pwa-install-benefit {
        color: rgba(255, 255, 255, 0.78);
      }

      .pwa-install-em {
        font-weight: 900;
      }

      .pwa-install-benefit--desktop {
        display: none;
      }

      @media (min-width: 760px) {
        .pwa-install-benefit--mobile {
          display: none;
        }

        .pwa-install-benefit--desktop {
          display: inline;
        }
      }

      @media (max-width: 520px) {
        .pwa-install-benefit {
          font-size: 0.82rem;
        }
      }

      .pwa-update__btn {
        border: 1px solid rgba(6, 38, 58, 0.16);
        background: rgba(255, 255, 255, 0.65);
        color: #06263a;
        font-weight: 900;
        border-radius: 12px;
        padding: 0.6rem 0.9rem;
        cursor: pointer;
      }

      .pwa-update__btn--icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 0.55rem;
      }

      .pwa-update__btn--icon .material-icons-outlined {
        font-size: 1.25em;
      }

      body.darkmode .pwa-update__btn {
        border-color: rgba(255, 255, 255, 0.18);
        background: rgba(255, 255, 255, 0.08);
        color: rgba(255, 255, 255, 0.92);
      }

      #tool,
      #dropzone,
      #xr-preview {
        scroll-margin-top: 96px;
      }

      #xr-hero-more {
        scroll-margin-top: 136px;
      }

      .xr-hero {
        text-align: center;
        padding: 7.5rem 2rem 4.75rem;
        background: linear-gradient(
          135deg,
          var(--canary-hero-start) 0%,
          var(--canary-hero-end) 100%
        );
        color: #06263a;
        position: relative;
        overflow: hidden;
      }

      .xr-hero::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.06'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
        opacity: 0.35;
      }

      .xr-hero-content {
        position: relative;
        z-index: 1;
        max-width: 980px;
        margin: 0 auto;
      }

      .xr-badge {
        display: inline-flex;
        align-items: center;
        gap: 0.5rem;
        background: rgba(255, 255, 255, 0.6);
        color: #06263a;
        border: 1px solid rgba(6, 38, 58, 0.14);
        padding: 0.5rem 1.2rem;
        border-radius: 999px;
        font-size: 0.95rem;
        font-weight: 700;
        margin-bottom: 1.5rem;
        backdrop-filter: blur(10px);
      }

      .xr-badge .material-icons-outlined {
        font-size: 18px;
        margin: 0;
        color: rgba(6, 38, 58, 0.92);
      }

      .xr-hero h1 {
        font-size: 2.85rem;
        font-weight: 800;
        margin: 0 0 0.85rem;
        letter-spacing: -0.02em;
        line-height: 1.15;
      }

      .xr-subtitle {
        font-size: 1.2rem;
        opacity: 0.96;
        margin: 0 auto 1.2rem;
        max-width: min(100%, 58rem);
        line-height: 1.65;
        white-space: normal;
        text-align: center;
        text-wrap: balance;
      }

      .xr-hero-subline {
        margin: -0.4rem auto 1rem;
        max-width: 900px;
        font-size: 0.92rem;
        font-weight: 800;
        color: rgba(6, 38, 58, 0.82);
      }

      .xr-hero-subline a {
        color: #004b87;
        text-decoration: underline;
        text-underline-offset: 2px;
      }

      .xr-hero-emphasis {
        margin: 0 auto 0.8rem;
        display: inline-flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        gap: 0.45rem;
        background: rgba(255, 255, 255, 0.72);
        border: 1px solid rgba(6, 38, 58, 0.2);
        color: rgba(6, 38, 58, 0.95);
        border-radius: 999px;
        padding: 0.5rem 0.95rem;
        max-width: 100%;
        box-sizing: border-box;
      }

      .xr-hero-emphasis__prefix {
        font-size: 0.9rem;
        font-weight: 800;
        letter-spacing: 0.01em;
      }

      .xr-hero-emphasis__focus {
        font-size: 1.04rem;
        font-weight: 900;
        color: #7f1d1d;
        letter-spacing: 0.01em;
        overflow-wrap: anywhere;
      }

      /* Info toast (click-reveal) */
      .xr-info-toast {
        margin: 0.6rem auto 1rem;
        max-width: 880px;
        display: flex;
        align-items: flex-start;
        gap: 0.55rem;
        padding: 0.75rem 1rem;
        border-radius: 12px;
        background: rgba(6, 38, 58, 0.06);
        border: 1px solid rgba(6, 38, 58, 0.12);
        font-size: 0.88rem;
        font-weight: 600;
        color: rgba(6, 38, 58, 0.82);
        line-height: 1.5;
        animation: xrToastIn 0.25s ease-out;
      }
      .xr-info-toast__icon {
        flex-shrink: 0;
        font-size: 1.15rem;
        color: rgba(6, 38, 58, 0.5);
        margin-top: 0.1rem;
      }
      .xr-info-toast__text {
        flex: 1;
      }
      .xr-info-toast__link {
        flex-shrink: 0;
        white-space: nowrap;
        font-weight: 800;
        color: rgba(0, 75, 135, 0.92);
        text-decoration: underline;
        text-underline-offset: 2px;
      }
      .xr-info-toast__link:hover {
        color: rgba(0, 52, 103, 0.98);
      }
      .xr-info-toast__link--secondary {
        color: rgba(83, 47, 0, 0.9);
      }
      .xr-info-toast__link--secondary:hover {
        color: rgba(59, 32, 0, 0.98);
      }
      .xr-info-toast__close {
        flex-shrink: 0;
        background: none;
        border: none;
        cursor: pointer;
        padding: 0.15rem;
        border-radius: 50%;
        color: rgba(6, 38, 58, 0.45);
        transition: color 0.15s, background 0.15s;
      }
      .xr-info-toast__close:hover {
        color: rgba(6, 38, 58, 0.8);
        background: rgba(6, 38, 58, 0.08);
      }
      .xr-info-toast__close .material-icons-outlined {
        font-size: 1.05rem;
      }
      .xr-info-toast--hidden {
        display: none !important;
      }
      @keyframes xrToastIn {
        from { opacity: 0; transform: translateY(-6px); }
        to   { opacity: 1; transform: translateY(0); }
      }
      body.darkmode .xr-info-toast {
        background: rgba(255, 255, 255, 0.07);
        border-color: rgba(255, 255, 255, 0.12);
        color: rgba(255, 255, 255, 0.82);
      }
      body.darkmode .xr-info-toast__icon {
        color: rgba(255, 255, 255, 0.5);
      }
      body.darkmode .xr-info-toast__link {
        color: rgba(148, 202, 255, 0.95);
      }
      body.darkmode .xr-info-toast__link:hover {
        color: rgba(188, 225, 255, 0.98);
      }
      body.darkmode .xr-info-toast__link--secondary {
        color: rgba(255, 208, 126, 0.98);
      }
      body.darkmode .xr-info-toast__link--secondary:hover {
        color: rgba(255, 224, 166, 0.98);
      }
      body.darkmode .xr-info-toast__close {
        color: rgba(255, 255, 255, 0.45);
      }
      body.darkmode .xr-info-toast__close:hover {
        color: rgba(255, 255, 255, 0.8);
        background: rgba(255, 255, 255, 0.1);
      }

      .xr-hero-counters {
        margin: 0 auto 1.3rem;
        max-width: 1160px;
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 0.65rem;
      }

      .xr-hero-counter {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 0.22rem;
        min-height: 118px;
        background: rgba(255, 255, 255, 0.62);
        border: 1px solid rgba(6, 38, 58, 0.16);
        border-radius: 14px;
        padding: 0.65rem 0.75rem;
        text-align: center;
        backdrop-filter: blur(10px);
      }

      .xr-hero-counter--highlight {
        position: relative;
        background: linear-gradient(
          135deg,
          rgba(255, 255, 255, 0.95) 0%,
          rgba(255, 241, 189, 0.95) 56%,
          rgba(255, 201, 77, 0.92) 100%
        );
        border-color: rgba(176, 76, 0, 0.46);
        box-shadow: 0 12px 28px rgba(135, 60, 0, 0.2);
      }

      .xr-hero-counter--highlight .xr-hero-counter__value {
        color: #7d2f00;
        font-size: 1.6rem;
      }

      .xr-hero-counter--highlight .xr-hero-counter__label {
        color: rgba(95, 34, 0, 0.88);
      }

      .xr-hero-counter--link {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-decoration: none;
        color: inherit;
        font: inherit;
        cursor: pointer;
        transition: transform 0.12s ease, box-shadow 0.12s ease, background 0.12s ease;
      }

      .xr-hero-counter--link:hover,
      .xr-hero-counter--link:focus-visible {
        transform: translateY(-2px);
        background: rgba(255, 255, 255, 0.78);
        box-shadow: 0 8px 20px rgba(6, 38, 58, 0.16);
      }

      .xr-hero-counter--link:focus-visible {
        outline: 2px solid rgba(6, 38, 58, 0.45);
        outline-offset: 2px;
      }

      .xr-hero-counter__value {
        font-family: "SF Mono", "Fira Code", "Consolas", monospace;
        font-size: 1.45rem;
        line-height: 1.1;
        font-weight: 900;
        color: #06263a;
        letter-spacing: -0.03em;
      }

      .xr-hero-counter__label {
        margin-top: 0.12rem;
        font-size: 0.78rem;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 0.06em;
        color: rgba(6, 38, 58, 0.72);
      }

      .xr-hero-counter__hint {
        margin-top: 0.16rem;
        display: inline-flex;
        align-items: center;
        gap: 0.2rem;
        font-size: 0.85rem;
        font-weight: 800;
        letter-spacing: 0.02em;
        color: #c0392b;
      }

      .xr-hero-counter__hint .material-icons-outlined {
        font-size: 0.95rem;
      }

      @media (max-width: 1024px) {
        .xr-hero-counters {
          max-width: 760px;
          grid-template-columns: repeat(2, minmax(0, 1fr));
        }
      }

      .xr-hero-note {
        max-width: 920px;
        margin: 0 auto 2rem;
        padding: 0.75rem 0.95rem;
        border-radius: 14px;
        border: 1px solid rgba(6, 38, 58, 0.16);
        background: rgba(255, 255, 255, 0.55);
        color: rgba(6, 38, 58, 0.95);
        font-size: 1rem;
        line-height: 1.6;
        backdrop-filter: blur(10px);
      }

      .xr-hero-note strong {
        font-weight: 900;
      }

      .xr-hero-note a {
        color: #0055aa;
        font-weight: 900;
        text-decoration: underline;
        text-decoration-thickness: 2px;
        text-underline-offset: 2px;
      }

      body.darkmode .xr-hero-note a {
        color: #0a66c2;
      }
      body.darkmode .xr-hero-subline {
        color: rgba(6, 38, 58, 0.9);
      }

      body.darkmode .xr-hero-emphasis {
        background: rgba(255, 255, 255, 0.48);
        border-color: rgba(6, 38, 58, 0.3);
      }

      body.darkmode .xr-hero-emphasis__focus {
        color: #8f1d1d;
      }

      body.darkmode .xr-hero-counter--link:hover,
      body.darkmode .xr-hero-counter--link:focus-visible {
        background: rgba(255, 255, 255, 0.72);
      }

      body.darkmode .xr-hero-counter__hint {
        color: #e74c3c;
      }

      body.darkmode .xr-hero-counter--highlight {
        background: linear-gradient(
          135deg,
          rgba(40, 18, 0, 0.82) 0%,
          rgba(77, 36, 0, 0.82) 56%,
          rgba(110, 52, 0, 0.86) 100%
        );
        border-color: rgba(255, 174, 74, 0.48);
        box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35);
      }

      body.darkmode .xr-hero-counter--highlight .xr-hero-counter__value {
        color: #ffd07e;
      }

      body.darkmode .xr-hero-counter--highlight .xr-hero-counter__label {
        color: rgba(255, 216, 150, 0.88);
      }

      .xr-hero-actions {
        margin: 0 auto 1.6rem;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 0.85rem;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
      }

      .xr-hero-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
        gap: 0.55rem;
        padding: 0.85rem 1.15rem;
        border-radius: 14px;
        font-weight: 900;
        text-decoration: none;
        color: #06263a;
        background: rgba(255, 255, 255, 0.92);
        border: 1px solid rgba(255, 255, 255, 0.42);
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.18);
        backdrop-filter: blur(12px);
        transition: transform 0.12s ease, box-shadow 0.12s ease,
          background 0.12s ease;
        max-width: 100%;
        box-sizing: border-box;
        white-space: normal;
        text-align: center;
      }

      .xr-hero-btn:hover {
        transform: translateY(-2px);
        background: rgba(255, 255, 255, 0.98);
        box-shadow: 0 14px 40px rgba(0, 0, 0, 0.22);
      }


      .xr-hero-btn .material-icons-outlined {
        font-size: 19px;
        margin: 0;
        color: inherit;
        flex-shrink: 0;
      }

      .xr-hero-btn > span:last-child {
        min-width: 0;
        overflow-wrap: anywhere;
      }

      .xr-hero-risks {
        max-width: 1140px;
        margin: 0 auto 2rem;
        border-radius: 20px;
        border: 1px solid #d9b878;
        background: #fff8e8;
        box-shadow: 0 18px 46px rgba(6, 38, 58, 0.16);
        overflow: hidden;
        text-align: left;
      }

      .xr-hero-risks__intro {
        padding: 0.95rem 1.1rem 0.82rem;
        border-bottom: 1px solid #dfc08b;
        background: linear-gradient(180deg, #fff4d7 0%, #ffe9bc 100%);
      }

      .xr-hero-risks-intro {
        margin: 0;
        text-align: center;
        color: #5d3605;
        font-size: 1.1rem;
        font-weight: 950;
        letter-spacing: -0.01em;
        line-height: 1.33;
      }

      .xr-hero-risks-method {
        margin: 0.4rem auto 0;
        max-width: 840px;
        text-align: center;
        color: #6d4917;
        font-size: 0.82rem;
        font-weight: 700;
        line-height: 1.4;
      }

      .xr-hero-risks__header {
        display: grid;
        grid-template-columns: 28px 1fr 1fr 120px 120px 92px;
        gap: 0 0.55rem;
        align-items: center;
        padding: 0.66rem 1rem;
        font-size: 0.76rem;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        color: #6f4306;
        background: #ffe3ac;
        border-bottom: 2px solid #d5af68;
      }

      .xr-hero-risks__hdr {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0.25rem;
        padding: 0.32rem 0.52rem;
        border-radius: 7px;
        font-size: 0.66rem;
        font-weight: 900;
        letter-spacing: 0.025em;
        color: #fff;
        cursor: help;
        white-space: nowrap;
        box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.16);
      }
      .xr-hero-hdr-num {
        font-size: 16px;
        color: #e8f4ff;
      }

      .xr-hero-risks__hdr--s1 { background: #0b6fbf; }
      .xr-hero-risks__hdr--s2 { background: #0c8d52; }
      .xr-hero-risks__hdr--s3 { background: #cf7700; }

      .xr-hero-risks__group-head {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.62rem 1rem;
        background: #ffecc8;
        border-bottom: 1px solid #ddc08a;
        font-size: 0.79rem;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        color: #69400d;
      }

      .xr-hero-risks__group-head:not(:first-child) {
        border-top: 1px solid #ddc08a;
      }

      .xr-hero-risks__group-head .material-icons-outlined {
        font-size: 18px;
      }

      .xr-hero-risks__row {
        display: grid;
        grid-template-columns: 28px 1fr 1fr 120px 120px 92px;
        gap: 0 0.55rem;
        align-items: center;
        padding: 0.62rem 1rem;
        border-bottom: 1px solid #ecd3a0;
        font-size: 0.92rem;
        line-height: 1.42;
        color: #4f320d;
        background: #fffdf6;
        transition: background 0.15s ease;
      }

      .xr-hero-risks__row:hover {
        background: #fff4da;
      }

      .xr-hero-risks__row--critical {
        background: var(--canary-risk-critical-bg);
        border-left: 4px solid var(--canary-risk-critical-border);
        padding-left: 0.78rem;
      }
      .xr-hero-risks__row--critical:hover {
        background: var(--canary-risk-critical-hover);
      }

      .xr-hero-risks__row--warn {
        background: var(--canary-risk-warn-bg);
        border-left: 4px solid var(--canary-risk-warn-border);
        padding-left: 0.78rem;
      }
      .xr-hero-risks__row--warn:hover {
        background: var(--canary-risk-warn-hover);
      }

      .xr-hero-risks__severity {
        display: flex;
        align-items: center;
        justify-content: center;
      }

      .xr-hero-risks__severity .material-icons-outlined { font-size: 19px; }
      .xr-hero-risks__row--critical .xr-hero-risks__severity { color: var(--canary-risk-critical-icon); }
      .xr-hero-risks__row--warn .xr-hero-risks__severity { color: var(--canary-risk-warn-icon); }

      .xr-hero-risks__check {
        font-weight: 900;
        color: #4f2f09;
      }

      .xr-hero-risks__consequence {
        color: #6a4a1e;
        font-size: 0.85rem;
        font-style: normal;
        font-weight: 700;
      }

      .xr-hero-risks__row--critical .xr-hero-risks__check {
        color: var(--canary-risk-critical-text);
      }

      .xr-hero-risks__row--critical .xr-hero-risks__consequence {
        color: var(--canary-risk-critical-text);
      }

      .xr-hero-risks__pct--high { color: #0c7f47; }
      .xr-hero-risks__pct--mid { color: #0a5f8f; }
      .xr-hero-risks__pct--low { color: #af1f1f; }
      .xr-hero-risks__pct--s3 { color: #8b4e00; }

      .xr-hero-risks__pct-bar {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 0.24rem;
      }

      .xr-hero-risks__pct-label {
        font-family: 'SF Mono', 'Fira Code', 'Consolas', monospace;
        font-size: 0.76rem;
        font-weight: 900;
        white-space: nowrap;
        letter-spacing: -0.02em;
      }

      .xr-hero-risks .xr-gradient-bar--mini {
        width: 66px;
        height: 7px;
        border-radius: 999px;
      }

      .xr-hero-risks .xr-gradient-bar--mini .xr-gradient-bar__marker {
        width: 10px;
        height: 10px;
        border-width: 2px;
        border-color: #6a4510;
      }

      .xr-hero-risks__pct-na {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        justify-self: center;
        font-family: 'SF Mono', 'Fira Code', 'Consolas', monospace;
        font-size: 0.68rem;
        font-weight: 900;
        line-height: 1.1;
        letter-spacing: -0.01em;
        color: #71542a;
        border: 1px dashed #cfa96a;
        border-radius: 999px;
        padding: 0.18rem 0.48rem;
        background: #fff1cf;
        white-space: nowrap;
      }

      .xr-hero-risks__footer {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0.7rem 1rem;
        border-top: 2px solid #d9b678;
        background: #ffe5b4;
      }

      .xr-hero-risks__legend {
        display: flex;
        gap: 0.8rem;
        flex-wrap: wrap;
        justify-content: center;
        font-size: 0.76rem;
        color: #6c4815;
        font-weight: 750;
      }

      body.darkmode .xr-hero-more__close {
        background: rgba(12, 23, 33, 0.7);
        border-color: rgba(106, 137, 160, 0.3);
        color: rgba(200, 220, 235, 0.7);
      }

      body.darkmode .xr-hero-more__close:hover {
        background: rgba(106, 137, 160, 0.25);
        color: #e0ecf5;
      }

      body.darkmode .xr-hero-risks {
        background: #0c1721;
        border-color: rgba(106, 137, 160, 0.85);
        box-shadow: 0 20px 48px rgba(0, 0, 0, 0.52);
      }

      body.darkmode .xr-hero-risks__intro {
        background: linear-gradient(180deg, rgba(20, 43, 60, 0.98) 0%, rgba(14, 31, 45, 0.98) 100%);
        border-bottom-color: rgba(120, 154, 179, 0.5);
      }

      body.darkmode .xr-hero-risks-intro {
        color: #ebf6ff;
      }

      body.darkmode .xr-hero-risks-method {
        color: #c9dcef;
      }

      body.darkmode .xr-hero-risks__header {
        background: #18374d;
        color: #d7e9f8;
        border-bottom-color: #527690;
      }

      body.darkmode .xr-hero-risks__group-head {
        background: #1c3b50;
        color: #d5e8f8;
        border-bottom-color: #4a6e88;
      }

      body.darkmode .xr-hero-risks__group-head:not(:first-child) {
        border-top-color: #4a6e88;
      }

      body.darkmode .xr-hero-risks__row {
        color: #deecf8;
        border-bottom-color: #335167;
        background: #122332;
      }

      body.darkmode .xr-hero-risks__row:hover {
        background: #173043;
      }

      body.darkmode .xr-hero-risks__row--critical {
        background: #381f1d;
        border-left-color: #de654f;
      }

      body.darkmode .xr-hero-risks__row--critical:hover {
        background: #462524;
      }

      body.darkmode .xr-hero-risks__row--warn {
        background: #3a2c19;
        border-left-color: #d7a548;
      }

      body.darkmode .xr-hero-risks__row--warn:hover {
        background: #4a3820;
      }

      body.darkmode .xr-hero-risks__check {
        color: #f0f7fd;
      }

      body.darkmode .xr-hero-risks__consequence {
        color: #b8cddd;
      }

      body.darkmode .xr-hero-risks__row--critical .xr-hero-risks__consequence {
        color: #f6b0a1;
      }

      body.darkmode .xr-hero-risks__pct--high { color: #7be8ab; }
      body.darkmode .xr-hero-risks__pct--mid { color: #85c7ff; }
      body.darkmode .xr-hero-risks__pct--low { color: #ff9f79; }
      body.darkmode .xr-hero-risks__pct--s3 { color: #ffcc77; }

      body.darkmode .xr-hero-risks .xr-gradient-bar--mini .xr-gradient-bar__marker {
        border-color: rgba(218, 236, 249, 0.95);
        background: #102030;
      }

      body.darkmode .xr-hero-risks__pct-na {
        color: #c5d9ea;
        border-color: #6f8ba2;
        background: #1b3042;
      }

      body.darkmode .xr-hero-risks__footer {
        background: #142a3c;
        border-top-color: #4f7390;
      }

      body.darkmode .xr-hero-risks__legend {
        color: #cce0ef;
      }

      @media (max-width: 640px) {
        .xr-hero-risks__intro {
          padding: 0.64rem 0.74rem;
        }
        .xr-hero-risks-intro {
          font-size: 0.9rem;
        }
        .xr-hero-risks-method {
          font-size: 0.74rem;
          line-height: 1.35;
        }
        .xr-hero-risks__header {
          display: none;
        }
        .xr-hero-risks__row {
          grid-template-columns: 22px minmax(0, 1fr) 60px 60px 60px;
          gap: 0.14rem 0.42rem;
          padding: 0.52rem 0.74rem;
          align-items: start;
        }
        .xr-hero-risks__severity {
          grid-column: 1;
          grid-row: 1 / 4;
          align-self: start;
          padding-top: 0.1rem;
        }
        .xr-hero-risks__check {
          grid-column: 2 / 6;
          grid-row: 1;
          font-size: 0.84rem;
        }
        .xr-hero-risks__consequence {
          grid-column: 2 / 6;
          grid-row: 2;
          font-size: 0.76rem;
        }
        .xr-hero-risks__row > :nth-child(4) {
          grid-column: 3;
          grid-row: 3;
        }
        .xr-hero-risks__row > :nth-child(5) {
          grid-column: 4;
          grid-row: 3;
        }
        .xr-hero-risks__row > :nth-child(6) {
          grid-column: 5;
          grid-row: 3;
        }
        .xr-hero-risks .xr-gradient-bar--mini {
          width: 50px;
        }
        .xr-hero-risks__pct-label {
          font-size: 0.68rem;
        }
        .xr-hero-risks__legend {
          font-size: 0.64rem;
        }
      }

      .xr-hero-features {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 0.8rem;
      }

      .xr-hero-feature {
        display: inline-flex;
        align-items: center;
        gap: 0.45rem;
        background: rgba(255, 255, 255, 0.5);
        border: 1px solid rgba(6, 38, 58, 0.14);
        padding: 0.6rem 1rem;
        border-radius: 10px;
        font-size: 0.95rem;
        font-weight: 600;
      }

      .xr-hero-feature .material-icons-outlined {
        font-size: 18px;
        margin: 0;
        color: rgba(6, 38, 58, 0.92);
      }


      .xr-hero-more {
        margin: 0 auto;
        position: relative;
      }

      .xr-hero-more__close {
        position: absolute;
        top: 0.5rem;
        right: 0.5rem;
        background: rgba(255, 255, 255, 0.7);
        border: 1px solid rgba(6, 38, 58, 0.15);
        border-radius: 50%;
        width: 32px;
        height: 32px;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        color: rgba(6, 38, 58, 0.7);
        backdrop-filter: blur(8px);
        transition: background 0.15s, color 0.15s;
        z-index: 2;
        padding: 0;
      }

      .xr-hero-more__close:hover {
        background: rgba(6, 38, 58, 0.1);
        color: rgba(6, 38, 58, 0.95);
      }

      .xr-hero-more__close .material-icons-outlined {
        font-size: 18px;
      }

      .xr-main {
        padding: 3rem 1.5rem 4rem;
      }

      .xr-shell {
        max-width: 1500px;
        margin: 0 auto;
      }

      .xr-card {
        background: var(--bg-primary);
        border-radius: var(--border-radius);
        box-shadow: var(--shadow);
        border: 1px solid var(--border-color);
        padding: 2.2rem 2rem;
      }

      .xr-card + .xr-card {
        margin-top: 1.25rem;
      }

      .xr-card-title {
        margin: 0 0 0.5rem;
        font-size: 1.6rem;
        font-weight: 800;
        color: var(--text-primary);
      }

      .xr-muted {
        color: var(--text-secondary);
      }

      .xr-alert {
        padding: 1rem 1.1rem;
        border-radius: 14px;
        border: 1px solid transparent;
        margin-bottom: 1.25rem;
        line-height: 1.55;
      }

      .xr-alert strong {
        font-weight: 800;
      }

      .xr-alert-danger {
        background: rgba(251, 77, 109, 0.12);
        border-color: rgba(251, 77, 109, 0.35);
        color: var(--text-primary);
      }

      .xr-alert-success {
        background: rgba(31, 208, 122, 0.12);
        border-color: rgba(31, 208, 122, 0.35);
        color: var(--text-primary);
      }

      .xr-alert-warning {
        margin-top: 1.15rem;
        background: rgba(255, 224, 91, 0.14);
        border-color: rgba(255, 224, 91, 0.4);
        color: var(--text-primary);
      }

      .xr-dropzone {
        margin-top: 1.35rem;
        border: 2px dashed rgba(0, 0, 0, 0.15);
        border-color: var(--border-color);
        background: var(--bg-secondary);
        border-radius: 18px;
        padding: 2.4rem 1.5rem;
        text-align: center;
        cursor: pointer;
        transition: transform 0.12s ease, border-color 0.12s ease,
          background 0.12s ease;
        outline: none;
        user-select: none;
      }

      .xr-dropzone:hover {
        transform: translateY(-2px);
        border-color: rgba(0, 119, 221, 0.35);
      }

      body.darkmode .xr-dropzone:hover {
        border-color: rgba(102, 187, 255, 0.35);
      }

      .xr-dropzone.is-dragover {
        background: rgba(0, 119, 221, 0.1);
        border-color: rgba(0, 119, 221, 0.45);
      }

      body.darkmode .xr-dropzone.is-dragover {
        background: rgba(102, 187, 255, 0.12);
        border-color: rgba(102, 187, 255, 0.5);
      }

      .xr-dropzone:focus-visible {
        box-shadow: 0 0 0 3px rgba(31, 208, 122, 0.3);
      }

      .xr-dropzone.is-error {
        border-color: #c0392b;
        animation: xr-shake 0.35s ease;
      }
      .xr-dropzone.is-error .xr-dropzone-hint {
        color: #c0392b;
        font-weight: 600;
      }
      body.darkmode .xr-dropzone.is-error {
        border-color: #e74c3c;
      }
      body.darkmode .xr-dropzone.is-error .xr-dropzone-hint {
        color: #e74c3c;
      }

      @keyframes xr-shake {
        0%, 100% { transform: translateX(0); }
        20% { transform: translateX(-6px); }
        40% { transform: translateX(6px); }
        60% { transform: translateX(-4px); }
        80% { transform: translateX(4px); }
      }

      .xr-dropzone-icon {
        width: 64px;
        height: 64px;
        margin: 0 auto 0.75rem;
        border-radius: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: rgba(0, 119, 221, 0.12);
      }

      body.darkmode .xr-dropzone-icon {
        background: rgba(102, 187, 255, 0.12);
      }

      .xr-dropzone-icon .material-icons-outlined {
        margin: 0;
        font-size: 30px;
        color: var(--primary);
      }

      .xr-dropzone-title {
        font-weight: 800;
        font-size: 1.15rem;
        color: var(--text-primary);
        margin: 0;
      }

      .xr-dropzone-hint {
        margin-top: 0.5rem;
        font-size: 0.98rem;
      }

      .xr-dropzone-hint code {
        background: rgba(0, 119, 221, 0.1);
        color: var(--text-primary);
        padding: 0.1rem 0.4rem;
        border-radius: 8px;
      }

      body.darkmode .xr-dropzone-hint code {
        background: rgba(102, 187, 255, 0.14);
      }

      /* ── Upload head with test-data button ── */
      .xr-upload-head {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 1rem;
      }
      .xr-testdata-wrap {
        position: relative;
        flex-shrink: 0;
      }

      .xr-upload-compliance {
        margin: 0.4rem 0 0;
        display: inline-flex;
        align-items: center;
        gap: 0.35rem;
        font-size: 0.92rem;
        font-weight: 800;
        color: rgba(6, 38, 58, 0.82);
      }
      body.darkmode .xr-upload-compliance {
        color: var(--text-secondary);
      }
      .xr-testdata-btn {
        display: inline-flex;
        align-items: center;
        gap: .3rem;
        padding: .4rem .7rem .4rem .55rem;
        border: 1px solid rgba(0,34,68,.12);
        border-radius: 10px;
        background: rgba(245,158,11,.06);
        color: var(--text-secondary, #4b5563);
        font-size: .78rem;
        font-weight: 700;
        font-family: inherit;
        cursor: pointer;
        transition: background .12s, border-color .12s;
        white-space: nowrap;
      }
      .xr-testdata-btn:hover {
        background: rgba(245,158,11,.14);
        border-color: rgba(245,158,11,.35);
      }
      .xr-testdata-btn .material-icons-outlined {
        font-size: 1.15em;
      }
      .xr-testdata-caret {
        font-size: 1.1em !important;
        transition: transform .15s;
      }
      .xr-testdata-btn[aria-expanded="true"] .xr-testdata-caret {
        transform: rotate(180deg);
      }
      body.darkmode .xr-testdata-btn {
        border-color: rgba(255,255,255,.12);
        background: rgba(245,158,11,.08);
        color: var(--text-secondary);
      }
      body.darkmode .xr-testdata-btn:hover {
        background: rgba(245,158,11,.18);
      }

      .xr-testdata-dd {
        position: absolute;
        top: calc(100% + 6px);
        right: 0;
        z-index: 100;
        min-width: 280px;
        max-height: 480px;
        overflow-y: auto;
        background: var(--card-bg, #fff);
        border: 1px solid var(--border-color, rgba(0,34,68,.1));
        border-radius: 12px;
        box-shadow: 0 8px 32px rgba(0,0,0,.12), 0 2px 8px rgba(0,0,0,.06);
        padding: .4rem;
      }
      .xr-testdata-dd[hidden] { display: none; }
      body.darkmode .xr-testdata-dd {
        background: var(--card-bg, #1e293b);
        box-shadow: 0 8px 32px rgba(0,0,0,.4);
      }
      .xr-testdata-group { padding: .2rem 0; }
      .xr-testdata-group + .xr-testdata-group {
        border-top: 1px solid var(--border-color, rgba(0,34,68,.08));
        margin-top: .2rem;
        padding-top: .4rem;
      }
      .xr-testdata-group-label {
        display: flex;
        align-items: center;
        gap: .3rem;
        padding: .2rem .5rem;
        font-size: .68rem;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: .05em;
        color: var(--text-secondary, #4b5563);
      }
      .xr-testdata-item {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: .1rem;
        width: 100%;
        padding: .4rem .5rem;
        border: none;
        border-radius: 8px;
        background: none;
        color: var(--text-primary, #002244);
        font-size: .78rem;
        font-weight: 600;
        font-family: inherit;
        cursor: pointer;
        text-align: left;
        transition: background .1s;
      }
      .xr-testdata-item:hover {
        background: rgba(31,208,122,.08);
      }
      .xr-testdata-item--mm:hover {
        background: rgba(251,77,109,.08);
      }
      .xr-testdata-title { font-weight: 700; }
      .xr-testdata-item small {
        font-size: .72rem;
        color: var(--text-secondary, #4b5563);
        font-weight: 500;
        line-height: 1.25;
      }
      .xr-testdata-item.is-loading {
        opacity: .5;
        pointer-events: none;
      }

      .xr-testdata-wrap--results { position: relative; }
      .xr-testdata-wrap--results .xr-testdata-dd { right: auto; left: 0; }
      @media (max-width: 500px) {
        .xr-upload-head { flex-direction: column; }
        .xr-testdata-dd { right: auto; left: 0; }
      }

      /* ── Upload mode toggle tabs ── */
      .xr-upload-tabs {
        display: inline-flex;
        gap: 0.25rem;
        background: var(--bg-secondary);
        border: 1px solid var(--border-color);
        padding: 0.25rem;
        border-radius: 999px;
        margin-bottom: 1rem;
        max-width: 100%;
        box-sizing: border-box;
        flex-wrap: wrap;
      }
      .xr-upload-tab {
        appearance: none;
        border: none;
        background: transparent;
        color: var(--text-secondary);
        font-weight: 800;
        font-size: 0.88rem;
        padding: 0.45rem 1rem;
        border-radius: 999px;
        cursor: pointer;
        transition: background 0.12s ease, color 0.12s ease;
        display: inline-flex;
        align-items: center;
        gap: 0.35rem;
        white-space: nowrap;
        min-width: 0;
      }
      .xr-upload-tab--link {
        text-decoration: none;
      }
      .xr-upload-tab--group-start {
        margin-left: 0.8rem;
      }
      .xr-upload-tab:hover { transform: translateY(-1px); }
      .xr-upload-tab.is-active {
        background: var(--cta);
        color: #fff;
        box-shadow: 0 4px 14px rgba(46, 204, 113, 0.3);
      }
      body.darkmode .xr-upload-tab.is-active {
        color: #fff;
        box-shadow: 0 4px 14px rgba(54, 220, 157, 0.25);
      }
      .xr-upload-tab .material-icons-outlined { font-size: 16px; }
      .xr-upload-tab__new {
        font-size: 0.58rem;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 0.06em;
        background: rgba(46, 204, 113, 0.18);
        color: #168f4a;
        padding: 0.1rem 0.35rem;
        border-radius: 6px;
      }
      body.darkmode .xr-upload-tab__new {
        background: rgba(85, 255, 170, 0.2);
        color: #7dffbb;
      }
      .xr-upload-panel { display: block; }
      .xr-upload-panel.is-hidden { display: none; }
      @media (max-width: 1100px) {
        .xr-upload-tabs {
          display: flex;
          width: 100%;
        }
        .xr-upload-tab {
          flex: 1 1 10.5rem;
          justify-content: center;
          text-align: center;
          white-space: normal;
          line-height: 1.25;
          padding: 0.5rem 0.8rem;
        }
        .xr-upload-tab--group-start {
          margin-left: 0;
        }
        .xr-hero-actions > .xr-hero-btn {
          flex: 1 1 18rem;
          max-width: min(100%, 28rem);
        }
      }
      @media (max-width: 400px) {
        .xr-upload-tabs { flex-wrap: wrap; justify-content: center; }
      }

      /* ── Convert result section ── */
      .xr-convert-result { margin-top: 1.35rem; }
      .xr-convert-success {
        padding: 1.5rem;
        background: rgba(31, 208, 122, 0.06);
        border: 1px solid rgba(31, 208, 122, 0.25);
        border-radius: 18px;
        text-align: center;
      }
      .xr-convert-success__icon {
        font-size: 48px;
        color: var(--cta);
        margin-bottom: 0.5rem;
      }
      .xr-convert-badges {
        display: flex;
        gap: 0.5rem;
        justify-content: center;
        margin: 0.75rem 0;
        flex-wrap: wrap;
      }
      .xr-convert-badge {
        display: inline-flex;
        align-items: center;
        gap: 0.25rem;
        padding: 0.3rem 0.65rem;
        border-radius: 999px;
        font-size: 0.78rem;
        font-weight: 700;
        background: rgba(31, 208, 122, 0.12);
        color: #059669;
        border: 1px solid rgba(31, 208, 122, 0.3);
      }
      .xr-convert-badge .material-icons-outlined { font-size: 15px; }
      body.darkmode .xr-convert-badge {
        background: rgba(31, 208, 122, 0.1);
        color: #34d399;
      }
      .xr-convert-errors { margin-top: 1rem; }
      .xr-convert-error-item {
        display: flex;
        align-items: flex-start;
        gap: 0.5rem;
        padding: 0.65rem 0.75rem;
        background: rgba(251, 77, 109, 0.06);
        border: 1px solid rgba(251, 77, 109, 0.2);
        border-radius: 12px;
        font-size: 0.88rem;
        line-height: 1.45;
      }
      .xr-convert-error-item + .xr-convert-error-item { margin-top: 0.4rem; }
      .xr-convert-error-item .material-icons-outlined {
        font-size: 18px;
        color: #fb4d6d;
        flex-shrink: 0;
        margin-top: 0.1rem;
      }
      .xr-convert-error-field {
        font-weight: 800;
        color: var(--primary);
        font-size: 0.82rem;
        min-width: 3.5em;
      }

      /* ── Batch analysis ── */
      .xr-batch-options {
        display: flex; flex-wrap: wrap; gap: 0.6rem; margin-bottom: 1rem;
      }
      .xr-dropzone--batch .material-icons-outlined { font-size: 42px; }
      .xr-batch-queue {
        margin-top: 1.25rem;
        padding: 1rem 1.25rem;
        background: rgba(0, 119, 221, 0.04);
        border: 1px solid rgba(0, 119, 221, 0.15);
        border-radius: var(--border-radius, 1.25em);
      }
      .xr-batch-count {
        display: block; font-weight: 700; font-size: 0.95rem; margin-bottom: 0.65rem;
      }
      .xr-batch-limit-error {
        color: var(--danger, #fb4d6d);
        font-weight: 700;
      }
      .xr-batch-chips {
        display: flex; flex-wrap: wrap; gap: 0.4rem; margin-bottom: 0.85rem;
      }
      .xr-batch-chip {
        display: inline-flex; align-items: center; gap: 0.3rem;
        padding: 0.25rem 0.55rem; border-radius: 999px;
        background: rgba(0, 119, 221, 0.1); font-size: 0.82rem; font-weight: 600;
        max-width: 220px; overflow: hidden;
      }
      .xr-batch-chip--error { background: rgba(251, 77, 109, 0.12); color: var(--danger); }
      .xr-batch-chip__name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
      .xr-batch-chip__remove {
        display: inline-flex; align-items: center; justify-content: center;
        background: none; border: none; padding: 0; cursor: pointer;
        color: inherit; opacity: 0.6; transition: opacity 0.12s;
      }
      .xr-batch-chip__remove:hover { opacity: 1; }
      .xr-batch-chip__remove .material-icons-outlined { font-size: 14px; }
      .xr-batch-actions {
        display: flex; gap: 0.75rem; align-items: center;
      }
      .xr-batch-results {
        margin-top: 1.25rem;
      }
      .xr-batch-results-title {
        font-size: 1.05rem; font-weight: 800; margin: 0 0 0.75rem;
      }
      .xr-batch-table {
        width: 100%; border-collapse: collapse; font-size: 0.88rem;
      }
      .xr-batch-table thead th {
        text-align: left; padding: 0.55rem 0.65rem;
        background: rgba(0, 119, 221, 0.06);
        font-size: 0.82rem; font-weight: 700; white-space: nowrap;
        border-bottom: 2px solid var(--border-color, #e5e7eb);
      }
      .xr-batch-table tbody tr { border-bottom: 1px solid var(--border-color, #e5e7eb); }
      .xr-batch-table tbody tr:last-child { border-bottom: none; }
      .xr-batch-cell {
        padding: 0.55rem 0.65rem; vertical-align: middle;
      }
      .xr-batch-cell--file { max-width: 200px; }
      .xr-batch-filename {
        display: block; font-weight: 600; overflow: hidden;
        text-overflow: ellipsis; white-space: nowrap;
      }
      .xr-batch-filesize { font-size: 0.75rem; opacity: 0.6; }
      .xr-batch-status--active { color: var(--primary); }
      .xr-batch-status--active .material-icons-outlined { font-size: 16px; vertical-align: text-bottom; }
      .xr-batch-status--done { color: var(--success, #059669); }
      .xr-batch-status--done .material-icons-outlined { font-size: 16px; color: var(--success, #059669); vertical-align: text-bottom; }
      .xr-batch-status--error { color: var(--danger, #fb4d6d); }
      .xr-batch-status--error .material-icons-outlined { font-size: 16px; color: var(--danger, #fb4d6d); vertical-align: text-bottom; }
      .xr-batch-status--skipped { color: var(--text-secondary, #9ca3af); }
      .xr-batch-match--good { color: var(--success, #059669); font-weight: 700; }
      .xr-batch-match--warn { color: #f59e0b; font-weight: 700; }
      .xr-batch-match--bad { color: var(--danger, #fb4d6d); font-weight: 700; }

      /* Validation badges (compact, subdued) */
      .xr-batch-val-badge {
        display: inline-flex; align-items: center; gap: 2px;
        font-size: 0.78rem; font-weight: 600; border-radius: 6px;
        padding: 2px 6px; line-height: 1.3;
      }
      .xr-batch-val-badge .material-icons-outlined { font-size: 14px; }
      .xr-batch-val-badge--ok { color: var(--success, #059669); opacity: 0.7; }
      .xr-batch-val-badge--fail {
        background: rgba(251, 77, 109, 0.1); color: var(--danger, #fb4d6d);
      }

      /* Risk badges (prominent — intentionally eye-catching) */
      .xr-batch-risk-badge {
        display: inline-flex; align-items: center; gap: 3px;
        font-size: 0.82rem; font-weight: 800; border-radius: 8px;
        padding: 3px 8px; line-height: 1.3;
      }
      .xr-batch-risk-badge .material-icons-outlined { font-size: 16px; }
      .xr-batch-risk-badge--ok { color: var(--text-secondary, #9ca3af); font-weight: 400; }
      .xr-batch-risk-badge--critical {
        background: rgba(251, 77, 109, 0.12); color: var(--danger, #fb4d6d);
        border: 1.5px solid rgba(251, 77, 109, 0.3);
      }
      .xr-batch-risk-badge--warn {
        background: rgba(245, 158, 11, 0.1); color: #d97706;
        border: 1.5px solid rgba(245, 158, 11, 0.25);
      }

      /* Row-level risk indicator (coloured left border) */
      .xr-batch-row--risk-critical {
        border-left: 4px solid var(--danger, #fb4d6d) !important;
      }
      .xr-batch-row--risk-warn {
        border-left: 4px solid #f59e0b !important;
      }
      .xr-batch-footer {
        display: flex; gap: 0.75rem; align-items: center; margin-top: 1rem;
        padding-top: 0.75rem; border-top: 1px solid var(--border-color, #e5e7eb);
      }
      .xr-batch-footer .xr-btn-secondary {
        display: inline-flex; align-items: center; gap: 0.4rem;
        padding: 0.5rem 1rem; font-size: 0.85rem;
      }
      .xr-batch-footer .material-icons-outlined { font-size: 18px; }
      @media (max-width: 600px) {
        .xr-batch-cell--file { max-width: 130px; }
        .xr-batch-table { font-size: 0.8rem; }
        .xr-batch-cell { padding: 0.4rem; }
      }

      /* Clickable rows */
      .xr-batch-row--clickable { cursor: pointer; transition: background 0.12s; }
      .xr-batch-row--clickable:hover { background: rgba(0, 119, 221, 0.06); }
      .xr-batch-results-hint { font-size: 0.82rem; margin: 0 0 0.75rem; }

      /* Action button (open single view) */
      .xr-batch-col-action { width: 5.4rem; }
      .xr-batch-cell--action {
        text-align: center;
        padding: 0.15rem 0.25rem;
        white-space: nowrap;
      }
      .xr-batch-action-btn {
        display: inline-flex; align-items: center; justify-content: center;
        background: none; border: none; cursor: pointer;
        color: var(--primary); opacity: 0.5;
        padding: 0.3rem; border-radius: 6px;
        transition: opacity 0.12s, background 0.12s;
        margin: 0 0.05rem;
      }
      .xr-batch-action-btn:hover { opacity: 1; background: rgba(0, 119, 221, 0.08); }
      .xr-batch-action-btn--ai { color: #6366f1; }
      .xr-batch-action-btn--ai:disabled { opacity: 0.55; cursor: default; }
      .xr-batch-action-btn .material-icons-outlined { font-size: 18px; }

      /* Detail view */
      .xr-batch-detail { margin-top: 0.5rem; }
      .xr-batch-detail-header {
        display: flex; align-items: center; gap: 0.75rem;
        margin-bottom: 1rem; flex-wrap: wrap;
      }
      .xr-batch-detail-back {
        display: inline-flex; align-items: center; gap: 0.3rem;
        background: none; border: 2px solid var(--primary); border-radius: 12px;
        padding: 0.4rem 0.85rem; cursor: pointer; font-weight: 700;
        font-size: 0.85rem; color: var(--primary);
        transition: background 0.12s, color 0.12s;
      }
      .xr-batch-detail-back:hover {
        background: var(--primary); color: #fff;
      }
      .xr-batch-detail-back .material-icons-outlined { font-size: 18px; }
      .xr-batch-detail-title {
        font-weight: 800; font-size: 1rem;
        overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
        flex: 1 1 0;
      }
      .xr-batch-single-btn {
        display: inline-flex; align-items: center; gap: 0.3rem;
        background: none; border: 2px solid var(--primary); border-radius: 12px;
        padding: 0.4rem 0.85rem; cursor: pointer; font-weight: 700;
        font-size: 0.85rem; color: var(--primary); white-space: nowrap;
        margin-left: auto; transition: background 0.12s, color 0.12s;
      }
      .xr-batch-single-btn:hover { background: var(--primary); color: #fff; }
      .xr-batch-single-btn .material-icons-outlined { font-size: 18px; }
      .xr-batch-detail-banner {
        background: rgba(0, 119, 221, 0.04);
        border: 1px solid rgba(0, 119, 221, 0.15);
        border-radius: var(--border-radius, 1.25em);
        padding: 1rem 1.25rem; margin-bottom: 1rem;
      }
      .xr-batch-detail-banner__text {
        display: flex; align-items: center; gap: 0.5rem;
        font-weight: 700; font-size: 0.95rem; margin-bottom: 0.5rem;
      }
      .xr-batch-detail-banner__text .material-icons-outlined { font-size: 20px; color: var(--primary); }
      .xr-batch-detail-banner__bar {
        display: flex; height: 6px; border-radius: 3px; overflow: hidden;
        background: var(--border-color, #e5e7eb);
      }
      .xr-batch-detail-chips {
        display: flex; flex-wrap: wrap; gap: 0.35rem; margin-top: 0.75rem;
      }
      .xr-batch-detail-risks { margin-bottom: 1rem; }
      .xr-batch-detail-validation { margin-bottom: 1rem; }
      .xr-batch-val-details { margin-top: 0.5rem; font-size: 0.85rem; }
      .xr-batch-val-details summary {
        cursor: pointer; font-weight: 600; color: var(--primary);
      }
      .xr-batch-val-msg {
        display: flex; align-items: flex-start; gap: 0.4rem;
        padding: 0.35rem 0; font-size: 0.82rem; line-height: 1.4;
      }
      .xr-batch-val-msg .material-icons-outlined { font-size: 16px; flex-shrink: 0; margin-top: 0.1rem; }
      .xr-batch-val-msg--error .material-icons-outlined { color: var(--danger, #fb4d6d); }
      .xr-batch-val-msg--warn .material-icons-outlined { color: #f59e0b; }

      /* Dark mode: Batch */
      body.darkmode .xr-batch-queue {
        background: rgba(0, 34, 85, 0.5);
        border-color: rgba(255, 255, 255, 0.12);
      }
      body.darkmode .xr-batch-chip {
        background: rgba(102, 187, 255, 0.15);
      }
      body.darkmode .xr-batch-chip--error {
        background: rgba(251, 77, 109, 0.18);
      }
      body.darkmode .xr-batch-limit-error {
        color: #ffb0bd;
      }
      body.darkmode .xr-batch-table thead th {
        background: rgba(0, 34, 85, 0.6);
        border-bottom-color: rgba(255, 255, 255, 0.12);
      }
      body.darkmode .xr-batch-table tbody tr {
        border-bottom-color: rgba(255, 255, 255, 0.08);
      }
      body.darkmode .xr-batch-footer {
        border-top-color: rgba(255, 255, 255, 0.1);
      }
      body.darkmode .xr-batch-row--clickable:hover {
        background: rgba(102, 187, 255, 0.08);
      }
      body.darkmode .xr-batch-risk-badge--critical {
        background: rgba(251, 77, 109, 0.18); border-color: rgba(251, 77, 109, 0.4);
      }
      body.darkmode .xr-batch-risk-badge--warn {
        background: rgba(245, 158, 11, 0.15); color: #fbbf24; border-color: rgba(245, 158, 11, 0.35);
      }
      body.darkmode .xr-batch-val-badge--fail {
        background: rgba(251, 77, 109, 0.15);
      }
      body.darkmode .xr-batch-detail-banner {
        background: rgba(0, 34, 85, 0.5);
        border-color: rgba(255, 255, 255, 0.12);
      }
      body.darkmode .xr-batch-detail-back {
        border-color: var(--primary);
        color: var(--primary);
      }
      body.darkmode .xr-batch-detail-back:hover {
        background: var(--primary);
        color: var(--card-bg, #002255);
      }
      body.darkmode .xr-batch-single-btn {
        border-color: var(--primary); color: var(--primary);
      }
      body.darkmode .xr-batch-single-btn:hover {
        background: var(--primary); color: var(--card-bg, #002255);
      }
      body.darkmode .xr-batch-action-btn { color: var(--primary); }
      body.darkmode .xr-batch-action-btn:hover { background: rgba(102, 187, 255, 0.12); }

      .xr-actions {
        margin-top: 1.4rem;
        display: flex;
        flex-wrap: wrap;
        gap: 0.75rem;
        align-items: center;
      }

      .xr-actions--bottom {
        margin-top: 1.2rem;
        padding-top: 1rem;
        border-top: 1px solid var(--border-color);
        justify-content: center;
      }

      .xr-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0.55rem;
        background: var(--cta);
        color: #17394c;
        font-weight: 800;
        border: none;
        border-radius: 14px;
        padding: 0.9rem 1.35rem;
        text-decoration: none;
        cursor: pointer;
        box-shadow: 0 3px 18px rgba(31, 208, 122, 0.2);
        transition: transform 0.12s ease, box-shadow 0.12s ease,
          background 0.12s ease;
      }

      .xr-btn:hover {
        background: #1ac86a;
        transform: translateY(-2px);
        box-shadow: 0 6px 24px rgba(22, 224, 89, 0.28);
      }

      .xr-btn-secondary {
        background: var(--bg-primary);
        color: var(--primary);
        border: 2px solid var(--primary);
        box-shadow: var(--shadow);
      }

      .xr-btn-secondary:hover {
        background: var(--primary);
        color: var(--light);
        transform: translateY(-2px);
      }

      .xr-note {
        margin-top: 1.25rem;
        padding-top: 1.25rem;
        border-top: 1px solid var(--border-color);
      }

      .xr-meta {
        margin-top: 1.25rem;
        display: grid;
        gap: 0.8rem;
      }

      .xr-meta-row {
        display: grid;
        grid-template-columns: 160px 1fr;
        gap: 0.9rem;
      }

      .xr-meta-label {
        font-weight: 800;
        color: var(--text-primary);
      }

      .xr-meta-value {
        color: var(--text-primary);
        overflow-wrap: anywhere;
      }

      .xr-pre {
        margin-top: 1rem;
        background: var(--bg-secondary);
        border: 1px solid var(--border-color);
        border-radius: 14px;
        padding: 1.1rem;
        overflow-x: auto;
        max-height: 540px;
      }

      .xr-preview-header {
        display: flex;
        align-items: flex-end;
        justify-content: space-between;
        gap: 1rem;
        flex-wrap: wrap;
      }

      .xr-tabs {
        display: inline-flex;
        gap: 0.25rem;
        background: var(--bg-secondary);
        border: 1px solid var(--border-color);
        padding: 0.25rem;
        border-radius: 999px;
      }

      .xr-tab {
        appearance: none;
        border: none;
        background: transparent;
        color: var(--text-secondary);
        font-weight: 800;
        padding: 0.5rem 1rem;
        border-radius: 999px;
        cursor: pointer;
        transition: background 0.12s ease, color 0.12s ease, transform 0.12s ease;
      }

      .xr-tab:hover {
        transform: translateY(-1px);
      }

      .xr-tab.is-active {
        background: var(--bg-primary);
        color: var(--text-primary);
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
      }

      body.darkmode .xr-tab.is-active {
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28);
      }

      .xr-preview-panel.is-hidden {
        display: none;
      }

      .xr-summary {
        margin-top: 1rem;
        background: var(--bg-secondary);
        border: 1px solid var(--border-color);
        border-radius: 16px;
        padding: 0.9rem 1rem;
      }

      .xr-summary-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
        gap: 0.6rem 0.7rem;
      }

      .xr-summary-item {
        background: var(--bg-primary);
        border: 1px solid var(--border-color);
        border-radius: 14px;
        padding: 0.65rem 0.75rem;
      }

      .xr-summary-item--money {
        background: var(--xr-tint-money);
        border-color: rgba(217, 119, 6, 0.25);
      }

      .xr-summary-item--tax {
        background: var(--xr-tint-tax);
        border-color: rgba(217, 119, 6, 0.25);
      }

      .xr-summary-label {
        font-size: 0.78rem;
        font-weight: 900;
        color: var(--text-secondary);
        text-transform: uppercase;
        letter-spacing: 0.05em;
        margin-bottom: 0.2rem;
      }

      .xr-summary-value {
        font-weight: 800;
        color: var(--text-primary);
        overflow-wrap: anywhere;
      }

      .xr-summary-value--money {
        color: var(--xr-money-color);
        font-weight: 900;
      }

      .xr-summary-value--tax {
        color: var(--xr-tax-color);
        font-weight: 900;
      }

      .xr-summary-foot {
        margin-top: 0.75rem;
        padding-top: 0.75rem;
        border-top: 1px solid var(--border-color);
      }

      .xr-invoice {
        margin-top: 1rem;
        background: var(--bg-secondary);
        border: 1px solid var(--border-color);
        border-radius: 16px;
        padding: 1rem 1.05rem;
      }

      .xr-compare {
        margin-top: 1rem;
        background: var(--bg-secondary);
        border: 1px solid var(--border-color);
        border-radius: 16px;
        padding: 1rem 1.05rem;
      }

      .xr-compare-head {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 1rem;
        flex-wrap: wrap;
      }

      @media (min-width: 981px) {
        .xr-compare-head > div {
          flex: 1 0 auto;
        }

        .xr-compare-head .xr-invoice-hint {
          white-space: nowrap;
        }
      }

      .xr-compare-actions {
        display: flex;
        align-items: center;
        gap: 0.75rem;
        flex-wrap: wrap;
        justify-content: flex-end;
      }

      .xr-compare-chips-row {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.6rem;
        margin-top: 0.8rem;
        flex-wrap: wrap;
      }
      .xr-compare-chips-row > .xr-compare-chips {
        margin-top: 0;
      }
      .xr-compare-chips-row > .xr-tier-bar {
        margin-left: auto;
        max-width: 100%;
        min-width: 0;
      }
      .xr-tier-bar {
        display: inline-flex;
        align-items: center;
        flex-wrap: nowrap;
        justify-content: center;
        gap: 0.35rem;
        background: rgba(255,255,255,0.55);
        backdrop-filter: blur(6px);
        border-radius: 999px;
        padding: 0.18rem 0.25rem;
        border: 1px solid var(--border-color, rgba(0,0,0,0.08));
        flex-shrink: 1;
        min-width: 0;
        max-width: 100%;
      }
      .xr-tier-badge {
        display: inline-flex;
        align-items: center;
        gap: 0.2rem;
        padding: 0.28rem 0.55rem;
        border-radius: 999px;
        font-size: 0.72rem;
        font-weight: 700;
        color: var(--text-secondary);
        white-space: nowrap;
      }
      .xr-tier-badge .material-icons-outlined { font-size: 14px; }
      .xr-tier-badge--clickable { cursor: pointer; }
      .xr-tier-badge--clickable:hover {
        filter: brightness(0.98);
      }
      .xr-tier-badge--active {
        background: rgba(46, 204, 113, 0.12);
        color: var(--green, #2ecc71);
      }
      .xr-tier-btn {
        display: inline-flex;
        align-items: center;
        gap: 0.25rem;
        padding: 0.28rem 0.6rem;
        border-radius: 999px;
        font-size: 0.72rem;
        font-weight: 600;
        border: 1px solid var(--border-color, rgba(0,0,0,0.12));
        background: var(--bg-primary, #fff);
        color: var(--text-primary);
        cursor: pointer;
        transition: all 0.15s ease;
        white-space: nowrap;
      }
      .xr-tier-btn .material-icons-outlined { font-size: 15px; }
      .xr-tier-btn:hover:not(:disabled) {
        background: var(--bg-hover, #f0f0f0);
        border-color: rgba(0,0,0,0.18);
      }
      .xr-tier-btn:disabled { opacity: 0.5; cursor: default; }
      .xr-tier-btn--done {
        background: rgba(46, 204, 113, 0.12) !important;
        color: var(--green, #2ecc71) !important;
        border-color: rgba(46, 204, 113, 0.3) !important;
        cursor: default !important;
      }
      .xr-tier-badge--proplus.xr-tier-badge--active {
        background: rgba(99, 102, 241, 0.12);
        color: #6366f1;
      }
      .xr-tier-badge--invalid {
        background: rgba(231, 76, 60, 0.12);
        color: var(--red, #e74c3c);
      }
      .xr-tier-badge--neutral {
        background: rgba(148, 163, 184, 0.2);
        color: var(--text-secondary);
      }
      .xr-tier-badge--running .material-icons-outlined {
        animation: xr-spin 1s linear infinite;
      }
      .xr-tier-pct {
        font-size: 0.68rem;
        font-weight: 800;
        opacity: 0.7;
        min-width: 1.6em;
      }
      .xr-tier-badge--active .xr-tier-pct {
        opacity: 1;
      }
      .xr-tier-btn--all {
        border-color: var(--green, #2ecc71);
        color: var(--green, #2ecc71);
        font-weight: 700;
      }
      .xr-tier-btn--all:hover:not(:disabled) {
        background: rgba(46, 204, 113, 0.08);
      }
      @media (max-width: 640px) {
        .xr-tier-bar { flex-wrap: wrap; justify-content: center; }
      }

      /* Dark mode overrides for tier bar */
      body.darkmode .xr-tier-bar {
        background: rgba(0, 34, 85, 0.7);
        border-color: rgba(255, 255, 255, 0.12);
      }
      body.darkmode .xr-tier-badge {
        color: rgba(234, 246, 255, 0.7);
      }
      body.darkmode .xr-tier-badge--active {
        background: rgba(54, 220, 157, 0.2);
        color: #36dc9d;
      }
      body.darkmode .xr-tier-badge--proplus.xr-tier-badge--active {
        background: rgba(129, 140, 248, 0.2);
        color: #a5b4fc;
      }
      body.darkmode .xr-tier-badge--invalid {
        background: rgba(251, 113, 133, 0.2);
        color: #fb7185;
      }
      body.darkmode .xr-tier-badge--neutral {
        background: rgba(148, 163, 184, 0.22);
        color: rgba(234, 246, 255, 0.78);
      }
      body.darkmode .xr-tier-btn {
        background: rgba(0, 34, 85, 0.6);
        border-color: rgba(255, 255, 255, 0.15);
        color: rgba(234, 246, 255, 0.9);
      }
      body.darkmode .xr-tier-btn:hover:not(:disabled) {
        background: rgba(0, 51, 102, 0.8);
        border-color: rgba(255, 255, 255, 0.25);
      }
      body.darkmode .xr-tier-btn--all {
        border-color: #36dc9d;
        color: #36dc9d;
      }
      body.darkmode .xr-tier-btn--done {
        background: rgba(54, 220, 157, 0.15) !important;
        color: #36dc9d !important;
        border-color: rgba(54, 220, 157, 0.35) !important;
      }
      /* ── Upload options (validation / AI checkboxes) ── */
      .xr-upload-options {
        display: flex;
        flex-wrap: wrap;
        gap: 0.6rem;
        margin-top: 0.8rem;
        justify-content: center;
      }
      .xr-upload-option {
        display: inline-flex;
        align-items: center;
        gap: 0.4rem;
        padding: 0.55rem 1rem;
        border-radius: 999px;
        font-size: 0.9rem;
        font-weight: 600;
        border: 2px solid var(--border-color, rgba(0,0,0,0.12));
        background: var(--bg-primary, #fff);
        cursor: pointer;
        transition: all 0.15s ease;
        user-select: none;
        box-shadow: 0 1px 3px rgba(0,0,0,0.06);
      }
      .xr-upload-option:hover {
        border-color: rgba(0,0,0,0.25);
        background: var(--bg-hover, #f5f5f5);
        box-shadow: 0 2px 6px rgba(0,0,0,0.1);
      }
      .xr-upload-option:has(:checked) {
        border-color: var(--green, #2ecc71);
        background: rgba(46, 204, 113, 0.08);
        box-shadow: 0 0 0 1px rgba(46, 204, 113, 0.15);
      }
      .xr-upload-option--ai:has(:checked) {
        border-color: rgba(99, 102, 241, 0.5);
        background: rgba(99, 102, 241, 0.06);
        box-shadow: 0 0 0 1px rgba(99, 102, 241, 0.15);
      }
      .xr-upload-option .material-icons-outlined { font-size: 20px; }
      .xr-upload-option__check {
        width: 18px;
        height: 18px;
        accent-color: var(--green, #2ecc71);
      }
      .xr-upload-option--ai .xr-upload-option__check {
        accent-color: #6366f1;
      }
      .xr-btn-all-checks {
        display: inline-flex;
        align-items: center;
        gap: 0.3rem;
        padding: 0.55rem 1rem;
        border-radius: 999px;
        font-size: 0.82rem;
        font-weight: 700;
        border: 2px solid var(--green, #2ecc71);
        background: transparent;
        color: var(--green, #2ecc71);
        cursor: pointer;
        transition: all 0.15s ease;
      }
      .xr-btn-all-checks:hover {
        background: rgba(46, 204, 113, 0.08);
      }
      .xr-btn-all-checks .material-icons-outlined { font-size: 18px; }

      .xr-filter {
        display: inline-flex;
        align-items: center;
        gap: 0.45rem;
        padding: 0.35rem 0.55rem;
        border-radius: 12px;
        border: 1px solid var(--border-color);
        background: var(--bg-primary);
        color: var(--text-primary);
        font-weight: 800;
        font-size: 0.85rem;
        cursor: pointer;
        user-select: none;
      }

      .xr-filter .material-icons-outlined {
        font-size: 18px;
        margin: 0;
      }

      .xr-compare-chips {
        margin-top: 0.8rem;
        display: flex;
        flex-wrap: wrap;
        gap: 0.5rem;
        align-items: center;
      }

      .xr-compare-chip {
        display: inline-flex;
        align-items: center;
        gap: 0.35rem;
        padding: 0.32rem 0.55rem;
        border-radius: 999px;
        border: 1px solid var(--border-color);
        background: var(--bg-primary);
        color: var(--text-primary);
        font-weight: 900;
        font-size: 0.82rem;
        white-space: nowrap;
      }

      .xr-compare-chip .material-icons-outlined {
        font-size: 18px;
        margin: 0;
        color: var(--text-secondary);
      }

      .xr-compare-chip--danger {
        border-color: rgba(251, 77, 109, 0.35);
        background: rgba(251, 77, 109, 0.1);
      }

      .xr-compare-chip--warn {
        border-color: rgba(255, 224, 91, 0.5);
        background: rgba(255, 224, 91, 0.16);
      }

      .xr-compare-chip--ok {
        border-color: rgba(31, 208, 122, 0.35);
        background: rgba(31, 208, 122, 0.1);
      }

      .xr-compare-chip:not(.xr-compare-chip--muted):not(.xr-compare-chip--disabled) {
        cursor: pointer;
        transition: filter 0.12s, outline-color 0.12s;
      }

      .xr-compare-chip:not(.xr-compare-chip--muted):not(.xr-compare-chip--disabled):hover {
        filter: brightness(0.9);
      }

      .xr-compare-chip--active {
        outline: 2.5px solid var(--text-primary);
        outline-offset: 1px;
      }

      .xr-compare-chip--disabled {
        opacity: 0.35;
        pointer-events: none;
      }

      .xr-compare-chip--muted {
        opacity: 0.9;
      }

      /* ── Currency cross-check warning ── */
      .xr-compare-ai-reason {
        display: flex;
        align-items: flex-start;
        gap: 0.3rem;
        padding: 0.35rem 0.6rem;
        margin-top: -0.2rem;
        margin-bottom: 0.4rem;
        background: rgba(99, 102, 241, 0.06);
        border-left: 3px solid rgba(99, 102, 241, 0.5);
        font-size: 0.78rem;
        color: #6366f1;
        border-radius: 0 4px 4px 0;
      }
      .xr-compare-ai-reason .material-icons-outlined {
        font-size: 15px;
        flex-shrink: 0;
        margin-top: 1px;
      }
      .xr-compare-currency-warn {
        display: flex;
        align-items: flex-start;
        gap: 0.3rem;
        padding: 0.35rem 0.6rem;
        margin-top: -0.2rem;
        margin-bottom: 0.4rem;
        background: rgba(230, 126, 34, 0.08);
        border-left: 3px solid var(--orange, #e67e22);
        font-size: 0.78rem;
        color: var(--orange, #e67e22);
        border-radius: 0 4px 4px 0;
      }
      .xr-compare-currency-warn .material-icons-outlined {
        font-size: 15px;
        flex-shrink: 0;
        margin-top: 1px;
      }
      .xr-compare-currency-found {
        opacity: 0.7;
        font-weight: 600;
      }

      /* ── IBAN checksum badges ── */
      .xr-iban-badge {
        display: inline-block;
        padding: 0.05rem 0.35rem;
        border-radius: 999px;
        font-size: 0.65rem;
        font-weight: 700;
        vertical-align: middle;
        line-height: 1.4;
        letter-spacing: 0.02em;
        white-space: nowrap;
      }
      .xr-iban-badge--valid {
        background: rgba(46, 204, 113, 0.13);
        color: var(--green, #2ecc71);
        border: 1px solid rgba(46, 204, 113, 0.35);
      }
      .xr-iban-badge--invalid {
        background: rgba(231, 76, 60, 0.13);
        color: var(--red, #e74c3c);
        border: 1px solid rgba(231, 76, 60, 0.35);
      }

      /* ── AI badge (Pro+ tier) ── */
      .xr-compare-ai-badge {
        display: inline-flex;
        align-items: center;
        gap: 0.15rem;
        padding: 0.08rem 0.35rem;
        border-radius: 999px;
        font-size: 0.62rem;
        font-weight: 700;
        background: rgba(99, 102, 241, 0.10);
        color: #6366f1;
        border: 1px solid rgba(99, 102, 241, 0.25);
        vertical-align: middle;
        cursor: help;
        margin-left: 0.3rem;
        white-space: nowrap;
      }
      .xr-compare-ai-badge .material-icons-outlined {
        font-size: 11px;
      }
      .xr-compare-ai-summary {
        display: inline-flex;
        align-items: center;
        gap: 0.25rem;
        padding: 0.15rem 0.5rem;
        font-size: 0.72rem;
        font-weight: 600;
        color: #6366f1;
        opacity: 0.85;
      }
      .xr-compare-ai-summary .material-icons-outlined {
        font-size: 14px;
      }
      .xr-compare-ai-summary--conflict {
        color: #d97706;
      }
      .xr-compare-ai-summary--conflict-high {
        color: #dc2626;
      }
      .xr-compare-ai-badge--conflict {
        border-color: rgba(217, 119, 6, 0.32);
        background: rgba(217, 119, 6, 0.12);
        color: #b45309;
      }
      .xr-compare-ai-badge--conflict-high {
        border-color: rgba(220, 38, 38, 0.35);
        background: rgba(220, 38, 38, 0.12);
        color: #b91c1c;
      }
      .xr-compare-ai-badge--conflict-low {
        border-color: rgba(234, 179, 8, 0.35);
        background: rgba(234, 179, 8, 0.12);
        color: #a16207;
      }
      .xr-compare-conflict-reason {
        display: flex;
        align-items: flex-start;
        gap: 0.3rem;
        padding: 0.35rem 0.6rem;
        margin-top: -0.2rem;
        margin-bottom: 0.4rem;
        background: rgba(217, 119, 6, 0.08);
        border-left: 3px solid rgba(217, 119, 6, 0.45);
        font-size: 0.78rem;
        color: #b45309;
        border-radius: 0 4px 4px 0;
      }
      .xr-compare-conflict-reason .material-icons-outlined {
        font-size: 15px;
        flex-shrink: 0;
        margin-top: 1px;
      }

      /* ── Validation result ── */
      .xr-eval-grid {
        margin-top: 0.75rem;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.75rem;
        align-items: stretch;
      }
      .xr-eval-grid .xr-validation-result,
      .xr-eval-grid .xr-booking-advisory { margin-top: 0; }
      @media (max-width: 980px) {
        .xr-eval-grid {
          grid-template-columns: 1fr;
          gap: 0.6rem;
        }
      }
      .xr-validation-result {
        margin-top: 0.8rem;
        padding: 0.6rem 0.8rem;
        border-radius: 8px;
        border: 1px solid var(--border-color);
        background: var(--bg-secondary);
        font-size: 0.85rem;
      }
      .xr-validation-result[hidden] { display: none; }
      .xr-validation-result--pending {
        border-style: dashed;
        border-color: rgba(148, 163, 184, 0.45);
        background: rgba(148, 163, 184, 0.08);
      }
      .xr-validation-result--pending .xr-validation-summary {
        color: var(--text-primary);
      }
      .xr-vies-result {
        margin-top: 0.4rem;
        padding: 0.45rem 0.7rem;
        border-radius: 8px;
        border: 1px solid var(--border-color);
        background: var(--bg-secondary);
        font-size: 0.78rem;
        display: flex;
        align-items: center;
        gap: 0.4rem;
      }
      .xr-vies-result[hidden] { display: none; }
      .xr-vies-result .material-icons-outlined {
        font-size: 16px;
        flex-shrink: 0;
      }
      .xr-vies-result__content {
        min-width: 0;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        gap: 0.2rem 0.5rem;
      }
      .xr-vies-result__content strong {
        font-size: 0.72rem;
        letter-spacing: 0.04em;
        text-transform: uppercase;
        opacity: 0.85;
      }
      .xr-vies-result__content span {
        line-height: 1.3;
      }
      .xr-vies-result--valid {
        border-color: rgba(31, 208, 122, 0.35);
        background: rgba(31, 208, 122, 0.08);
        color: var(--green, #1fd07a);
      }
      .xr-vies-result--invalid {
        border-color: rgba(231, 76, 60, 0.35);
        background: rgba(231, 76, 60, 0.08);
        color: var(--red, #e74c3c);
      }
      .xr-vies-result--neutral {
        border-color: rgba(148, 163, 184, 0.35);
        background: rgba(148, 163, 184, 0.12);
        color: var(--text-secondary);
      }
      body.darkmode .xr-vies-result {
        border-color: rgba(255, 255, 255, 0.15);
        background: rgba(0, 34, 85, 0.5);
        color: rgba(234, 246, 255, 0.9);
      }
      body.darkmode .xr-vies-result--valid {
        border-color: rgba(54, 220, 157, 0.45);
        background: rgba(54, 220, 157, 0.15);
        color: #36dc9d;
      }
      body.darkmode .xr-vies-result--invalid {
        border-color: rgba(251, 113, 133, 0.45);
        background: rgba(251, 113, 133, 0.15);
        color: #fb7185;
      }
      body.darkmode .xr-vies-result--neutral {
        border-color: rgba(148, 163, 184, 0.35);
        background: rgba(148, 163, 184, 0.15);
        color: rgba(234, 246, 255, 0.82);
      }
      .xr-compare-risks[hidden] { display: none; }

      .xr-validation-summary {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        font-weight: 700;
      }
      .xr-validation-summary .material-icons-outlined { font-size: 20px; }
      .xr-validation-summary--valid { color: var(--green, #1fd07a); }
      .xr-validation-summary--invalid { color: var(--red, #e74c3c); }

      .xr-validation-badges {
        display: flex;
        gap: 0.5rem;
        flex-wrap: wrap;
        margin-top: 0.4rem;
      }
      .xr-validation-badge {
        display: inline-flex;
        align-items: center;
        gap: 0.3rem;
        padding: 0.2rem 0.5rem;
        border-radius: 999px;
        font-size: 0.75rem;
        font-weight: 600;
      }
      .xr-validation-badge--valid {
        background: rgba(31, 208, 122, 0.1);
        color: var(--green, #1fd07a);
        border: 1px solid rgba(31, 208, 122, 0.3);
      }
      .xr-validation-badge--invalid {
        background: rgba(231, 76, 60, 0.1);
        color: var(--red, #e74c3c);
        border: 1px solid rgba(231, 76, 60, 0.3);
      }

      .xr-validation-details {
        margin-top: 0.5rem;
        display: flex;
        flex-direction: column;
        gap: 0.3rem;
      }
      .xr-validation-detail {
        display: flex;
        align-items: flex-start;
        gap: 0.4rem;
        font-size: 0.8rem;
        color: var(--text-secondary);
      }
      .xr-validation-detail .material-icons-outlined {
        font-size: 16px;
        flex-shrink: 0;
        margin-top: 1px;
      }
      .xr-validation-detail--error { color: var(--red, #e74c3c); }
      .xr-validation-detail--warning { color: var(--orange, #e67e22); }

      .xr-validation-detail-content {
        display: flex;
        flex-direction: column;
        gap: 0.15rem;
        min-width: 0;
      }
      .xr-validation-specifics {
        margin: 0.15rem 0 0 0;
        padding-left: 1.2rem;
        font-size: 0.78rem;
        list-style: disc;
      }
      .xr-validation-specifics li {
        margin-bottom: 0.1rem;
        line-height: 1.35;
      }
      .xr-validation-detail--error .xr-validation-specifics {
        color: var(--red, #e74c3c);
        opacity: 0.85;
      }
      .xr-validation-detail--warning .xr-validation-specifics {
        color: var(--orange, #e67e22);
        opacity: 0.85;
      }

      .xr-validation-risk {
        display: flex;
        align-items: flex-start;
        gap: 0.5rem;
        margin-top: 0.6rem;
        padding: 0.55rem 0.7rem;
        background: rgba(231, 76, 60, 0.08);
        border: 1px solid rgba(231, 76, 60, 0.35);
        border-left: 4px solid var(--red, #e74c3c);
        border-radius: 0 6px 6px 0;
        color: var(--red, #e74c3c);
        font-size: 0.82rem;
      }
      .xr-validation-risk .material-icons-outlined {
        font-size: 22px;
        flex-shrink: 0;
        margin-top: 1px;
      }
      .xr-validation-risk-content {
        display: flex;
        flex-direction: column;
        gap: 0.15rem;
        min-width: 0;
      }
      .xr-validation-risk-content strong {
        font-size: 0.85rem;
        letter-spacing: 0.02em;
      }

      .xr-validation-hint {
        margin-top: 0.25rem;
        font-size: 0.8rem;
        color: var(--text-secondary);
      }
      .xr-validation-technical {
        margin-top: 0.5rem;
        font-size: 0.75rem;
        color: var(--text-secondary);
      }
      .xr-validation-technical summary {
        cursor: pointer;
        font-weight: 600;
        user-select: none;
        opacity: 0.6;
      }
      .xr-validation-technical summary:hover {
        opacity: 0.9;
      }
      .xr-validation-technical-list {
        margin-top: 0.3rem;
        display: flex;
        flex-direction: column;
        gap: 0.25rem;
        font-family: monospace;
        font-size: 0.7rem;
        word-break: break-word;
      }

      .xr-validation-meta {
        margin-top: 0.4rem;
        font-size: 0.75rem;
        color: var(--text-tertiary, var(--text-secondary));
        opacity: 0.7;
      }

      @keyframes xr-spin { to { transform: rotate(360deg); } }
      .xr-spin { animation: xr-spin 1s linear infinite; }

      .xr-compare-body {
        margin-top: 0.95rem;
        display: grid;
        gap: 0.75rem;
      }

      .xr-compare-group {
        border: 1px solid var(--border-color);
        background: var(--bg-primary);
        border-radius: 14px;
        overflow: hidden;
      }

      .xr-compare-group-title {
        padding: 0.75rem 0.9rem;
        font-weight: 950;
        letter-spacing: -0.01em;
        border-bottom: 1px solid var(--border-color);
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.75rem;
      }

      .xr-compare-group-title small {
        font-weight: 900;
        color: var(--text-secondary);
      }

      .xr-compare-rows {
        display: grid;
      }

      .xr-compare-row {
        display: grid;
        grid-template-columns: minmax(140px, 0.9fr) minmax(180px, 1.1fr) minmax(180px, 1.1fr) minmax(130px, 0.7fr);
        gap: 0.75rem;
        padding: 0.65rem 0.9rem;
        border-top: 1px solid var(--border-color);
        align-items: baseline;
      }

      .xr-compare-row:first-child {
        border-top: none;
      }

      .xr-compare-row--header {
        background: var(--bg-secondary);
        align-items: center;
      }

      .xr-compare-row--header .xr-compare-colhead {
        color: var(--text-secondary);
        font-weight: 950;
        font-size: 0.82rem;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        opacity: 0.92;
        display: flex;
        flex-direction: column;
        gap: 0.12rem;
        line-height: 1.15;
      }

      .xr-compare-row--header .xr-compare-colhead .xr-compare-colhead-label {
        font-size: 0.95em;
        font-weight: 950;
      }

      .xr-compare-row--header .xr-compare-colhead small,
      .xr-compare-row--header .xr-compare-colhead .xr-compare-colhead-hint {
        font-size: 0.76rem;
        font-weight: 900;
        text-transform: none;
        letter-spacing: 0;
        opacity: 0.92;
      }

      .xr-compare-row--header .xr-compare-colhead--xml {
        flex-direction: row;
        align-items: baseline;
        gap: 0.45rem;
        flex-wrap: wrap;
      }

      .xr-compare-row--header .xr-compare-colhead--xml small {
        color: var(--xr-tax);
        white-space: nowrap;
      }

      .xr-compare-row--header .xr-compare-colhead-spacer,
      .xr-compare-row--header .xr-compare-colhead-status {
        opacity: 0;
        user-select: none;
        pointer-events: none;
      }

      .xr-compare-key {
        color: var(--text-secondary);
        font-weight: 900;
        font-size: 0.78rem;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        opacity: 0.82;
      }

      .xr-compare-val {
        color: var(--text-primary);
        font-weight: 850;
        overflow-wrap: anywhere;
      }

      .xr-compare-val--pdf {
        color: var(--text-primary);
      }

      .xr-compare-val--xml {
        color: var(--text-primary);
      }

      .xr-compare-val--danger {
        color: #d97706;
        font-weight: 950;
      }

      .xr-compare-val--warn {
        color: #d97706;
        font-weight: 950;
      }

      .xr-status {
        justify-self: end;
        display: inline-flex;
        align-items: center;
        gap: 0.35rem;
        padding: 0.22rem 0.5rem;
        border-radius: 999px;
        font-weight: 950;
        font-size: 0.78rem;
        border: 1px solid var(--border-color);
        background: var(--bg-secondary);
        white-space: nowrap;
      }

      .xr-status .material-icons-outlined {
        font-size: 18px;
        margin: 0;
      }

      .xr-status--ok {
        border-color: rgba(31, 208, 122, 0.4);
        background: rgba(31, 208, 122, 0.12);
      }

      .xr-status--mismatch {
        border-color: rgba(251, 77, 109, 0.45);
        background: rgba(251, 77, 109, 0.12);
      }

      .xr-status--warn-mismatch {
        border-color: rgba(230, 126, 34, 0.45);
        background: rgba(230, 126, 34, 0.12);
      }

      .xr-status--uncertain {
        border-color: rgba(255, 224, 91, 0.55);
        background: rgba(255, 224, 91, 0.18);
      }

      .xr-status--missing {
        opacity: 0.92;
      }

      /* ── Status column wrapper (badge + gradient bar) ── */
      .xr-status-col {
        justify-self: end;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 0.25rem;
        min-width: 120px;
      }

      .xr-status-col .xr-status {
        align-self: flex-end;
      }

      /* ── Gradient confidence bar ── */
      .xr-gradient-bar {
        position: relative;
        width: 100%;
        height: 6px;
        border-radius: 3px;
        background: linear-gradient(
          to right,
          rgba(231, 76, 60, 0.65) 0%,
          rgba(241, 196, 15, 0.65) 45%,
          rgba(46, 204, 113, 0.65) 100%
        );
        overflow: visible;
      }

      .xr-gradient-bar--mini {
        height: 5px;
        border-radius: 2.5px;
        width: 48px;
        flex-shrink: 0;
      }

      .xr-gradient-bar__marker {
        position: absolute;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 10px;
        height: 10px;
        border-radius: 50%;
        background: #fff;
        border: 2px solid rgba(6, 38, 58, 0.6);
        box-shadow: 0 1px 4px rgba(0, 0, 0, 0.18);
        transition: left 0.35s ease;
        z-index: 1;
      }

      .xr-gradient-bar--mini .xr-gradient-bar__marker {
        width: 7px;
        height: 7px;
        border-width: 1.5px;
      }

      body.darkmode .xr-gradient-bar {
        background: linear-gradient(
          to right,
          rgba(231, 76, 60, 0.5) 0%,
          rgba(241, 196, 15, 0.5) 45%,
          rgba(46, 204, 113, 0.5) 100%
        );
      }

      body.darkmode .xr-gradient-bar__marker {
        background: var(--bg-primary, #1a1a1a);
        border-color: rgba(255, 255, 255, 0.55);
      }

      /* ── Score summary banner ── */
      .xr-score-banner {
        margin-top: 0.65rem;
        padding: 0.55rem 0.85rem;
        border-radius: 10px;
        border: 1px solid var(--border-color);
        background: var(--bg-primary);
      }

      .xr-booking-advisory {
        margin-top: 0.5rem;
        border-radius: 10px;
        border: 1px solid var(--border-color);
        background: var(--bg-primary);
        overflow: hidden;
      }
      .xr-booking-advisory[hidden] { display: none !important; }
      .xr-booking-advisory--pending {
        border-style: dashed;
        border-color: rgba(148, 163, 184, 0.45);
        background: rgba(148, 163, 184, 0.08);
      }
      .xr-booking-advisory--pending .xr-booking-advisory__main .material-icons-outlined {
        color: var(--text-secondary);
      }
      .xr-booking-advisory__main {
        display: flex;
        align-items: flex-start;
        gap: 0.55rem;
        padding: 0.55rem 0.85rem 0.5rem;
      }
      .xr-booking-advisory__main .material-icons-outlined {
        font-size: 19px;
        margin-top: 0.05rem;
      }
      .xr-booking-advisory__content {
        display: grid;
        gap: 0.15rem;
      }
      .xr-booking-advisory__meta {
        margin-left: auto;
        align-self: flex-start;
      }
      .xr-booking-advisory__content strong {
        font-size: 0.85rem;
      }
      .xr-booking-advisory__content span {
        font-size: 0.79rem;
        line-height: 1.35;
        color: var(--text-secondary);
      }
      .xr-booking-advisory__blockers {
        color: var(--text-primary) !important;
        font-weight: 700;
      }
      .xr-booking-advisory__next {
        font-weight: 700;
        color: var(--text-primary) !important;
      }
      .xr-booking-advisory__actions {
        margin-top: 0.14rem;
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 0.32rem;
      }
      .xr-booking-advisory__action {
        display: inline-flex;
        align-items: center;
        gap: 0.2rem;
        padding: 0.1rem 0.46rem;
        min-height: 24px;
        border-radius: 999px;
        border: 1px solid rgba(0, 122, 255, 0.38);
        background: rgba(0, 122, 255, 0.08);
        color: var(--link-color, #007aff);
        font-size: 0.69rem;
        font-weight: 700;
        line-height: 1.2;
        white-space: nowrap;
        cursor: pointer;
        transition: background-color 0.15s ease, border-color 0.15s ease;
      }
      .xr-booking-advisory__action .material-icons-outlined {
        font-size: 13px;
      }
      .xr-booking-advisory__action:hover {
        background: rgba(0, 122, 255, 0.15);
        border-color: rgba(0, 122, 255, 0.52);
      }
      .xr-booking-advisory__action:disabled {
        opacity: 0.72;
        cursor: wait;
      }
      .xr-booking-advisory__disclaimer {
        border-top: 1px solid var(--border-color);
        padding: 0.42rem 0.85rem 0.5rem;
        font-size: 0.68rem;
        line-height: 1.35;
        color: var(--text-secondary);
      }
      .xr-vies-inline {
        display: inline-flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 0.25rem;
        padding: 0.2rem 0.45rem;
        border-radius: 999px;
        border: 1px solid rgba(148, 163, 184, 0.35);
        background: rgba(148, 163, 184, 0.1);
        color: var(--text-secondary);
        font-size: 0.7rem;
        line-height: 1.2;
        white-space: normal;
        max-width: min(100%, 420px);
      }
      .xr-vies-inline .material-icons-outlined {
        font-size: 14px;
      }
      .xr-vies-inline__label {
        font-weight: 800;
        letter-spacing: 0.03em;
      }
      .xr-vies-inline__state {
        font-weight: 900;
      }
      .xr-vies-inline__vat {
        font-weight: 700;
        opacity: 0.86;
      }
      .xr-vies-inline__actions {
        display: inline-flex;
        align-items: center;
        gap: 0.32rem;
        margin-left: 0.2rem;
      }
      .xr-vies-inline__action {
        display: inline-flex;
        align-items: center;
        gap: 0.16rem;
        padding: 0.08rem 0.46rem;
        border-radius: 999px;
        border: 1px solid currentColor;
        background: transparent;
        color: inherit;
        font-size: 0.66rem;
        font-weight: 700;
        line-height: 1.2;
        text-decoration: none;
        cursor: pointer;
      }
      .xr-vies-inline__action .material-icons-outlined {
        font-size: 12px;
      }
      .xr-vies-inline__action:hover {
        background: rgba(0, 0, 0, 0.08);
      }
      .xr-vies-inline--valid {
        border-color: rgba(31, 208, 122, 0.36);
        background: rgba(31, 208, 122, 0.1);
        color: var(--green, #1fd07a);
      }
      .xr-vies-inline--invalid {
        border-color: rgba(231, 76, 60, 0.36);
        background: rgba(231, 76, 60, 0.1);
        color: var(--red, #e74c3c);
      }
      .xr-vies-inline--neutral {
        border-color: rgba(148, 163, 184, 0.35);
        background: rgba(148, 163, 184, 0.12);
        color: var(--text-secondary);
      }
      @media (max-width: 980px) {
        .xr-booking-advisory__main {
          flex-wrap: wrap;
        }
        .xr-booking-advisory__meta {
          margin-left: 0;
          width: 100%;
        }
        .xr-vies-inline {
          width: fit-content;
          max-width: 100%;
        }
      }
      .xr-booking-advisory--green {
        border-color: rgba(46, 204, 113, 0.45);
        background: rgba(46, 204, 113, 0.07);
      }
      .xr-booking-advisory--green .xr-booking-advisory__main .material-icons-outlined {
        color: var(--green, #2ecc71);
      }
      .xr-booking-advisory--yellow {
        border-color: rgba(241, 196, 15, 0.55);
        background: rgba(241, 196, 15, 0.08);
      }
      .xr-booking-advisory--yellow .xr-booking-advisory__main .material-icons-outlined {
        color: #b8860b;
      }
      .xr-booking-advisory--red {
        border-color: rgba(231, 76, 60, 0.5);
        background: rgba(231, 76, 60, 0.07);
      }
      .xr-booking-advisory--red .xr-booking-advisory__main .material-icons-outlined {
        color: #e74c3c;
      }

      .xr-score-banner__text {
        display: flex;
        align-items: center;
        gap: 0.4rem;
        font-weight: 800;
        font-size: 0.86rem;
        color: var(--text-primary);
        margin-bottom: 0.4rem;
      }

      .xr-score-banner__text .material-icons-outlined {
        font-size: 20px;
        color: var(--green, #2ecc71);
      }

      .xr-score-banner__bar {
        display: flex;
        height: 8px;
        border-radius: 4px;
        overflow: hidden;
        background: rgba(6, 38, 58, 0.06);
      }

      .xr-score-banner__seg {
        transition: width 0.4s ease;
        min-width: 0;
      }

      .xr-score-banner__seg--match {
        background: rgba(46, 204, 113, 0.72);
      }

      .xr-score-banner__seg--mismatch {
        background: rgba(231, 76, 60, 0.72);
      }

      .xr-score-banner__seg--uncertain {
        background: rgba(241, 196, 15, 0.48);
      }

      body.darkmode .xr-score-banner__bar {
        background: rgba(255, 255, 255, 0.06);
      }
      body.darkmode .xr-booking-advisory {
        border-color: rgba(255, 255, 255, 0.16);
        background: rgba(255, 255, 255, 0.02);
      }
      body.darkmode .xr-validation-result--pending {
        border-color: rgba(255, 255, 255, 0.24);
        background: rgba(0, 34, 85, 0.34);
      }
      body.darkmode .xr-booking-advisory__content span,
      body.darkmode .xr-booking-advisory__disclaimer {
        color: rgba(234, 246, 255, 0.78);
      }
      body.darkmode .xr-booking-advisory--pending {
        border-color: rgba(255, 255, 255, 0.24);
        background: rgba(0, 34, 85, 0.32);
      }
      body.darkmode .xr-booking-advisory__next {
        color: rgba(234, 246, 255, 0.92) !important;
      }
      body.darkmode .xr-booking-advisory__action {
        border-color: rgba(120, 196, 255, 0.42);
        background: rgba(0, 122, 255, 0.2);
        color: #b6e0ff;
      }
      body.darkmode .xr-booking-advisory__action:hover {
        background: rgba(0, 122, 255, 0.32);
        border-color: rgba(120, 196, 255, 0.62);
      }
      body.darkmode .xr-vies-inline {
        border-color: rgba(255, 255, 255, 0.2);
        background: rgba(0, 34, 85, 0.45);
        color: rgba(234, 246, 255, 0.88);
      }
      body.darkmode .xr-vies-inline__action:hover {
        background: rgba(255, 255, 255, 0.15);
      }
      body.darkmode .xr-vies-inline--valid {
        border-color: rgba(54, 220, 157, 0.48);
        background: rgba(54, 220, 157, 0.16);
        color: #36dc9d;
      }
      body.darkmode .xr-vies-inline--invalid {
        border-color: rgba(251, 113, 133, 0.5);
        background: rgba(251, 113, 133, 0.16);
        color: #fb7185;
      }
      body.darkmode .xr-vies-inline--neutral {
        border-color: rgba(148, 163, 184, 0.45);
        background: rgba(148, 163, 184, 0.2);
        color: rgba(234, 246, 255, 0.86);
      }
      body.darkmode .xr-booking-advisory--green {
        border-color: rgba(54, 220, 157, 0.44);
        background: rgba(54, 220, 157, 0.12);
      }
      body.darkmode .xr-booking-advisory--yellow {
        border-color: rgba(255, 203, 102, 0.44);
        background: rgba(255, 203, 102, 0.12);
      }
      body.darkmode .xr-booking-advisory--yellow .xr-booking-advisory__main .material-icons-outlined {
        color: #ffd27a;
      }
      body.darkmode .xr-booking-advisory--red {
        border-color: rgba(255, 120, 120, 0.44);
        background: rgba(255, 120, 120, 0.13);
      }
      body.darkmode .xr-booking-advisory--red .xr-booking-advisory__main .material-icons-outlined {
        color: #ff8d8d;
      }
      body.darkmode .xr-compare-ai-summary--conflict {
        color: #fbbf24;
      }
      body.darkmode .xr-compare-ai-summary--conflict-high {
        color: #fca5a5;
      }
      body.darkmode .xr-compare-ai-badge--conflict {
        border-color: rgba(251, 191, 36, 0.35);
        background: rgba(251, 191, 36, 0.14);
        color: #fde68a;
      }
      body.darkmode .xr-compare-ai-badge--conflict-high {
        border-color: rgba(248, 113, 113, 0.4);
        background: rgba(248, 113, 113, 0.14);
        color: #fecaca;
      }
      body.darkmode .xr-compare-ai-badge--conflict-low {
        border-color: rgba(253, 224, 71, 0.35);
        background: rgba(253, 224, 71, 0.14);
        color: #fef08a;
      }
      body.darkmode .xr-compare-conflict-reason {
        background: rgba(251, 191, 36, 0.16);
        border-left-color: rgba(251, 191, 36, 0.45);
        color: #fde68a;
      }

      /* ── Tier attribution line ── */
      .xr-score-banner__meta {
        display: flex;
        flex-wrap: wrap;
        gap: 0.15rem 0.6rem;
        margin-top: 0.4rem;
        font-size: 0.68rem;
        color: rgba(6, 38, 58, 0.48);
        line-height: 1.5;
      }

      .xr-score-banner__tier {
        display: inline-flex;
        align-items: center;
        gap: 0.2rem;
        white-space: nowrap;
      }

      .xr-score-banner__tier .material-icons-outlined {
        font-size: 11px;
      }

      .xr-score-banner__tier-label {
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 0.04em;
        font-size: 0.58rem;
        padding: 0.05rem 0.25rem;
        border-radius: 3px;
      }

      .xr-score-banner__tier--std .xr-score-banner__tier-label {
        background: rgba(26, 82, 118, 0.1);
        color: #1a5276;
      }

      .xr-score-banner__tier--pro .xr-score-banner__tier-label {
        background: rgba(30, 132, 73, 0.1);
        color: #1e8449;
      }

      .xr-score-banner__tier--pp .xr-score-banner__tier-label {
        background: rgba(99, 102, 241, 0.1);
        color: #6366f1;
      }

      .xr-score-banner__tier--pp {
        color: #6366f1;
      }

      @media (max-width: 640px) {
        .xr-score-banner__meta {
          font-size: 0.6rem;
        }
      }

      .xr-compare-footnote {
        margin-top: 0.85rem;
        color: var(--text-secondary);
        font-size: 0.95rem;
        line-height: 1.6;
      }

      @media (max-width: 980px) {
        .xr-compare-row {
          grid-template-columns: 1fr;
        }

        .xr-compare-row--header .xr-compare-colhead-spacer,
        .xr-compare-row--header .xr-compare-colhead-status {
          display: none;
        }

        .xr-status {
          justify-self: start;
        }

        .xr-status-col {
          justify-self: start;
          min-width: 0;
        }
      }

      .xr-invoice-split {
        margin-top: 1rem;
        display: grid;
        grid-template-columns: minmax(380px, 1fr) minmax(420px, 1fr);
        gap: 0.95rem;
        align-items: start;
      }

      .xr-invoice-split .xr-invoice {
        margin-top: 0;
      }

      .xr-pdf-preview {
        background: var(--bg-secondary);
        border: 1px solid var(--border-color);
        border-radius: 16px;
        padding: 0.9rem 0.95rem;
      }

      .xr-pdf-head {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        gap: 0.75rem;
        margin-bottom: 0.6rem;
      }

      .xr-link {
        color: var(--primary);
        text-decoration: none;
        font-weight: 850;
        font-size: 0.95rem;
        white-space: nowrap;
      }

      .xr-link:hover {
        text-decoration: underline;
      }

      .xr-pdf-frame {
        width: 100%;
        height: min(78vh, 920px);
        border: 1px solid var(--border-color);
        border-radius: 14px;
        background: var(--bg-primary);
      }

      .xr-invoice-head {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 1rem;
        flex-wrap: wrap;
      }

      .xr-invoice-title {
        font-size: 1.1rem;
        font-weight: 950;
        color: var(--text-primary);
      }

      .xr-invoice-hint {
        margin-top: 0.25rem;
        max-width: 56ch;
      }

      .xr-invoice-meta {
        display: grid;
        gap: 0.35rem;
        min-width: min(360px, 100%);
      }

      .xr-inv-row {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        gap: 1rem;
      }

      .xr-inv-row--due {
        margin-top: 0.55rem;
        padding-top: 0.55rem;
        border-top: 1px solid var(--border-color);
      }

      .xr-inv-k {
        font-size: 0.78rem;
        font-weight: 900;
        color: var(--text-secondary);
        text-transform: uppercase;
        letter-spacing: 0.05em;
        opacity: 0.82;
        white-space: nowrap;
      }

      .xr-inv-v {
        font-weight: 950;
        color: var(--text-primary);
        font-variant-numeric: tabular-nums;
        text-align: right;
        overflow-wrap: anywhere;
      }

      .xr-inv-v--party {
        color: var(--xr-party-color);
      }

      .xr-inv-v--address {
        color: var(--xr-address-color);
      }

      .xr-inv-v--money {
        color: var(--xr-money-color);
      }

      .xr-inv-v--tax {
        color: var(--xr-tax-color);
      }

      .xr-inv-v--id {
        color: var(--primary);
      }

      .xr-invoice-parties {
        margin-top: 1rem;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.75rem;
      }

      .xr-invoice-party {
        background: var(--bg-primary);
        border: 1px solid var(--border-color);
        border-radius: 14px;
        padding: 0.85rem 0.9rem;
      }

      .xr-invoice-party--seller {
        background: var(--xr-tint-party);
        border-color: rgba(14, 165, 233, 0.22);
      }

      .xr-invoice-party--buyer {
        background: var(--xr-tint-address);
        border-color: rgba(99, 102, 241, 0.22);
      }

      .xr-inv-address {
        margin-top: 0.3rem;
        display: grid;
        gap: 0.12rem;
      }

      .xr-invoice-lines {
        margin-top: 1rem;
        background: var(--bg-primary);
        border: 1px solid var(--border-color);
        border-radius: 14px;
        overflow: hidden;
      }

      .xr-lines-head {
        display: grid;
        grid-template-columns: 56px 1fr 110px 140px 140px;
        gap: 0.7rem;
        padding: 0.55rem 0.85rem;
        background: rgba(0, 0, 0, 0.03);
        color: var(--text-secondary);
        font-weight: 900;
        font-size: 0.78rem;
        text-transform: uppercase;
        letter-spacing: 0.05em;
      }

      body.darkmode .xr-lines-head {
        background: rgba(255, 255, 255, 0.04);
      }

      .xr-line {
        display: grid;
        grid-template-columns: 56px 1fr 110px 140px 140px;
        gap: 0.7rem;
        padding: 0.55rem 0.85rem;
        border-top: 1px solid var(--border-color);
        align-items: baseline;
      }

      .xr-line-pos {
        color: var(--text-secondary);
        font-weight: 900;
        opacity: 0.72;
        font-variant-numeric: tabular-nums;
      }

      .xr-line-desc {
        font-weight: 900;
        color: var(--text-primary);
        overflow-wrap: anywhere;
      }

      .xr-line-qty,
      .xr-line-unit-price,
      .xr-line-total {
        text-align: right;
        font-variant-numeric: tabular-nums;
        font-weight: 950;
      }

      .xr-line-unit-price,
      .xr-line-total {
        color: var(--xr-money-color);
      }

      .xr-invoice-bottom {
        margin-top: 1rem;
        display: flex;
        justify-content: flex-end;
        gap: 0.75rem;
        flex-wrap: wrap;
      }

      .xr-invoice-payment {
        min-width: min(380px, 100%);
        background: var(--bg-primary);
        border: 1px solid var(--border-color);
        border-radius: 14px;
        padding: 0.75rem 0.85rem;
      }

      .xr-invoice-totals {
        min-width: min(380px, 100%);
        background: var(--bg-primary);
        border: 1px solid var(--border-color);
        border-radius: 14px;
        padding: 0.75rem 0.85rem;
      }

      .xr-tree-tools {
        margin-top: 0.85rem;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.75rem;
        flex-wrap: wrap;
      }

      .xr-tree-search {
        flex: 1 1 360px;
        display: inline-flex;
        align-items: center;
        gap: 0.45rem;
        padding: 0.38rem 0.6rem;
        border-radius: 999px;
        border: 1px solid var(--border-color);
        background: var(--bg-secondary);
        color: var(--text-primary);
      }

      .xr-tree-search .material-icons-outlined {
        font-size: 18px;
        margin: 0;
        color: var(--text-secondary);
      }

      .xr-tree-search input {
        flex: 1 1 auto;
        min-width: 140px;
        border: none;
        outline: none;
        background: transparent;
        color: var(--text-primary);
        font-weight: 850;
        font-size: 0.9rem;
      }

      .xr-tree-search input::placeholder {
        color: var(--text-secondary);
        opacity: 0.85;
        font-weight: 800;
      }

      .xr-tree-search-clear {
        border: none;
        background: transparent;
        color: var(--text-secondary);
        cursor: pointer;
        padding: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
      }

      .xr-tree-search-clear .material-icons-outlined {
        font-size: 20px;
        margin: 0;
      }

      .xr-tree-search-meta {
        flex: 0 0 auto;
        font-size: 0.9rem;
        font-weight: 850;
        color: var(--text-secondary);
      }

      .xr-tree {
        margin-top: 0.85rem;
      }

      .xr-node {
        margin-bottom: 0.5rem;
      }

      .xr-node.xr-leaf {
        display: grid;
        grid-template-columns: minmax(200px, 290px) 1fr;
        gap: 0.65rem;
        align-items: start;
        padding: 0.48rem 0.7rem;
        background: var(--bg-secondary);
        border: 1px solid var(--border-color);
        border-radius: 12px;
      }

      .xr-leaf-name {
        font-weight: 800;
        color: var(--text-secondary);
        font-size: 0.88rem;
        opacity: 0.82;
        overflow-wrap: anywhere;
      }

      .xr-leaf-value {
        color: var(--text-primary);
        font-weight: 900;
        overflow-wrap: anywhere;
        line-height: 1.45;
      }

      .xr-node.xr-leaf.xr-leaf-id .xr-leaf-value {
        font-weight: 900;
      }

      .xr-node.xr-leaf.xr-leaf-money .xr-leaf-value {
        color: var(--xr-money-color);
        font-weight: 900;
      }

      .xr-node.xr-leaf.xr-leaf-tax .xr-leaf-value {
        color: var(--xr-tax-color);
        font-weight: 900;
      }

      .xr-node.xr-leaf.xr-group-party:not(.xr-leaf-money):not(.xr-leaf-tax) .xr-leaf-value {
        color: var(--xr-party-color);
      }

      .xr-node.xr-leaf.xr-group-address:not(.xr-leaf-money):not(.xr-leaf-tax) .xr-leaf-value {
        color: var(--xr-address-color);
      }

      details.xr-node {
        padding: 0.6rem 0.75rem;
        background: var(--bg-secondary);
        border: 1px solid var(--border-color);
        border-radius: 12px;
      }

      details.xr-node > summary {
        cursor: pointer;
        font-weight: 850;
        color: var(--text-secondary);
        list-style: none;
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        gap: 1rem;
      }

      details.xr-node[open] > summary {
        color: var(--text-secondary);
      }

      details.xr-node > summary::-webkit-details-marker {
        display: none;
      }

      .xr-node-left {
        display: flex;
        align-items: baseline;
        gap: 0.55rem;
        flex-wrap: wrap;
        min-width: 0;
      }

      .xr-node-title {
        color: var(--text-secondary);
        font-weight: 800;
        opacity: 0.82;
      }

      details.xr-node[open] > summary .xr-node-title {
        color: var(--text-secondary);
      }

      .xr-node-chips {
        display: inline-flex;
        flex-wrap: wrap;
        gap: 0.35rem;
      }

      .xr-chip {
        display: inline-flex;
        align-items: center;
        max-width: 520px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 0.82rem;
        font-weight: 850;
        padding: 0.14rem 0.55rem;
        border-radius: 999px;
        border: 1px solid var(--border-color);
        background: var(--bg-primary);
        color: var(--text-secondary);
      }

      .xr-chip-k {
        flex: 0 0 auto;
        color: var(--text-secondary);
        opacity: 0.82;
      }

      .xr-chip-k::after {
        content: ":";
        margin: 0 0.35rem 0 0.25rem;
        opacity: 0.65;
      }

      .xr-chip-v {
        flex: 1 1 auto;
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        color: var(--text-primary);
        font-weight: 900;
      }

      .xr-chip--party {
        background: var(--xr-tint-party);
        border-color: rgba(14, 165, 233, 0.22);
      }

      .xr-chip--party .xr-chip-v {
        color: var(--xr-party-color);
      }

      .xr-chip--address {
        background: var(--xr-tint-address);
        border-color: rgba(99, 102, 241, 0.22);
      }

      .xr-chip--address .xr-chip-v {
        color: var(--xr-address-color);
      }

      .xr-chip--id {
        background: var(--xr-tint-party);
        border-color: rgba(14, 165, 233, 0.25);
      }

      .xr-chip--id .xr-chip-v {
        color: var(--xr-party-color);
      }

      .xr-chip--money {
        background: var(--xr-tint-money);
        border-color: rgba(217, 119, 6, 0.28);
      }

      .xr-chip--money .xr-chip-v {
        color: var(--xr-money-color);
      }

      .xr-chip--tax {
        background: var(--xr-tint-tax);
        border-color: rgba(217, 119, 6, 0.28);
      }

      .xr-chip--tax .xr-chip-v {
        color: var(--xr-tax-color);
      }

      .xr-chip--more {
        background: transparent;
        border-style: dashed;
      }

      .xr-node-meta {
        font-size: 0.82rem;
        font-weight: 800;
        color: var(--text-secondary);
        white-space: nowrap;
      }

      .xr-node-children {
        margin-top: 0.55rem;
        padding-left: 0.75rem;
        border-left: 2px dashed var(--border-color);
      }

      .xr-attrs {
        margin-top: 0.3rem;
        display: flex;
        flex-wrap: wrap;
        gap: 0.35rem;
      }

      .xr-attr {
        display: inline-flex;
        align-items: center;
        gap: 0.3rem;
        font-size: 0.78rem;
        font-weight: 800;
        padding: 0.12rem 0.5rem;
        border-radius: 999px;
        border: 1px solid var(--border-color);
        background: rgba(0, 0, 0, 0.02);
        color: var(--text-secondary);
      }

      .xr-attr-k {
        opacity: 0.78;
      }

      .xr-attr-eq {
        opacity: 0.65;
      }

      .xr-attr-v {
        color: var(--text-primary);
        font-weight: 900;
      }

      body.darkmode .xr-attr {
        background: rgba(255, 255, 255, 0.03);
      }

      .xr-attr--money {
        background: var(--xr-tint-money);
        border-color: rgba(217, 119, 6, 0.25);
      }

      .xr-attr--money .xr-attr-v {
        color: var(--xr-money-color);
      }

      .xr-attr--tax {
        background: var(--xr-tint-tax);
        border-color: rgba(217, 119, 6, 0.25);
      }

      .xr-attr--tax .xr-attr-v {
        color: var(--xr-tax-color);
      }

      .xr-attr--id {
        background: var(--xr-tint-party);
        border-color: rgba(14, 165, 233, 0.25);
      }

      .xr-attr--id .xr-attr-v {
        color: var(--xr-party-color);
      }

      .xr-attr--more {
        background: transparent;
        border-style: dashed;
      }

      .xr-node.xr-group-party {
        background: var(--xr-tint-party);
        border-color: rgba(14, 165, 233, 0.22);
      }

      .xr-node.xr-group-address {
        background: var(--xr-tint-address);
        border-color: rgba(99, 102, 241, 0.22);
      }

      .xr-node.xr-group-money {
        background: var(--xr-tint-money);
        border-color: rgba(217, 119, 6, 0.24);
      }

      .xr-node.xr-group-tax {
        background: var(--xr-tint-tax);
        border-color: rgba(217, 119, 6, 0.24);
      }

      .xr-disclaimer {
        margin-top: 1rem;
        border: 1px solid var(--border-color);
        border-radius: 14px;
        padding: 0.9rem 1rem;
        background: var(--bg-secondary);
      }

      .xr-disclaimer summary {
        cursor: pointer;
        font-weight: 900;
        color: var(--text-primary);
      }

      .xr-disclaimer p {
        margin-top: 0.75rem;
        line-height: 1.65;
      }

      .xr-fab {
        position: fixed;
        right: 1.25rem;
        bottom: 1.25rem;
        z-index: 30;
        width: 46px;
        height: 46px;
        border-radius: 999px;
        border: 1px solid rgba(255, 255, 255, 0.22);
        background: rgba(255, 255, 255, 0.55);
        color: var(--text-primary);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        backdrop-filter: blur(12px);
        box-shadow: 0 18px 42px rgba(0, 0, 0, 0.12);
        transition: transform 0.14s ease, opacity 0.14s ease, background 0.14s ease, box-shadow 0.14s ease;
        opacity: 0;
        pointer-events: none;
        transform: translateY(10px) scale(0.98);
      }

      body.has-lang-suggest .xr-fab {
        bottom: 4.75rem;
      }

      body.darkmode .xr-fab {
        background: rgba(0, 34, 85, 0.35);
        border-color: rgba(102, 187, 255, 0.22);
        box-shadow: 0 18px 48px rgba(0, 0, 0, 0.38);
      }

      .xr-fab .material-icons-outlined {
        font-size: 22px;
        margin: 0;
      }

      .xr-fab.is-visible {
        opacity: 1;
        pointer-events: auto;
        transform: translateY(0) scale(1);
      }

      .xr-fab:hover {
        transform: translateY(-2px) scale(1.02);
        background: rgba(255, 255, 255, 0.7);
        box-shadow: 0 22px 56px rgba(0, 0, 0, 0.16);
      }

      body.darkmode .xr-fab:hover {
        background: rgba(0, 34, 85, 0.5);
      }

      .xr-fab:active {
        transform: translateY(0) scale(0.99);
      }

      /* XML view highlighting */
      #xr-xml-code {
        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
        font-size: 0.92rem;
        line-height: 1.55;
        white-space: pre;
      }

      .xml-bracket {
        color: var(--text-secondary);
      }

      .xml-slash {
        color: var(--text-secondary);
      }

      .xml-name {
        color: var(--text-secondary);
        font-weight: 800;
        opacity: 0.78;
      }

      .xml-attr-name {
        color: var(--text-secondary);
        font-weight: 800;
        opacity: 0.78;
      }

      .xml-attr-eq {
        color: var(--text-secondary);
        opacity: 0.65;
      }

      .xml-attr-value {
        color: var(--text-primary);
        font-weight: 800;
      }

      .xml-value {
        color: var(--text-primary);
        font-weight: 900;
        padding: 0 0.14rem;
        border-radius: 0.35rem;
      }

      .xml-v-party {
        color: var(--xr-party-color);
        background: var(--xr-tint-party);
      }

      .xml-v-address {
        color: var(--xr-address-color);
        background: var(--xr-tint-address);
      }

      .xml-v-money {
        color: var(--xr-money-color);
        background: var(--xr-tint-money);
      }

      .xml-v-tax {
        color: var(--xr-tax-color);
        background: var(--xr-tint-tax);
      }

      .xml-v-id {
        color: var(--primary);
      }

      .xml-comment,
      .xml-meta {
        color: var(--text-secondary);
        opacity: 0.8;
      }

      @media (max-width: 860px) {
        .xr-hero {
          padding: 6.25rem 1.5rem 4.25rem;
        }

        .xr-hero h1 {
          font-size: 2.25rem;
        }

        .xr-card {
          padding: 1.9rem 1.6rem;
        }

        .xr-meta-row {
          grid-template-columns: 1fr;
          gap: 0.2rem;
        }

        .xr-invoice-parties {
          grid-template-columns: 1fr;
        }

        .xr-lines-head {
          display: none;
        }

        .xr-line {
          grid-template-columns: 1fr;
          gap: 0.35rem;
          padding: 0.8rem 0.85rem;
        }

        .xr-line > div {
          display: flex;
          align-items: baseline;
          justify-content: space-between;
          gap: 1rem;
        }

        .xr-line > div::before {
          content: attr(data-label);
          color: var(--text-secondary);
          font-weight: 900;
          text-transform: uppercase;
          letter-spacing: 0.05em;
          font-size: 0.75rem;
          opacity: 0.78;
        }

        .xr-line-desc {
          display: block;
          text-align: left;
        }

        .xr-line-desc::before {
          display: block;
          margin-bottom: 0.25rem;
        }

        .xr-node.xr-leaf {
          grid-template-columns: 1fr;
          gap: 0.25rem;
        }

        .xr-preview-header .xr-tabs,
        .xr-upload-tabs {
          display: flex;
          width: 100%;
          max-width: 100%;
          box-sizing: border-box;
          flex-wrap: wrap;
          justify-content: center;
        }

        .xr-preview-header .xr-tab,
        .xr-upload-tab {
          flex: 1 1 9.5rem;
          min-width: 0;
          justify-content: center;
          text-align: center;
          white-space: normal;
          line-height: 1.25;
          padding: 0.48rem 0.75rem;
        }

        .xr-compare-actions {
          width: 100%;
          justify-content: flex-start;
        }
      }

      @media (max-width: 560px) {
        .xr-hero {
          padding: 4.75rem 1rem 3.25rem;
        }

        .xr-badge {
          font-size: 0.85rem;
          padding: 0.45rem 1rem;
          margin-bottom: 1.15rem;
        }

        .xr-hero h1 {
          font-size: 1.95rem;
          margin-bottom: 0.75rem;
        }

        .xr-subtitle {
          font-size: 1.05rem;
          margin-bottom: 1rem;
          white-space: normal;
        }

        .xr-hero-subline {
          font-size: 0.82rem;
          line-height: 1.45;
          margin-bottom: 0.85rem;
        }

        .xr-hero-emphasis {
          margin-bottom: 0.65rem;
          padding: 0.45rem 0.7rem;
          border-radius: 12px;
          width: 100%;
          max-width: 360px;
        }

        .xr-hero-emphasis__prefix {
          font-size: 0.8rem;
        }

        .xr-hero-emphasis__focus {
          font-size: 0.95rem;
        }

        .xr-info-toast {
          font-size: 0.8rem;
          padding: 0.6rem 0.75rem;
        }

        .xr-hero-counters {
          grid-template-columns: 1fr;
          max-width: 360px;
          margin-bottom: 1rem;
        }

        .xr-hero-counter {
          padding: 0.58rem 0.68rem;
        }

        .xr-hero-counter__value {
          font-size: 1.18rem;
        }

        .xr-hero-counter__label {
          font-size: 0.72rem;
        }

        .xr-hero-counter__hint {
          font-size: 0.78rem;
        }

        .xr-hero-note {
          font-size: 0.95rem;
          padding: 0.65rem 0.75rem;
          margin-bottom: 1.25rem;
        }

        .xr-hero-note [data-i18n="canary_hero_note_after_strong"],
        .xr-hero-note [data-i18n="canary_hero_note_after_link"] {
          display: none;
        }

        .xr-hero-actions {
          flex-direction: column;
          align-items: center;
          gap: 0.65rem;
          margin-bottom: 0.95rem;
        }

        .xr-hero-btn {
          width: 100%;
          max-width: 360px;
          padding: 0.78rem 1.05rem;
        }

      }

      @media (max-width: 1100px) {
        .xr-invoice-split {
          grid-template-columns: 1fr;
        }

        .xr-pdf-frame {
          height: min(62vh, 760px);
        }
      }

      @media (display-mode: standalone) and (max-width: 1300px),
        (display-mode: minimal-ui) and (max-width: 1300px),
        (display-mode: fullscreen) and (max-width: 1300px) {
        .xr-invoice-split {
          grid-template-columns: 1fr;
        }

        .xr-pdf-frame {
          height: min(62vh, 760px);
        }
      }