/* === OPENOX THEME === */
:root {
    --yellow: #F1D67E;
    --green: #CDD597;
    --background: var(--yellow);
    --text: #282726;
    --statement-title-size: clamp(2rem, 6vw, 6rem);
    --content-title-size: clamp(1.75rem, 3.5vw, 3.5rem);
    --title-gap: clamp(20px, 3vh, 36px);
    --font: -apple-system, BlinkMacSystemFont, "Inter", "IBM Plex Sans",
            "Segoe UI", Helvetica, Arial, sans-serif;
}
/* === WINDOW-FILLING CANVAS === */
* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; }
body { font-family: var(--font); color: var(--text); background: var(--green); }
.deck-viewport { position: fixed; inset: 0; overflow: hidden; }
.deck-stage {
    position: absolute;
    inset: 0;
    overflow: hidden;
}
.slide {
    position: absolute;
    inset: 0;
    background: var(--background);
    overflow: hidden;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
}
.slide.active { visibility: visible; opacity: 1; pointer-events: auto; }
/* === TITLE SLIDE === */
.title-slide {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: clamp(24px, 6vw, 96px);
    text-align: center;
    gap: clamp(12px, 2vh, 28px);
}
.title-slide canvas {
    display: block;
    width: clamp(120px, 30vmin, 280px);
    height: clamp(120px, 30vmin, 280px);
    flex-shrink: 0;
}
.title-slide h1 {
    margin: 0;
    font-size: clamp(2.5rem, 6vw, 6rem);
    font-weight: 500;
    letter-spacing: -0.02em;
    line-height: 1.25;
    overflow-wrap: anywhere;
}
.title-slide p {
    margin: 0;
    font-size: clamp(1.125rem, 2.5vw, 2.5rem);
    font-weight: 400;
    line-height: 1.45;
    color: var(--text);
}
/* === CENTERED STATEMENT === */
.statement-slide {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: clamp(24px, 6vw, 96px);
    text-align: center;
}
.slide h2 {
    margin: 0;
    font-size: var(--heading-size, var(--statement-title-size));
    font-weight: 500;
    letter-spacing: -0.02em;
    line-height: 1.25;
    text-align: center;
    overflow-wrap: anywhere;
}
.resource-build,
.solution-layout,
.integration-content,
.repository-slide,
.media-statement,
.environment-content,
.vm-computer-content {
    --heading-size: var(--content-title-size);
}
.slide h2 strong { font-weight: 600; }
/* === STATEMENTS AND IMAGE LAYOUTS === */
.statement-builds strong { font-weight: 600; }
.resource-build {
    width: 100%;
    height: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr) auto minmax(0, 1fr);
    gap: clamp(12px, 2vh, 24px) clamp(16px, 4vw, 64px);
    align-items: center;
    justify-items: center;
}
.tennis-build > img:first-child { grid-column: 1; }
.resource-build img {
    display: block;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    object-fit: contain;
}
.resource-build h2 {
    grid-column: 1 / -1;
}
.solution-layout {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: var(--title-gap);
    width: 100%;
    height: 100%;
    justify-items: center;
}
.solution-sequence {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: clamp(6px, 1.5vw, 24px);
    width: 100%;
    min-height: 0;
}
.solution-step {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 8px;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    margin: 0;
}
.solution-step figcaption {
    font-size: clamp(0.875rem, 2vw, 2rem);
    font-weight: 600;
    line-height: 1.2;
}
.solution-arrow {
    align-self: start;
    margin-top: clamp(48px, 12vh, 120px);
    font-size: clamp(1.25rem, 3.5vw, 4rem);
    line-height: 1;
}
.solution-layout.has-postscript { grid-template-rows: auto minmax(0, 1fr) auto; }
.solution-postscript {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
}
.solution-postscript p {
    margin: 0;
    font-size: clamp(0.875rem, 1.8vw, 1.75rem);
    line-height: 1.35;
    text-align: center;
}
.solution-step img { object-position: center top; }
.solution-layout .solution-postscript img {
    width: auto;
    height: clamp(100px, 22vh, 200px);
    flex-shrink: 0;
}
.solution-layout img {
    display: block;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    object-fit: contain;
}
.ideas-slide {
    padding: clamp(24px, 5vw, 72px);
    overflow-y: auto;
}
.ideas-content {
    display: flex;
    flex-direction: column;
    gap: clamp(24px, 4vh, 48px);
    max-width: 80rem;
    margin: 0 auto;
}
.ideas-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(24px, 4vh, 48px) clamp(32px, 5vw, 80px);
}
.idea-group { display: grid; align-content: start; gap: 12px; }
.idea-group:last-child { grid-column: 1 / -1; }
.ideas-content .idea-lead { font-weight: 600; line-height: 1.25; }
.ideas-content .idea-detail { font-size: clamp(1.125rem, 1.7vw, 1.75rem); }
.ideas-content .ideas-conclusion { font-weight: 600; }
@media (max-width: 700px) {
    .ideas-grid { grid-template-columns: minmax(0, 1fr); }
}
.ideas-content p {
    margin: 0;
    font-size: clamp(1.5rem, 2.4vw, 2.5rem);
    line-height: 1.45;
}
.requirement-slide {
    flex-direction: column;
    gap: clamp(20px, 4vh, 48px);
}
.requirement-tag {
    margin: 0;
    padding: 0.4em 0.75em;
    border: 2px solid currentColor;
    border-radius: 0.35em;
    font-size: clamp(1rem, 1.8vw, 1.75rem);
    font-weight: 600;
    line-height: 1.2;
}
/* === BOT-DETECTION EXAMPLES === */
.discovery-slide { overflow-y: auto; }
.bot-detection-images {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(16px, 3vw, 48px);
    width: min(100%, 64rem);
    flex-shrink: 0;
}
.bot-detection-images img { display: block; min-width: 0; object-fit: contain; }
.bot-detection-logo { width: 18%; max-height: 20vh; }
.bot-detection-example { width: 76%; max-height: 28vh; }
.service-generation-video { display: block; width: 100%; height: min(60vh, 720px); object-fit: contain; }
/* === CLIENT-SIDE WEBSITE ACTIONS === */
.web-actions-slide { padding: clamp(24px, 5vw, 72px); overflow-y: auto; }
.web-actions-content {
    --heading-size: var(--content-title-size);
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: var(--title-gap);
    min-height: 100%;
    max-width: 80rem;
    margin: 0 auto;
}
.web-client { margin: 0; }
.web-action-flow { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: clamp(12px, 2vw, 28px); }
.web-action-step { padding: clamp(16px, 2vw, 28px); border: 2px solid currentColor; border-radius: 6px; background: #FFFCF0; text-align: center; }
.web-action-step h3 { margin: 0 0 16px; font-size: clamp(1.125rem, 1.8vw, 1.75rem); font-weight: 600; line-height: 1.3; }
.web-action-step p { margin: 0; font-size: clamp(1rem, 1.5vw, 1.5rem); line-height: 1.45; }
.web-action-step code { font-family: inherit; font-weight: 600; }
.web-action-arrow { font-size: 2rem; text-align: center; }
@media (max-width: 700px) {
    .web-action-flow { grid-template-columns: minmax(0, 1fr); }
    .web-action-arrow { transform: rotate(90deg); }
}
/* === SERVICE CONNECTION DIAGRAM === */
.integration-slide { overflow-y: auto; padding: clamp(24px, 5vw, 80px); }
.integration-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: var(--title-gap);
    min-height: 100%;
    max-width: 90rem;
    margin: 0 auto;
}
.integration-scroll { overflow-x: auto; padding: 8px 0; }
.integration-diagram {
    display: grid;
    grid-template-columns: minmax(7rem, 0.8fr) 40px minmax(8rem, 1fr) auto minmax(9rem, 1.2fr) auto minmax(10rem, 1.3fr);
    grid-template-rows: repeat(3, minmax(7rem, 1fr));
    gap: clamp(20px, 4vh, 48px) clamp(8px, 1.2vw, 20px);
    align-items: center;
    min-width: 760px;
    font-size: clamp(1.125rem, 1.6vw, 1.75rem);
    line-height: 1.3;
    text-align: center;
}
.integration-node { padding: 0.8em 0.6em; border: 2px solid currentColor; border-radius: 6px; }
.integration-source { grid-column: 1; grid-row: 1 / 4; align-self: center; font-weight: 600; }
.integration-branches { grid-column: 2; grid-row: 1 / 4; width: 100%; height: 100%; overflow: visible; }
.integration-highlight { background: #FFFCF0; border-width: 3px; font-weight: 600; }
.integration-node small { display: block; margin-top: 0.4em; font-size: 0.8em; }
.integration-arrow { font-size: 1.5em; }
.integration-endpoint { grid-column: 5 / 8; }
.integration-note { margin: 0; max-width: 52rem; font-size: clamp(1.25rem, 2.3vw, 2.5rem); line-height: 1.4; }
.integration-note strong { font-weight: 600; }
.integration-domain { overflow-wrap: anywhere; font-size: 0.85em; }
/* === SHARED SERVICE REPOSITORIES === */
.repository-slide {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: clamp(12px, 2vh, 28px);
    padding: clamp(20px, 4vw, 64px);
    overflow-y: auto;
}
.repository-figure { width: 100%; max-width: 80rem; margin: 0; }
.service-groups-scroll { overflow-x: auto; padding: 8px 0; }
.service-groups { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(24px, 4vw, 64px); min-width: 760px; }
.service-group h3 { margin: 0 0 clamp(24px, 4vh, 48px); font-size: clamp(1.25rem, 2.1vw, 2rem); font-weight: 600; text-align: center; }
.service-icons { list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(20px, 4vh, 40px) 12px; padding: 0; margin: 0; }
.service-icons li { display: grid; grid-template-rows: auto 2.6em; justify-items: center; align-content: start; gap: 10px; min-width: 0; text-align: center; }
.service-icons img { display: block; width: clamp(36px, 4.5vw, 64px); height: clamp(36px, 4.5vw, 64px); object-fit: contain; border-radius: 22%; background: #FFFCF0; }
.service-icons span { font-size: clamp(0.75rem, 1vw, 1rem); line-height: 1.3; overflow-wrap: anywhere; }
.repository-figure figcaption { margin-top: 8px; font-size: clamp(0.875rem, 1.4vw, 1.25rem); line-height: 1.4; text-align: center; }
.media-statement {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
    gap: clamp(24px, 4vw, 64px);
}
.media-statement img { display: block; width: 100%; height: 100%; min-height: 0; max-height: 70vh; object-fit: contain; }
@media (max-width: 700px) {
    .media-statement { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr); }
}
/* === PERSISTENT EXECUTION ENVIRONMENT === */
.environment-slide { padding: clamp(24px, 5vw, 72px); overflow-y: auto; }
.environment-content { display: flex; flex-direction: column; justify-content: center; gap: var(--title-gap); min-height: 100%; max-width: 76rem; margin: 0 auto; text-align: center; }
.environment-content > p { margin: 0; font-size: clamp(1.125rem, 2.1vw, 2rem); line-height: 1.4; }
.environment-diagram { margin: 0; font-size: clamp(1rem, 1.8vw, 1.75rem); line-height: 1.3; }
.environment-agent { display: inline-block; padding: 0.5em 1.5em; border: 2px solid currentColor; border-radius: 6px; font-weight: 600; }
.environment-down { display: block; margin: 8px 0; font-size: 1.5em; line-height: 1; }
.environment-interface { max-width: 36rem; margin: 0 auto; padding: 0.7em; border: 2px solid currentColor; border-radius: 6px; background: #FFFCF0; font-weight: 600; }
.environment-branches { display: block; width: 100%; height: clamp(32px, 6vh, 64px); }
.environment-platforms { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(12px, 2vw, 32px); }
.environment-platform { padding: clamp(12px, 2vw, 28px); border: 2px solid currentColor; border-radius: 6px; }
.environment-platform h3 { margin: 0 0 0.8em; font: inherit; font-weight: 600; }
.environment-platform p { margin: 0; line-height: 1.6; }
.protocol-vm { background: var(--green); border-width: 3px; }
.roles-diagram { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: clamp(12px, 2vw, 32px); margin: 0; font-size: clamp(1rem, 1.8vw, 1.75rem); }
.role-device { border: 2px solid currentColor; border-radius: 8px; padding: clamp(12px, 2vw, 32px); }
.role-device h3 { margin: 0 0 1em; font: inherit; font-weight: 600; }
.protocol-role { padding: 0.7em; border: 3px solid currentColor; border-radius: 6px; background: var(--green); font-weight: 600; }
.protocol-role small { display: block; margin-top: 0.4em; font-size: 0.75em; font-weight: 400; line-height: 1.4; }
.roles-remote { display: flex; flex-direction: column; align-items: center; gap: 8px; font-size: 2em; }
.roles-remote small { font-size: clamp(0.75rem, 1.2vw, 1.125rem); white-space: nowrap; }
.roles-diagram figcaption { grid-column: 1 / -1; font-size: 0.9em; line-height: 1.4; }
/* === OX VM CAPABILITY COMPUTER === */
.vm-computer-slide { padding: clamp(20px, 3vw, 48px); overflow-y: auto; }
.vm-computer-content { display: flex; flex-direction: column; justify-content: center; gap: var(--title-gap); min-height: 100%; max-width: 80rem; margin: 0 auto; }
.vm-computer-image { display: block; width: 100%; height: min(75vh, 900px); object-fit: contain; }
.service-package { width: min(100%, 46rem); margin: 0 auto; padding: clamp(20px, 3vw, 40px); border: 2px solid currentColor; border-radius: 8px; background: var(--green); }
.service-package h3 { margin: 0 0 24px; font-size: clamp(1.5rem, 2.5vw, 2.5rem); font-weight: 600; }
.service-package-files { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(12px, 2vw, 28px); }
.service-package-file { padding: 1em 0.5em; border: 2px solid currentColor; border-radius: 6px; background: #FFFCF0; font-size: clamp(1.125rem, 2vw, 2rem); font-weight: 600; }
.service-package-types { display: flex; justify-content: center; gap: clamp(12px, 2vw, 28px); margin-top: clamp(16px, 2vh, 24px); }
.service-package-type { padding: 0.5em 1em; border: 2px solid currentColor; border-radius: 6px; background: var(--green); font-size: clamp(1rem, 1.5vw, 1.5rem); font-weight: 600; }
.evolve-flow { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1.2fr) auto minmax(0, 1fr); gap: clamp(12px, 2vw, 28px); align-items: center; margin: 0; font-size: clamp(1.125rem, 1.8vw, 1.75rem); }
.evolve-node { padding: clamp(16px, 2vw, 32px); border: 2px solid currentColor; border-radius: 8px; }
.evolve-node h3 { margin: 0 0 0.7em; font: inherit; font-weight: 600; }
.evolve-node p { margin: 0; font-size: 0.85em; line-height: 1.45; }
.evolve-skill { margin-bottom: 16px; padding: 0.65em; border: 2px solid currentColor; border-radius: 6px; background: var(--green); font-weight: 600; }
.evolve-service { background: var(--green); }
.evolve-files { display: grid; gap: 10px; }
.evolve-files span { padding: 0.5em; border: 1px solid currentColor; border-radius: 4px; background: #FFFCF0; font-size: 0.85em; }
.evolve-arrow { font-size: 1.75em; }
.distributed-layout { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); align-items: center; gap: clamp(24px, 4vw, 56px); }
.distributed-screenshot { display: block; width: 100%; height: min(65vh, 760px); object-fit: contain; }
@media (max-width: 700px) { .distributed-layout { grid-template-columns: minmax(0, 1fr); } }
.distributed-network { margin: 0; font-size: clamp(1rem, 1.8vw, 1.75rem); }
.distributed-devices { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(8px, 2vw, 28px); }
.distributed-device { padding: clamp(12px, 2vw, 24px) 8px; border: 2px solid currentColor; border-radius: 8px; }
.distributed-device > img { display: block; width: clamp(32px, 4vw, 56px); height: clamp(32px, 4vw, 56px); object-fit: contain; border-radius: 22%; margin: 0 auto 12px; }
.distributed-device h3 { margin: 0 0 0.5em; font: inherit; font-weight: 600; }
.distributed-device p { margin: 0; font-size: 0.8em; }
.distributed-links { position: relative; }
.distributed-git { position: absolute; top: 50%; transform: translate(-50%, -50%); padding: 0.1em 0.35em; background: var(--background); font-size: clamp(1rem, 1.5vw, 1.5rem); }
.distributed-git:nth-of-type(1) { left: 15%; }
.distributed-git:nth-of-type(2) { left: 28.35%; }
.distributed-git:nth-of-type(3) { left: 41.7%; }
.distributed-connections { display: block; width: 100%; height: clamp(40px, 8vh, 80px); overflow: visible; }
.distributed-repository { width: min(100%, 26rem); margin: 0 auto; background: var(--green); }
.distributed-repository h3 { margin-bottom: 0.4em; }
@media (max-width: 700px) {
    .evolve-flow { grid-template-columns: minmax(0, 1fr); }
    .evolve-arrow { transform: rotate(90deg); }
}
.profile-folder { position: relative; width: min(100%, 46rem); margin: 16px auto 0; padding: clamp(18px, 2.5vw, 32px); border: 2px solid currentColor; border-radius: 0 8px 8px 8px; background: var(--green); }
.profile-folder::before { content: ''; position: absolute; left: -2px; bottom: 100%; width: 30%; height: 16px; border: 2px solid currentColor; border-bottom: 0; border-radius: 6px 6px 0 0; background: var(--green); }
.profile-folder h3 { margin: 0 0 0.5em; font: inherit; font-weight: 600; }
.profile-folder p { margin: 0; font-size: 0.8em; line-height: 1.5; }
.profile-folder small { display: block; margin-top: 0.5em; font-size: 0.75em; }
.interoperable-devices-image { display: block; width: min(100%, 46rem); max-height: 24vh; object-fit: contain; margin: 0 auto; }
.usb-media { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); align-items: center; gap: clamp(24px, 4vw, 64px); width: 100%; }
.usb-media img { max-height: 75vh; }
@media (max-width: 700px) { .usb-media { grid-template-columns: minmax(0, 1fr); } .usb-media img { max-height: 36vh; } }
.portable-data-image { display: block; width: min(100%, 52rem); max-height: 26vh; object-fit: contain; margin: 0 auto; }
.profiles-layout { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); align-items: center; gap: clamp(32px, 5vw, 80px); margin: 0; font-size: clamp(1.125rem, 1.8vw, 1.75rem); }
.profiles-layout .profile-folder { width: 100%; }
.profile-examples { display: grid; gap: 32px; }
.profile-examples .profile-folder { max-width: 22rem; padding: clamp(14px, 1.5vw, 24px); font-size: 0.85em; }
.profile-examples .profile-folder h3 { margin: 0; }
@media (max-width: 600px) { .profiles-layout { grid-template-columns: minmax(0, 1fr); } }
.screenshot-slide { display: grid; place-items: center; padding: clamp(16px, 3vw, 48px); }
.screenshot-slide img { display: block; width: 100%; height: 100%; min-height: 0; object-fit: contain; }
.protocol-list { list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(24px, 4vh, 48px) clamp(24px, 4vw, 64px); margin: 0; padding: 0; text-align: center; font-size: clamp(1.5rem, 2.8vw, 3rem); line-height: 1.3; }
@media (max-width: 700px) { .protocol-list { grid-template-columns: minmax(0, 1fr); } }
.model-groups { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); align-items: start; gap: clamp(32px, 5vw, 72px); }
.local-model-emphasis { display: inline-block; padding: 0.2em 0.65em; border: 3px solid currentColor; border-radius: 50%; }
.model-group h3 { margin: 0 0 clamp(20px, 3vh, 36px); font-size: clamp(1.5rem, 2.5vw, 2.5rem); font-weight: 600; }
.provider-protocols { margin-top: clamp(24px, 4vh, 40px); text-align: left; font-size: clamp(1rem, 1.5vw, 1.5rem); line-height: 1.4; }
.provider-protocols > p { font-size: inherit; }
.provider-protocols ul { margin: 12px 0 0; padding-left: 1.2em; }
.provider-protocols li + li { margin-top: 8px; }
.model-providers { display: grid; gap: clamp(20px, 4vh, 40px); list-style: none; padding: 0; margin: 0; }
.model-providers li { display: flex; align-items: center; gap: 20px; font-size: clamp(1.25rem, 2vw, 2rem); text-align: left; }
.model-providers img { width: clamp(40px, 5vw, 64px); height: clamp(40px, 5vw, 64px); object-fit: contain; border-radius: 22%; }
@media (max-width: 700px) { .model-groups { grid-template-columns: minmax(0, 1fr); } }
.local-model-resources { display: grid; gap: clamp(16px, 3vh, 32px); justify-items: center; }
.local-model-resources img { display: block; width: min(100%, 64rem); max-height: 22vh; object-fit: contain; }
.local-model-resources a { color: inherit; font-size: clamp(1rem, 1.7vw, 1.75rem); line-height: 1.4; text-align: center; text-underline-offset: 0.2em; }
.possibilities-slide { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) auto; justify-items: center; gap: clamp(16px, 3vh, 32px); padding: 3vh 4vw; overflow-y: auto; }
.possibilities-copy { display: grid; gap: 12px; text-align: center; }
.possibilities-copy h2 { font-size: var(--content-title-size); }
.possibilities-photo { display: block; width: 100%; height: 100%; min-height: 0; object-fit: contain; border-radius: 8px; }
.internet-access-slide { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3vh; padding: clamp(24px, 4vw, 56px); }
.internet-access-map { display: block; height: 48vh; max-width: 100%; }
.internet-access-map img { display: block; height: 100%; max-width: 100%; object-fit: contain; }
.internet-access-arrows { fill: none; stroke: currentColor; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.internet-access-flow { display: block; width: min(100%, 90rem); max-height: 60vh; font-family: var(--font); }
.agent-runtime-slide { padding: clamp(20px, 4vw, 56px); overflow-y: auto; }
.agent-runtime-content { display: flex; flex-direction: column; justify-content: center; gap: 2vh; min-height: 100%; max-width: 76rem; margin: 0 auto; text-align: center; }
.agent-runtime-content h2 { margin: 0; font-size: clamp(1.5rem, 3vw, 3rem); }
.agent-runtime-diagram { display: block; width: 100%; max-height: 72vh; font-family: var(--font); color: var(--text); }
.agent-runtime-caption { margin: 0; font-size: clamp(0.875rem, 1.5vw, 1.4rem); line-height: 1.4; }
.agent-stack-slide { padding: 3vh 16px; }
.iphone-frame {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: min(38vh, 80vw, 390px);
    height: min(82vh, 840px);
    flex-shrink: 0;
    padding: clamp(48px, 8vh, 80px) 16px clamp(28px, 5vh, 48px);
    border: 8px solid #100F0F;
    border-radius: clamp(36px, 6vh, 60px);
    background: #FFFCF0;
}
.iphone-frame::before { content: ''; position: absolute; top: 14px; left: 50%; transform: translateX(-50%); width: 32%; height: clamp(16px, 2.5vh, 26px); border-radius: 999px; background: #100F0F; }
.iphone-frame::after { content: ''; position: absolute; bottom: 12px; left: 50%; transform: translateX(-50%); width: 34%; height: 4px; border-radius: 999px; background: #100F0F; }
.iphone-frame .agent-stack { gap: clamp(6px, 1.5vh, 16px); }
.iphone-frame .agent-stack-node { font-size: clamp(0.875rem, 2.8vh, 1.75rem); }
.iphone-frame .agent-stack-arrow { font-size: clamp(1rem, 2.5vh, 1.75rem); }
.agent-stack { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: clamp(12px, 2vh, 24px); width: 100%; }
.agent-stack-node { font-size: clamp(1.5rem, 3vw, 3.5rem); line-height: 1.3; }
.agent-stack-arrow { font-size: clamp(1.5rem, 3vw, 3rem); transform: rotate(90deg); }
.security-flow { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: clamp(12px, 2vw, 28px); font-size: clamp(1.125rem, 2vw, 2rem); }
.security-step { padding: clamp(20px, 3vw, 40px) 16px; border: 2px solid currentColor; border-radius: 8px; }
.security-step strong { display: block; font-weight: 600; }
.security-step small { display: block; margin-top: 12px; font-size: 0.75em; }
.security-boundary { border: 3px solid currentColor; border-radius: 12px; padding: clamp(16px, 2.5vw, 32px); }
.security-boundary h3 { text-align: left; margin: 0 0 20px; font-size: clamp(1.125rem, 2vw, 2rem); font-weight: 600; }
.security-vm { width: min(100%, 48rem); margin: 0 auto; border: 2px solid currentColor; border-radius: 8px; padding: clamp(16px, 2vw, 28px); background: var(--green); }
.security-interception { display: grid; grid-template-columns: minmax(0, 0.65fr) minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 16px; }
.security-device-flow { display: grid; grid-template-columns: minmax(0, 3fr) auto minmax(0, 1fr); align-items: center; gap: clamp(12px, 2vw, 28px); }
.security-command-arrows { display: grid; gap: 20px; font-size: clamp(1rem, 1.5vw, 1.5rem); }
.security-command-arrows > div { display: grid; gap: 4px; }
.security-command-arrows > div > span:last-child { font-size: 2.5rem; line-height: 1; }
.security-real-device { border: 2px solid currentColor; border-radius: 12px; padding: clamp(16px, 2.5vw, 32px); font-size: clamp(1rem, 1.7vw, 1.75rem); }
.security-real-device h3 { text-align: left; margin: 0 0 20px; font: inherit; font-weight: 600; }
@media (max-width: 700px) {
    .security-device-flow, .security-interception { grid-template-columns: minmax(0, 1fr); }
    .security-device-flow > .evolve-arrow { transform: rotate(90deg); }
    .security-command-arrows { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .security-command-arrows > div > span:last-child { transform: rotate(90deg); }
}
.security-down { display: block; margin: 12px 0; font-size: 2rem; }
.security-footnote { font-size: clamp(1rem, 1.5vw, 1.5rem) !important; }
@media (max-width: 700px) {
    .security-flow { grid-template-columns: minmax(0, 1fr); }
    .security-flow > .evolve-arrow { transform: rotate(90deg); }
}
.security-diagram-scroll { overflow-x: auto; }
.security-diagram-scroll:focus-visible { outline: 2px solid currentColor; outline-offset: 6px; }
.security-diagram { display: block; width: 100%; min-width: 800px; height: auto; font-family: var(--font); fill: currentColor; text-align: left; }
.security-diagram .security-wire { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.security-diagram .security-detail { fill: #575653; font-size: 20px; }
.long-tail-chart { width: min(100%, 60rem); margin: clamp(24px, 5vh, 56px) auto 0; }
.long-tail-bars { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); align-items: end; gap: clamp(4px, 1vw, 12px); height: clamp(100px, 27vh, 280px); padding: 0 5%; }
.long-tail-bars span { display: block; height: var(--bar-height); background: #F6E2A0; border-radius: 5px 5px 0 0; }
.long-tail-bars .long-tail-service { background: #AD8301; }
.long-tail-chart figcaption { display: flex; justify-content: space-between; gap: 24px; margin-top: clamp(24px, 4vh, 40px); font-size: clamp(1.125rem, 2.4vw, 2.5rem); line-height: 1.3; }
.court-map { position: relative; width: min(100%, calc((100dvh - clamp(32px, 6vw, 96px)) * 1320 / 2868)); }
.court-map > img { display: block; width: 100%; height: auto; }
.court-ox { position: absolute; left: var(--x); top: var(--y); transform: translate(-50%, -50%); width: clamp(64px, 9vh, 96px); height: clamp(28px, 4vh, 42px); }
.court-ox img { position: absolute; left: 0; top: 15%; display: block; width: 30%; height: auto; border-radius: 22%; }
.court-ox::before { content: '→'; position: absolute; left: 32%; top: 50%; transform: translateY(-50%); width: 25%; text-align: center; color: #100F0F; font-size: clamp(16px, 2.5vh, 24px); line-height: 1; }
.court-ox::after { content: ''; position: absolute; right: 0; top: 0; height: 100%; aspect-ratio: 1; border-radius: 50%; background: url('/assets/slides/openox/media/court-marker-b00fc80b5d8a.png') center / cover; }
.connector-screenshots { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(16px, 3vw, 48px); }
.connector-screenshots img { display: block; width: 100%; height: 68vh; object-fit: contain; }
@media (max-width: 600px) { .connector-screenshots { grid-template-columns: minmax(0, 1fr); } }
.git-server { padding: clamp(16px, 2vw, 28px); border: 2px solid currentColor; border-radius: 10px; }
.git-server > h3 { margin: 0 0 20px; font-size: clamp(1.125rem, 1.8vw, 1.75rem); font-weight: 600; text-align: left; }
.git-repositories { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(8px, 1.2vw, 16px); }
.git-repositories .distributed-repository { width: 100%; padding: clamp(10px, 1.3vw, 18px); }
.git-repositories h3 { font-size: clamp(0.875rem, 1.3vw, 1.25rem); }
.git-repositories .service-package-files { grid-template-columns: minmax(0, 1fr); gap: 8px; }
.git-repositories .service-package-file { padding: 0.5em; font-size: clamp(0.75rem, 1.1vw, 1rem); }
.distributed-evolution-slide .distributed-layout { grid-template-columns: minmax(0, 3fr) minmax(0, 1fr); }
.distributed-evolution-slide .distributed-devices { width: 80%; }
.distributed-evolution-slide .distributed-device { padding: 12px 8px; border: 0; border-radius: 0; font-size: clamp(0.875rem, 1.3vw, 1.25rem); }
.distributed-evolution-slide .distributed-device > img { width: 32px; height: 32px; margin-bottom: 8px; }
.distributed-evolution-slide .distributed-screenshot { height: 54vh; }
.distributed-evolution-slide .distributed-git { font-size: 1rem; }
@media (max-width: 700px) { .distributed-evolution-slide .distributed-layout { grid-template-columns: minmax(0, 1fr); } }
.thanks-names { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 4vh, 40px) 24px; padding: 0; margin: 0; list-style: none; font-size: clamp(1.25rem, 2.3vw, 2.5rem); line-height: 1.4; }
@media (max-width: 600px) { .thanks-names { grid-template-columns: minmax(0, 1fr); gap: 12px; } }
.tennis-travel-slide { --heading-size: var(--content-title-size); grid-template-rows: auto minmax(0, 1fr); gap: clamp(16px, 3vh, 32px); }
.tennis-travel-slide .court-map { width: auto; height: 100%; max-width: 100%; aspect-ratio: 1320 / 2868; }
.tennis-travel-slide .court-map > img { width: 100%; height: 100%; object-fit: contain; }
.thanks-slide .environment-content p,
.thanks-slide .thanks-names { font-size: clamp(1.25rem, 2.3vw, 2.5rem); line-height: 1.4; }
.thanks-slide h2 { font-size: clamp(3.5rem, 7vw, 7rem); }
.thanks-credits { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: clamp(24px, 4vh, 48px) clamp(24px, 4vw, 64px); align-items: start; text-align: left; }
.thanks-credits > p,
.thanks-credits > ul { margin: 0; align-self: start; }
.thanks-credits .thanks-names { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 24px; }
@media (max-width: 600px) {
    .thanks-credits { grid-template-columns: minmax(0, 1fr); }
    .thanks-credits .thanks-names { grid-template-columns: minmax(0, 1fr); }
}
.evolve-service .service-package-files { grid-template-columns: minmax(0, 1fr); gap: 12px; }
.evolve-service .service-package-file { padding: 0.6em; font-size: clamp(1rem, 1.6vw, 1.5rem); }
/* === PRINT === */
@page { size: A4 landscape; margin: 0; }
@media print {
    html, body { width: 297mm; height: auto; overflow: visible; }
    body { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
    .deck-viewport { position: static; overflow: visible; }
    .deck-stage { position: static; height: auto; overflow: visible; }
    .slide { position: relative; width: 297mm; height: 210mm; visibility: visible; opacity: 1; break-after: page; }
    .slide:last-child { break-after: auto; }
}

/* Values originally specified inline in the source presentation. */
:root body .deck-style-1 { --background: #FFFFFF; }
:root body .deck-style-2 { --background: var(--green); }
:root body .deck-style-3 { --background: linear-gradient(to right, var(--green), var(--yellow)); }
:root body .deck-style-4 { margin: 0; font-size: clamp(1.5rem, 2.4vw, 2.5rem); line-height: 1.45; }
:root body .deck-style-5 { --bar-height: 100%; }
:root body .deck-style-6 { --bar-height: 63%; }
:root body .deck-style-7 { --bar-height: 42%; }
:root body .deck-style-8 { --bar-height: 29%; }
:root body .deck-style-9 { --bar-height: 23%; }
:root body .deck-style-10 { --bar-height: 19%; }
:root body .deck-style-11 { --bar-height: 17%; }
:root body .deck-style-12 { --bar-height: 15%; }
:root body .deck-style-13 { --bar-height: 14%; }
:root body .deck-style-14 { --bar-height: 12%; }
:root body .deck-style-15 { --bar-height: 11%; }
:root body .deck-style-16 { font-size: clamp(1rem, 1.5vw, 1.5rem); }
:root body .deck-style-17 { margin: 0; font-size: clamp(1.5rem, 2.8vw, 3rem); text-align: center; }
:root body .deck-style-18 { display: block; width: min(100%, 48rem); max-height: 62vh; object-fit: contain; margin: 0 auto; }
:root body .deck-style-19 { --background: linear-gradient(to right, var(--yellow), var(--green)); }
:root body .deck-style-20 { --x: 14%; --y: 53%; }
:root body .deck-style-21 { --x: 10%; --y: 61%; }
:root body .deck-style-22 { --x: 24%; --y: 66%; }
:root body .deck-style-23 { --x: 42%; --y: 60%; }
:root body .deck-style-24 { --x: 55%; --y: 69%; }
:root body .deck-style-25 { --x: 69%; --y: 58%; }
:root body .deck-style-26 { --x: 87%; --y: 63%; }