.howto-button{position:fixed;top:12px;right:16px;z-index:50;display:inline-flex;align-items:center;gap:8px;padding:6px 12px 6px 6px;border-radius:999px;background:var(--surface);color:var(--text);border:1px solid var(--border);box-shadow:0 2px 8px #00000014;font-size:.9rem}.howto-button>span{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--accent);color:var(--accent-text);font-weight:700;font-size:.85rem}.howto{width:min(680px,calc(100vw - 32px));max-height:calc(100dvh - 32px);padding:0;border:1px solid var(--border);border-radius:14px;background:var(--surface);color:var(--text);box-shadow:0 20px 60px #0000004d}.howto::backdrop{background:#140f0a80}.howto-body{padding:20px 24px 24px;line-height:1.55}.howto header{display:flex;justify-content:space-between;align-items:center;gap:12px}.howto h2{margin:0}.howto h3{margin:1.4em 0 .4em;font-size:1.05rem;color:var(--accent)}.howto ul,.howto ol{padding-left:1.3em;margin:.4em 0}.howto li{margin:.35em 0}.howto-lead{font-size:1.05rem}.howto-close{background:none;border:0;font-size:1.8rem;line-height:1;padding:0 4px;color:var(--muted)}.howto-cats{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px}.howto-cats li{margin:0;padding:4px 10px;border:1px solid var(--border);border-radius:999px;font-size:.9rem}.howto-tip{color:var(--muted);font-style:italic}.howto-footer{display:flex;justify-content:flex-end;margin-top:16px}@media(max-width:520px){.howto-button{top:8px;right:8px;font-size:.8rem}.howto-body{padding:16px}}.howto .code-block{background:color-mix(in srgb,var(--text) 6%,var(--surface));border:1px solid var(--border);border-radius:8px;padding:10px 12px;font:.78rem/1.45 ui-monospace,monospace;overflow-x:auto;white-space:pre}.howto code{font:.85em ui-monospace,monospace;background:color-mix(in srgb,var(--text) 6%,transparent);padding:0 4px;border-radius:4px}.howto a{color:var(--accent)}.tutorial-button{position:absolute;top:16px;right:16px;display:inline-flex;align-items:center;gap:8px;padding:5px 12px 5px 6px;border-radius:999px;font-size:.85rem}.tutorial-button>span{padding:1px 7px;border-radius:999px;background:var(--accent);color:var(--accent-text);font-weight:700;font-size:.72rem;letter-spacing:.08em}.howto.tutorial{width:min(940px,calc(100vw - 32px))}.tutorial-steps{list-style:none;padding:0!important;margin:16px 0 0!important;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.tutorial-steps li{margin:0!important;display:flex;flex-direction:column;gap:10px;padding:10px;border:1px solid var(--border);border-radius:12px;background:color-mix(in srgb,var(--text) 3%,var(--surface))}.tutorial-steps img{width:100%;aspect-ratio:4 / 3;object-fit:cover;border-radius:8px;border:1px solid var(--border);background:var(--bg, var(--surface))}.tutorial-steps h3{margin:0 0 4px;display:flex;align-items:center;gap:8px;color:var(--text)}.tutorial-steps p{margin:0;font-size:.92rem;color:var(--muted)}.tutorial-num{display:inline-grid;place-items:center;flex:none;width:28px;height:28px;border-radius:50%;background:var(--accent);color:var(--accent-text);font-family:Cinzel,serif;font-size:1rem;font-weight:700}.tutorial-win{display:flex;align-items:center;justify-content:center;gap:10px;margin:16px 0 0;padding:12px 16px;border-radius:12px;border:1px solid color-mix(in srgb,var(--gold, #c9a227) 60%,var(--border));background:color-mix(in srgb,var(--gold, #c9a227) 14%,var(--surface));font-size:1.05rem;text-align:center}.tutorial-win>span:first-child{font-size:1.6rem}.tutorial .howto-footer{justify-content:space-between;align-items:center}.tutorial .howto-footer .link{font-size:.9rem}@media(max-width:720px){.tutorial-steps{grid-template-columns:1fr;gap:10px}.tutorial-steps li{gap:8px}.tutorial-steps img{aspect-ratio:16 / 10}.tutorial-steps h3{font-size:.98rem}.tutorial-steps p{font-size:.85rem}.tutorial-button{top:12px;right:12px}}