:root{--canvas:#f7f7f2;--paper:#fff;--ink:#192c2b;--teal:#006d6f;--mist:#e5eeea;--muted:#526460;--line:#d4dcd5;--orange:#d96d3a}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:80px}body{margin:0;background:var(--canvas);color:var(--ink);font-family:'Avenir Next',Avenir,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-size:17px;line-height:1.5}a{color:inherit}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--orange);outline-offset:5px}header{height:92px;padding:0 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:9px;text-decoration:none;font-size:25px;font-weight:650;letter-spacing:-1px}.brand-assist{font-weight:400}.brand img{object-fit:contain}nav{display:flex;align-items:center;gap:28px;font-size:14px}nav a{text-decoration:none}.present-trigger{border:1px solid var(--ink);padding:11px 17px;background:transparent;border-radius:6px;font-size:13px}.present-trigger span{margin-left:15px}.chapter{padding:88px 6%;max-width:1600px;margin:auto}.hero{padding-top:56px;padding-bottom:70px;min-height:690px;display:grid;grid-template-columns:1fr 1fr;gap:5%;align-items:center}.event{font-size:13px;line-height:1.8;font-weight:650;position:relative;padding-left:18px}.event span:not(.event-dot){font-weight:400;color:var(--muted)}.event-dot{width:7px;height:7px;border-radius:50%;background:var(--orange);position:absolute;left:0;top:8px}h1,h2,h3,p{margin:0}h1{font-size:clamp(48px,5.5vw,86px);line-height:1.02;letter-spacing:-4px;font-weight:550;margin:32px 0 23px}h2{font-size:clamp(36px,4vw,60px);line-height:1.08;letter-spacing:-2.4px;font-weight:550}h3{font-size:22px;line-height:1.2;letter-spacing:-.6px;font-weight:600}.lead{font-size:23px;line-height:1.35;max-width:430px;letter-spacing:-.6px}.intro{color:var(--muted);max-width:410px;margin:17px 0 28px;font-size:16px}.button{display:inline-flex;gap:30px;align-items:center;justify-content:space-between;padding:14px 22px;border-radius:6px;font-size:14px;font-weight:600;text-decoration:none}.primary{background:var(--teal);color:white}.secondary{border:1px solid var(--teal);color:var(--teal)}.small{font-size:12px;color:var(--muted)}.hero-foot{margin-top:17px}.hero-art{background:#e8eceb;border-radius:120px 120px 10px 10px;overflow:hidden;position:relative;align-self:stretch;display:flex;flex-direction:column;justify-content:center;min-height:540px}.artifact-caption{display:flex;justify-content:space-between;align-items:center;padding:30px 40px 0;font-size:12px;color:var(--muted)}.crosshair{font-size:25px;font-weight:300}.lamp{width:100%;max-height:490px;object-fit:contain;mix-blend-mode:multiply}.artifact-bottom{display:flex;justify-content:space-between;align-items:center;padding:0 35px 30px}.artifact-name{display:block;font-size:18px;letter-spacing:-.4px}.artifact-bottom small{color:var(--muted);font-size:11px}.artifact-bottom svg{width:36px;height:36px;stroke:var(--teal);fill:none;stroke-width:1}.how{border-top:1px solid var(--line)}.section-index{font-size:14px;color:var(--teal);margin-bottom:18px;font-weight:600}.section-heading{display:grid;grid-template-columns:1.5fr 1fr;column-gap:70px;align-items:end}.section-heading>.section-index{grid-column:1/-1}.section-heading>p:last-child{color:var(--muted);font-size:18px;padding-bottom:4px}.workflow{display:grid;grid-template-columns:repeat(3,1fr);gap:35px;margin-top:48px}.step-visual{height:225px;background:var(--mist);border-radius:8px;position:relative;overflow:hidden;margin-bottom:26px}.reference-visual img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}.reference-tag{position:absolute;bottom:16px;left:16px;font-size:11px;background:white;padding:5px 10px;border-radius:4px}.instruction-visual,.check-visual{padding:26px 24px}.example-label{display:block;color:var(--muted);font-size:11px;margin-bottom:20px}.instruction-visual strong{font-size:19px;font-weight:550}.keys{display:flex;align-items:center;gap:8px;margin:14px 0}.keys>span{font-size:10px;color:var(--muted)}kbd{font:14px inherit;background:white;box-shadow:0 2px 0 #bfcac5;border-radius:4px;min-width:27px;text-align:center;padding:5px}.instruction-visual small{font-size:12px;color:var(--muted);line-height:1.5}.check-line{display:flex;align-items:center;gap:11px;font-size:14px;margin:11px 0}.check-line i{font-style:normal;color:var(--teal);font-size:18px}.feedback-example{font-size:14px;background:white;padding:12px 15px;margin-top:15px;border-radius:6px}.feedback-example span{display:block;font-size:10px;color:var(--muted);margin-top:3px}.step-title{display:flex;align-items:baseline;gap:12px;margin-bottom:14px}.step-title>span{font-size:13px;color:var(--teal)}.workflow article>p{font-size:15px;color:var(--muted);max-width:330px}.demo{max-width:none;background:#e8efeb;padding-top:70px;padding-bottom:55px}.demo-heading{display:flex;justify-content:space-between;align-items:end;max-width:1400px;margin:0 auto 36px;gap:35px}.demo-heading>p{color:var(--muted);font-size:16px}.video-shell{max-width:1400px;margin:auto;background:#253532;border-radius:10px;overflow:hidden;box-shadow:0 20px 50px #243b3020}.video-bar{background:#fff;display:flex;justify-content:space-between;align-items:center;padding:13px 19px;font-size:11px;color:var(--muted)}.video-bar i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--teal);margin-right:9px}video{width:100%;display:block;aspect-ratio:1920/1104;background:#333}.demo-caption{max-width:1400px;margin:17px auto 0;font-size:12px;color:var(--muted)}.closing{padding-top:80px;padding-bottom:65px}.closing-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:45px}.closing-top p{font-size:12px;text-align:right;line-height:1.8;color:var(--muted);font-weight:400}.closing-top strong{font-weight:500}.closing-mark{height:65px;width:65px;object-fit:contain}.closing h2{font-size:clamp(42px,5.3vw,78px)}.closing-lead{font-size:20px;color:var(--muted);margin-top:25px}.closing-bottom{display:flex;align-items:center;justify-content:space-between;gap:25px;margin-top:42px;padding-top:28px;border-top:1px solid var(--line)}.closing-bottom strong{font-size:16px}.closing-bottom p{font-size:13px;color:var(--muted);margin-top:7px}.closing details{margin-top:24px;font-size:12px;color:var(--muted);max-width:800px}.closing summary{cursor:pointer}.closing details p{margin-top:10px}footer{border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:25px 5%;font-size:12px;color:var(--muted)}footer .brand{font-size:20px;color:var(--ink)}.presentation-controls{position:fixed;bottom:14px;left:50%;transform:translateX(-50%);z-index:10;align-items:center;gap:15px;background:#fff;border:1px solid var(--line);padding:9px 15px;border-radius:9px;box-shadow:0 4px 30px #192c2b15;white-space:nowrap;font-size:12px}.presentation-controls:not([hidden]){display:flex}.presentation-controls button{border:0;background:transparent;color:var(--teal);font-size:12px;padding:5px}#speaker-notes{position:fixed;left:5%;bottom:78px;width:90%;padding:15px 20px;background:#fff;border:1px solid var(--line);z-index:20;font-size:14px;box-shadow:0 5px 30px #0001}.presenting header{height:65px}.presenting header nav a{display:none}.presenting .chapter{display:none}.presenting .chapter.active{display:block;min-height:0;height:calc(100vh - 120px);padding:30px 6%;overflow:auto;max-width:none}.presenting .hero.active{display:grid}.presenting .hero-art{min-height:0;max-height:100%}.presenting .lamp{max-height:55vh}.presenting .hero h1{font-size:clamp(44px,5.4vw,78px);margin-top:20px}.presenting .hero-foot{display:none}.presenting footer{display:none}.presenting .demo-heading{margin-bottom:18px}.presenting .demo h2{font-size:34px}.presenting .demo .section-index{margin-bottom:6px}.presenting .demo .video-shell{width:min(100%,calc((100vh - 270px)*1.74))}.presenting .demo-caption{text-align:center;font-size:10px;margin-top:10px}.presenting .how .workflow{margin-top:28px}.presenting .step-visual{height:190px;margin-bottom:18px}.presenting .closing-top{margin-bottom:20px}.presenting .closing-bottom{margin-top:25px}.presenting details{display:none}@media(max-width:850px){header{padding:0 5%;height:75px}.brand{font-size:22px}nav{gap:12px}nav a{display:none}.present-trigger{font-size:11px;padding:9px 11px}.chapter{padding:55px 6%}.hero{grid-template-columns:1fr;gap:32px}.hero h1{font-size:61px;letter-spacing:-3px}.hero-art{min-height:0;max-height:570px}.hero-art .lamp{max-height:430px}.section-heading{display:block}.section-heading>p:last-child{margin-top:20px}.workflow{gap:25px;grid-template-columns:1fr}.step-visual{height:240px}.workflow article>p{max-width:none}.demo-heading{display:block}.demo-heading>p{margin-top:20px}.demo h2{font-size:38px}.demo{padding-left:4%;padding-right:4%}.video-bar{font-size:9px;padding:10px}.closing-bottom{align-items:flex-start;flex-direction:column}footer{flex-wrap:wrap;gap:20px}.presentation-controls{gap:8px;max-width:98vw}#timing{display:none}.presenting .hero.active{display:block}.presenting .hero-art{display:none}.presenting .workflow{grid-template-columns:repeat(3,1fr);gap:12px}.presenting .step-visual{display:none}.presenting h3{font-size:17px}.presenting .workflow article>p{font-size:13px}.presenting .chapter.active{padding:25px 5%}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.media-controls{display:flex;align-items:center;gap:14px;background:white;color:var(--ink);padding:12px 17px;font-size:12px}.media-controls button{background:var(--teal);color:white;border:0;border-radius:5px;padding:8px 12px;min-width:94px;font-size:12px}.media-controls input{flex:1;min-width:35px;accent-color:var(--teal);cursor:pointer}.media-controls output{white-space:nowrap;font-variant-numeric:tabular-nums}.media-controls a{color:var(--teal)}#media-status{padding:10px 17px;background:white;color:var(--ink);font-size:12px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.presenting .demo .video-shell{width:min(100%,calc((100vh - 320px)*1.74))}@media(max-width:600px){.media-controls{gap:8px;padding:10px}.media-controls a{display:none}}
