.school-demo-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:60px;align-items:center}.school-demo-copy>p{font-size:19px;line-height:1.7}.school-sandbox{min-width:0;border:1px solid #c8d7e4;border-radius:22px;overflow:hidden;background:#f5f7fa;box-shadow:0 25px 70px #1b32521c}.sandbox-brand{background:#1B3252;color:white;padding:24px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}.sandbox-brand span{font-size:13px}.sandbox-tabs{display:flex;overflow-x:auto;gap:8px;padding:16px;background:white;border-bottom:1px solid #dce5ee}.sandbox-tabs button,.flow-chapters button{border:0;background:#edf2f7;border-radius:9px;padding:12px 16px;font:800 14px Nunito,sans-serif;white-space:nowrap;cursor:pointer;color:#1B3252}.sandbox-tabs button[aria-pressed=true],.flow-chapters button[aria-current=true]{background:#1B3252;color:white}#sandbox-content{padding:24px;min-height:410px}.sandbox-footer{padding:16px 24px;background:white;display:flex;justify-content:space-between;gap:15px;align-items:center;font-size:12px}.sandbox-footer button,.connection-top button{background:white;color:#1B3252;border:1px solid #bdcedb;border-radius:8px;padding:10px 14px;cursor:pointer;font:800 13px Nunito,sans-serif}#sandbox-status{margin:0;padding:10px 24px;color:var(--navy);min-height:40px;background:#e8faf6;font-size:14px}.demo-record{border:1px solid #dce5ee;border-radius:12px;background:white;padding:20px;margin-top:14px}.demo-record h3{font-size:22px;margin:0 0 8px}.demo-record p{font-size:15px;line-height:1.5}.demo-record label{display:block;font-size:14px;font-weight:800;margin:16px 0 8px}.demo-record select,.demo-record textarea{width:100%;padding:12px;border:1px solid #bdcedb;border-radius:8px;font:inherit;background:white}.demo-record .button{margin-top:14px}.demo-pipeline{display:flex;overflow-x:auto;gap:12px;padding:12px 0 24px}.demo-column{flex:0 0 220px;border-radius:12px;background:#e7edf3;padding:14px;min-height:240px}.demo-column>strong{font-size:14px}.demo-column .demo-record{padding:15px}.demo-task{display:flex;gap:14px;align-items:flex-start;padding:17px 0;border-bottom:1px solid #dce5ee}.demo-task input{width:22px;height:22px;accent-color:#239C80}.demo-task:has(input:checked) span{text-decoration:line-through;color:#66758a}.demo-note{background:#e8faf6;padding:14px;border-radius:9px;margin-top:12px;white-space:pre-wrap;overflow-wrap:anywhere}.demo-sharing{display:flex!important;gap:12px;align-items:center}.demo-sharing input{width:22px;height:22px;accent-color:#239C80}
.connection-section{background:#E8FAF6}.connection-section .section-heading{max-width:850px}.connection-player{border:1px solid #c2dbd4;background:white;border-radius:24px;overflow:hidden;box-shadow:0 24px 70px #1b32521a}.connection-top{padding:20px 28px;display:flex;justify-content:space-between;align-items:center;gap:14px;border-bottom:1px solid #dce5ee}.connection-top>span{font-weight:900;color:#1B3252}.connection-top>div{display:flex;gap:8px}.connection-stage{min-height:370px;display:grid;place-items:center;padding:32px;background:#f4f7fb}.flow-screen{width:min(650px,100%);border:1px solid #cad8e3;border-radius:18px;background:white;box-shadow:0 14px 35px #1b325212;overflow:hidden;animation:flow-enter 650ms cubic-bezier(.23,1,.32,1) both}.flow-screen header{position:static!important;background:#1B3252;color:white;padding:17px 22px;font-weight:800;z-index:auto!important}.flow-body{padding:22px;display:grid;gap:14px}.flow-bubble{max-width:85%;padding:16px;border-radius:14px;background:#edf2f7;font-size:17px;line-height:1.6}.flow-bubble.out{margin-left:auto;background:#E8FAF6}.flow-bubble small{display:block;color:#587084;font-size:12px;margin-bottom:6px}.flow-result{padding:18px;border:1px solid #34C3A0;border-radius:12px;background:#E8FAF6}.flow-search{border:1px solid #bdcedb;border-radius:10px;padding:14px;color:#1B3252}.flow-chip{display:inline-block;background:#E8FAF6;color:var(--navy);padding:7px 12px;border-radius:99px;font-weight:800;font-size:13px}.flow-action{background:#34C3A0;border-radius:8px;padding:12px 18px;font-weight:800;color:#1B3252;justify-self:start}.flow-body>*{animation:flow-enter 700ms cubic-bezier(.23,1,.32,1) both}.flow-body>*:nth-child(2){animation-delay:600ms}.flow-body>*:nth-child(3){animation-delay:1200ms}.connection-copy{padding:26px 32px;max-width:850px;margin:auto;text-align:center;min-height:180px}.connection-copy>span{font-size:12px;letter-spacing:1.5px;font-weight:900;color:var(--navy)}.connection-copy h3{font-size:30px;margin:10px 0}.connection-copy p{line-height:1.65;margin:0}.flow-chapters{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;padding:0 20px 24px}.flow-chapters button{font-size:12px;padding:10px 12px}@keyframes flow-enter{from{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){.flow-screen,.flow-body>*{animation:none}}@media(max-width:900px){.school-demo-layout{grid-template-columns:1fr;gap:30px}}@media(max-width:760px){#sandbox-content{padding:16px}.sandbox-brand{padding:20px}.sandbox-tabs{gap:5px;padding:10px}.sandbox-tabs button{padding:12px 10px;font-size:13px}.connection-top{padding:16px;flex-wrap:wrap}.connection-stage{padding:15px;min-height:360px}.flow-body{padding:15px}.flow-bubble{max-width:95%;font-size:15px}.connection-copy{padding:22px 18px;min-height:210px}.connection-copy h3{font-size:25px}.flow-chapters{gap:6px;padding:0 12px 20px}.flow-chapters button{font-size:11px}.sandbox-footer{padding:16px;align-items:flex-start}}

/* School15: one stable stage and large, stationary chapter controls. */
.connection-player{overflow-anchor:none}.connection-stage{height:620px;min-height:620px;position:relative;overflow:hidden;padding:28px}.connection-top{height:78px}.connection-top>span{max-width:60%}.connection-top button{min-width:100px}.connection-copy{display:none}.flow-chapters{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));padding:18px;gap:10px;background:#fff;border-top:1px solid #dce5ee}.flow-chapters button{min-height:72px;font-size:16px;white-space:normal;line-height:1.3;padding:16px 10px}.flow-screen{max-height:100%;position:relative}.flow-body{gap:16px}.flow-body p{font-size:16px;line-height:1.65}.flow-answer-actions{display:flex;flex-wrap:wrap;gap:10px}.flow-answer-actions button,.flow-pdf-toolbar button,.flow-pdf-toolbar a{border:1px solid #b7cfc7;background:#fff;padding:12px 15px;border-radius:9px;font:800 14px Nunito,sans-serif;cursor:pointer;color:#1B3252}.flow-answer-actions .is-highlighted{background:#34C3A0;box-shadow:0 0 0 4px #34c3a033}.flow-copied{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:22px 28px;border-radius:14px;background:#1B3252;color:white;font-weight:900;box-shadow:0 20px 60px #1b325260;z-index:5;text-align:center;width:max-content;max-width:90%;animation:none!important}.flow-pdf{height:100%;width:min(750px,100%);display:flex;flex-direction:column;border:1px solid #cad8e3;background:#fff;border-radius:16px;overflow:hidden}.flow-pdf-toolbar{padding:14px;display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px}.flow-pdf-scroll{flex:1;overflow-y:auto;min-height:0;background:#edf2f7}.flow-pdf-scroll img{width:100%;display:block}.flow-real{height:100%;width:100%;position:relative;padding-bottom:76px;min-width:0}.flow-real iframe{width:100%;height:100%;border:1px solid #c4d7cf;border-radius:14px;background:white;pointer-events:none}.flow-annotation{position:absolute;bottom:0;left:0;width:100%;min-height:64px;padding:14px 20px;background:#E8FAF6;border-radius:12px;color:#1B3252;font-size:16px;line-height:1.45}.flow-query{display:inline-block;overflow:hidden;white-space:nowrap;max-width:100%;vertical-align:bottom;animation:flow-type 1.6s steps(25,end) both}.flow-body>*{animation-delay:0ms!important}@keyframes flow-type{from{max-width:0}to{max-width:100%}}
@media(max-width:760px){.connection-stage{height:650px;min-height:650px;padding:14px}.connection-top{height:112px;align-content:center}.connection-top>span{max-width:100%;width:100%;font-size:15px}.connection-top button{min-width:110px}.flow-chapters{grid-template-columns:repeat(2,minmax(0,1fr));padding:12px;gap:8px}.flow-chapters button{min-height:64px;font-size:16px}.flow-body{padding:16px;gap:12px}.flow-body p{font-size:15px;line-height:1.55}.flow-answer-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.flow-answer-actions button{padding:12px 8px;font-size:13px;min-height:46px}.flow-answer-actions button:last-child{grid-column:1/-1}.flow-pdf-toolbar{flex-wrap:wrap;gap:8px}.flow-pdf-toolbar strong{order:3;width:100%}.flow-real{padding-bottom:100px}.flow-annotation{font-size:14px;min-height:88px;padding:14px}.flow-screen header{padding:16px;font-size:15px}.flow-bubble{font-size:15px}}
@media(prefers-reduced-motion:reduce){.flow-query{animation:none}}

.contact-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}#contact-status{line-height:1.6;font-weight:700}.contact button:disabled{opacity:.6;cursor:wait}

.flow-screen{display:flex;flex-direction:column}.flow-screen>header{flex:none}.flow-screen>.flow-body{min-height:0;overflow:auto}.flow-pdf-scroll img{height:auto}@media(max-width:360px){.flow-body{padding:12px;gap:10px}.flow-body p{font-size:14px;line-height:1.45}.flow-result{padding:14px}.flow-answer-actions button{font-size:12px}}

/* School16: connected record details and a matching navy title reveal. */
.sharing-line{text-align:center;grid-template-columns:minmax(0,1fr) 160px minmax(0,1fr);align-items:center}.sharing-line article{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px 16px}.sharing-line article>p{margin-inline:auto}.sharing-arrow{align-self:center}.sharing-arrow small{font-size:13px}
.flow-annotation button{border:0;background:transparent;color:#1B3252;font:800 15px Nunito,sans-serif;cursor:pointer;min-height:40px;padding:4px 8px}.flow-card-target{position:absolute;z-index:3;background:transparent;border:2px solid #34C3A0;border-radius:12px;cursor:pointer;max-width:100%}.flow-card-target span{position:absolute;right:12px;bottom:12px;background:#1B3252;color:#fff;border-radius:50%;width:32px;height:32px;display:grid;place-items:center;font-size:23px;box-shadow:0 0 0 7px #34c3a04d}.flow-task-wipe{position:absolute;inset:0;z-index:8;background:#1B3252;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;animation:task-cover 2s cubic-bezier(.77,0,.175,1) both}.flow-task-wipe strong{font:900 clamp(60px,9vw,125px)/1 Nunito,sans-serif}.flow-task-wipe span{font-size:18px}@keyframes task-cover{0%{clip-path:inset(0 0 100% 0)}30%,85%{clip-path:inset(0)}100%{clip-path:inset(100% 0 0 0)}}
@media(max-width:760px){.sharing-line{grid-template-columns:1fr;gap:16px}.sharing-line article{padding:25px 16px}.sharing-arrow b{transform:rotate(90deg)}.flow-annotation button{font-size:14px}.flow-task-wipe span{font-size:15px}}
@media(prefers-reduced-motion:reduce){.flow-task-wipe{animation:none}}

@keyframes task-cover{0%{clip-path:inset(0 0 100% 0)}30%,100%{clip-path:inset(0)}}.flow-task-uncover{position:absolute;inset:0;background:#1B3252;z-index:8;pointer-events:none;animation:task-uncover .7s cubic-bezier(.77,0,.175,1) both}@keyframes task-uncover{to{clip-path:inset(100% 0 0 0)}}@media(prefers-reduced-motion:reduce){.flow-task-uncover{display:none}}

.flow-card-target.is-clicking span{transform:scale(.8);box-shadow:0 0 0 12px #34c3a055;transition:transform .25s,box-shadow .25s}

/* School17: quiet cursor cue and playback progress above chapter shortcuts. */
.flow-card-target{border:0;background:transparent;box-shadow:none}.flow-card-target:focus-visible{outline:2px solid #1B3252;outline-offset:3px}.flow-card-target span{width:48px;height:48px;right:10px;bottom:10px;background:rgba(52,195,160,.18);box-shadow:none;border-radius:50%;display:grid;place-items:center}.flow-card-target svg{filter:drop-shadow(0 2px 2px #1b325233)}.flow-card-target.is-clicking span{transform:scale(.9);background:rgba(52,195,160,.3);box-shadow:0 0 0 5px #34c3a014;transition:transform .25s,background .25s,box-shadow .25s}.flow-playback{padding:14px 20px 0;background:white;display:flex;gap:14px;align-items:center;height:36px}.flow-playback-state{font-size:12px;font-weight:800;color:#526a7b;min-width:62px}.flow-playback progress{appearance:none;-webkit-appearance:none;display:block;width:100%;height:5px;flex:1;border:0;border-radius:99px;overflow:hidden;background:#e7efed;color:#34C3A0}.flow-playback progress::-webkit-progress-bar{background:#e7efed;border-radius:99px}.flow-playback progress::-webkit-progress-value{background:#34C3A0;border-radius:99px}.flow-playback progress::-moz-progress-bar{background:#34C3A0;border-radius:99px}.flow-playback+.flow-chapters{border-top:0}

/* School18: native touch scrolling and a stable stage selector. */
#sandbox-content{min-width:0;max-width:100%}.demo-pipeline{position:relative;width:100%;max-width:100%;min-width:0;display:flex;flex-direction:row;overflow-x:scroll;overflow-y:hidden;touch-action:pan-x pan-y;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:#8abbb0 #e7efed}.demo-column{flex:0 0 220px;min-width:220px}.demo-board-controls{display:flex;align-items:center;gap:8px;margin:16px 0 0}.demo-board-controls span{margin-right:auto;font-size:12px;color:#526a7b}.demo-board-controls button{width:44px;height:44px;background:#fff;border:1px solid #c8d7e4;border-radius:8px;color:#1B3252;font-size:20px;cursor:pointer}#demo-stage{font-size:16px;max-width:100%}.pocket-answer{white-space:pre-line}