/* A hands-on tour. The leader is projected from actual CAD parts every frame. */
header nav{margin-left:auto;gap:32px}.nav span{display:none}
.workspace{padding:24px 26px;background:#f7f7f0}.workspace-top{margin-bottom:21px}.workspace-top .eyebrow{color:#818b73}
.tour-card{padding-bottom:24px;margin-bottom:23px;border-bottom:1px solid #d7ddcb;position:relative;opacity:.6;transform:translateY(5px);transition:opacity .45s,transform .45s}.tour-card.entered{opacity:1;transform:none}
.tour-meta{display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:1px;color:#8e977f}.tour-meta strong{font-weight:500;color:#778565}
.tour-card h2{font-weight:400;font-size:25px;line-height:1.4;letter-spacing:-.7px;margin:18px 0 13px}.tour-card>p{font-size:12px;line-height:1.95;margin:0;color:#657456}

.tour-note{font-size:10px!important;color:#939b87!important;line-height:1.7!important}.tour-actions{display:flex;gap:12px;align-items:center;margin-top:17px;min-height:30px}.tour-actions #tourNext{padding:10px 15px;background:#556540;color:#f7f4e6;font-size:11px;border-radius:3px;text-align:left;flex:1}.tour-actions #tourWait{font-size:10px;color:#90997f;flex:1}.tour-actions #tourFocus{font-size:10px;color:#6f7e5e;white-space:nowrap}.tour-skip{margin:12px 0 0;padding:0;font-size:9px;color:#9ba28e;text-decoration:underline;text-underline-offset:3px}.tour-progress{height:2px;background:#e1e5d8;margin-top:19px}.tour-progress i{display:block;height:2px;background:#9ca77c;transition:width .6s}
body[data-tutorial='active'] .intro,body[data-tutorial='active'] .orbit-hint,body[data-tutorial='active'] .recipe-row{display:none}
body[data-tutorial='active'] .reset-row{display:none}
body[data-tutorial='active'] .stage-bottom{bottom:23px}
body[data-tutorial='active'] .ingredient{min-height:118px}.ingredient.guide-item{border-color:#869b5e;background:#f4f4e6;box-shadow:0 0 0 3px #b6c39936;animation:inventory-invite 2.4s ease-in-out infinite}.ingredient.guide-item .slot-status{color:#6c7e4a}
@keyframes inventory-invite{50%{box-shadow:0 0 0 6px #b6c39916}}
#guideOverlay{position:fixed;inset:0;width:100%;height:100%;z-index:11;pointer-events:none;overflow:visible}#guideLine{stroke:#a2ad83;stroke-width:1.2;fill:none;opacity:.8}#guideRing{r:13;stroke:#9aa676;stroke-width:1;fill:#fff9df18;animation:guide-ring 2.4s ease-in-out infinite}#guideDot{r:3;fill:#f8f2d4;stroke:#78865d;stroke-width:1}#guideTargetLabel{position:fixed;font-size:10px;padding:7px 10px;border:1px solid #ccd3b8;background:#faf9eceb;color:#66754e;pointer-events:none;z-index:12;border-radius:3px;white-space:nowrap}
@keyframes guide-ring{50%{stroke-opacity:.5;r:19}}
.phase-status{margin:19px 0 25px;padding:18px 0;border-top:1px solid #d9dece;border-bottom:1px solid #d9dece}.phase-status header{margin:0 0 13px;height:auto;border:0;display:flex;align-items:center;justify-content:space-between;gap:12px}.phase-status strong{font-size:14px;font-weight:500}.phase-status small{font-size:8px;letter-spacing:.7px;color:#919b80}.phase-status p{font-size:10px;line-height:1.85;color:#869176;margin:8px 0}.phase-status p>span{font-size:8px;letter-spacing:1px;color:#a1a88f;display:block}.phase-status p>b{font-weight:400}.phase-status .phase-dots{display:flex;gap:9px;margin:13px 0 4px}.phase-dots i{width:6px;height:6px;border-radius:50%;background:color-mix(in srgb,var(--lamp-color) calc(var(--lamp-level)*100%),#7e8766);box-shadow:0 0 calc(var(--lamp-level)*8px) var(--lamp-color)}
.free-card h2{font-size:25px;font-weight:400;margin:6px 0 12px}.free-card p{font-size:11px;color:#89957b;line-height:1.9;margin-bottom:23px}.transport{display:flex;align-items:center;justify-content:space-between;gap:9px;margin-bottom:18px}.transport button,.transport select{font-size:10px;border:1px solid #d1d8c2;padding:8px;border-radius:3px;background:#f0f3e7}.reset-row{padding-top:18px;border-top:1px solid #d7ddcb;margin-top:23px}#replayTour{margin:22px 0;padding:10px 0;border-bottom:1px solid #a5b18d;font-size:11px}.recipe-row{margin-bottom:20px}#extras .ingredient{min-height:55px!important}.stage[data-view='speaker'] .intro,.stage[data-view='release'] .intro,.stage[data-view='fill'] .intro,.stage[data-view='openLid'] .intro{display:none}
@media(max-height:800px) and (min-width:761px){.workspace{padding-top:19px}.workspace-top{margin-bottom:14px}.tour-card{padding-bottom:16px;margin-bottom:16px}.tour-card h2{font-size:23px;margin:12px 0 9px}.tour-card>p{font-size:11px}.tour-actions{margin-top:12px}.tour-progress{margin-top:13px}body[data-tutorial='active'] .ingredient{min-height:105px;padding:8px}.ingredient .icon,.ingredient .icon svg{width:42px;height:46px}.tour-meta{font-size:9px}.tour-note{font-size:9px!important}.tour-skip{margin-top:8px}}
@media(max-width:760px){.stage{height:51vh;min-height:330px}.workspace{padding:20px 24px;overflow:visible}.workspace-top{margin-bottom:10px}.tour-card{padding-bottom:16px;margin-bottom:18px}.tour-card h2{font-size:24px;margin:10px 0}.tour-card>p{font-size:12px}.tour-actions{margin-top:12px}.tour-note{font-size:9px!important}body[data-tutorial='active'] .ingredient{min-height:120px}.phase-status{margin-top:16px}.view-tools{bottom:45px}.tour-progress{margin-top:12px}#guideLine{opacity:.4}}
@media(prefers-reduced-motion:reduce){#guideRing,.ingredient.guide-item{animation:none}.tour-card{transition:none}}
.tour-card.travelling{opacity:0;transform:translateX(28px);pointer-events:none}.tour-card.entered{opacity:1;transform:translateX(0)}
/* Camera-led teaching motion is explicitly requested for this prototype. */
body[data-tutorial='active'] .tour-card{transition:opacity .45s ease,transform .55s cubic-bezier(.22,.7,.2,1)!important}
body[data-tutorial='active'] .tour-progress i{transition:width .6s ease!important}

/* Poetry appears at the beginning, during the quiet stages and at release. */
.workspace-top{justify-content:flex-end}body[data-panel='explore'] .workspace-top{display:none}
.restart-tutorial{margin-right:auto;padding:7px 10px;border:1px solid #c8d1ba;border-radius:3px;font-size:11px;color:#5b6e46;background:transparent}.restart-tutorial:hover{background:#e9eedf}
.free-card{display:block;width:100%;padding:0;margin:0 0 23px;text-align:left;transition:opacity .18s ease,transform .18s ease}.free-card:hover{filter:none}.free-card-title{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:25px;font-weight:400;line-height:1.4;margin:6px 0 12px}.free-card-title>span{font-size:18px;color:#96a087}.free-card-copy{display:block;font-size:11px;line-height:1.9;color:#89957b}.free-card.is-leaving{opacity:0;transform:translateY(-4px);pointer-events:none}
footer{justify-content:center}.reset-row{justify-content:flex-end}
.intro h1{margin-top:0}.intro p,.workspace #explorePanel>.poem-line{font-family:Georgia,'Times New Roman',serif;font-size:15px;line-height:1.7;color:#788268}
body[data-tutorial='active'][data-tour-step='release'] .stage[data-view='release'] .intro{display:block}

.explore-copy h3{font:500 13px/1.6 DM,'Segoe UI','Microsoft YaHei',sans-serif;letter-spacing:0}
#finished h2{margin:0 0 30px;line-height:1.25}
@media(max-width:760px){.intro h1{font-size:36px;letter-spacing:-1.6px}.intro p{font-size:13px}}

/* One instruction per step. Ingredient destinations stay available in free exploration. */
.tour-note{margin-top:12px!important}
body[data-tutorial='active'] .ingredient:not(.added) .slot-status{visibility:hidden}

/* Instructions lead; the poem remains a quiet secondary line. */
.tour-card>p.tour-poem{font:italic 14px/1.5 Georgia,'Times New Roman',serif;letter-spacing:0;color:#8a927c;white-space:pre-line;margin:14px 0 0}
#finished .completion-poem{font:italic 17px/1.55 Georgia,'Times New Roman',serif;color:#8a927c;margin:0 0 28px}

/* Camera controls replace the footer stage list, without covering the model. */
.view-footer{justify-content:center;gap:0}
.view-footer .view-tools{position:static;transform:none;gap:8px;padding:0;border:0;border-radius:0;background:transparent;backdrop-filter:none;max-width:100%;overflow-x:auto}
.view-footer .tool{padding:9px 14px;min-height:40px;flex:none;font-size:15px}
.view-footer .tool span{display:inline;font-size:12px;margin-left:6px}
.view-footer .tool:focus-visible{outline:2px solid #73835b;outline-offset:-2px}
@media(max-width:760px){.view-footer{margin:0 12px}.view-footer .view-tools{gap:2px}.view-footer .tool{padding:9px 5px;font-size:12px}.view-footer .tool span{font-size:10px;margin-left:3px}}
@media(max-width:360px){.view-footer .tool{font-size:0}.view-footer .tool span{margin-left:0}}