.tutorial-stage{z-index:1000;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);pointer-events:none;color:var(--text);font-family:var(--sans);isolation:isolate;font-weight:400;position:fixed;inset:0;overflow:hidden}.tutorial-ambient-veil{background:radial-gradient(at 50% 45%,#0307080d,#03070845);transition:opacity .35s;position:absolute;inset:0}.tutorial-ambient-veil.has-target{opacity:0}.tutorial-input-shield{z-index:1;position:absolute;inset:0}.tutorial-input-shield,.tutorial-barriers>div{pointer-events:auto;touch-action:pan-y}.tutorial-barriers>div{z-index:1;position:absolute}.tutorial-highlight{z-index:0;pointer-events:none;background:0 0;border:1px solid #edcf9a;border-radius:9px;position:absolute}.tutorial-highlight[data-visible=false]{visibility:hidden}.tutorial-highlight.is-dimmed[data-visible=true]{box-shadow:0 0 0 150vmax #0307088a,0 0 30px #e7c78d30,inset 0 0 22px #e7c78d07}.tutorial-corner{filter:drop-shadow(0 0 5px #f1cb9470);border-style:solid;border-color:#ffdfab;width:17px;height:17px;position:absolute}.tutorial-corner--tl{border-width:2px 0 0 2px;border-radius:5px 0 0;top:-3px;left:-3px}.tutorial-corner--tr{border-width:2px 2px 0 0;border-radius:0 5px 0 0;top:-3px;right:-3px}.tutorial-corner--bl{border-width:0 0 2px 2px;border-radius:0 0 0 5px;bottom:-3px;left:-3px}.tutorial-corner--br{border-width:0 2px 2px 0;border-radius:0 0 5px;bottom:-3px;right:-3px}.tutorial-target-trace{opacity:0;border:1px solid #e9c994;border-radius:12px;animation:1.15s ease-out both tutorial-target-arrive;position:absolute;inset:-5px}.tutorial-target-label{color:#ecd5b1;letter-spacing:.045em;white-space:nowrap;background:#101b1a;border:1px solid #d8c19b50;border-radius:3px;align-items:center;gap:7px;max-width:240px;height:20px;padding:0 8px;font-size:9px;display:flex;position:absolute;top:-27px;left:-1px}.tutorial-target-label.is-below{top:calc(100% + 6px)}.tutorial-target-label>span{background:var(--gold);width:4px;height:4px;box-shadow:0 0 8px var(--gold);border-radius:50%}.tutorial-connector{z-index:2;pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.tutorial-connector path{fill:none;stroke:#dfc294;stroke-width:1px;stroke-linecap:round;stroke-dasharray:1;animation:.45s .52s both tutorial-connect}.tutorial-dialogue{z-index:3;overscroll-behavior:contain;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);contain:layout style;pointer-events:auto;scrollbar-width:thin;scrollbar-color:#bfa98360 transparent;background:radial-gradient(at 0 0,#2b38318c,#0000 75%),#101a19f7;border:1px solid #d8c19b55;border-radius:12px;padding:0;position:absolute;overflow:hidden auto;box-shadow:0 28px 90px #0009,0 0 0 1px #040b0b60,inset 0 1px #f8e5c010}.tutorial-dialogue-inner{padding:24px}.tutorial-dialogue:focus,.tutorial-dialogue h2:focus{outline:none}.tutorial-stage[data-initializing=true] .tutorial-dialogue{visibility:hidden}.tutorial-dialogue-header{border-bottom:1px solid #d8c19b21;justify-content:space-between;align-items:center;gap:12px;margin-bottom:21px;padding-bottom:17px;display:flex}.tutorial-overline{color:var(--gold);letter-spacing:.18em;text-transform:uppercase;font-size:9px;line-height:1.6}.tutorial-step-number{color:#9fac9f;letter-spacing:.05em;white-space:nowrap;font-size:10px}.tutorial-copy{animation:.44s cubic-bezier(.2,.7,.2,1) 50ms both tutorial-chapter-in}.tutorial-dialogue h2{font-family:var(--serif);letter-spacing:-.02em;color:#f2ebdc;margin:0 0 16px;font-size:34px;font-weight:400;line-height:1.08}.tutorial-dialogue p{color:#c5cdc4;margin:0 0 15px;font-size:13px;line-height:1.75}.tutorial-dialogue .tutorial-detail{color:#aeb8af;border-left:1px solid #d8c19b60;margin-top:16px;padding:10px 0 10px 13px;font-size:11px}.tutorial-dialogue .tutorial-notice{color:#e2d1b2;background:#d8c19b0c;padding:10px 12px;font-size:11px}.tutorial-dialogue .tutorial-interaction-hint{color:#e4c899;align-items:center;gap:9px;padding-top:5px;font-size:11px;display:flex}.tutorial-interaction-hint>span{font-size:20px}.tutorial-transit-status{color:#cbb88f;align-items:center;gap:8px;min-height:16px;margin-top:10px;font-size:10px;display:flex}.tutorial-transit-status>span{background:var(--gold);border-radius:50%;width:4px;height:4px;animation:1s ease-in-out infinite alternate tutorial-breathe}.tutorial-dialogue-footer{margin-top:14px}.tutorial-step-actions{justify-content:space-between;gap:12px;display:flex}.tutorial-primary,.tutorial-secondary{border:1px solid #d8c19b50;border-radius:5px;justify-content:center;align-items:center;gap:18px;min-height:44px;padding:11px 17px;font-size:12px;transition:background .2s,border-color .2s,box-shadow .2s;display:inline-flex}.tutorial-primary{background:var(--gold);border-color:var(--gold);color:#101718;font-weight:500}.tutorial-primary:hover{background:#eed9b7;border-color:#eed9b7;box-shadow:0 4px 20px #d8c19b16}.tutorial-secondary{color:#e2dac9}.tutorial-secondary:hover{border-color:var(--gold);background:#d8c19b0c}.tutorial-stage button:disabled{opacity:.35;cursor:default}.tutorial-utilities{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:3px 12px;margin:15px -4px -8px;display:flex}.tutorial-utilities button{color:#aeb8af;min-height:32px;padding:6px 4px;font-size:10px}.tutorial-utilities button:hover{color:var(--gold)}.tutorial-completion-actions{gap:8px;display:grid}.tutorial-completion-actions button{justify-content:space-between}.tutorial-stage button:focus-visible{outline:2px solid var(--gold);outline-offset:3px}.tutorial-hud{z-index:6;top:max(20px, env(safe-area-inset-top));left:max(24px, env(safe-area-inset-left));right:max(24px, env(safe-area-inset-right));justify-content:space-between;align-items:center;gap:20px;display:flex;position:absolute}.tutorial-hud.is-bottom{top:auto;bottom:max(20px, env(safe-area-inset-bottom))}.tutorial-hud>div:not(.tutorial-hud-actions){-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#0d1716d9;border:1px solid #d8c19b20;border-radius:5px;align-items:center;gap:24px;padding:8px 12px;display:flex}.tutorial-hud-count{color:#c4b99f;font-variant-numeric:tabular-nums;align-items:center;gap:8px;font-size:10px;display:flex}.tutorial-hud-count i{background:#d8c19b50;width:15px;height:1px}.tutorial-hud-actions>button{color:#d9cfbd;pointer-events:auto;background:#0d1716e8;border:1px solid #d8c19b30;border-radius:5px;align-items:center;gap:12px;min-height:36px;padding:6px 12px;font-size:10px;display:flex}.tutorial-hud-actions>button>span{font-size:18px}.tutorial-hud-actions>button:hover{border-color:var(--gold)}.tutorial-progress-track{z-index:5;background:#d8c19b16;height:2px;position:absolute;bottom:0;left:0;right:0}.tutorial-progress-track>span{background:linear-gradient(90deg,#948067,#f2d3a2);height:100%;transition:width .65s cubic-bezier(.2,.7,.2,1);display:block;box-shadow:0 0 12px #e4bf8b66}@keyframes tutorial-target-arrive{0%{opacity:.8;transform:scale(1.025)}to{opacity:0;transform:scale(1.07)}}@keyframes tutorial-connect{0%{stroke-dashoffset:1px;opacity:0}to{stroke-dashoffset:0;opacity:.65}}@keyframes tutorial-chapter-in{0%{opacity:0;filter:blur(2px);transform:translateY(9px)}to{opacity:1;filter:blur();transform:translateY(0)}}@keyframes tutorial-breathe{0%{opacity:.25}to{opacity:1}}.tutorial-assembly{background:radial-gradient(ellipse at 50% 45%, #28302b50, transparent 58%), var(--bg);animation:tutorial-assembly-timeline var(--tutorial-duration) linear both;pointer-events:auto;position:absolute;inset:0;overflow:hidden}.tutorial-structure{width:min(760px,105vw);height:auto;stroke:var(--gold);stroke-width:.7px;position:absolute;top:45%;left:50%;transform:translate(-50%,-50%)}.tutorial-structure-grid{stroke-dasharray:1600;stroke-dashoffset:1600px;opacity:.3;animation:tutorial-assemble-lines calc(var(--tutorial-duration) * .65) cubic-bezier(.3, .1, .3, 1) both}.tutorial-structure-core{stroke-dasharray:500;stroke-dashoffset:500px;opacity:.65;animation:tutorial-assemble-lines calc(var(--tutorial-duration) * .5) calc(var(--tutorial-duration) * .17) ease both}.tutorial-structure-points{fill:var(--gold);stroke:none;animation:tutorial-identity-in calc(var(--tutorial-duration) * .4) calc(var(--tutorial-duration) * .15) both}.tutorial-assembly-copy{text-align:center;background:radial-gradient(#090c0de6,#090c0d00 65%);flex-direction:column;justify-content:center;align-items:center;padding:32px;display:flex;position:absolute;inset:0}.tutorial-assembly-copy .tutorial-overline{animation:tutorial-identity-in calc(var(--tutorial-duration) * .25) calc(var(--tutorial-duration) * .28) both;margin:0 0 16px}.tutorial-wordmark{font-family:var(--serif);letter-spacing:-.045em;color:#eee7d9;animation:tutorial-identity-in calc(var(--tutorial-duration) * .3) calc(var(--tutorial-duration) * .35) both;margin:0;font-size:clamp(64px,10vw,100px);font-weight:400;line-height:1.1}.tutorial-assembly-caption{color:#c2bbac;animation:tutorial-identity-in calc(var(--tutorial-duration) * .2) calc(var(--tutorial-duration) * .5) both;margin:25px 0 0;font-size:11px;line-height:1.8}.tutorial-assembly.is-paused,.tutorial-assembly.is-paused *{animation-play-state:paused!important}.tutorial-intro-controls{bottom:max(24px, env(safe-area-inset-bottom));pointer-events:auto;flex-wrap:wrap;justify-content:center;gap:12px 24px;width:calc(100% - 32px);padding:12px;display:flex;position:absolute;left:50%;transform:translate(-50%)}.tutorial-intro-controls:focus{outline:none}.tutorial-intro-controls button{color:#c5cdc4;padding:10px 5px;font-size:12px}.tutorial-intro-controls button:hover{color:var(--gold)}@keyframes tutorial-assembly-timeline{0%,88%{opacity:1}to{opacity:0}}@keyframes tutorial-assemble-lines{to{stroke-dashoffset:0}}@keyframes tutorial-identity-in{0%{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}@keyframes tutorial-dialogue-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media (max-width:640px){.tutorial-dialogue{border-radius:12px}.tutorial-dialogue-inner{padding:20px}.tutorial-target-label{display:none}.tutorial-hud{gap:8px;left:16px;right:16px}.tutorial-dialogue .tutorial-utilities{display:none}.tutorial-dialogue-header{border-bottom:0;margin-bottom:12px;padding-bottom:0}.tutorial-dialogue h2{margin-bottom:12px}.tutorial-dialogue p{margin-bottom:0}.tutorial-hud>div:not(.tutorial-hud-actions){gap:12px;padding:8px}.tutorial-hud .tutorial-overline{letter-spacing:.12em;font-size:7px}.tutorial-hud-actions>button{min-height:40px}.tutorial-dialogue h2{font-size:29px}.tutorial-dialogue p:not(.tutorial-step-number){font-size:12px;line-height:1.7}.tutorial-progress{margin-top:18px}.tutorial-utilities button{min-height:40px}}@media (prefers-reduced-motion:reduce){.tutorial-stage *,.tutorial-stage :before,.tutorial-stage :after{transition:none!important;animation:none!important}}.tutorial-hud-actions{pointer-events:auto;gap:8px;display:flex;position:relative}.tutorial-options{background:#111d1b;border:1px solid #d8c19b45;border-radius:7px;min-width:150px;padding:6px;display:grid;position:absolute;top:calc(100% + 8px);right:0;box-shadow:0 10px 30px #0008}.tutorial-hud.is-bottom .tutorial-options{top:auto;bottom:calc(100% + 8px)}.tutorial-options button{color:#d9cfbd;text-align:left;min-height:40px;padding:10px 12px;font-size:11px}.tutorial-options button:hover{background:#d8c19b0c}
