/* ==========================================================================
   QuanLLM Model V1 · Domain Cognition / Structured Inference
   ========================================================================== */

.model-v1 {
    --m-violet: #846cf0;
    --m-violet-strong: #a091ff;
    --m-blue: #5579ee;
    --m-cyan: #27becb;
    --m-emerald: #39bd8c;
    --m-amber: #d7a04b;
    --m-line: rgba(135, 119, 242, .17);
    --m-line-strong: rgba(39, 190, 203, .34);
    --m-card-border: rgba(139, 160, 197, .13);
    --m-shadow: 0 26px 82px -56px rgba(0, 0, 0, .84);
    --m-section-gap: 118px;
    background:
        radial-gradient(circle at 75% 7%, rgba(132, 108, 240, .055), transparent 31rem),
        var(--bg);
}

html[data-theme="light"] .model-v1 {
    --m-violet: #654fd0;
    --m-violet-strong: #735dde;
    --m-blue: #355bd5;
    --m-cyan: #0c909d;
    --m-emerald: #16815f;
    --m-amber: #a76f28;
    --m-line: rgba(101, 79, 208, .10);
    --m-line-strong: rgba(12, 144, 157, .20);
    --m-card-border: rgba(27, 49, 79, .09);
    --m-shadow: 0 25px 70px -48px rgba(31, 54, 86, .29);
    background:
        radial-gradient(circle at 75% 7%, rgba(101, 79, 208, .045), transparent 31rem),
        #f7f9fc;
}

.model-v1 .navbar.scrolled {
    background: rgba(7, 16, 29, .82);
    border-bottom-color: rgba(142, 164, 199, .12);
    box-shadow: 0 14px 50px -34px rgba(0, 0, 0, .72);
}

html[data-theme="light"] .model-v1 .navbar.scrolled {
    background: rgba(248, 250, 253, .90);
    border-bottom-color: rgba(25, 45, 76, .075);
    box-shadow: 0 14px 42px -32px rgba(25, 45, 76, .24);
}

.model-v1 .details-menu a[aria-current="page"] {
    background: rgba(132, 108, 240, .09);
    border-color: rgba(132, 108, 240, .17);
}

.model-v1 .nav-cta {
    background: linear-gradient(112deg, var(--m-blue), var(--m-cyan));
}

.model-v1 .icon-sprite {
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
}

.model-v1 .button-icon {
    width: 17px;
    height: 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    flex: none;
}

.model-v1 .harness-link-icon {
    transform: translateY(1px);
}

/* ---------- Shared section rhythm ------------------------------------ */

.model-section {
    position: relative;
    padding: var(--m-section-gap) 0;
    overflow: clip;
}

.model-v1 .section-header {
    max-width: 850px;
    margin-bottom: 56px;
}

.model-v1 .section-tag {
    display: inline-block;
    position: relative;
    padding: 0 0 0 28px;
    border: 0;
    background: transparent;
    color: var(--m-violet-strong);
    text-transform: uppercase;
    letter-spacing: .12em;
    font-size: .71rem;
    font-weight: 700;
}

.model-v1 .section-tag::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 18px;
    height: 1px;
    background: var(--m-cyan);
}

.model-v1 .section-header h2 {
    margin-top: 14px;
    font-size: clamp(2rem, 4.2vw, 3.55rem);
    line-height: 1.12;
    letter-spacing: -.035em;
}

.model-v1 .section-header p {
    margin-top: 18px;
    max-width: 800px;
    color: var(--text-muted);
    line-height: 1.86;
    font-size: 1.03rem;
}

/* ---------- Hero ----------------------------------------------------- */

.model-hero {
    position: relative;
    min-height: 100svh;
    display: flex;
    align-items: center;
    padding: 132px 0 78px;
    isolation: isolate;
    overflow: clip;
    background:
        radial-gradient(circle at 80% 23%, rgba(132, 108, 240, .12), transparent 30rem),
        radial-gradient(circle at 13% 80%, rgba(39, 190, 203, .055), transparent 28rem),
        linear-gradient(180deg, rgba(255,255,255,.01), transparent 54%);
}

html[data-theme="light"] .model-hero {
    background:
        radial-gradient(circle at 80% 23%, rgba(101, 79, 208, .07), transparent 31rem),
        radial-gradient(circle at 13% 80%, rgba(12, 144, 157, .04), transparent 27rem),
        linear-gradient(180deg, #fbfcff 0%, #f7f9fc 100%);
}

.model-hero::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    width: min(1180px, 92vw);
    height: 1px;
    transform: translateX(-50%);
    background: linear-gradient(90deg, transparent, var(--m-line-strong), transparent);
    opacity: .62;
}

.model-hero__field {
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
}

.model-field-grid {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(var(--m-line) 1px, transparent 1px),
        linear-gradient(90deg, var(--m-line) 1px, transparent 1px);
    background-size: 82px 82px;
    opacity: .18;
    mask-image: linear-gradient(to bottom, rgba(0,0,0,.54), transparent 82%);
}

.model-field-wave {
    position: absolute;
    left: -5%;
    right: -5%;
    height: 150px;
    border-top: 1px solid var(--m-line-strong);
    border-radius: 50%;
    opacity: .16;
    filter: blur(.15px);
    animation: modelWave 11s ease-in-out infinite;
}

.model-field-wave--a {
    top: 34%;
    transform: rotate(-4deg);
}

.model-field-wave--b {
    top: 49%;
    transform: rotate(5deg) scaleX(.86);
    animation-duration: 14s;
    animation-direction: reverse;
}

.model-field-symbol {
    position: absolute;
    font-family: "Courier New", monospace;
    color: var(--text-subtle);
    font-size: .77rem;
    opacity: .19;
    animation: modelSymbol 10s ease-in-out infinite;
}

.model-field-symbol--a { left: 6%; top: 24%; }
.model-field-symbol--b { right: 7%; top: 27%; animation-delay: -3s; }
.model-field-symbol--c { left: 11%; bottom: 14%; animation-delay: -6s; color: var(--m-cyan); }

.model-hero__layout {
    display: grid;
    grid-template-columns: minmax(0, .96fr) minmax(520px, 1.04fr);
    gap: 58px;
    align-items: center;
}

.model-hero__copy .hero-badge {
    margin-bottom: 23px;
    background: rgba(132, 108, 240, .07);
    border-color: rgba(132, 108, 240, .16);
    color: var(--m-violet-strong);
}

.model-hero__copy h1 {
    font-size: clamp(2.72rem, 4.6vw, 4.95rem);
    line-height: 1.03;
    letter-spacing: -.047em;
}

.model-v1 .gradient-text {
    display: block;
    margin-top: 5px;
    background: linear-gradient(100deg, var(--m-violet-strong), var(--m-blue) 44%, var(--m-cyan) 90%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}

.model-hero__lead {
    margin-top: 28px;
    max-width: 730px;
    color: var(--text-muted);
    line-height: 1.88;
    font-size: 1.055rem;
}

.model-hero__lead strong {
    color: var(--text);
}

.model-hero__metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-top: 38px;
}

.model-hero__metrics > div {
    padding: 14px 12px;
    border: 1px solid var(--m-card-border);
    border-radius: 13px;
    background: color-mix(in srgb, var(--bg-light) 88%, transparent);
    backdrop-filter: blur(10px);
}

.model-hero__metrics strong,
.model-hero__metrics span {
    display: block;
}

.model-hero__metrics strong {
    color: var(--text);
    font-size: 1.08rem;
}

.model-hero__metrics span {
    margin-top: 4px;
    color: var(--text-subtle);
    font-size: .66rem;
    line-height: 1.35;
}

/* ---------- Hero model runtime -------------------------------------- */

.model-runtime {
    position: relative;
    min-width: 0;
    --model-tilt-x: 0deg;
    --model-tilt-y: 0deg;
    transform: perspective(1200px) rotateX(var(--model-tilt-x)) rotateY(var(--model-tilt-y));
    transition: transform .35s cubic-bezier(.2,.7,.2,1);
    will-change: transform;
}

.model-runtime::before {
    content: "";
    position: absolute;
    inset: 8% 4% -8%;
    z-index: -1;
    background: radial-gradient(circle, rgba(132,108,240,.19), transparent 65%);
    filter: blur(40px);
    opacity: .62;
}

.model-runtime__window {
    overflow: hidden;
    border: 1px solid rgba(132, 149, 204, .16);
    border-radius: 22px;
    background:
        radial-gradient(circle at 79% 15%, rgba(132,108,240,.09), transparent 21rem),
        color-mix(in srgb, var(--bg-light) 98%, var(--m-violet) 2%);
    box-shadow: 0 40px 100px -58px rgba(47, 40, 122, .70);
}

html[data-theme="light"] .model-runtime__window {
    background:
        radial-gradient(circle at 79% 15%, rgba(101,79,208,.055), transparent 21rem),
        rgba(255,255,255,.94);
    box-shadow: 0 34px 80px -50px rgba(53, 48, 113, .27);
}

.model-runtime__bar {
    height: 45px;
    display: grid;
    grid-template-columns: 78px 1fr auto;
    gap: 10px;
    align-items: center;
    padding: 0 15px;
    border-bottom: 1px solid var(--m-card-border);
    background: rgba(132,108,240,.025);
    color: var(--text-subtle);
    font-family: "Courier New", monospace;
    font-size: .64rem;
}

.model-runtime__dots {
    display: flex;
    gap: 5px;
}

.model-runtime__dots i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: rgba(128,153,190,.34);
}

.model-runtime__dots i:first-child { background: #ef6c63; }
.model-runtime__dots i:nth-child(2) { background: #e4b94f; }
.model-runtime__dots i:nth-child(3) { background: #49bb79; }

.model-runtime__bar em {
    font-style: normal;
    color: var(--m-cyan);
}

.model-runtime__request {
    margin: 16px;
    padding: 15px 16px;
    border: 1px solid var(--m-card-border);
    border-radius: 13px;
    background: rgba(132,108,240,.025);
}

.model-runtime__request span,
.model-runtime__profile span,
.model-runtime__artifact-label,
.model-runtime__handoff span {
    font-size: .58rem;
    letter-spacing: .1em;
    color: var(--text-subtle);
    font-weight: 700;
}

.model-runtime__request p {
    margin-top: 7px;
    color: var(--text-muted);
    font-size: .75rem;
    line-height: 1.55;
}

.model-runtime__profile {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 16px 12px;
}

.model-profile-pill {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 6px 9px;
    border: 1px solid rgba(132,108,240,.22);
    border-radius: 999px;
    background: rgba(132,108,240,.045);
    color: var(--m-violet-strong);
    font-family: "Courier New", monospace;
    font-size: .62rem;
}

.model-profile-pill i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--m-violet-strong);
    box-shadow: 0 0 0 5px rgba(132,108,240,.065);
    animation: modelPulse 2s ease-in-out infinite;
}

.model-runtime__artifact {
    margin: 0 16px 14px;
    border: 1px solid var(--m-card-border);
    border-radius: 13px;
    overflow: hidden;
    background: rgba(4,12,22,.26);
}

html[data-theme="light"] .model-runtime__artifact {
    background: rgba(101,79,208,.025);
}

.model-runtime__artifact-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 40px;
    padding: 0 13px;
    border-bottom: 1px solid var(--m-card-border);
}

.model-runtime__artifact-head code {
    color: var(--m-cyan);
    font-size: .63rem;
}

.model-artifact {
    display: none;
    min-height: 198px;
    padding: 15px;
}

.model-artifact.is-active {
    display: block;
}

.model-artifact__line {
    display: grid;
    grid-template-columns: 94px 1fr;
    gap: 12px;
    padding: 7px 0;
    color: var(--text-muted);
    font-family: "Courier New", monospace;
    font-size: .64rem;
}

.model-artifact__line span:first-child {
    color: var(--text-subtle);
}

.model-artifact__line strong {
    color: var(--text);
    font-weight: 600;
}

.model-artifact__equation {
    margin-top: 13px;
    padding: 17px;
    border: 1px solid rgba(39,190,203,.13);
    border-radius: 11px;
    background: rgba(39,190,203,.025);
    color: var(--m-cyan);
    text-align: center;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.18rem;
}

.model-artifact__json {
    margin-top: 8px;
    color: var(--text-muted);
    font-family: "Courier New", monospace;
    font-size: .64rem;
    line-height: 1.7;
    white-space: pre-wrap;
}

.model-runtime__handoff {
    position: relative;
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 13px 16px;
    border-top: 1px solid var(--m-card-border);
    background: rgba(39,190,203,.025);
}

.model-runtime__handoff strong {
    margin-left: auto;
    color: var(--text);
    font-family: "Courier New", monospace;
    font-size: .68rem;
}

.model-runtime__handoff i {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--m-cyan);
    box-shadow: 0 0 0 5px rgba(39,190,203,.07);
}

.model-runtime__caption {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 9px;
    margin-top: 14px;
    color: var(--text-subtle);
    font-size: .72rem;
}

.model-runtime__caption span {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--m-violet-strong);
}

/* ---------- Identity + local nav ------------------------------------ */

.model-identity {
    padding: 24px 0;
    border-bottom: 1px solid var(--m-card-border);
    background: color-mix(in srgb, var(--bg-light) 35%, transparent);
}

.model-identity .identity-strip {
    display: grid;
    grid-template-columns: minmax(190px,.8fr) minmax(0,1.7fr) auto;
    gap: 26px;
    align-items: center;
}

.model-identity .identity-kicker {
    color: var(--m-violet-strong);
}

.model-identity .identity-tags {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.model-identity .identity-tags span {
    padding: 6px 9px;
    border: 1px solid var(--m-card-border);
    border-radius: 999px;
    color: var(--text-muted);
    font-size: .68rem;
    background: rgba(132,108,240,.022);
}

.model-identity .identity-status {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--text-subtle);
    font-size: .72rem;
    white-space: nowrap;
}

.model-identity .identity-status i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--m-emerald);
    box-shadow: 0 0 0 5px rgba(57,189,140,.06);
}

.model-local-nav {
    position: sticky;
    top: 62px;
    z-index: 80;
    border-bottom: 1px solid var(--m-card-border);
    background: color-mix(in srgb, var(--bg) 82%, transparent);
    backdrop-filter: blur(18px);
}

html[data-theme="light"] .model-local-nav {
    background: rgba(247,249,252,.86);
}

.model-local-nav__track {
    display: flex;
    gap: 30px;
    overflow-x: auto;
    scrollbar-width: none;
}

.model-local-nav__track::-webkit-scrollbar { display: none; }

.model-local-nav a {
    position: relative;
    flex: none;
    padding: 13px 0 12px;
    color: var(--text-subtle);
    font-size: .77rem;
    font-weight: 600;
}

.model-local-nav a::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 2px;
    background: var(--m-cyan);
    transform: scaleX(0);
    transition: transform .25s ease;
}

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

.model-local-nav a.is-active::after {
    transform: scaleX(1);
}

/* ---------- Model role ---------------------------------------------- */

.role-section {
    background: linear-gradient(180deg, transparent, rgba(132,108,240,.02), transparent);
}

.role-shell {
    display: grid;
    grid-template-columns: minmax(0,1.18fr) minmax(310px,.82fr);
    gap: 24px;
}

.role-map {
    position: relative;
    min-height: 520px;
    border: 1px solid var(--m-card-border);
    border-radius: 24px;
    overflow: hidden;
    background:
        radial-gradient(circle at center, rgba(132,108,240,.07), transparent 23rem),
        linear-gradient(rgba(135,119,242,.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(135,119,242,.03) 1px, transparent 1px);
    background-size: auto, 44px 44px, 44px 44px;
    box-shadow: var(--m-shadow);
}

.role-map__orbit {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 360px;
    height: 220px;
    border: 1px solid var(--m-line);
    border-radius: 50%;
    transform: translate(-50%,-50%) rotate(-9deg);
    opacity: .8;
}

.role-map__orbit--b {
    width: 470px;
    height: 290px;
    transform: translate(-50%,-50%) rotate(14deg);
    opacity: .4;
}

.role-core {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 150px;
    height: 150px;
    transform: translate(-50%,-50%);
    border: 1px solid rgba(39,190,203,.27);
    border-radius: 50%;
    background: radial-gradient(circle, rgba(132,108,240,.16), rgba(39,190,203,.035) 60%, transparent 72%);
    display: grid;
    place-items: center;
    text-align: center;
    z-index: 2;
}

.role-core strong,
.role-core small {
    display: block;
}

.role-core strong {
    font-size: .92rem;
}

.role-core small {
    margin-top: 5px;
    color: var(--text-subtle);
    font-size: .58rem;
    letter-spacing: .08em;
}

.role-node {
    position: absolute;
    width: 150px;
    min-height: 78px;
    padding: 12px;
    border: 1px solid var(--m-card-border);
    border-radius: 14px;
    background: color-mix(in srgb, var(--bg-light) 94%, transparent);
    color: var(--text);
    text-align: left;
    cursor: pointer;
    z-index: 3;
    transition: .22s ease;
}

.role-node strong,
.role-node span {
    display: block;
}

.role-node strong {
    font-size: .78rem;
}

.role-node span {
    margin-top: 5px;
    color: var(--text-subtle);
    font-size: .61rem;
    line-height: 1.4;
}

.role-node--understand { left: 8%; top: 15%; }
.role-node--generate { right: 8%; top: 15%; }
.role-node--explain { left: 50%; bottom: 10%; transform: translateX(-50%); }

.role-node:hover,
.role-node:focus-visible {
    border-color: rgba(39,190,203,.31);
    outline: none;
}

.role-node.is-active {
    border-color: rgba(39,190,203,.42);
    background: color-mix(in srgb, var(--bg-light) 90%, rgba(39,190,203,.10));
    box-shadow: 0 16px 34px -28px rgba(39,190,203,.85);
}

.role-signal {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--m-cyan);
    box-shadow: 0 0 11px rgba(39,190,203,.9);
    animation: roleSignal 7s ease-in-out infinite;
    z-index: 4;
}

.role-detail {
    padding: 30px;
    border: 1px solid var(--m-card-border);
    border-radius: 24px;
    background: color-mix(in srgb, var(--bg-light) 91%, transparent);
    box-shadow: var(--m-shadow);
}

.role-detail__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.role-detail__head span {
    color: var(--text-subtle);
    font-size: .62rem;
    letter-spacing: .11em;
    font-weight: 700;
}

.role-detail__head code {
    color: var(--m-cyan);
    font-size: .67rem;
}

.role-detail h3 {
    margin-top: 27px;
    font-size: 1.65rem;
    letter-spacing: -.025em;
}

.role-detail > p {
    margin-top: 11px;
    color: var(--text-muted);
    line-height: 1.75;
    font-size: .84rem;
}

.role-detail dl {
    margin-top: 26px;
}

.role-detail dl > div {
    padding: 14px 0;
    border-top: 1px solid var(--m-card-border);
}

.role-detail dt {
    font-size: .58rem;
    letter-spacing: .09em;
    color: var(--text-subtle);
    font-weight: 700;
}

.role-detail dd {
    margin-top: 6px;
    color: var(--text-muted);
    font-size: .8rem;
    line-height: 1.55;
}

/* ---------- Request profiles ---------------------------------------- */

.profiles-section {
    background: linear-gradient(180deg, rgba(132,108,240,.018), transparent 45%, rgba(39,190,203,.018));
}

.profile-workbench {
    display: grid;
    grid-template-columns: minmax(300px,.68fr) minmax(0,1.32fr);
    gap: 24px;
}

.profile-selector {
    display: grid;
    gap: 10px;
}

.profile-button {
    padding: 19px;
    border: 1px solid var(--m-card-border);
    border-radius: 15px;
    background: color-mix(in srgb, var(--bg-light) 86%, transparent);
    color: var(--text);
    text-align: left;
    cursor: pointer;
    transition: .22s ease;
}

.profile-button span,
.profile-button strong,
.profile-button small {
    display: block;
}

.profile-button span {
    color: var(--m-violet-strong);
    font-family: "Courier New", monospace;
    font-size: .61rem;
    letter-spacing: .07em;
}

.profile-button strong {
    margin-top: 8px;
    font-size: 1rem;
}

.profile-button small {
    margin-top: 6px;
    color: var(--text-subtle);
    line-height: 1.5;
}

.profile-button:hover,
.profile-button:focus-visible {
    transform: translateX(3px);
    border-color: rgba(39,190,203,.28);
    outline: none;
}

.profile-button.is-active {
    border-color: rgba(39,190,203,.32);
    background: rgba(39,190,203,.04);
}

.profile-panel {
    border: 1px solid var(--m-card-border);
    border-radius: 22px;
    overflow: hidden;
    background: color-mix(in srgb, var(--bg-light) 91%, transparent);
    box-shadow: var(--m-shadow);
}

.profile-panel__bar {
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 18px;
    border-bottom: 1px solid var(--m-card-border);
    color: var(--text-subtle);
    font-size: .64rem;
    letter-spacing: .09em;
    font-weight: 700;
}

.profile-panel__bar code {
    color: var(--m-cyan);
    letter-spacing: 0;
}

.profile-view {
    display: none;
    grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr);
    gap: 18px;
    padding: 20px;
}

.profile-view.is-active {
    display: grid;
}

.profile-config,
.profile-output {
    min-height: 285px;
    border: 1px solid var(--m-card-border);
    border-radius: 14px;
    padding: 18px;
    background: rgba(132,108,240,.018);
}

.profile-config > span,
.profile-output > span {
    display: block;
    color: var(--text-subtle);
    font-size: .58rem;
    letter-spacing: .11em;
    font-weight: 700;
}

.profile-config pre,
.profile-output pre {
    margin-top: 15px;
    color: var(--text-muted);
    font-family: "Courier New", monospace;
    font-size: .68rem;
    line-height: 1.72;
    white-space: pre-wrap;
}

.profile-output__equation {
    display: grid;
    place-items: center;
    min-height: 118px;
    margin-top: 17px;
    border: 1px solid rgba(39,190,203,.13);
    border-radius: 12px;
    background: rgba(39,190,203,.025);
    color: var(--m-cyan);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.3rem;
}

.profile-output__tags {
    display: flex;
    gap: 7px;
    flex-wrap: wrap;
    margin-top: 16px;
}

.profile-output__tags span {
    padding: 5px 8px;
    border-radius: 999px;
    border: 1px solid var(--m-card-border);
    color: var(--text-subtle);
    font-size: .6rem;
}

.profile-json {
    margin-top: 15px;
    padding: 15px;
    border: 1px solid rgba(132,108,240,.13);
    border-radius: 12px;
    background: rgba(4,12,22,.25);
    color: var(--text-muted);
    font-family: "Courier New", monospace;
    font-size: .66rem;
    line-height: 1.7;
    white-space: pre-wrap;
}

html[data-theme="light"] .profile-json {
    background: #f5f6fb;
}

/* ---------- Domain work --------------------------------------------- */

.work-section {
    background: linear-gradient(180deg, transparent, rgba(132,108,240,.025), transparent);
}

.domain-work {
    display: grid;
    gap: 24px;
}

.domain-panel {
    display: grid;
    grid-template-columns: minmax(0,.94fr) minmax(0,1.06fr);
    gap: 42px;
    align-items: center;
    min-height: 315px;
    padding: 32px;
    border: 1px solid var(--m-card-border);
    border-radius: 24px;
    background: color-mix(in srgb, var(--bg-light) 86%, transparent);
    box-shadow: var(--m-shadow);
}

.domain-panel:nth-child(2) {
    grid-template-columns: minmax(0,1.06fr) minmax(0,.94fr);
}

.domain-panel:nth-child(2) .domain-copy { order: 2; }
.domain-panel:nth-child(2) .domain-visual { order: 1; }

.domain-index {
    color: var(--m-violet-strong);
    font-family: "Courier New", monospace;
    font-size: .65rem;
    letter-spacing: .08em;
    font-weight: 700;
}

.domain-copy h3 {
    margin-top: 11px;
    font-size: clamp(1.55rem, 3vw, 2.35rem);
    letter-spacing: -.03em;
    line-height: 1.18;
}

.domain-copy p {
    margin-top: 15px;
    color: var(--text-muted);
    line-height: 1.77;
}

.domain-tags {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 19px;
}

.domain-tags span {
    padding: 6px 9px;
    border: 1px solid var(--m-card-border);
    border-radius: 999px;
    color: var(--text-subtle);
    font-size: .66rem;
}

.domain-visual {
    position: relative;
    min-height: 235px;
    border: 1px solid var(--m-card-border);
    border-radius: 18px;
    overflow: hidden;
    background:
        radial-gradient(circle at center, rgba(132,108,240,.07), transparent 68%),
        rgba(132,108,240,.012);
}

.tutor-visual {
    padding: 24px;
}

.tutor-visual__equation {
    font-family: Georgia, "Times New Roman", serif;
    color: var(--m-cyan);
    font-size: 1.4rem;
}

.tutor-visual__bars {
    margin-top: 24px;
}

.tutor-visual__bars i {
    display: block;
    height: 5px;
    margin-top: 11px;
    border-radius: 999px;
    background: rgba(128,153,190,.16);
}

.tutor-visual__bars i:first-child { width: 88%; }
.tutor-visual__bars i:nth-child(2) { width: 69%; }
.tutor-visual__bars i:nth-child(3) { width: 79%; }
.tutor-visual__bars i:nth-child(4) { width: 54%; }

.tutor-visual__question {
    position: absolute;
    right: 18px;
    bottom: 18px;
    max-width: 190px;
    padding: 10px 12px;
    border: 1px solid rgba(39,190,203,.16);
    border-radius: 12px;
    background: rgba(39,190,203,.04);
    color: var(--text-muted);
    font-size: .68rem;
    line-height: 1.45;
}

.derivation-visual {
    padding: 24px;
    font-family: "Courier New", monospace;
}

.derivation-step {
    display: flex;
    gap: 12px;
    align-items: center;
    padding: 10px 0;
    border-bottom: 1px solid var(--m-card-border);
    color: var(--text-muted);
    font-size: .68rem;
}

.derivation-step span {
    color: var(--m-violet-strong);
}

.derivation-step strong {
    color: var(--text);
}

.protocol-visual {
    padding: 22px;
    font-family: "Courier New", monospace;
}

.protocol-visual pre {
    color: var(--text-muted);
    font-size: .67rem;
    line-height: 1.75;
    white-space: pre-wrap;
}

.protocol-visual b {
    color: var(--m-cyan);
    font-weight: 600;
}

/* ---------- Integration --------------------------------------------- */

.integration-section {
    background: linear-gradient(180deg, rgba(39,190,203,.018), transparent);
}

.integration-shell {
    border: 1px solid var(--m-card-border);
    border-radius: 24px;
    padding: 28px;
    background: color-mix(in srgb, var(--bg-light) 90%, transparent);
    box-shadow: var(--m-shadow);
}

.integration-flow {
    position: relative;
    display: grid;
    grid-template-columns: repeat(5, minmax(0,1fr));
    gap: 10px;
    align-items: stretch;
}

.integration-flow::before {
    content: "";
    position: absolute;
    left: 7%;
    right: 7%;
    top: 50%;
    height: 1px;
    background: linear-gradient(90deg, var(--m-line), var(--m-cyan), var(--m-line));
    z-index: 0;
}

.integration-node {
    position: relative;
    min-height: 150px;
    padding: 18px;
    border: 1px solid var(--m-card-border);
    border-radius: 14px;
    background: color-mix(in srgb, var(--bg-light) 98%, transparent);
    z-index: 2;
}

.integration-node span,
.integration-node strong,
.integration-node small {
    display: block;
}

.integration-node span {
    color: var(--text-subtle);
    font-family: "Courier New", monospace;
    font-size: .58rem;
    letter-spacing: .08em;
}

.integration-node strong {
    margin-top: 30px;
    font-size: .86rem;
}

.integration-node small {
    margin-top: 6px;
    color: var(--text-subtle);
    font-size: .65rem;
    line-height: 1.45;
}

.integration-node--model {
    border-color: rgba(132,108,240,.34);
    background:
        linear-gradient(150deg, rgba(132,108,240,.10), rgba(39,190,203,.035)),
        var(--bg-light);
    box-shadow: 0 18px 36px -30px rgba(132,108,240,.8);
}

.integration-node--model strong {
    color: var(--m-violet-strong);
}

.integration-signal {
    position: absolute;
    top: calc(50% - 4px);
    left: 7%;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--m-cyan);
    box-shadow: 0 0 11px rgba(39,190,203,.9);
    z-index: 3;
    animation: integrationSignal 7s linear infinite;
}

.integration-caption {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid var(--m-card-border);
    color: var(--text-muted);
    font-size: .79rem;
    line-height: 1.7;
}

/* ---------- Boundary ------------------------------------------------ */

.boundary-section {
    background: linear-gradient(180deg, transparent, rgba(132,108,240,.022), transparent);
}

.boundary-shell {
    display: grid;
    grid-template-columns: minmax(0,1fr) 120px minmax(0,1fr);
    gap: 18px;
    align-items: stretch;
}

.ownership-panel {
    padding: 28px;
    border: 1px solid var(--m-card-border);
    border-radius: 20px;
    background: color-mix(in srgb, var(--bg-light) 89%, transparent);
    box-shadow: var(--m-shadow);
}

.ownership-panel__label {
    display: inline-flex;
    padding: 6px 9px;
    border: 1px solid rgba(132,108,240,.19);
    border-radius: 999px;
    color: var(--m-violet-strong);
    font-size: .63rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.ownership-panel--harness .ownership-panel__label {
    border-color: rgba(39,190,203,.19);
    color: var(--m-cyan);
}

.ownership-panel h3 {
    margin-top: 18px;
    font-size: 1.35rem;
    letter-spacing: -.02em;
}

.ownership-panel p {
    margin-top: 10px;
    color: var(--text-muted);
    line-height: 1.7;
    font-size: .83rem;
}

.ownership-list {
    display: grid;
    gap: 10px;
    margin-top: 22px;
    list-style: none;
}

.ownership-list li {
    position: relative;
    padding: 12px 12px 12px 31px;
    border: 1px solid var(--m-card-border);
    border-radius: 11px;
    color: var(--text-muted);
    font-size: .76rem;
    line-height: 1.5;
}

.ownership-list li::before {
    content: "✓";
    position: absolute;
    left: 12px;
    color: var(--m-emerald);
    font-weight: 700;
}

.verification-gate {
    position: relative;
    display: grid;
    place-items: center;
    overflow: hidden;
}

.verification-gate::before {
    content: "";
    position: absolute;
    top: 5%;
    bottom: 5%;
    width: 1px;
    background: linear-gradient(transparent, var(--m-cyan), transparent);
    opacity: .35;
}

.verification-gate__box {
    position: relative;
    z-index: 2;
    width: 96px;
    padding: 16px 9px;
    border: 1px solid rgba(39,190,203,.25);
    border-radius: 14px;
    background: var(--bg-light);
    text-align: center;
}

.verification-gate__box span,
.verification-gate__box strong {
    display: block;
}

.verification-gate__box span {
    color: var(--text-subtle);
    font-size: .54rem;
    letter-spacing: .09em;
}

.verification-gate__box strong {
    margin-top: 7px;
    color: var(--m-cyan);
    font-size: .69rem;
}

.gate-pulse {
    position: absolute;
    left: 50%;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--m-cyan);
    box-shadow: 0 0 10px rgba(39,190,203,.9);
    transform: translateX(-50%);
    animation: gatePulse 4.5s ease-in-out infinite;
}

.boundary-callout {
    margin-top: 24px;
    padding: 20px 22px;
    border: 1px solid rgba(39,190,203,.16);
    border-radius: 14px;
    background: rgba(39,190,203,.035);
}

.boundary-callout strong {
    display: block;
    color: var(--text);
    font-size: .94rem;
}

.boundary-callout p {
    margin-top: 7px;
    color: var(--text-muted);
    line-height: 1.65;
    font-size: .8rem;
}

/* ---------- API access ---------------------------------------------- */

.model-access-section {
    padding: var(--m-section-gap) 0;
    background: linear-gradient(180deg, rgba(39,190,203,.018), transparent);
}

.access-shell {
    display: grid;
    grid-template-columns: minmax(250px,.36fr) minmax(0,.64fr);
    gap: 24px;
    align-items: start;
}

.access-summary {
    position: sticky;
    top: 138px;
    padding: 25px;
    border: 1px solid var(--m-card-border);
    border-radius: 20px;
    background: color-mix(in srgb, var(--bg-light) 90%, transparent);
}

.access-slot {
    display: flex;
    align-items: baseline;
    gap: 8px;
}

.access-slot strong {
    font-size: 2.8rem;
    line-height: 1;
    color: var(--m-violet-strong);
}

.access-slot span {
    color: var(--text-subtle);
    font-size: .72rem;
}

.access-summary p {
    margin-top: 17px;
    color: var(--text-muted);
    line-height: 1.7;
    font-size: .8rem;
}

.access-summary ul {
    display: grid;
    gap: 8px;
    margin-top: 19px;
    list-style: none;
}

.access-summary li {
    color: var(--text-subtle);
    font-size: .72rem;
}

.access-summary li::before {
    content: "•";
    margin-right: 7px;
    color: var(--m-cyan);
}

.access-summary .btn {
    width: 100%;
    margin-top: 22px;
}

.model-access-card {
    min-width: 0;
}

.model-access-card .mail-window {
    border-radius: 20px;
    box-shadow: var(--m-shadow);
}

.model-access-card .mail-window-header {
    background: rgba(132,108,240,.035);
}

.model-access-card .copy-btn {
    border-color: rgba(132,108,240,.18);
}

.model-access-card .copy-btn:hover {
    border-color: rgba(39,190,203,.26);
}

.model-access-note {
    margin-top: 14px;
    color: var(--text-subtle);
    font-size: .73rem;
    line-height: 1.65;
}

/* ---------- Footer CTA ---------------------------------------------- */

.model-footer-cta {
    padding: 44px 0 110px;
}

.model-cta-card {
    position: relative;
    overflow: hidden;
    padding: 64px;
    border: 1px solid var(--m-card-border);
    border-radius: 26px;
    background:
        radial-gradient(circle at 82% 20%, rgba(132,108,240,.12), transparent 24rem),
        radial-gradient(circle at 18% 80%, rgba(39,190,203,.065), transparent 22rem),
        color-mix(in srgb, var(--bg-light) 91%, transparent);
    box-shadow: var(--m-shadow);
}

.model-cta-card::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--m-line-strong), transparent);
}

.model-cta-code {
    display: block;
    color: var(--m-cyan);
    font-family: "Courier New", monospace;
    font-size: .66rem;
    letter-spacing: .08em;
}

.model-cta-card h2 {
    margin-top: 14px;
    max-width: 830px;
    font-size: clamp(2rem, 4vw, 3.4rem);
    line-height: 1.12;
    letter-spacing: -.035em;
}

.model-cta-card > p {
    margin-top: 18px;
    max-width: 770px;
    color: var(--text-muted);
    line-height: 1.75;
}

.model-cta-card .cta-actions {
    justify-content: flex-start;
    margin-top: 30px;
}

/* ---------- Top-right alignment ------------------------------------- */

.model-v1 .nav-links > li:has(.theme-toggle),
.model-v1 .nav-links > li:has(.nav-cta--github) {
    display: flex;
    align-items: center;
}

.model-v1 .theme-toggle {
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

html[data-theme="dark"] .model-v1 .nav-cta--github {
    background: linear-gradient(112deg, #4b67df 0%, #1599aa 100%) !important;
}

/* ---------- Motion -------------------------------------------------- */

@keyframes modelWave {
    0%,100% { transform: translateY(0) rotate(-4deg) scaleX(1); }
    50% { transform: translateY(-13px) rotate(-2deg) scaleX(1.035); }
}

@keyframes modelSymbol {
    0%,100% { transform: translateY(0); opacity: .13; }
    50% { transform: translateY(-8px); opacity: .23; }
}

@keyframes modelPulse {
    0%,100% { opacity: .55; transform: scale(.9); }
    50% { opacity: 1; transform: scale(1.12); }
}

@keyframes roleSignal {
    0% { left: 50%; top: 50%; opacity: 0; }
    15% { opacity: 1; }
    30% { left: 19%; top: 24%; }
    53% { left: 50%; top: 50%; }
    73% { left: 80%; top: 24%; }
    88% { left: 50%; top: 50%; opacity: 1; }
    100% { left: 50%; top: 81%; opacity: 0; }
}

@keyframes integrationSignal {
    0% { left: 7%; opacity: 0; }
    10% { opacity: 1; }
    90% { opacity: 1; }
    100% { left: 92%; opacity: 0; }
}

@keyframes gatePulse {
    0% { top: 7%; opacity: 0; }
    17% { opacity: 1; }
    83% { opacity: 1; }
    100% { top: 90%; opacity: 0; }
}

/* ---------- Responsive ---------------------------------------------- */

@media (max-width: 1080px) {
    .model-hero__layout {
        grid-template-columns: 1fr;
        gap: 48px;
    }

    .model-hero__copy {
        text-align: center;
    }

    .model-hero__lead {
        margin-left: auto;
        margin-right: auto;
    }

    .model-hero__metrics {
        max-width: 760px;
        margin-left: auto;
        margin-right: auto;
    }

    .model-runtime {
        max-width: 760px;
        margin: 0 auto;
        width: 100%;
    }

    .role-shell,
    .profile-workbench,
    .access-shell {
        grid-template-columns: 1fr;
    }

    .access-summary {
        position: static;
    }

    .model-identity .identity-strip {
        grid-template-columns: 1fr;
    }

    .model-identity .identity-status {
        white-space: normal;
    }
}

@media (max-width: 820px) {
    .model-v1 { --m-section-gap: 86px; }

    .model-hero {
        padding-top: 118px;
    }

    .model-hero__copy h1 {
        font-size: clamp(2.4rem, 11vw, 3.5rem);
    }

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

    .model-local-nav {
        top: 58px;
    }

    .model-local-nav__track {
        gap: 22px;
    }

    .role-map {
        min-height: 520px;
    }

    .profile-view {
        grid-template-columns: 1fr;
    }

    .domain-panel,
    .domain-panel:nth-child(2) {
        grid-template-columns: 1fr;
        padding: 22px;
        gap: 24px;
    }

    .domain-panel:nth-child(2) .domain-copy,
    .domain-panel:nth-child(2) .domain-visual {
        order: initial;
    }

    .integration-flow {
        grid-template-columns: 1fr;
    }

    .integration-flow::before,
    .integration-signal {
        display: none;
    }

    .integration-node {
        min-height: auto;
    }

    .integration-node strong {
        margin-top: 13px;
    }

    .boundary-shell {
        grid-template-columns: 1fr;
    }

    .verification-gate {
        min-height: 100px;
    }

    .verification-gate::before {
        left: 5%;
        right: 5%;
        top: 50%;
        bottom: auto;
        width: auto;
        height: 1px;
        background: linear-gradient(90deg, transparent, var(--m-cyan), transparent);
    }

    .gate-pulse {
        top: 50%;
        left: 8%;
        transform: translateY(-50%);
        animation: gatePulseMobile 4.5s ease-in-out infinite;
    }

    .model-cta-card {
        padding: 36px 24px;
    }

    .model-cta-card .cta-actions {
        justify-content: center;
    }
}

@keyframes gatePulseMobile {
    0% { left: 8%; opacity: 0; }
    17% { opacity: 1; }
    83% { opacity: 1; }
    100% { left: 90%; opacity: 0; }
}

@media (max-width: 540px) {
    .model-runtime__bar {
        grid-template-columns: 60px 1fr;
    }

    .model-runtime__bar em {
        display: none;
    }

    .model-artifact__line {
        grid-template-columns: 1fr;
        gap: 3px;
    }

    .role-map {
        min-height: auto;
        display: grid;
        gap: 9px;
        padding: 18px;
    }

    .role-map__orbit,
    .role-core,
    .role-signal {
        display: none;
    }

    .role-node {
        position: relative;
        inset: auto;
        width: auto;
        transform: none;
    }

    .model-hero__metrics {
        grid-template-columns: 1fr 1fr;
    }
}

@media (prefers-reduced-motion: reduce) {
    .model-v1 *,
    .model-v1 *::before,
    .model-v1 *::after {
        scroll-behavior: auto !important;
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
    }

    .model-runtime {
        transform: none !important;
    }
}


/* ==========================================================================
   Model V2 Ambient Upgrade · Quantum Cognition Field
   ========================================================================== */
.model-v1 {
    --subpage-ambient-a: rgba(126, 96, 237, .135);
    --subpage-ambient-b: rgba(36, 181, 201, .09);
    --subpage-ambient-c: rgba(78, 102, 226, .07);
    --subpage-ambient-line: rgba(117, 92, 218, .21);
    --subpage-ambient-particle: rgba(100, 91, 226, .95);
}

html[data-theme="light"] .model-v1 {
    background:
        radial-gradient(circle at 15% 7%, rgba(105, 82, 211, .06), transparent 32rem),
        radial-gradient(circle at 86% 38%, rgba(12, 144, 157, .045), transparent 31rem),
        #f5f6fc;
}

html[data-theme="light"] .model-v1 .model-hero {
    background:
        radial-gradient(circle at 79% 22%, rgba(101,79,208,.12), transparent 33rem),
        radial-gradient(circle at 15% 75%, rgba(12,144,157,.065), transparent 29rem),
        radial-gradient(circle at 49% 98%, rgba(76,102,222,.045), transparent 31rem),
        linear-gradient(180deg, rgba(252,252,255,.84) 0%, rgba(244,246,252,.78) 100%);
}

html[data-theme="light"] .model-v1 .model-field-grid {
    opacity: .34;
}

html[data-theme="light"] .model-v1 .model-field-wave {
    opacity: .26;
}

html[data-theme="light"] .model-v1 .model-field-symbol {
    opacity: .29;
}

.model-v1 .model-hero__field::before {
    content: "";
    position: absolute;
    width: 650px;
    height: 260px;
    right: -150px;
    top: 18%;
    border: 1px solid rgba(132,108,240,.14);
    border-radius: 50%;
    transform: rotate(17deg);
    box-shadow:
        -350px 220px 0 -1px rgba(39,190,203,.075),
        -110px 380px 0 -1px rgba(132,108,240,.055);
    opacity: .8;
    animation: modelAmbientOrbit 18s ease-in-out infinite;
}

.model-v1 .model-hero__field::after {
    content: "";
    position: absolute;
    left: 6%;
    right: 5%;
    top: 56%;
    height: 1px;
    background:
        linear-gradient(90deg, transparent, rgba(132,108,240,.18), rgba(39,190,203,.20), transparent);
    transform: rotate(4deg);
    opacity: .58;
}

.model-v1 .model-runtime::after {
    content: "";
    position: absolute;
    inset: 8% 2% -8%;
    z-index: -2;
    border-radius: 46%;
    background:
        radial-gradient(circle at 54% 32%, rgba(132,108,240,.20), transparent 54%),
        radial-gradient(circle at 41% 63%, rgba(39,190,203,.10), transparent 66%);
    filter: blur(34px);
    opacity: .75;
    pointer-events: none;
}

@keyframes modelAmbientOrbit {
    0%,100% { transform: rotate(17deg) translate3d(0,0,0); }
    50% { transform: rotate(13deg) translate3d(-12px,8px,0); }
}


/* ==========================================================================
   Model V5.2 · Public customer presentation
   ========================================================================== */

/* Interactive local navigation */
.model-v1 .model-local-nav{
    position:sticky;
    top:62px;
    z-index:990;
    isolation:isolate;
    pointer-events:auto;
    box-shadow:0 12px 30px -28px rgba(0,0,0,.55);
}
.model-v1 .model-local-nav .container,
.model-v1 .model-local-nav__track,
.model-v1 .model-local-nav a{
    position:relative;
    z-index:2;
    pointer-events:auto;
}
.model-v1 .model-section,
.model-v1 .model-access-section{
    scroll-margin-top:118px;
}

/* Hero learning demo */
.model-learning-demo .model-runtime__bar{
    grid-template-columns:68px minmax(0,1fr) auto;
}
.model-learning-demo .model-runtime__bar > span{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.model-demo-tabs{
    display:flex;
    gap:7px;
    padding:0 16px 13px;
}
.model-demo-tab{
    flex:1;
    padding:8px 10px;
    border:1px solid var(--m-card-border);
    border-radius:10px;
    background:transparent;
    color:var(--text-subtle);
    font-size:.64rem;
    font-weight:650;
    cursor:pointer;
    transition:.22s ease;
}
.model-demo-tab:hover,
.model-demo-tab:focus-visible,
.model-demo-tab.is-active{
    outline:none;
    color:var(--text);
    border-color:rgba(37,190,201,.26);
    background:rgba(37,190,201,.045);
}
.model-demo-answer{
    margin:0 16px 14px;
    padding:18px;
    min-height:235px;
    border:1px solid rgba(37,190,201,.16);
    border-radius:14px;
    background:
        radial-gradient(circle at 88% 10%,rgba(132,108,240,.065),transparent 15rem),
        linear-gradient(140deg,rgba(132,108,240,.035),rgba(37,190,201,.025));
}
.model-demo-answer__kicker{
    color:var(--m-cyan);
    font-family:"Courier New",monospace;
    font-size:.58rem;
    letter-spacing:.09em;
}
.model-demo-answer h3{
    margin-top:11px;
    color:var(--text);
    font-size:1.04rem;
    line-height:1.45;
}
.model-demo-answer p{
    margin-top:10px;
    color:var(--text-muted);
    font-size:.74rem;
    line-height:1.68;
}
.model-demo-equation{
    margin-top:20px;
    padding:16px;
    border:1px solid var(--m-card-border);
    border-radius:12px;
    background:rgba(37,190,201,.025);
    color:var(--m-cyan);
    font-family:Georgia,"Times New Roman",serif;
    font-size:1.28rem;
    text-align:center;
}
.model-demo-footer{
    display:grid;
    grid-template-columns:auto 1fr auto 1fr auto;
    gap:8px;
    align-items:center;
    padding:0 16px 17px;
    color:var(--text-subtle);
    font-size:.57rem;
}
.model-demo-footer i{
    height:1px;
    position:relative;
    background:linear-gradient(90deg,var(--m-line),var(--m-cyan),var(--m-line));
}
.model-demo-footer i::after{
    content:"";
    position:absolute;
    top:-2px;
    left:0;
    width:5px;
    height:5px;
    border-radius:50%;
    background:var(--m-cyan);
    animation:modelPublicSignal 2.6s linear infinite;
}

/* Model Role refinements */
.role-shell--public .role-map{
    background:
        radial-gradient(circle at center,rgba(132,108,240,.075),transparent 23rem),
        linear-gradient(rgba(135,119,242,.028) 1px,transparent 1px),
        linear-gradient(90deg,rgba(135,119,242,.028) 1px,transparent 1px);
    background-size:auto,44px 44px,44px 44px;
}
.role-shell--public .role-node strong{
    color:var(--text);
}
.role-shell--public .role-node span{
    line-height:1.45;
}
.role-shell--public .role-detail dl > div{
    grid-template-columns:130px 1fr;
}
.role-shell--public .role-detail dt{
    color:var(--text-subtle);
}
.role-shell--public .role-detail dd{
    color:var(--text-muted);
}

/* Learning Responses */
.profiles-section{
    background:
        radial-gradient(circle at 88% 20%,rgba(37,190,201,.04),transparent 24rem),
        linear-gradient(180deg,rgba(132,108,240,.016),transparent 62%);
}
.response-workbench{
    display:grid;
    grid-template-columns:minmax(290px,.72fr) minmax(0,1.28fr);
    gap:24px;
    align-items:stretch;
}
.response-selector{
    display:grid;
    gap:9px;
}
.response-button{
    min-height:132px;
    padding:18px;
    border:1px solid var(--m-card-border);
    border-radius:16px;
    background:color-mix(in srgb,var(--bg-light) 89%,transparent);
    color:var(--text);
    text-align:left;
    cursor:pointer;
    transition:.24s ease;
}
.response-button span,
.response-button strong,
.response-button small{
    display:block;
}
.response-button span{
    color:var(--m-violet-strong);
    font-family:"Courier New",monospace;
    font-size:.58rem;
    letter-spacing:.07em;
}
.response-button strong{
    margin-top:15px;
    font-size:.95rem;
}
.response-button small{
    margin-top:7px;
    color:var(--text-subtle);
    font-size:.65rem;
    line-height:1.45;
}
.response-button:hover,
.response-button:focus-visible,
.response-button.is-active{
    outline:none;
    transform:translateX(4px);
    border-color:rgba(37,190,201,.28);
    background:
        linear-gradient(125deg,rgba(132,108,240,.05),rgba(37,190,201,.04)),
        var(--bg-light);
    box-shadow:0 18px 38px -32px rgba(37,190,201,.8);
}
.response-panel{
    overflow:hidden;
    border:1px solid var(--m-card-border);
    border-radius:22px;
    background:
        radial-gradient(circle at 85% 8%,rgba(132,108,240,.075),transparent 18rem),
        color-mix(in srgb,var(--bg-light) 91%,transparent);
    box-shadow:var(--m-shadow);
}
.response-panel__bar{
    height:52px;
    padding:0 20px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:18px;
    border-bottom:1px solid var(--m-card-border);
}
.response-panel__bar span{
    color:var(--text-subtle);
    font-size:.58rem;
    letter-spacing:.09em;
}
.response-panel__bar code{
    color:var(--m-cyan);
    font-size:.67rem;
}
.response-question{
    margin:18px 20px 0;
    padding:16px;
    border:1px solid var(--m-card-border);
    border-radius:13px;
    background:rgba(132,108,240,.025);
}
.response-question small{
    color:var(--text-subtle);
    font-size:.56rem;
    letter-spacing:.08em;
}
.response-question p{
    margin-top:8px;
    color:var(--text-muted);
    font-size:.78rem;
    line-height:1.6;
}
.response-output{
    margin:14px 20px 20px;
    padding:20px;
    border:1px solid rgba(37,190,201,.15);
    border-radius:14px;
    background:rgba(37,190,201,.022);
}
.response-output > span{
    color:var(--m-cyan);
    font-family:"Courier New",monospace;
    font-size:.58rem;
    letter-spacing:.08em;
}
.response-output h3{
    margin-top:10px;
    font-size:1.18rem;
    line-height:1.4;
}
.response-output > p{
    margin-top:10px;
    color:var(--text-muted);
    font-size:.77rem;
    line-height:1.7;
}
.response-equation{
    margin-top:18px;
    padding:16px;
    border:1px solid var(--m-card-border);
    border-radius:12px;
    background:color-mix(in srgb,var(--bg-light) 93%,transparent);
    color:var(--m-cyan);
    text-align:center;
    font-family:Georgia,"Times New Roman",serif;
    font-size:1.15rem;
}
.response-points{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:8px;
    margin-top:16px;
}
.response-points > div{
    padding:12px;
    border:1px solid var(--m-card-border);
    border-radius:11px;
}
.response-points b,
.response-points span{
    display:block;
}
.response-points b{
    color:var(--text);
    font-size:.67rem;
    line-height:1.35;
}
.response-points span{
    margin-top:5px;
    color:var(--text-subtle);
    font-size:.57rem;
    line-height:1.4;
}

/* Domain Work public visuals */
.domain-work--public .domain-panel{
    overflow:hidden;
}
.concept-visual{
    position:relative;
    min-height:270px;
    padding:24px;
    border-radius:18px;
    background:
        radial-gradient(circle at 50% 45%,rgba(37,190,201,.07),transparent 14rem),
        linear-gradient(180deg,rgba(132,108,240,.025),transparent);
}
.concept-visual__formula{
    color:var(--m-cyan);
    font-family:Georgia,"Times New Roman",serif;
    font-size:1.25rem;
    text-align:center;
}
.concept-visual__wave{
    display:flex;
    justify-content:center;
    align-items:flex-end;
    gap:8px;
    height:105px;
    margin-top:20px;
    padding:0 12px 12px;
    border-bottom:1px solid var(--m-card-border);
}
.concept-visual__wave i{
    width:10%;
    min-width:12px;
    border-radius:8px 8px 2px 2px;
    background:linear-gradient(180deg,var(--m-cyan),rgba(132,108,240,.22));
    opacity:.75;
    animation:modelWaveBars 3.8s ease-in-out infinite;
}
.concept-visual__wave i:nth-child(1),
.concept-visual__wave i:nth-child(7){height:18%;animation-delay:-.6s}
.concept-visual__wave i:nth-child(2),
.concept-visual__wave i:nth-child(6){height:45%;animation-delay:-.3s}
.concept-visual__wave i:nth-child(3),
.concept-visual__wave i:nth-child(5){height:78%}
.concept-visual__wave i:nth-child(4){height:100%;animation-delay:-.8s}
.concept-visual__labels{
    display:grid;
    grid-template-columns:1fr auto 1fr;
    gap:10px;
    align-items:center;
    margin-top:16px;
    color:var(--text-subtle);
    font-family:"Courier New",monospace;
    font-size:.59rem;
    text-align:center;
}
.concept-visual__labels b{color:var(--m-cyan)}
.concept-visual__note{
    margin-top:16px;
    padding:12px;
    border:1px solid var(--m-card-border);
    border-radius:10px;
    color:var(--text-muted);
    font-size:.66rem;
    line-height:1.5;
    text-align:center;
}
.derivation-visual--public .derivation-step{
    grid-template-columns:38px 1fr;
}
.derivation-visual--public .derivation-step small{
    grid-column:2;
    margin-top:-2px;
    color:var(--text-subtle);
    font-size:.58rem;
}
.dialogue-visual{
    display:flex;
    flex-direction:column;
    gap:10px;
    min-height:285px;
    padding:22px;
    border-radius:18px;
    background:
        radial-gradient(circle at 82% 15%,rgba(132,108,240,.06),transparent 15rem),
        rgba(37,190,201,.018);
}
.dialogue-context{
    display:flex;
    justify-content:space-between;
    gap:12px;
    padding-bottom:12px;
    border-bottom:1px solid var(--m-card-border);
}
.dialogue-context span{
    color:var(--text-subtle);
    font-size:.55rem;
    letter-spacing:.08em;
}
.dialogue-context strong{
    color:var(--m-cyan);
    font-size:.68rem;
}
.dialogue-bubble{
    max-width:84%;
    padding:12px 14px;
    border:1px solid var(--m-card-border);
    border-radius:14px;
    color:var(--text-muted);
    font-size:.69rem;
    line-height:1.55;
}
.dialogue-bubble--user{
    align-self:flex-end;
    background:rgba(132,108,240,.04);
}
.dialogue-bubble--ai{
    align-self:flex-start;
    background:rgba(37,190,201,.035);
    border-color:rgba(37,190,201,.16);
}
.dialogue-followups{
    display:flex;
    gap:7px;
    flex-wrap:wrap;
    margin-top:auto;
}
.dialogue-followups span{
    padding:6px 8px;
    border:1px solid var(--m-card-border);
    border-radius:999px;
    color:var(--text-subtle);
    font-size:.57rem;
}

/* Model + Harness collaboration */
.boundary-section{
    background:
        radial-gradient(circle at 50% 30%,rgba(132,108,240,.04),transparent 28rem),
        linear-gradient(180deg,transparent,rgba(37,190,201,.014),transparent);
}
.collaboration-shell{
    display:grid;
    grid-template-columns:minmax(0,1fr) 150px minmax(0,1fr);
    gap:18px;
    align-items:stretch;
}
.collaboration-panel{
    min-height:330px;
    padding:26px;
    border:1px solid var(--m-card-border);
    border-radius:22px;
    background:color-mix(in srgb,var(--bg-light) 91%,transparent);
    box-shadow:var(--m-shadow);
}
.collaboration-panel--harness{
    background:
        radial-gradient(circle at 86% 10%,rgba(37,190,201,.07),transparent 17rem),
        color-mix(in srgb,var(--bg-light) 91%,transparent);
}
.collaboration-label{
    color:var(--m-violet-strong);
    font-size:.59rem;
    letter-spacing:.09em;
    font-weight:700;
}
.collaboration-panel--harness .collaboration-label{
    color:var(--m-cyan);
}
.collaboration-panel h3{
    margin-top:12px;
    font-size:1.35rem;
}
.collaboration-panel > p{
    margin-top:12px;
    color:var(--text-muted);
    font-size:.78rem;
    line-height:1.68;
}
.collaboration-panel ul{
    display:grid;
    gap:0;
    margin-top:24px;
    padding:0;
    list-style:none;
    border-top:1px solid var(--m-card-border);
}
.collaboration-panel li{
    position:relative;
    padding:13px 0 13px 18px;
    border-bottom:1px solid var(--m-card-border);
    color:var(--text-muted);
    font-size:.72rem;
    line-height:1.5;
}
.collaboration-panel li::before{
    content:"";
    position:absolute;
    left:0;
    top:19px;
    width:6px;
    height:6px;
    border-radius:50%;
    background:var(--m-cyan);
}
.collaboration-bridge{
    position:relative;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    gap:14px;
    color:var(--text-subtle);
    text-align:center;
}
.collaboration-bridge span{
    font-family:"Courier New",monospace;
    font-size:.56rem;
}
.collaboration-bridge i{
    position:relative;
    width:1px;
    height:64px;
    background:linear-gradient(var(--m-line),var(--m-cyan),var(--m-line));
}
.collaboration-bridge i::after{
    content:"";
    position:absolute;
    top:0;
    left:-2px;
    width:5px;
    height:5px;
    border-radius:50%;
    background:var(--m-cyan);
    animation:modelBridgeSignal 2.8s linear infinite;
}
.collaboration-bridge strong{
    display:grid;
    place-items:center;
    width:42px;
    height:42px;
    border:1px solid rgba(37,190,201,.22);
    border-radius:50%;
    color:var(--m-cyan);
    background:var(--bg-light);
}
.boundary-callout--public{
    margin-top:22px;
}

/* Motion */
@keyframes modelPublicSignal{
    0%{left:0;opacity:0}
    15%{opacity:1}
    85%{opacity:1}
    100%{left:100%;opacity:0}
}
@keyframes modelWaveBars{
    0%,100%{transform:scaleY(.9);opacity:.62}
    50%{transform:scaleY(1.08);opacity:.92}
}
@keyframes modelBridgeSignal{
    0%{top:0;opacity:0}
    15%{opacity:1}
    85%{opacity:1}
    100%{top:100%;opacity:0}
}

@media (max-width:1080px){
    .response-workbench,
    .collaboration-shell{
        grid-template-columns:1fr;
    }
    .collaboration-bridge{
        flex-direction:row;
        min-height:92px;
    }
    .collaboration-bridge i{
        width:64px;
        height:1px;
        background:linear-gradient(90deg,var(--m-line),var(--m-cyan),var(--m-line));
    }
    .collaboration-bridge i::after{
        top:-2px;
        left:0;
        animation:modelPublicSignal 2.8s linear infinite;
    }
}
@media (max-width:820px){
    .model-v1 .model-local-nav{top:58px}
    .model-v1 .model-section,
    .model-v1 .model-access-section{scroll-margin-top:112px}
    .response-points{grid-template-columns:1fr}
}
@media (max-width:540px){
    .model-learning-demo .model-runtime__bar{
        grid-template-columns:58px 1fr;
    }
    .model-learning-demo .model-runtime__bar em{display:none}
    .model-demo-tabs{flex-wrap:wrap}
    .model-demo-tab{flex:1 1 30%}
    .model-demo-footer{grid-template-columns:1fr}
    .model-demo-footer i{display:none}
    .role-shell--public .role-detail dl > div{grid-template-columns:1fr}
    .response-panel__bar{
        align-items:flex-start;
        flex-direction:column;
        height:auto;
        padding:14px 16px;
    }
    .response-question,
    .response-output{
        margin-left:14px;
        margin-right:14px;
    }
}