/**
 * Vault Viewer — marketing iframe embed (viewer.php?embed=1).
 * Fixed 1280×720 canvas; overrides vh-based layout that overflows when scaled in promo iframes.
 */
:root {
    --vault-embed-canvas-w: 1280px;
    --vault-embed-canvas-h: 720px;
    --vault-embed-control-h: 64px;
    --vault-embed-slide-h: calc(var(--vault-embed-canvas-h) - var(--vault-embed-control-h));
}

html.promo-vault-embed-html {
    overflow: hidden;
    width: var(--vault-embed-canvas-w);
    height: var(--vault-embed-canvas-h);
}

html.promo-vault-embed-html body.promo-vault-embedded {
    margin: 0;
    overflow: hidden;
    width: var(--vault-embed-canvas-w);
    height: var(--vault-embed-canvas-h);
    min-height: var(--vault-embed-canvas-h);
    max-height: var(--vault-embed-canvas-h);
}

body.vault-viewer-body.promo-vault-embedded {
    width: var(--vault-embed-canvas-w);
    height: var(--vault-embed-canvas-h);
    min-height: var(--vault-embed-canvas-h);
    max-height: var(--vault-embed-canvas-h);
    overflow: hidden;
}

body.vault-viewer-body.promo-vault-embedded .viewer-container {
    width: var(--vault-embed-canvas-w);
    height: var(--vault-embed-canvas-h);
    max-height: var(--vault-embed-canvas-h);
}

body.vault-viewer-body.promo-vault-embedded #viewerContainer {
    height: var(--vault-embed-slide-h);
    min-height: 0;
    max-height: var(--vault-embed-slide-h);
    overflow: hidden;
}

body.vault-viewer-body.promo-vault-embedded #slideDisplay {
    height: 100%;
    min-height: 0;
    max-height: 100%;
    overflow: hidden !important;
    flex: 1 1 auto;
}

/* Main slide canvas gradient (behind vocab column edge at 200px) */
body.promo-vault-embedded.dark-mode #slideDisplay {
    background: linear-gradient(60deg, var(--gradient-secondary-15), var(--gradient-primary-12));
}

body.promo-vault-embedded.light-mode #slideDisplay {
    background: linear-gradient(60deg, var(--gradient-secondary-25), var(--gradient-primary-20));
}

/* Teaching slides 3–6: fill width to canvas edge (avoid 10% right gutter + black strip) */
body.promo-vault-embedded .slide-content.prior-learning-slide,
body.promo-vault-embedded .slide-content.i-do-slide,
body.promo-vault-embedded .slide-content.we-do-slide,
body.promo-vault-embedded .slide-content.you-do-slide {
    margin-left: 200px !important;
    margin-right: 0 !important;
    width: calc(var(--vault-embed-canvas-w) - 200px) !important;
    max-width: calc(var(--vault-embed-canvas-w) - 200px) !important;
    box-sizing: border-box !important;
}

body.promo-vault-embedded.dark-mode .slide-content::before,
body.promo-vault-embedded.light-mode .slide-content:not(.plenary-slide):not(.exit-ticket-slide)::before {
    left: 200px !important;
    right: 0 !important;
    width: calc(var(--vault-embed-canvas-w) - 200px) !important;
}

body.promo-vault-embedded .slide-content.plenary-slide::before,
body.promo-vault-embedded .slide-content.exit-ticket-slide::before {
    left: 200px !important;
    right: 0 !important;
    width: calc(var(--vault-embed-canvas-w) - 200px) !important;
}

body.promo-vault-embedded .slide-content .school-logo {
    height: var(--vault-embed-slide-h) !important;
    max-height: var(--vault-embed-slide-h) !important;
    transform: rotate(-10deg) translateX(14%) !important;
    transform-origin: top right !important;
}

body.promo-vault-embedded .slide-display:has(.i-do-slide),
body.promo-vault-embedded .slide-display:has(.we-do-slide),
body.promo-vault-embedded .slide-display:has(.you-do-slide),
body.promo-vault-embedded .slide-display:has(.formulae-slide) {
    align-items: stretch !important;
    justify-content: flex-start !important;
}

body.vault-viewer-body.promo-vault-embedded .key-vocab-box {
    height: var(--vault-embed-slide-h);
    max-height: var(--vault-embed-slide-h);
}

body.vault-viewer-body.promo-vault-embedded #controlBar {
    flex-wrap: nowrap;
    padding: 8px 12px;
    gap: 8px;
    min-height: var(--vault-embed-control-h);
    box-sizing: border-box;
}

body.vault-viewer-body.promo-vault-embedded .control-btn {
    width: 40px;
    height: 40px;
}

/* Slightly smaller default embedded widgets in promo preview */
body.promo-vault-embedded {
    --font-multiplier: 1.2;
    --tlac-font-multiplier: 1.15;
    --plenary-font-multiplier: 1.15;
    --exit-font-multiplier: 1.15;
}

body.promo-vault-embedded .slide-title {
    font-size: 2.35rem;
}

body.promo-vault-embedded .slide-content {
    overflow: hidden !important;
    max-height: var(--vault-embed-slide-h);
}

body.promo-vault-embedded .slide-content.app-slide {
    min-height: 0 !important;
    height: auto !important;
    max-height: var(--vault-embed-slide-h) !important;
}

body.promo-vault-embedded .app-slide .app-embed-container {
    min-height: 0 !important;
    height: var(--vault-embed-slide-h) !important;
    max-height: var(--vault-embed-slide-h) !important;
}

body.promo-vault-embedded .slide-content.independent-task-slide[data-task-type="instructions"] {
    min-height: 0 !important;
    height: auto !important;
    max-height: var(--vault-embed-slide-h) !important;
}

body.promo-vault-embedded .slide-content.discovery-slide {
    min-height: 0 !important;
    height: auto !important;
    max-height: var(--vault-embed-slide-h) !important;
}

body.promo-vault-embedded .discovery-text-panel {
    max-height: calc(var(--vault-embed-slide-h) - 120px) !important;
}

body.promo-vault-embedded .projector-container .projector-single-view {
    min-height: 0 !important;
    height: auto !important;
}

body.promo-vault-embedded .projector-content-wrapper {
    max-width: calc(var(--vault-embed-canvas-w) - 220px) !important;
}

body.promo-vault-embedded .tlac-slide .resource-embed-container,
body.promo-vault-embedded .exit-ticket-slide .resource-embed-container,
body.promo-vault-embedded .homework-answers-slide .resource-embed-container {
    height: calc(var(--vault-embed-slide-h) - 48px) !important;
    max-height: calc(var(--vault-embed-slide-h) - 48px) !important;
    overflow: hidden;
}

body.promo-vault-embedded #tlacContainer,
body.promo-vault-embedded #projectorContainer,
body.promo-vault-embedded #craftContainer,
body.promo-vault-embedded #ranrContainer,
body.promo-vault-embedded #plenaryContainer,
body.promo-vault-embedded #homeworkAnswersContainer {
    height: 100%;
    max-height: calc(var(--vault-embed-slide-h) - 40px);
    overflow: hidden;
    box-sizing: border-box;
}

body.promo-vault-embedded .tlac-container,
body.promo-vault-embedded .projector-container,
body.promo-vault-embedded .craft-container {
    padding-top: 12px;
    padding-bottom: 12px;
}

body.promo-vault-embedded .projector-iframe,
body.promo-vault-embedded .discuss-iframe {
    height: calc(var(--vault-embed-slide-h) - 80px) !important;
}

body.promo-vault-embedded .slide-content.i-do-slide,
body.promo-vault-embedded .slide-content.we-do-slide,
body.promo-vault-embedded .slide-content.you-do-slide,
body.promo-vault-embedded .slide-content.formulae-slide {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    height: var(--vault-embed-slide-h) !important;
    max-height: var(--vault-embed-slide-h) !important;
    min-height: 0 !important;
    overflow: hidden !important;
    transform: none !important;
    box-sizing: border-box !important;
}

body.promo-vault-embedded .slide-content.i-do-slide .question-display-container,
body.promo-vault-embedded .slide-content.we-do-slide .question-display-container,
body.promo-vault-embedded .slide-content.you-do-slide .question-display-container,
body.promo-vault-embedded .slide-content.formulae-slide .formulae-display-container {
    flex: 0 0 auto !important;
}

body.promo-vault-embedded .i-do-slide .whiteboard-embed-container,
body.promo-vault-embedded .we-do-slide .whiteboard-embed-container,
body.promo-vault-embedded .you-do-slide .whiteboard-embed-container {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    flex: 1 1 auto !important;
    margin: 8px 0 0 !important;
    flex-grow: 1 !important;
    flex-shrink: 1 !important;
}

body.promo-vault-embedded .i-do-slide .whiteboard-embed-container.whiteboard-hidden,
body.promo-vault-embedded .we-do-slide .whiteboard-embed-container.whiteboard-hidden,
body.promo-vault-embedded .you-do-slide .whiteboard-embed-container.whiteboard-hidden {
    display: none !important;
    flex: 0 0 0 !important;
    margin: 0 !important;
}

body.promo-vault-embedded .i-do-slide .slide-label,
body.promo-vault-embedded .we-do-slide .slide-label,
body.promo-vault-embedded .you-do-slide .slide-label {
    font-size: 2rem;
}

body.promo-vault-embedded .i-do-slide .question-text-inline,
body.promo-vault-embedded .we-do-slide .question-text-inline,
body.promo-vault-embedded .you-do-slide .question-text-inline {
    font-size: 2rem;
    line-height: 1.35;
}

body.promo-vault-embedded .slide-display:has(.title-slide) {
    align-items: center !important;
    justify-content: center !important;
}

body.promo-vault-embedded .slide-content.title-slide {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    height: var(--vault-embed-slide-h) !important;
    max-height: var(--vault-embed-slide-h) !important;
    min-height: 0 !important;
    overflow: hidden !important;
    transform: none !important;
    padding: 20px 28px !important;
    box-sizing: border-box !important;
}

body.promo-vault-embedded .title-slide .title-main {
    font-size: clamp(1.6rem, 3.5vw, 2.5rem) !important;
    margin-bottom: 14px !important;
    line-height: 1.12 !important;
    max-width: 100%;
}

body.promo-vault-embedded .title-slide .title-subtitle {
    font-size: 1.25rem !important;
    margin-bottom: 12px !important;
}

body.promo-vault-embedded .title-slide .title-date {
    font-size: 1.05rem !important;
}

body.promo-vault-embedded .slide-display:has(.prior-learning-slide) {
    align-items: stretch !important;
    justify-content: flex-start !important;
}

body.promo-vault-embedded .slide-content.prior-learning-slide {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    height: var(--vault-embed-slide-h) !important;
    max-height: var(--vault-embed-slide-h) !important;
    min-height: 0 !important;
    overflow: hidden !important;
    transform: none !important;
    padding: 14px 20px 16px !important;
    box-sizing: border-box !important;
}

body.promo-vault-embedded .prior-learning-slide .prior-learning-title {
    font-size: 1.85rem !important;
    margin-bottom: 6px !important;
}

body.promo-vault-embedded .prior-learning-slide .prior-learning-subtitle {
    font-size: 1rem !important;
    margin-bottom: 14px !important;
}

body.promo-vault-embedded .prior-learning-slide .prior-learning-questions {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
    max-width: 100% !important;
    width: 100% !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    align-content: start !important;
}

body.promo-vault-embedded .prior-learning-slide .prior-learning-question:nth-child(3) {
    max-width: none !important;
}

body.promo-vault-embedded .prior-learning-slide .prior-learning-question {
    font-size: 1.2rem !important;
    padding: 12px 14px !important;
}

body.promo-vault-embedded .prior-learning-slide .prior-learning-text,
body.promo-vault-embedded .prior-learning-slide .prior-learning-number {
    font-size: 1.2rem !important;
    line-height: 1.35 !important;
}

body.promo-vault-embedded .slide-content.exit-ticket-slide {
    display: flex !important;
    flex-direction: column !important;
    height: var(--vault-embed-slide-h) !important;
    max-height: var(--vault-embed-slide-h) !important;
    min-height: 0 !important;
    overflow: hidden !important;
    transform: none !important;
    padding-top: 12px !important;
    box-sizing: border-box !important;
}

body.promo-vault-embedded .exit-ticket-slide .slide-title-container {
    flex-shrink: 0 !important;
    margin-bottom: 4px !important;
}

body.promo-vault-embedded #exitTicketContainer.exit-ticket-native-mount {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    width: 100% !important;
    max-width: calc(var(--vault-embed-canvas-w) - 220px) !important;
    margin: 0 auto !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    box-sizing: border-box !important;
}

body.promo-vault-embedded #exitTicketContainer .exit-ticket-fit-inner {
    transform: none !important;
    transform-origin: unset !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    padding: 8px 10px 14px !important;
}

body.promo-vault-embedded #exitTicketContainer .exit-question-container {
    padding: 1rem 1.2rem !important;
    margin-bottom: 12px !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

body.promo-vault-embedded #exitTicketContainer .exit-question-text {
    font-size: 1.1rem !important;
    line-height: 1.45 !important;
}

body.promo-vault-embedded #exitTicketContainer .exit-toggle-solution-btn {
    padding: 0.5rem 1rem !important;
    font-size: 0.95rem !important;
    margin-bottom: 12px !important;
}

body.promo-vault-embedded #exitTicketContainer .exit-solution-container {
    max-width: 100% !important;
    max-height: min(240px, calc(var(--vault-embed-slide-h) - 210px)) !important;
    overflow-y: auto !important;
    padding: 1rem 1.15rem !important;
    box-sizing: border-box !important;
}

body.promo-vault-embedded #exitTicketContainer .exit-solution-title {
    font-size: 1.1rem !important;
    margin-bottom: 12px !important;
}

body.promo-vault-embedded #exitTicketContainer .exit-step-text,
body.promo-vault-embedded #exitTicketContainer .exit-step-number {
    font-size: 0.95rem !important;
}

body.promo-vault-embedded .starter-slide #ranrContainer {
    max-height: calc(var(--vault-embed-slide-h) - 32px);
}