/* Guided tour: fixed layers only. The four shades leave the live control reachable. */
.tutorial-layer[hidden]{display:none!important}
.tutorial-layer{position:fixed;inset:0;z-index:65;pointer-events:none;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
.tutorial-shade{position:absolute;left:0;top:0;background:rgba(0,5,5,.76);pointer-events:none}
.tutorial-target{position:absolute;left:0;top:0;box-shadow:inset 0 0 0 1px #ffd58488,0 0 0 2px #000b,0 0 22px #ffc26277;pointer-events:none}
.tutorial-target[hidden]{display:none}
.tutorial-target i{position:absolute;width:15px;height:15px;border-color:#ffd06b;border-style:solid;border-width:0}
.tutorial-target i:nth-child(1){left:-2px;top:-2px;border-left-width:3px;border-top-width:3px}
.tutorial-target i:nth-child(2){right:-2px;top:-2px;border-right-width:3px;border-top-width:3px}
.tutorial-target i:nth-child(3){left:-2px;bottom:-2px;border-left-width:3px;border-bottom-width:3px}
.tutorial-target i:nth-child(4){right:-2px;bottom:-2px;border-right-width:3px;border-bottom-width:3px}
.tutorial-card{position:absolute;left:0;top:0;width:min(326px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow-y:auto;box-sizing:border-box;padding:13px 14px 14px;background:#0c1614f5;border:1px solid #e3ac58;box-shadow:0 12px 32px #000e, inset 3px 0 #d6953f;color:#e8e2d5;pointer-events:auto;overscroll-behavior:contain}
.tutorial-top{display:flex;justify-content:space-between;align-items:center;gap:12px;color:#c0a67b;font-size:11px;letter-spacing:.13em}
.tutorial-top button,.tutorial-actions button{min-height:36px;border:1px solid #866338;border-radius:1px;background:#211b13;color:#ffe1aa;font:700 11px ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.08em;cursor:pointer}
.tutorial-top button{padding:5px 11px}
.tutorial-card h2{font:400 15px/1.3 "Astoria Pixel",ui-monospace,monospace;letter-spacing:.03em;color:#ffd186;margin:12px 0 7px}
.tutorial-card p{font-size:13px;line-height:1.45;color:#e6ded0;margin:0 0 13px}
.tutorial-actions{display:flex;justify-content:flex-end;align-items:center;gap:8px}
.tutorial-actions .tutorial-hint{margin-right:auto;color:#9fbbad;font-size:10px;letter-spacing:.04em}
.tutorial-actions button{padding:6px 13px;white-space:nowrap}
.tutorial-actions button.tutorial-next{background:#8e5e27;color:#0a0c0a;border-color:#ecb463}
.tutorial-actions button[hidden]{display:none}
.tutorial-card button:focus-visible{outline:2px solid #ffe6aa;outline-offset:2px}
@media(max-width:390px){.tutorial-card{padding:11px 12px}.tutorial-card p{font-size:12px}.tutorial-actions button{padding:6px 9px}}
@media(prefers-reduced-motion:reduce){.tutorial-layer *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}