﻿:root {
        --bg: #02070f;
        --panel: rgba(5, 18, 31, 0.88);
        --panel-strong: rgba(7, 27, 45, 0.94);
        --line: rgba(18, 201, 255, 0.32);
        --line-soft: rgba(121, 191, 255, 0.16);
        --cyan: #18d8ff;
        --blue: #0b74ff;
        --green: #61ff7a;
        --amber: #ffbf3d;
        --red: #ff5d64;
        --text: #f4fbff;
        --muted: #9fb8ca;
        --dim: #6f8596;
        --radius: 8px;
        --shadow: 0 22px 70px rgba(0, 0, 0, 0.36);
        --font: Inter, "Microsoft YaHei", "PingFang SC", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      }

      * {
        box-sizing: border-box;
      }

      html {
        scroll-behavior: smooth;
        overflow-x: hidden;
      }

      body {
        min-width: 320px;
        margin: 0;
        font-family: var(--font);
        color: var(--text);
        background:
          radial-gradient(circle at 50% 0%, rgba(18, 216, 255, 0.12), transparent 36%),
          linear-gradient(180deg, #02070f 0%, #03111e 47%, #02070f 100%);
        overflow-x: hidden;
      }

      body::before {
        content: "";
        position: fixed;
        inset: 0;
        z-index: -2;
        background:
          linear-gradient(rgba(15, 189, 255, 0.055) 1px, transparent 1px),
          linear-gradient(90deg, rgba(15, 189, 255, 0.055) 1px, transparent 1px);
        background-size: 72px 72px;
        mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.9), transparent 82%);
      }

      body::after {
        content: "";
        position: fixed;
        inset: 0;
        z-index: -1;
        background:
          linear-gradient(90deg, transparent 0%, rgba(16, 211, 255, 0.12) 48%, transparent 100%) 0 188px / 100% 1px no-repeat,
          radial-gradient(circle at 12% 18%, rgba(22, 217, 255, 0.13), transparent 20%),
          radial-gradient(circle at 88% 22%, rgba(12, 106, 255, 0.12), transparent 22%);
        pointer-events: none;
      }

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

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

      button {
        cursor: pointer;
      }

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

      img {
        display: block;
        max-width: 100%;
      }

      .page-shell {
        position: relative;
        width: 100%;
        min-height: 100vh;
        isolation: isolate;
      }

      .topbar {
        position: sticky;
        top: 0;
        z-index: 20;
        display: grid;
        grid-template-columns: auto 1fr auto;
        align-items: center;
        gap: 24px;
        min-height: 62px;
        padding: 10px 24px;
        border-bottom: 1px solid rgba(122, 196, 255, 0.14);
        background: rgba(2, 7, 15, 0.9);
        backdrop-filter: blur(18px);
      }

      .brand {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        font-size: 19px;
        font-weight: 900;
      }

      .brand img {
        width: 34px;
        height: 34px;
        border-radius: 7px;
      }

      .topbar nav {
        display: flex;
        justify-content: center;
        gap: 36px;
        color: #dceaf5;
        font-weight: 750;
      }

      .topbar nav a {
        position: relative;
        padding: 20px 0 18px;
      }

      .topbar nav a.is-active {
        color: var(--text);
      }

      .topbar nav a.is-active::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        height: 3px;
        border-radius: 999px;
        background: linear-gradient(90deg, var(--cyan), var(--blue));
        box-shadow: 0 0 20px rgba(24, 216, 255, 0.7);
      }

      .hero {
        position: relative;
        max-width: 1440px;
        margin: 0 auto;
        padding: 22px 24px 12px;
        text-align: center;
      }

      .hero::before,
      .hero::after {
        content: "";
        position: absolute;
        top: 40px;
        width: 31%;
        height: 145px;
        border-top: 1px solid rgba(23, 216, 255, 0.22);
        background:
          linear-gradient(150deg, rgba(24, 216, 255, 0.18), transparent 28%) top left / 100% 1px no-repeat,
          linear-gradient(90deg, transparent, rgba(24, 216, 255, 0.14), transparent) 0 58px / 100% 1px no-repeat;
        opacity: 0.74;
      }

      .hero::before {
        left: 0;
      }

      .hero::after {
        right: 0;
        transform: scaleX(-1);
      }

      .eyebrow {
        position: relative;
        z-index: 1;
        display: inline-flex;
        align-items: center;
        min-height: 30px;
        padding: 0 12px;
        border: 1px solid rgba(24, 216, 255, 0.5);
        border-radius: 6px;
        background: rgba(24, 216, 255, 0.08);
        color: var(--cyan);
        font-size: 13px;
        font-weight: 900;
      }

      h1 {
        position: relative;
        z-index: 1;
        margin: 14px auto 10px;
        font-size: clamp(42px, 4.4vw, 66px);
        line-height: 1.04;
        letter-spacing: 0;
        text-shadow: 0 0 28px rgba(115, 194, 255, 0.28);
      }

      .hero-copy {
        position: relative;
        z-index: 1;
        max-width: 820px;
        margin: 0 auto;
        color: #d5e7f3;
        font-size: clamp(17px, 1.6vw, 22px);
        line-height: 1.55;
      }

      .hero-actions {
        position: relative;
        z-index: 1;
        display: flex;
        justify-content: center;
        gap: 22px;
        margin-top: 18px;
      }

      .primary-cta,
      .secondary-cta,
      .report-actions button,
      .service-card,
      .full-report-link {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        min-height: 48px;
        border-radius: var(--radius);
        font-weight: 900;
      }

      .primary-cta {
        min-width: 280px;
        border: 1px solid rgba(103, 221, 255, 0.86);
        background: linear-gradient(90deg, #18cfff, #0a67ff);
        box-shadow: 0 0 28px rgba(22, 141, 255, 0.48), inset 0 1px 0 rgba(255, 255, 255, 0.32);
      }

      .secondary-cta {
        min-width: 250px;
        border: 1px solid rgba(24, 216, 255, 0.44);
        background: rgba(5, 18, 31, 0.75);
        color: #ecf8ff;
      }

      .command-grid {
        display: grid;
        grid-template-columns: minmax(300px, 0.88fr) minmax(420px, 1.45fr) minmax(310px, 0.92fr);
        gap: 14px;
        align-items: start;
        max-width: 1440px;
        margin: 0 auto;
        padding: 0 14px 14px;
      }

      .panel {
        position: relative;
        min-width: 0;
        border: 1px solid var(--line);
        border-radius: var(--radius);
        background:
          linear-gradient(180deg, rgba(10, 37, 58, 0.88), rgba(3, 13, 24, 0.94)),
          radial-gradient(circle at 50% 0%, rgba(24, 216, 255, 0.12), transparent 44%);
        box-shadow: inset 0 0 45px rgba(25, 206, 255, 0.055), var(--shadow);
        overflow: hidden;
      }

      .panel::before {
        content: "";
        position: absolute;
        inset: 0;
        border-radius: inherit;
        background:
          linear-gradient(90deg, rgba(24, 216, 255, 0.7) 0 70px, transparent 70px calc(100% - 70px), rgba(24, 216, 255, 0.7) calc(100% - 70px)) top / 100% 2px no-repeat,
          linear-gradient(90deg, rgba(24, 216, 255, 0.7) 0 70px, transparent 70px calc(100% - 70px), rgba(24, 216, 255, 0.7) calc(100% - 70px)) bottom / 100% 2px no-repeat;
        pointer-events: none;
        opacity: 0.72;
      }

      .panel-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        min-height: 54px;
        padding: 16px 18px 10px;
        color: var(--cyan);
      }

      .panel-title {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 18px;
        font-weight: 900;
      }

      .index-tag {
        display: grid;
        min-width: 30px;
        height: 26px;
        place-items: center;
        border: 1px solid rgba(24, 216, 255, 0.52);
        border-radius: 6px;
        background: rgba(24, 216, 255, 0.1);
        color: var(--cyan);
        font-size: 14px;
        font-weight: 950;
      }

      .panel-note {
        color: var(--dim);
        font-size: 12px;
        font-weight: 750;
      }

      .input-panel form {
        display: grid;
        gap: 13px;
        padding: 0 18px 18px;
      }

      .field {
        display: grid;
        gap: 7px;
        min-width: 0;
      }

      .field-row {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 10px;
      }

      .field label,
      .range-field > span,
      .toggle-title {
        color: #d9ebf7;
        font-size: 13px;
        font-weight: 850;
      }

      .field input,
      .field select,
      .field textarea {
        width: 100%;
        min-width: 0;
        min-height: 42px;
        border: 1px solid rgba(133, 198, 255, 0.2);
        border-radius: 6px;
        outline: none;
        background: rgba(1, 9, 18, 0.72);
        color: #f3fbff;
        padding: 0 12px;
      }

      .field textarea {
        min-height: 70px;
        padding: 10px 12px;
        resize: vertical;
        line-height: 1.48;
      }

      .range-field {
        display: grid;
        gap: 8px;
        min-width: 0;
        padding: 10px 11px;
        border: 1px solid rgba(133, 198, 255, 0.17);
        border-radius: 6px;
        background: rgba(255, 255, 255, 0.035);
      }

      .range-field > span {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
      }

      .range-field b {
        color: var(--cyan);
      }

      .range-field input {
        width: 100%;
        accent-color: var(--cyan);
      }

      .range-caps {
        display: flex;
        justify-content: space-between;
        gap: 10px;
        color: var(--dim);
        font-size: 12px;
      }

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

      .toggle-card {
        display: flex;
        align-items: flex-start;
        gap: 8px;
        min-width: 0;
        min-height: 58px;
        padding: 10px;
        border: 1px solid rgba(133, 198, 255, 0.16);
        border-radius: 6px;
        background: rgba(255, 255, 255, 0.035);
      }

      .toggle-card input {
        width: 16px;
        height: 16px;
        margin: 2px 0 0;
        accent-color: var(--cyan);
      }

      .toggle-card small {
        display: block;
        margin-top: 2px;
        color: var(--dim);
        line-height: 1.35;
      }

      .input-foot {
        display: flex;
        align-items: center;
        gap: 8px;
        min-height: 34px;
        padding: 0 10px;
        border: 1px solid rgba(133, 198, 255, 0.13);
        border-radius: 6px;
        color: #9ab0c2;
        font-size: 12px;
        background: rgba(1, 9, 18, 0.58);
      }

      .core-panel {
        align-self: start;
        display: grid;
        grid-template-rows: auto auto auto;
        min-height: auto;
      }

      .model-head {
        justify-content: center;
      }

      .model-head .panel-title {
        padding: 8px 22px;
        border: 1px solid rgba(24, 216, 255, 0.45);
        background: rgba(24, 216, 255, 0.08);
        box-shadow: 0 0 26px rgba(24, 216, 255, 0.18);
      }

      .model-stage {
        position: relative;
        display: grid;
        height: 360px;
        min-height: 0;
        padding: 10px 24px 0;
        overflow: hidden;
      }

      .flow-svg {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        pointer-events: none;
      }

      .flow-path {
        fill: none;
        stroke: rgba(24, 216, 255, 0.7);
        stroke-width: 2;
        stroke-linecap: round;
        filter: drop-shadow(0 0 7px rgba(24, 216, 255, 0.7));
        stroke-dasharray: 8 12;
        animation: dash 5s linear infinite;
      }

      .flow-path.is-risk {
        stroke: rgba(255, 93, 100, 0.8);
      }

      .flow-path.is-amber {
        stroke: rgba(255, 191, 61, 0.78);
      }

      @keyframes dash {
        to {
          stroke-dashoffset: -80;
        }
      }

      .dimension-grid {
        position: relative;
        z-index: 1;
        display: grid;
        height: 100%;
        grid-template-columns: 180px 1fr 180px;
        grid-template-rows: repeat(3, 1fr);
        gap: 12px 24px;
        align-items: center;
      }

      .dimension-card {
        min-height: 86px;
        padding: 13px;
        border: 1px solid rgba(24, 216, 255, 0.34);
        border-radius: 8px;
        background: rgba(2, 12, 23, 0.78);
        box-shadow: inset 0 0 22px rgba(24, 216, 255, 0.055);
      }

      .dimension-card.is-risk {
        border-color: rgba(255, 93, 100, 0.46);
        box-shadow: inset 0 0 22px rgba(255, 93, 100, 0.06);
      }

      .dimension-card.is-amber {
        border-color: rgba(255, 191, 61, 0.48);
      }

      .dimension-grid .dimension-card:nth-child(1) {
        grid-column: 1;
        grid-row: 1;
      }

      .dimension-grid .dimension-card:nth-child(2) {
        grid-column: 1;
        grid-row: 2;
      }

      .dimension-grid .dimension-card:nth-child(3) {
        grid-column: 1;
        grid-row: 3;
      }

      .dimension-grid .dimension-card:nth-child(5) {
        grid-column: 3;
        grid-row: 1;
      }

      .dimension-grid .dimension-card:nth-child(6) {
        grid-column: 3;
        grid-row: 3;
      }

      .dimension-card strong,
      .dimension-card small {
        display: block;
      }

      .dimension-card strong {
        margin-bottom: 5px;
        color: #f2fbff;
      }

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

      .dimension-card b {
        display: inline-flex;
        margin-top: 9px;
        color: var(--amber);
        font-size: 26px;
        line-height: 1;
      }

      .dimension-card b span {
        align-self: flex-end;
        margin-left: 3px;
        color: var(--muted);
        font-size: 12px;
      }

      .core-node {
        grid-column: 2;
        grid-row: 1 / 4;
        justify-self: center;
        align-self: center;
        position: relative;
        display: grid;
        width: min(100%, 220px);
        aspect-ratio: 1;
        place-items: center;
        clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%);
        border: 1px solid rgba(24, 216, 255, 0.7);
        background:
          radial-gradient(circle at 50% 42%, rgba(24, 216, 255, 0.27), transparent 40%),
          linear-gradient(180deg, rgba(9, 58, 85, 0.88), rgba(3, 21, 35, 0.92));
        box-shadow: 0 0 44px rgba(24, 216, 255, 0.22), inset 0 0 38px rgba(24, 216, 255, 0.16);
      }

      .core-node::before,
      .core-node::after {
        content: "";
        position: absolute;
        inset: 18px;
        clip-path: inherit;
        border: 1px solid rgba(24, 216, 255, 0.42);
      }

      .core-node::after {
        inset: 38px;
        opacity: 0.62;
      }

      .core-node-content {
        position: relative;
        z-index: 1;
        display: grid;
        place-items: center;
        gap: 8px;
        text-align: center;
      }

      .core-node-content span {
        display: grid;
        width: 54px;
        height: 54px;
        place-items: center;
        border-radius: 50%;
        border: 1px solid rgba(24, 216, 255, 0.48);
        color: var(--cyan);
        font-size: 26px;
        font-weight: 900;
      }

      .core-node-content strong {
        color: var(--cyan);
        font-size: 18px;
      }

      .core-node-content small {
        max-width: min(150px, 78%);
        color: rgba(228, 246, 255, 0.86);
        font-size: 12px;
        font-weight: 800;
        line-height: 1.45;
        overflow-wrap: anywhere;
        text-align: center;
      }

      .score-band {
        position: relative;
        z-index: 1;
        display: grid;
        gap: 10px;
        margin: 0 24px 18px;
        padding: 12px 18px 14px;
        border: 1px solid rgba(122, 196, 255, 0.2);
        border-radius: 8px;
        background: rgba(255, 255, 255, 0.035);
      }

      .score-band-top {
        display: flex;
        align-items: end;
        justify-content: center;
        gap: 8px;
      }

      .score-band-top span {
        color: #dceaf5;
        font-weight: 850;
      }

      .score-band-top strong {
        color: var(--red);
        font-size: 42px;
        line-height: 0.9;
      }

      .score-scale {
        position: relative;
        height: 8px;
        border-radius: 999px;
        background: linear-gradient(90deg, var(--green), var(--cyan) 36%, var(--amber) 66%, var(--red));
        box-shadow: 0 0 18px rgba(24, 216, 255, 0.3);
      }

      .score-marker {
        position: absolute;
        top: -7px;
        left: 24%;
        width: 20px;
        height: 20px;
        border: 3px solid #fff;
        border-radius: 50%;
        background: var(--red);
        transform: translateX(-50%);
        box-shadow: 0 0 20px rgba(255, 93, 100, 0.8);
      }

      .scale-labels {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 8px;
        color: var(--muted);
        font-size: 12px;
        text-align: center;
      }

      .scale-labels b {
        display: block;
        color: var(--text);
      }

      .report-panel {
        display: grid;
        grid-template-rows: auto 1fr auto;
      }

      .report-body {
        display: grid;
        gap: 14px;
        padding: 0 18px 18px;
      }

      .result-row {
        display: grid;
        grid-template-columns: 122px 1fr;
        gap: 16px;
        align-items: center;
        padding: 14px 0 4px;
      }

      .score-ring {
        position: relative;
        display: grid;
        width: 116px;
        height: 116px;
        place-items: center;
        border-radius: 50%;
        background:
          radial-gradient(circle at center, rgba(5, 18, 31, 1) 57%, transparent 59%),
          conic-gradient(var(--red) var(--score, 24%), rgba(91, 124, 149, 0.28) 0);
      }

      .score-ring strong {
        margin-top: 14px;
        color: var(--red);
        font-size: 46px;
        line-height: 0.85;
      }

      .score-ring span {
        margin-top: -22px;
        color: var(--muted);
        font-size: 13px;
      }

      .result-badge {
        display: inline-flex;
        width: max-content;
        min-height: 28px;
        align-items: center;
        padding: 0 10px;
        border: 1px solid rgba(255, 93, 100, 0.6);
        border-radius: 5px;
        background: rgba(255, 93, 100, 0.18);
        color: #ffb7b9;
        font-weight: 950;
      }

      .result-copy {
        display: grid;
        gap: 8px;
      }

      .result-copy h2 {
        margin: 0;
        font-size: 25px;
        line-height: 1.16;
      }

      .result-copy p {
        margin: 0;
        color: var(--muted);
        line-height: 1.55;
      }

      .report-section {
        padding-top: 12px;
        border-top: 1px solid rgba(122, 196, 255, 0.14);
      }

      .report-section h3 {
        display: flex;
        align-items: center;
        gap: 8px;
        margin: 0 0 8px;
        font-size: 16px;
      }

      .signal {
        width: 11px;
        height: 11px;
        border-radius: 50%;
        background: var(--green);
        box-shadow: 0 0 14px currentColor;
      }

      .signal.is-amber {
        background: var(--amber);
      }

      .signal.is-red {
        background: var(--red);
      }

      .report-list {
        display: grid;
        gap: 7px;
        margin: 0;
        padding: 0;
        list-style: none;
        color: #dceaf5;
        line-height: 1.45;
        font-size: 14px;
      }

      .report-list li {
        display: grid;
        grid-template-columns: 10px 1fr;
        gap: 8px;
      }

      .report-list li::before {
        content: "";
        width: 7px;
        height: 7px;
        margin-top: 8px;
        border-radius: 50%;
        background: var(--green);
      }

      .report-list.risk li::before {
        background: var(--amber);
      }

      .report-list.stop li::before {
        background: var(--red);
      }

      .full-report-link {
        width: 100%;
        min-height: 44px;
        border: 1px solid rgba(24, 216, 255, 0.42);
        background: rgba(24, 216, 255, 0.08);
        color: var(--cyan);
      }

      .report-actions {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 8px;
        padding-top: 2px;
      }

      .report-actions button {
        min-height: 40px;
        border: 1px solid rgba(122, 196, 255, 0.2);
        background: rgba(255, 255, 255, 0.04);
        color: #e8f5ff;
        font-size: 13px;
      }

      .report-next-actions {
        margin-top: 12px;
        padding: 14px;
        border: 1px solid rgba(24, 216, 255, 0.24);
        border-radius: 8px;
        background: rgba(3, 16, 30, 0.72);
      }

      .report-next-actions h3 {
        margin: 0 0 10px;
        color: #f6fbff;
        font-size: 15px;
      }

      .report-next-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 9px;
      }

      .report-next-card {
        display: grid;
        grid-template-columns: 1fr auto;
        gap: 8px;
        align-items: center;
        min-height: 66px;
        padding: 12px;
        border: 1px solid rgba(122, 196, 255, 0.18);
        border-radius: 7px;
        background: rgba(255, 255, 255, 0.045);
        color: inherit;
        text-decoration: none;
      }

      .report-next-card strong,
      .report-next-card small {
        display: block;
      }

      .report-next-card strong {
        color: var(--cyan);
        font-size: 13px;
      }

      .report-next-card small {
        margin-top: 4px;
        color: var(--muted);
        font-size: 12px;
        line-height: 1.45;
      }

      .report-next-card b {
        color: var(--cyan);
        font-size: 18px;
      }

      .service-rail {
        max-width: 1412px;
        margin: 0 auto 16px;
        padding: 0 14px;
      }

      .service-panel {
        border: 1px solid rgba(24, 216, 255, 0.3);
        border-radius: 8px;
        background: rgba(5, 18, 31, 0.72);
        box-shadow: var(--shadow);
      }

      .service-head {
        display: flex;
        align-items: center;
        gap: 10px;
        min-height: 44px;
        padding: 0 18px;
        border-bottom: 1px solid rgba(122, 196, 255, 0.14);
        color: #dceaf5;
        font-size: 18px;
        font-weight: 900;
      }

      .service-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 16px;
        padding: 16px 20px;
      }

      .service-card {
        justify-content: space-between;
        min-height: 82px;
        padding: 0 22px;
        border: 1px solid rgba(122, 196, 255, 0.18);
        background:
          linear-gradient(90deg, rgba(24, 216, 255, 0.09), rgba(255, 255, 255, 0.025)),
          rgba(1, 9, 18, 0.62);
      }

      .service-card div {
        display: grid;
        gap: 5px;
      }

      .service-card strong {
        font-size: 18px;
      }

      .service-card span {
        color: var(--muted);
        font-size: 13px;
        font-weight: 650;
      }

      .service-card b {
        color: var(--cyan);
        font-size: 26px;
      }

      .seo-block,
      .faq-block {
        max-width: 1412px;
        margin: 0 auto 16px;
        padding: 0 14px;
      }

      .content-panel {
        border: 1px solid rgba(122, 196, 255, 0.16);
        border-radius: 8px;
        background: rgba(5, 18, 31, 0.62);
        padding: 20px;
      }

      .content-panel h2 {
        margin: 0 0 10px;
        font-size: 26px;
      }

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

      .decision-card,
      details {
        border: 1px solid rgba(122, 196, 255, 0.14);
        border-radius: 8px;
        background: rgba(1, 9, 18, 0.46);
        padding: 14px;
      }

      .decision-card strong,
      summary {
        color: #f1fbff;
        font-weight: 900;
      }

      .decision-card p,
      details p {
        margin: 8px 0 0;
        color: var(--muted);
        line-height: 1.6;
      }

      summary {
        cursor: pointer;
      }

      /* UI100 pass: make the first-screen cockpit feel like a real decision console. */
      .topbar {
        box-shadow: 0 16px 50px rgba(0, 0, 0, 0.22);
      }

      .topbar[data-rzw-unified-topbar="1"] {
        grid-template-columns: auto minmax(0, 1fr) auto;
      }

      .topbar[data-rzw-unified-topbar="1"] .rzw-header-auth-actions {
        justify-self: end;
      }

      .brand span,
      .topbar nav a,
      .topbar[data-rzw-unified-topbar="1"] .rzw-header-auth-actions a,
      .topbar[data-rzw-unified-topbar="1"] .rzw-header-auth-actions button {
        white-space: nowrap;
      }

      .status-link {
        color: #dff7ff;
        text-decoration: none;
      }

      .status-link:hover {
        border-color: rgba(24, 216, 255, 0.56);
        box-shadow: 0 0 18px rgba(24, 216, 255, 0.18);
      }

      .hero {
        min-height: 238px;
        padding-top: 26px;
      }

      .hero h1 {
        max-width: 820px;
      }

      .hero h1 span {
        display: block;
      }

      .hero-orbit {
        position: absolute;
        inset: 18px 24px auto;
        z-index: 0;
        display: flex;
        justify-content: space-between;
        gap: 24px;
        pointer-events: none;
      }

      .hero-mini {
        position: relative;
        width: min(264px, 22vw);
        min-height: 150px;
        border: 1px solid rgba(24, 216, 255, 0.34);
        border-radius: 8px;
        background:
          linear-gradient(145deg, rgba(9, 38, 62, 0.94), rgba(2, 13, 24, 0.9)),
          radial-gradient(circle at 18% 24%, rgba(24, 216, 255, 0.2), transparent 46%);
        box-shadow: 0 24px 70px rgba(0, 0, 0, 0.28), inset 0 0 36px rgba(24, 216, 255, 0.08);
        overflow: hidden;
        pointer-events: auto;
      }

      .hero-mini::before,
      .hero-mini::after {
        content: "";
        position: absolute;
        pointer-events: none;
      }

      .hero-mini::before {
        inset: 0;
        background:
          linear-gradient(90deg, rgba(24, 216, 255, 0.92) 0 74px, transparent 74px calc(100% - 74px), rgba(24, 216, 255, 0.92) calc(100% - 74px)) top / 100% 2px no-repeat,
          linear-gradient(90deg, rgba(24, 216, 255, 0.34), transparent 34%, transparent 66%, rgba(24, 216, 255, 0.34)) bottom / 100% 1px no-repeat;
        opacity: 0.76;
      }

      .hero-mini::after {
        width: 120px;
        height: 1px;
        left: -120px;
        top: 0;
        background: linear-gradient(90deg, transparent, rgba(144, 236, 255, 0.95), transparent);
        animation: rzw-scan-x 4.4s linear infinite;
      }

      .hero-mini-label {
        display: block;
        padding: 12px 14px 8px;
        color: #bfefff;
        font-size: 13px;
        font-weight: 900;
      }

      .hero-kpi-main {
        display: grid;
        grid-template-columns: 92px 1fr;
        gap: 14px;
        align-items: center;
        padding: 0 14px 14px;
      }

      .hero-kpi-ring {
        position: relative;
        display: grid;
        width: 82px;
        height: 82px;
        place-items: center;
        border-radius: 50%;
        background:
          radial-gradient(circle at center, rgba(4, 17, 31, 1) 50%, transparent 52%),
          conic-gradient(var(--cyan) 32%, rgba(76, 108, 131, 0.26) 0);
        box-shadow: 0 0 30px rgba(24, 216, 255, 0.22);
      }

      .hero-kpi-ring strong {
        color: #dffbff;
        font-size: 27px;
        line-height: 1;
      }

      .hero-kpi-ring small {
        position: absolute;
        bottom: 14px;
        width: 100%;
        color: rgba(220, 239, 252, 0.86);
        font-size: 10px;
        font-weight: 800;
        text-align: center;
      }

      .hero-mini dl,
      .hero-system ul {
        display: grid;
        gap: 8px;
        margin: 0;
        padding: 0;
        list-style: none;
      }

      .hero-mini dl div,
      .hero-system li {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 10px;
        align-items: center;
        min-height: 28px;
        border-bottom: 1px solid rgba(122, 196, 255, 0.11);
      }

      .hero-mini dt,
      .hero-system span {
        color: rgba(223, 240, 252, 0.82);
        font-size: 12px;
        font-weight: 750;
      }

      .hero-mini dd,
      .hero-system b {
        margin: 0;
        color: #f7fcff;
        font-size: 13px;
        font-weight: 950;
      }

      .hero-system ul {
        padding: 0 14px 14px;
      }

      .hero-system li::after {
        content: "";
        width: 8px;
        height: 8px;
        margin-left: 4px;
        border-radius: 50%;
        background: var(--green);
        box-shadow: 0 0 14px rgba(97, 255, 122, 0.8);
      }

      .hero-system li {
        grid-template-columns: minmax(0, 1fr) auto auto;
      }

      .hero > .eyebrow,
      .hero h1,
      .hero .hero-copy,
      .hero .hero-actions {
        position: relative;
        z-index: 1;
      }

      .panel {
        backdrop-filter: blur(12px);
      }

      .panel::after {
        content: "";
        position: absolute;
        inset: 0;
        border-radius: inherit;
        background:
          linear-gradient(135deg, rgba(24, 216, 255, 0.16), transparent 22%) top left / 180px 120px no-repeat,
          linear-gradient(315deg, rgba(24, 216, 255, 0.12), transparent 28%) bottom right / 210px 150px no-repeat;
        pointer-events: none;
      }

      .input-panel form,
      .core-panel > *,
      .report-panel > * {
        position: relative;
        z-index: 1;
      }

      .field input:focus,
      .field select:focus,
      .field textarea:focus,
      .range-field:focus-within,
      .toggle-card:focus-within {
        border-color: rgba(24, 216, 255, 0.72);
        box-shadow: 0 0 0 3px rgba(24, 216, 255, 0.12), inset 0 0 20px rgba(24, 216, 255, 0.06);
      }

      .range-field input {
        height: 22px;
      }

      .toggle-card {
        transition: border-color 160ms ease, transform 160ms ease, background 160ms ease;
      }

      .toggle-card:hover {
        transform: translateY(-1px);
        border-color: rgba(24, 216, 255, 0.42);
        background: rgba(24, 216, 255, 0.055);
      }

      .model-head {
        justify-content: space-between;
      }

      .model-live-pill {
        display: inline-flex;
        align-items: center;
        min-height: 28px;
        padding: 0 12px;
        border: 1px solid rgba(24, 216, 255, 0.55);
        border-radius: 6px;
        background: rgba(24, 216, 255, 0.08);
        color: #8ff1ff;
        font-size: 12px;
        font-weight: 900;
        box-shadow: 0 0 20px rgba(24, 216, 255, 0.16);
      }

      .model-live-pill::before {
        content: "";
        width: 7px;
        height: 7px;
        margin-right: 8px;
        border-radius: 50%;
        background: var(--green);
        box-shadow: 0 0 14px rgba(97, 255, 122, 0.85);
        animation: rzw-pulse 1.8s ease-in-out infinite;
      }

      .model-stage {
        background:
          linear-gradient(rgba(24, 216, 255, 0.06) 1px, transparent 1px),
          linear-gradient(90deg, rgba(24, 216, 255, 0.06) 1px, transparent 1px),
          radial-gradient(circle at 50% 50%, rgba(24, 216, 255, 0.14), transparent 44%);
        background-size: 40px 40px, 40px 40px, 100% 100%;
      }

      .model-stage::before {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(90deg, transparent 0%, rgba(24, 216, 255, 0.18) 48%, transparent 100%);
        transform: translateX(-110%);
        animation: rzw-model-sweep 5.6s linear infinite;
        pointer-events: none;
      }

      .model-stage::after {
        content: "";
        position: absolute;
        left: 50%;
        top: 50%;
        width: min(54%, 320px);
        aspect-ratio: 1;
        border: 1px solid rgba(24, 216, 255, 0.22);
        border-radius: 50%;
        transform: translate(-50%, -50%);
        box-shadow: 0 0 60px rgba(24, 216, 255, 0.16), inset 0 0 40px rgba(24, 216, 255, 0.08);
        pointer-events: none;
        animation: rzw-breathe 3.8s ease-in-out infinite;
      }

      .dimension-card {
        position: relative;
        overflow: hidden;
        transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
      }

      .dimension-card::after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(120deg, transparent 0 35%, rgba(255, 255, 255, 0.08) 48%, transparent 64% 100%);
        transform: translateX(-120%);
        animation: rzw-card-shine 5.8s linear infinite;
        pointer-events: none;
      }

      .dimension-card:hover {
        transform: translateY(-2px);
        border-color: rgba(24, 216, 255, 0.62);
        box-shadow: 0 0 24px rgba(24, 216, 255, 0.14), inset 0 0 28px rgba(24, 216, 255, 0.08);
      }

      .core-node {
        animation: rzw-core-float 4.4s ease-in-out infinite;
      }

      .core-node-content span {
        background: rgba(24, 216, 255, 0.08);
        box-shadow: 0 0 28px rgba(24, 216, 255, 0.22), inset 0 0 20px rgba(24, 216, 255, 0.14);
      }

      .flow-path {
        stroke-width: 2.4;
        stroke-dasharray: 9 14;
      }

      .score-band {
        background:
          linear-gradient(90deg, rgba(24, 216, 255, 0.08), rgba(255, 255, 255, 0.035)),
          rgba(2, 12, 23, 0.82);
      }

      .score-marker {
        animation: rzw-pulse 1.8s ease-in-out infinite;
      }

      .result-row {
        min-height: 142px;
        border: 1px solid rgba(122, 196, 255, 0.16);
        border-radius: 8px;
        padding: 16px;
        background: rgba(1, 10, 20, 0.54);
      }

      .score-ring {
        box-shadow: 0 0 34px rgba(255, 93, 100, 0.18), inset 0 0 18px rgba(0, 0, 0, 0.34);
      }

      .score-ring strong,
      .score-ring span {
        position: absolute;
        left: 0;
        right: 0;
        margin: 0;
        text-align: center;
      }

      .score-ring strong {
        top: 36px;
      }

      .score-ring span {
        top: 76px;
      }

      .report-section {
        padding: 14px 0 0;
      }

      .report-list li {
        font-weight: 650;
      }

      .full-report-link,
      .report-actions button,
      .service-card {
        transition: border-color 160ms ease, transform 160ms ease, box-shadow 160ms ease, background 160ms ease;
      }

      .full-report-link:hover,
      .report-actions button:hover,
      .service-card:hover {
        transform: translateY(-1px);
        border-color: rgba(24, 216, 255, 0.58);
        box-shadow: 0 0 24px rgba(24, 216, 255, 0.14);
        background-color: rgba(24, 216, 255, 0.075);
      }

      .report-next-card:hover {
        border-color: rgba(24, 216, 255, 0.5);
        box-shadow: 0 0 20px rgba(24, 216, 255, 0.12);
      }

      @keyframes rzw-scan-x {
        to {
          transform: translateX(420px);
        }
      }

      @keyframes rzw-pulse {
        0%,
        100% {
          opacity: 0.65;
          transform: scale(1);
        }
        50% {
          opacity: 1;
          transform: scale(1.12);
        }
      }

      @keyframes rzw-model-sweep {
        to {
          transform: translateX(110%);
        }
      }

      @keyframes rzw-breathe {
        0%,
        100% {
          opacity: 0.42;
          transform: translate(-50%, -50%) scale(0.96);
        }
        50% {
          opacity: 0.82;
          transform: translate(-50%, -50%) scale(1.04);
        }
      }

      @keyframes rzw-card-shine {
        55%,
        100% {
          transform: translateX(130%);
        }
      }

      @keyframes rzw-core-float {
        0%,
        100% {
          transform: translateY(0);
        }
        50% {
          transform: translateY(-5px);
        }
      }

      @media (prefers-reduced-motion: reduce) {
        .hero-mini::after,
        .model-live-pill::before,
        .model-stage::before,
        .model-stage::after,
        .dimension-card::after,
        .core-node,
        .score-marker {
          animation: none !important;
        }
      }

      @media (max-width: 1020px) {
        .topbar {
          grid-template-columns: auto minmax(0, 1fr);
        }

        .topbar nav {
          justify-content: flex-end;
          gap: 22px;
          min-width: 0;
          overflow-x: auto;
        }

        .topbar nav a {
          white-space: nowrap;
        }

      }

      @media (max-width: 1180px) {
        .command-grid {
          grid-template-columns: 1fr;
        }

        .hero {
          min-height: auto;
        }

        .hero-orbit {
          position: relative;
          inset: auto;
          display: grid;
          grid-template-columns: repeat(2, minmax(0, 1fr));
          max-width: 760px;
          margin: 0 auto 16px;
        }

        .hero-mini {
          width: 100%;
        }

        .model-head {
          justify-content: space-between;
          flex-direction: row;
          align-items: center;
        }

        .model-stage {
          height: auto;
          min-height: 0;
          padding: 14px 24px 18px;
        }

        .dimension-grid {
          height: auto;
          grid-template-columns: repeat(6, minmax(0, 1fr));
          grid-template-rows: auto auto auto;
          gap: 12px;
          align-items: stretch;
        }

        .dimension-card {
          min-height: 96px;
        }

        .dimension-grid .dimension-card:nth-child(1) {
          grid-column: 1 / 3 !important;
          grid-row: 1 !important;
        }

        .dimension-grid .dimension-card:nth-child(2) {
          grid-column: 1 / 3 !important;
          grid-row: 2 !important;
        }

        .dimension-grid .dimension-card:nth-child(3) {
          grid-column: 2 / 4 !important;
          grid-row: 3 !important;
        }

        .dimension-grid .dimension-card:nth-child(5) {
          grid-column: 5 / 7 !important;
          grid-row: 1 !important;
        }

        .dimension-grid .dimension-card:nth-child(6) {
          grid-column: 4 / 6 !important;
          grid-row: 3 !important;
        }

        .core-node {
          grid-column: 3 / 5 !important;
          grid-row: 1 / 3 !important;
          width: min(100%, 200px);
          margin: 0 auto;
        }

        .flow-svg {
          display: none;
        }

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

      @media (max-width: 700px) {
        .model-stage {
          padding: 12px 14px 16px;
        }

        .dimension-grid {
          grid-template-columns: 1fr;
          grid-template-rows: auto;
          gap: 10px;
        }

        .dimension-grid .dimension-card:nth-child(1),
        .dimension-grid .dimension-card:nth-child(2),
        .dimension-grid .dimension-card:nth-child(3),
        .dimension-grid .dimension-card:nth-child(5),
        .dimension-grid .dimension-card:nth-child(6) {
          grid-column: auto !important;
          grid-row: auto !important;
        }

        .core-node {
          grid-column: 1 / -1 !important;
          grid-row: 1 !important;
          width: min(168px, 54vw);
          margin: 0 auto 2px;
        }

        .dimension-card {
          display: grid;
          min-height: 72px;
          grid-template-columns: minmax(0, 1fr) auto;
          grid-template-areas:
            "title score"
            "meta score";
          align-items: center;
          gap: 4px 12px;
          padding: 12px 14px;
        }

        .dimension-card strong {
          grid-area: title;
          margin: 0;
          font-size: 15px;
        }

        .dimension-card small {
          grid-area: meta;
          font-size: 12px;
        }

        .dimension-card b {
          grid-area: score;
          justify-self: end;
          margin: 0;
          font-size: 24px;
        }

        .core-node-content {
          gap: 5px;
        }

        .core-node-content span {
          width: 48px;
          height: 48px;
          font-size: 23px;
        }

        .core-node-content strong {
          font-size: 16px;
        }

        .core-node-content small {
          max-width: 118px;
          font-size: 11px;
        }

        .decision-grid,
        .faq-grid {
          grid-template-columns: 1fr;
        }
      }

      @media (max-width: 760px) {
        body,
        .page-shell {
          width: 100%;
          max-width: 100vw;
          overflow-x: hidden;
        }

        .topbar {
          grid-template-columns: 1fr;
          gap: 8px;
          padding: 12px 14px;
        }

        .brand {
          justify-content: flex-start;
        }

        .topbar nav {
          justify-content: flex-start;
          gap: 18px;
          overflow-x: auto;
          padding-bottom: 3px;
          font-size: 14px;
        }

        .topbar nav a {
          white-space: nowrap;
          padding: 6px 0 10px;
        }

        .hero {
          padding: 26px 14px 14px;
          text-align: left;
        }

        .hero-orbit {
          grid-template-columns: 1fr;
          gap: 10px;
          margin-bottom: 18px;
        }

        .hero-mini {
          min-height: auto;
        }

        .hero-kpi-main {
          grid-template-columns: 80px 1fr;
        }

        .hero-kpi-ring {
          width: 74px;
          height: 74px;
        }

        .hero::before,
        .hero::after {
          display: none;
        }

        .eyebrow {
          font-size: 12px;
        }

        h1 {
          width: 100%;
          font-size: 38px;
          line-height: 1.1;
          word-break: keep-all;
          overflow-wrap: anywhere;
        }

        h1 span {
          display: block;
        }

        .hero-copy {
          font-size: 16px;
        }

        .mobile-line {
          display: block;
        }

        .hero-actions {
          display: grid;
          grid-template-columns: minmax(0, 1fr);
          width: 100%;
          gap: 10px;
        }

        .primary-cta,
        .secondary-cta {
          width: 100%;
          min-width: 0;
        }

        .command-grid,
        .service-rail,
        .seo-block,
        .faq-block {
          width: 100%;
          max-width: 100vw;
          padding-left: 14px;
          padding-right: 14px;
          overflow-x: hidden;
        }

        .command-grid {
          grid-template-columns: minmax(0, 1fr);
        }

        .panel,
        .panel *,
        .service-panel,
        .content-panel {
          min-width: 0;
        }

        .panel {
          width: 100%;
          max-width: 100%;
        }

        .panel-head {
          align-items: flex-start;
          flex-direction: column;
        }

        .model-head {
          align-items: flex-start;
          flex-direction: column;
        }

        .field-row,
        .toggle-grid,
        .dimension-grid,
        .result-row,
        .service-grid,
        .decision-grid,
        .faq-grid {
          grid-template-columns: 1fr;
        }

        .field input,
        .field select,
        .field textarea,
        .range-field,
        .toggle-card {
          max-width: 100%;
        }

        .range-field > span,
        .range-caps {
          display: grid;
          grid-template-columns: minmax(0, 1fr);
          flex-wrap: wrap;
          gap: 4px;
        }

        .range-field > span b,
        .range-caps span {
          justify-self: start;
        }

        .range-field b,
        .range-caps span {
          overflow-wrap: anywhere;
        }

        .field textarea {
          white-space: pre-wrap;
          overflow-x: hidden;
          overflow-wrap: anywhere;
        }

        .result-row {
          justify-items: start;
        }

        .score-ring {
          width: 104px;
          height: 104px;
        }

        .score-ring strong {
          top: 31px;
          font-size: 40px;
        }

        .score-ring span {
          top: 67px;
        }

        .core-node {
          width: 174px;
        }

        .scale-labels {
          grid-template-columns: repeat(2, 1fr);
          text-align: left;
        }

        .report-actions {
          grid-template-columns: 1fr;
        }

        .report-next-grid {
          grid-template-columns: 1fr;
        }

        .service-card {
          min-height: 72px;
          padding: 12px 16px;
        }
      }

      @media (max-width: 430px) {
        h1 {
          font-size: 34px;
        }

        .topbar nav {
          gap: 12px;
          font-size: 13px;
        }

        .hero-copy {
          line-height: 1.62;
        }

        .input-panel form,
        .report-body,
        .score-band {
          padding-left: 14px;
          padding-right: 14px;
        }

        .model-stage {
          padding-left: 14px;
          padding-right: 14px;
        }

        .dimension-card {
          min-height: auto;
        }
      }

      @media print {
        .topbar,
        .hero,
        .input-panel,
        .core-panel,
        .service-rail,
        .seo-block,
        .faq-block,
        .report-actions,
        .report-next-actions,
        .full-report-link {
          display: none !important;
        }

        body {
          background: #fff;
          color: #111;
        }

        .command-grid {
          display: block;
        }

        .report-panel {
          border: 0;
          box-shadow: none;
          background: #fff;
          color: #111;
        }
      }
