/* The chart is the whole stage. These rules cannot change the earlier journey. */
.chapter-flight #notebook { display:block; min-height:calc(100svh - 76px); padding:48px 0 180px; perspective:1600px; }
.chapter-flight #world { position:absolute; inset:0; width:100%; height:100%; min-height:100%; background:#dfd0a8; }
.chapter-flight #writing { width:min(620px,calc(100% - 48px)); min-height:0; margin:0 auto; padding:34px 44px; background:linear-gradient(92deg,#f7ebce,#fff7df 48%,#d8c6a44a 50%,#fcf0d5 52%); border:1px solid #9c7d4b70; box-shadow:5px 12px 24px #332a2340,inset 0 0 50px #b7984b12; transform-origin:50% 100%; pointer-events:auto; }
.chapter-flight #writing::before { content:''; position:absolute; width:58px; height:18px; background:#d9c18770; top:-8px; left:calc(50% - 29px); rotate:-4deg; border-inline:1px dashed #a5885d44; }
.chapter-flight #writing h1 { font-size:clamp(32px,3.2vw,46px); }
.chapter-flight #writing .question { font-size:21px; }
.chapter-flight #writing .concept { font-size:15px; }
.chapter-flight .footbar { z-index:12; background:#f4e8ceee; bottom:0; left:0; right:0; padding:12px 3vw; }
.chapter-flight #ink,.chapter-flight #landscape,.chapter-flight #stir,.chapter-flight #stage-caption,.chapter-flight #definition { display:none; }
.flight-world { position:absolute; inset:0; overflow:hidden; }
.flight-map { position:absolute; inset:-15%; background:url('assets/notebook/flight-chart.png') center/100% 100%; transform-origin:center; }
.flight-route { position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.flight-route path { fill:none; stroke:#244f7b; stroke-width:2; stroke-dasharray:7 8; }
.flight-route .travel-line { stroke:#a65028; stroke-width:3; stroke-dasharray:none; }
.flight-pins { position:absolute; inset:0; pointer-events:none; }
.flight-pin { pointer-events:auto; position:absolute; transform:translate(-50%,-50%) rotate(-4deg); max-width:160px; padding:8px 12px; background:#fbefcd; border:1px solid #846139; box-shadow:2px 5px 6px #3c2b2733; font:italic 16px Georgia,serif; }
.flight-pin::before { content:''; position:absolute; top:-6px; left:50%; width:9px; height:9px; border-radius:50%; background:#244f7b; box-shadow:1px 2px 2px #35251580; }
.flight-pin[aria-current=step] { background:#244f7b; color:#fff3d7; }
.flight-pin:hover { rotate:3deg; }
.flight-invitation { position:absolute; left:50%; top:38%; transform:translate(-50%,-50%) rotate(-7deg); width:min(380px,80%); padding:40px 30px; background:linear-gradient(90deg,#dfcda3,#fff3cf 48%,#b4a17b 50%,#f2dfb7 53%); border:1px solid #a08450; box-shadow:12px 20px 25px #362d2755; z-index:6; }
.flight-invitation span { display:block; font-size:36px; margin:12px 0; }
.flight-invitation small { display:block; font:15px/1.5 system-ui,sans-serif; }
.chapter-flight.chart-folded #writing { visibility:hidden; }
.chapter-flight .flying-machine { z-index:4; width:220px; height:148px; }
.chapter-flight .machine-rig { transform:scale(.22); }
.flight-caption { position:absolute; bottom:80px; left:15%; right:15%; text-align:center; font:italic 20px/1.4 Georgia,serif; color:#453b2e; pointer-events:none; }
.flight-paper-tab { display:block; margin:-18px auto 18px; background:none; border:0; border-bottom:1px dashed #9b7950; padding:8px; font:italic 14px Georgia,serif; }
.chapter-flight .bench-quiz { border:0; padding:0; margin:24px 0; }
.chapter-flight .quiz-option { display:block; width:100%; text-align:left; margin:8px 0; padding:12px; background:#fff7df; border:1px solid #a38b67; }
.chapter-flight .bench-feedback { font:16px/1.5 system-ui,sans-serif; color:#244f7b; }
.chapter-flight .smart-summary { font:15px/1.6 system-ui,sans-serif; }
.chapter-flight .goal-pair section { padding:12px 0; border-top:1px solid #98774d; }
.chapter-flight h2 { font-size:23px; font-weight:normal; }
.chapter-flight .plan-list { padding-left:24px; }
.chapter-flight .plan-step { margin:24px 0; padding-bottom:20px; border-bottom:1px dashed #98774d; overflow-wrap:anywhere; }
.chapter-flight .plan-revise button { margin-right:18px; }
.chapter-flight .plan-status { color:#244f7b; }
.flight-world[hidden],.flight-invitation[hidden] { display:none; }
@media(max-width:740px) {
  .chapter-flight #notebook { padding:160px 0 170px; }
  .chapter-flight #writing { width:calc(100% - 32px); padding:28px 22px; }
  .chapter-flight .flying-machine { width:150px; height:100px; }
  .chapter-flight .machine-rig { transform:scale(.15); }
  .flight-pin { max-width:110px; font-size:13px; padding:7px; }
  .flight-caption { left:8%; right:8%; font-size:17px; }
  .chapter-flight .footbar { flex-wrap:wrap; font-size:10px; }
}
@media(prefers-reduced-motion:reduce) { .flight-pin:hover { rotate:0deg; } }

/* The chart opens into different working objects, rather than a repeated card. */
.flight-apparatus { position:absolute; inset:0; pointer-events:none; }
.flight-apparatus button { pointer-events:auto; }
.flight-apparatus .live-bearing { overflow-wrap:anywhere; }
.chapter-flight:not([data-flight-scene=chart]):not([data-flight-scene=dispatch]) #notebook { padding-top:285px; }
.chapter-flight[data-flight-scene=destination] #writing { width:min(660px,calc(100% - 40px)); border-left:6px solid #244f7b; rotate:-1deg; }
.destination-pin { position:absolute; left:50%; top:65px; width:230px; min-height:95px; transform:translateX(-50%) rotate(-5deg); background:#244f7b; border:2px solid #c0a776; color:#fff2d2; padding:18px; box-shadow:4px 9px 6px #35281f44; font:italic 14px Georgia; touch-action:none; }
.destination-pin::after { content:''; position:absolute; width:2px; height:65px; left:50%; top:100%; background:#483c2c; }
.destination-pin .live-bearing { display:block; margin-top:9px; font-size:20px; max-height:90px; overflow:auto; }
.destination-pin.alternate { left:60%; }
.dispatch-stack { position:absolute; top:150px; left:8%; width:140px; height:200px; }
.dispatch-sheet { position:absolute; inset:0; transform:translate(calc(var(--sheet)*5px),calc(var(--sheet)*8px)) rotate(calc(var(--sheet)*-3deg)); transform-origin:50% 110%; border:1px solid #957a4d; background:linear-gradient(125deg,#fff5d8,#e5ce9e); text-align:left; padding:10px; color:#785538; font:italic 24px Georgia; box-shadow:2px 4px 7px #3c2b2625; }
.dispatch-sheet.current { border-bottom:5px solid #244f7b; }
.dispatch-sheet:hover { translate:-25px -10px; }
.chapter-flight[data-flight-scene=dispatch] #writing { rotate:1deg; border-bottom:6px double #91754f; }
.chapter-flight[data-flight-scene=measure] #writing { width:min(780px,calc(100% - 48px)); padding:28px 50px; background:repeating-linear-gradient(0deg,#fff4d9 0 33px,#b39c6925 34px,#fff4d9 35px); box-shadow:0 10px 15px #59432d33; }
.flight-ruler { position:absolute; top:115px; left:12%; width:76%; height:65px; background:repeating-linear-gradient(90deg,transparent 0 19px,#6d533c 20px,transparent 21px),linear-gradient(#e4c988,#f1d9a4); border:1px solid #806342; box-shadow:4px 9px 9px #39271d33; rotate:-2deg; }
.ruler-from,.ruler-to { position:absolute; top:-35px; font:italic 17px Georgia; }
.ruler-from { left:0; }.ruler-to { right:0; }
.flight-ruler .live-bearing { position:absolute; left:15%; top:75px; width:70%; text-align:center; font:italic 19px/1.4 Georgia; max-height:80px; overflow:hidden; }
.flight-luggage { position:absolute; top:18px; left:50%; width:300px; height:245px; transform:translateX(-50%); }
.flight-luggage img { width:100%; height:100%; object-fit:contain; mix-blend-mode:multiply; }
.flight-luggage .live-bearing { position:absolute; left:20%; top:100px; width:60%; background:#f8ebcc; border:1px solid #866640; padding:9px; font:italic 15px/1.3 Georgia; max-height:85px; overflow:auto; rotate:-5deg; }
.load-checks { display:flex; position:absolute; top:230px; left:-50px; right:-50px; justify-content:center; gap:10px; }
.load-check { padding:8px 14px; background:#f7e9c6; border:1px solid #977749; font:italic 16px Georgia; box-shadow:2px 3px 4px #5b442f33; }
.chapter-flight[data-flight-scene=load] #notebook { padding-top:325px; }
.chapter-flight[data-flight-scene=load] #writing { border-radius:5px 5px 24px 5px; background:#f6e9ca; border:1px dashed #916844; box-shadow:10px 10px 0 #bc985b44; }
.flight-compass { position:absolute; top:30px; left:50%; width:235px; height:235px; transform:translateX(-50%); border:3px double #8b693d; border-radius:50%; background:repeating-conic-gradient(from 0deg,#9b743800 0 14deg,#9b743844 14deg 15deg),radial-gradient(circle,#fff4d433 55%,#bc935746 56%,transparent 60%); }
.flight-compass::before,.flight-compass::after { content:''; position:absolute; inset:25px; border:1px solid #8b693d; rotate:45deg; }
.flight-compass::after { rotate:0deg; }
.compass-needle { position:absolute; left:calc(50% - 9px); top:18%; width:18px; height:65%; background:linear-gradient(#244f7b 50%,#956630 50%); clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%); }
.compass-value { position:absolute; left:50%; top:50%; transform:rotate(var(--bearing)) translateY(-110px) rotate(calc(-1 * var(--bearing))) translateX(-50%); background:#f9ecca; border:1px solid #947749; padding:6px 12px; max-width:170px; text-align:center; font:italic 16px Georgia; z-index:2; }
.compass-empty { position:absolute; top:80px; left:25px; right:25px; text-align:center; font-style:italic; z-index:3; background:#f4e5c6dd; }
.chapter-flight[data-flight-scene=compass] #writing { background:#fff4d0; border-top:4px double #ae8850; }
.flight-clock { position:absolute; left:50%; top:8px; width:270px; height:240px; transform:translateX(-50%); }
/* Keep the existing clock drawing; clip away its baked-in white square. */
.clock-art { position:absolute; left:50%; width:240px; height:240px; transform:translateX(-50%); object-fit:contain; clip-path:circle(46.3% at 50% 49.5%); mix-blend-mode:multiply; }
.clock-hand { position:absolute; left:50%; top:30%; width:2px; height:47px; transform-origin:50% 100%; background:#553d25; }
.flight-clock .live-bearing { position:absolute; bottom:-20px; left:-40px; right:-40px; text-align:center; font:italic 19px Georgia; max-height:50px; overflow:hidden; }
.chapter-flight[data-flight-scene=time] #writing { border-top:16px solid #244f7b; background:linear-gradient(0deg,#f8edce,#fff7df); }
.flight-tickets { position:absolute; top:45px; left:50%; width:min(570px,85%); transform:translateX(-50%); display:flex; justify-content:center; gap:20px; }
.flight-ticket { width:46%; height:180px; padding:22px; background:#244f7b; color:#fff2d1; border:3px double #d9ba7f; rotate:-5deg; font:20px Georgia; box-shadow:4px 12px 10px #30251e55; }
.flight-ticket + .flight-ticket { background:#694d30; rotate:7deg; }
.flight-ticket small { display:block; font:italic 16px/1.5 Georgia; margin-top:10px; overflow:hidden; max-height:82px; }
.chapter-flight[data-flight-scene=passport] #writing { border:6px double #aa8955; }
.chapter-flight[data-flight-scene=route] #writing { background:#faf0d8e8; border-top:0; box-shadow:0 10px 12px #46382925; }
.chapter-flight[data-flight-scene=route] .flight-pins,.chapter-flight[data-flight-scene=route] .flight-route { display:none; }
.route-stops { position:absolute; top:70px; left:12%; right:12%; display:flex; align-items:center; gap:28px; overflow-x:auto; padding:20px 10px; border-bottom:3px dashed #244f7b; pointer-events:auto; }
.route-stop { flex:0 0 170px; min-height:100px; padding:14px; border:1px solid #987847; background:#f9edc9; box-shadow:3px 6px 7px #4c35242a; font:18px/1.4 Georgia; cursor:grab; rotate:-3deg; }
.route-gap { font:italic 22px Georgia; margin:auto; }
.flight-weather { position:absolute; top:35px; left:50%; width:min(530px,75%); min-height:135px; transform:translateX(-50%); border-radius:50% 40% 45% 30%; background:radial-gradient(ellipse at 20% 40%,#adb8bba6,transparent 50%),radial-gradient(ellipse at 60% 20%,#5e767bae,transparent 70%); border-bottom:1px dashed #6c7c81; padding:25px 55px; }
.weather-words { text-align:center; color:#263b45; font:italic 20px/1.4 Georgia; max-height:90px; overflow:auto; }
.chapter-flight[data-flight-scene=weather] #writing { rotate:1deg; border-left:4px solid #6c7c81; }
.flight-wind { position:absolute; top:90px; left:22%; right:22%; }
.flight-wind i { display:block; margin:14px; height:24px; border-top:2px solid #657d7c; border-radius:50%; transform:skewX(-20deg); }
.flight-wind i:nth-child(2) { width:65%; margin-left:20%; }
.chapter-flight[data-flight-scene=wind] #writing { rotate:-1deg; border-right:4px solid #829c94; }
.flight-letter { border:1px solid #b59867; background:linear-gradient(150deg,#fdf4db 48%,#d4bf8e 49%,#fcf0d1 50%); padding:16px 20px; margin:20px 0; box-shadow:2px 4px 4px #7c63351a; }
.flight-letter summary { cursor:pointer; font-size:19px; }
.flight-letter[open] { background:#fff5dc; }
.chapter-flight[data-flight-scene=letters] #notebook { padding-top:45px; }
.chapter-flight[data-flight-scene=letters] #writing { background:transparent; border:0; box-shadow:none; }
.purpose-ticket { position:absolute; top:85px; left:50%; transform:translateX(-50%) rotate(-8deg); width:300px; padding:32px; border:3px double #8e6c46; background:#f7e7bd; text-align:center; letter-spacing:.14em; }
.packed-skill { position:absolute; top:calc(40px + var(--packed)*22px); left:calc(17% + var(--packed)*2%); padding:6px 12px; max-width:180px; background:#244f7b; color:#fff2d2; border:1px solid #b99b61; font:15px Georgia; rotate:-7deg; }
.chapter-flight[data-flight-scene=crew] #writing { border-top:3px solid #9f7234; }
.chapter-flight[data-flight-scene=supplies] #writing { border-bottom:8px double #9f7234; }
.problem-branches { position:absolute; top:180px; left:20%; right:20%; display:flex; gap:10px; }
.problem-branch { flex:1; padding:10px 7px; border-top:2px dashed #8d704c; font:italic 14px/1.4 Georgia; transform:rotate(calc((var(--branch) - 2)*3deg)); max-height:80px; overflow:auto; }
.problem-branch.developed { border-top:3px solid #244f7b; color:#244f7b; }
.flight-apparatus[data-problem-stage="0"] .problem-branches { opacity:.3; }
.flight-apparatus[data-problem-stage="4"] .problem-branches { border:1px solid #244f7b; padding:5px; }
.flight-apparatus[data-problem-stage="5"] .problem-branches { border-bottom:3px double #244f7b; }
.chapter-flight[data-flight-scene=problem] #writing { border-bottom:3px dashed #8d704c; }
.recall-envelope { padding:12px 0; border-top:1px dashed #a68d60; margin-top:20px; font:16px Georgia; }
.recall-envelope summary { cursor:pointer; }
.arrival-journal { position:absolute; z-index:8; left:50%; top:310px; transform:translateX(-50%); width:min(600px,90%); max-height:500px; overflow:auto; padding:30px; border:3px double #9b7748; background:#fff1d2; pointer-events:auto; }
.arrival-journal p { white-space:pre-wrap; overflow-wrap:anywhere; font:18px/1.5 Georgia; }
.arrival-journal[hidden] { display:none; }
.chapter-flight.flight-landed #writing { visibility:hidden; }
.chapter-flight.flight-landed .flight-luggage { width:380px; height:300px; }
@media(max-width:740px) {
  .chapter-flight:not([data-flight-scene=chart]):not([data-flight-scene=dispatch]) #notebook { padding-top:355px; }
  .flight-apparatus { top:100px; }
  .dispatch-stack { top:20px; left:5%; width:60px; height:90px; }
  .dispatch-sheet { font-size:15px; }
  .chapter-flight[data-flight-scene=measure] #writing { padding:25px; }
  .flight-tickets { gap:12px; }.flight-ticket { padding:15px; }
  .flight-weather { padding:20px; }
  .problem-branches { left:5%; right:5%; }
  .route-stops { left:6%; right:6%; }
  .packed-skill { left:2%; max-width:120px; font-size:12px; }
  .chapter-flight[data-flight-scene=letters] #notebook { padding-top:145px; }
}

/* Finale: the whole screen is the keepsake collection, not another question card. */
.open-case-cutout { mask-image:url('assets/notebook/suitcase-open-silhouette.svg'); mask-size:100% 100%; mask-repeat:no-repeat; }
.chapter-flight.flight-landed #notebook { height:calc(100svh - 76px); min-height:600px; padding:0; }
.chapter-flight.flight-landed #world { height:100%; }
.chapter-flight.flight-landed #writing { display:none; }
.chapter-flight.flight-landed .flight-apparatus { top:0; }
.chapter-flight.flight-landed .flight-luggage { position:absolute; top:auto; bottom:15px; left:50%; width:330px; height:auto; aspect-ratio:1312 / 1199; z-index:5; }
.chapter-flight.flight-landed .flight-luggage img { width:100%; height:100%; object-fit:fill; }
.chapter-flight.flight-landed .live-bearing,.chapter-flight.flight-landed .flight-caption { display:none; }
.chapter-flight.flight-landed .flying-machine.arrival-parked { visibility:hidden; }
.arrival-journal { position:absolute; inset:0; width:100%; max-height:none; transform:none; padding:20px 35px 90px; border:0; background:transparent; overflow-y:auto; scrollbar-gutter:stable; pointer-events:none; }
.chapter-flight .arrival-heading { position:relative; z-index:3; margin:4px auto 28px; max-width:850px; text-align:center; color:#254f65; font:italic clamp(30px,3.8vw,51px)/1.14 Georgia,serif; text-shadow:0 2px 15px #fff9df; }
.keepsake-wall { display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:22px 25px; align-items:start; padding:12px 3px 240px; }
.keepsake-scrap { position:relative; pointer-events:auto; min-height:118px; max-height:200px; padding:18px 16px; color:#49341f; background:linear-gradient(112deg,#fff4ca,#f5e4b4); border:0; border-bottom:2px solid #b79b6590; box-shadow:3px 7px 9px #48352038; transform:rotate(var(--tilt)); text-align:left; cursor:pointer; }
.keepsake-scrap:nth-child(3n) { background:#f0e1bb; }
.keepsake-scrap:nth-child(4n) { border-radius:0 0 28px 0; }
.keepsake-scrap:hover,.keepsake-scrap:focus-visible { z-index:6; transform:rotate(0deg) scale(1.06); }
.scrap-label { display:block; margin-bottom:10px; font:12px/1.3 system-ui,sans-serif; color:#78623e; }
.scrap-words { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:5; overflow:hidden; white-space:pre-wrap; overflow-wrap:anywhere; font:italic 18px/1.35 Georgia,serif; }
.keepsake-value { background:#244f7b!important; color:#fff3cf; }
.keepsake-value .scrap-label { color:#dac597; }
.keepsake-value .scrap-words { font-size:clamp(21px,1.9vw,27px); }
.keepsake-goal { border-top:3px solid #af6933; }
.keepsake-skill { border-left:4px solid #477e78; }
.arrival-controls { position:fixed; bottom:44px; left:50%; transform:translateX(-50%); display:flex; justify-content:center; gap:20px; width:max-content; max-width:95%; padding:6px 16px; background:#f8ebcced; z-index:10; pointer-events:auto; }
.arrival-controls button,.arrival-controls a { white-space:nowrap; }
.keepsake-dialog { width:min(640px,92vw); max-height:85svh; border:2px solid #a88b55; background:#fff1ce; color:#49341f; padding:25px 35px; }
.keepsake-dialog::backdrop { background:#302b2466; }
.keepsake-words { white-space:pre-wrap; overflow-wrap:anywhere; font:20px/1.6 Georgia,serif; }
@media(max-width:740px) {
  .chapter-flight.flight-landed #notebook { height:calc(100svh - 100px); min-height:600px; padding:0; }
  .arrival-journal { padding:20px 18px 95px; }
  .keepsake-wall { grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px 14px; }
  .keepsake-scrap { padding:13px 11px; }
  .scrap-words { font-size:16px; }
  .keepsake-value .scrap-words { font-size:23px; }
  .chapter-flight.flight-landed .flight-luggage { width:250px; }
  .arrival-controls { gap:6px 12px; bottom:58px; flex-wrap:wrap; width:90%; }
  .arrival-controls button,.arrival-controls a { font-size:12px; }
}