*{box-sizing:border-box} :root{--pink:#ff6fae;--green:#65dba3;--orange:#f69a75;--blue:#a3adf4;--ink:#111117;--muted:#aba8b7}body{margin:0;background:#08080b;color:white;font-family:Arial,Helvetica,sans-serif;overflow:hidden}button{font:inherit;cursor:pointer}#stage{width:1600px;height:900px;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(var(--scale,1));transform-origin:center;overflow:hidden;background:#0c0c11}.slide{position:absolute;inset:0;display:none;padding:64px 76px 106px;overflow:hidden}.slide.active{display:block}.slide.light{background:#f4f3f1;color:#151519}.slide.pink{background:var(--pink);color:#151519}.slide h1{font-size:104px;line-height:1.02;letter-spacing:-5px;margin:40px 0 24px;max-width:1300px}.slide h2{font-size:60px;line-height:1.08;letter-spacing:-2.4px;margin:10px 0 38px}.slide h3{font-size:30px;line-height:1.15;margin:0 0 15px}.slide p{font-size:26px;line-height:1.4;margin:12px 0;color:var(--muted)}.light p,.pink p{color:#62616b}.eyebrow{font:17px Menlo,monospace;letter-spacing:3px;text-transform:uppercase;color:var(--pink);margin-bottom:18px}.pink .eyebrow,.light .eyebrow{color:#8c325a}.accent{color:var(--pink)}.light .accent{color:#9c3062}.foot{position:absolute;bottom:0;left:0;right:0;height:64px;background:#000;display:flex;align-items:center;justify-content:space-between;padding:0 48px;color:#fff}.brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:23px}.brand img{width:30px;height:30px;object-fit:contain}.brand sup{font-size:10px;align-self:flex-start;margin-top:10px}.page{font:15px Menlo,monospace;color:#aaa}.mark{width:46px;height:46px;object-fit:contain;vertical-align:middle;margin-right:13px}.row{display:flex;gap:32px}.row>*{flex:1;min-width:0}.node{border:1.5px solid #494653;border-radius:10px;padding:24px 28px;background:#1c1b24;position:relative}.node h3{font-size:27px}.node p{font-size:21px;margin:4px 0}.node.swift{border-color:#cf728f;background:#342330}.node.android{border-color:#929ce2;background:#25283e}.node.shared{border-color:#5bc6b3;background:#153c34}.node.infra{border-color:#737c98;background:#242833}.node.bridge{border-color:#dca152;background:#3a2a13}.node .mark{width:30px;height:30px}.light .node{color:white}.connector{height:54px;display:flex;align-items:center;justify-content:center;position:relative;color:#aaa;font:17px Menlo,monospace}.connector:before{content:'';height:100%;border-left:2px solid #85818f;position:absolute;left:50%;top:0}.connector:after{content:'';position:absolute;bottom:0;left:calc(50% - 6px);border-left:7px solid transparent;border-right:7px solid transparent;border-top:10px solid #85818f}.connector span{position:relative;margin-left:250px;background:#0c0c11;padding:4px 10px}.diagram{padding:25px;border:1px solid #37333e;border-radius:16px;background:#14131b}.diagram .row{gap:32px}.diagram .smallgap{gap:16px}.diagram .node{padding:17px 24px}.diagram h3{font-size:25px;margin-bottom:8px}.diagram p{font-size:20px}.diagram .subnodes{display:flex;gap:16px;margin-top:18px}.subnodes div{flex:1;background:#191820;padding:14px 18px;border-radius:5px;font-size:22px}.seam{margin:15px 0;border-top:1px dashed #635b70;text-align:center;font:14px Menlo,monospace;letter-spacing:3px;color:#a8a0b4;padding-top:9px}.frameworks{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:45px}.framework{background:#1b1a23;border:1px solid #3c384a;border-radius:22px;padding:34px;min-height:465px;display:flex;flex-direction:column;transition:transform .4s,border-color .4s}.framework:hover{transform:translateY(-8px);border-color:var(--pink)}.framework .mark{height:65px;width:65px;margin-bottom:30px}.framework h3{font-size:34px}.framework p{font-size:23px}.framework dl{margin-top:auto;margin-bottom:0;border-top:1px solid #47414f;padding-top:18px}.framework dt{font:14px Menlo,monospace;text-transform:uppercase;color:#b8afc3;letter-spacing:1px;margin-top:14px}.framework dd{margin:8px 0 0;font-size:23px}.framework.selected{border-color:var(--pink);background:linear-gradient(145deg,#382331,#1b1a23)}.caption{margin-top:25px!important;font-size:23px!important}.hero{font-size:116px!important;max-width:1350px!important;margin-top:130px!important}.portrait{display:flex;align-items:center;gap:20px;position:absolute;bottom:119px}.portrait img{height:88px;width:88px;border-radius:50%;object-fit:cover}.portrait h3{font-size:26px;margin:0}.portrait p{font-size:20px}.screens{height:550px;display:flex;justify-content:center;gap:90px;margin-top:22px}.screens figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:15px}.screens img{height:480px;width:auto;border:2px solid var(--pink);border-radius:16px;box-shadow:0 25px 55px #0008}.screens figcaption{font-size:22px}.codegrid{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-top:60px}.codepanel{border:1px solid #d1cbd1;border-radius:14px;overflow:hidden;background:white}.codehead{padding:21px 28px;background:#e8e5e9;font-size:24px;font-weight:bold}.codehead img{width:30px;height:30px}.codepanel pre{font:23px/1.75 Menlo,monospace;padding:27px;white-space:pre-wrap;margin:0;color:#282633}.kw{color:#a52d75}.type{color:#375caf}.fn{color:#8b520d}.comment{color:#85818e}.statements{margin-top:50px}.statement{display:grid;grid-template-columns:310px 1fr;gap:35px;padding:26px 0;border-top:1px solid #48434e}.statement strong{font-size:30px}.statement span{font-size:28px;color:#aaa5b5}.light .statement{border-color:#d5cfd7}.light .statement span{color:#65616b}.pipeline{display:flex;align-items:stretch;gap:0;margin-top:100px}.pipeline .node{flex:1}.h-arrow{width:66px;flex-shrink:0;display:flex;justify-content:center;align-items:center;font-size:38px;color:#a59aaf}.giant{font-size:160px!important;letter-spacing:-8px!important}.step{opacity:0;transform:translateY(18px);transition:opacity .65s ease,transform .65s cubic-bezier(.2,.7,.2,1)}.active .step.shown{opacity:1;transform:none}.slide.active h2{animation:enter .6s both}.slide.active .connector:before{animation:line .85s both;transform-origin:top}@keyframes enter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes line{from{transform:scaleY(0)}to{transform:scaleY(1)}}nav{position:fixed;bottom:12px;right:18px;z-index:10;display:flex;gap:5px;opacity:0;transition:opacity .2s}nav:hover,nav:focus-within,body.controls nav{opacity:1}nav button{background:#25222b;color:white;border:1px solid #62586c;padding:9px 13px;border-radius:6px}#speaker{position:fixed;right:20px;top:20px;width:430px;max-height:75vh;overflow:auto;z-index:30;background:#fff;color:#222;padding:25px;box-shadow:0 8px 60px #000b;font-size:18px;line-height:1.5;border-radius:12px}#grid{position:fixed;inset:0;background:#111018;z-index:20;overflow:auto;padding:45px;grid-template-columns:repeat(4,1fr);gap:15px}#grid:not([hidden]){display:grid}#grid button{text-align:left;background:#26212e;color:#fff;padding:24px;border:1px solid #59465b;font-size:20px;min-height:125px}#grid button.current{border-color:var(--pink)}@media(prefers-reduced-motion:reduce){*,*:before{animation:none!important;transition:none!important}}@media print{body{overflow:visible;background:white}#stage{position:static;width:auto;height:auto;transform:none}.slide{display:block!important;position:relative;width:1600px;height:900px;break-after:page;print-color-adjust:exact}.step{opacity:1;transform:none}nav,#speaker,#grid{display:none!important}@page{size:1600px 900px;margin:0}}
/* Architecture keeps connectors aligned with the platform that owns the call. */
.slide[data-index="13"] .diagram{padding:20px 25px}
.slide[data-index="13"] .connector{height:30px}
.slide[data-index="13"] .diagram>.step:nth-child(3) .row>div:first-child .connector{height:128px;position:absolute;width:100%}
.slide[data-index="13"] .diagram>.step:nth-child(3) .row>div:first-child{position:relative}
.slide[data-index="13"] .diagram>.connector:nth-child(4):before{left:75%}
.slide[data-index="13"] .diagram>.connector:nth-child(4):after{left:calc(75% - 6px)}
.slide[data-index="13"] .diagram .node{padding:14px 24px}
.slide[data-index="13"] .diagram .subnodes{margin-top:12px}
