.tutorial-widget{position:fixed;right:14px;bottom:24px;z-index:1250;font:13px/1.5 var(--sans,sans-serif);color:var(--ink,#e9dfcb)}
.tutorial-toggle{display:flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:7px 12px;border:1px solid #efc575;border-radius:7px;color:#fff5d5;background:linear-gradient(150deg,#d6b16a,#947035);box-shadow:inset 0 2px #fff1bf88,inset 0 -2px #5e3a1c99,0 3px 12px #0006;font:700 13px/1.3 var(--sans,sans-serif);cursor:pointer}
.tutorial-toggle.is-active{border:2px solid #ffe497;animation:tutorial-attention 1.7s ease-in-out infinite}
.tutorial-scroll{font-size:24px;line-height:1;color:#fff0b4}.tutorial-badge{display:inline-grid;place-items:center;width:19px;height:19px;border-radius:50%;background:#fff0b1;color:#795013;border:1px solid #fff8d4;font:800 13px/1 sans-serif;box-shadow:0 0 7px #ffe4a777}
.tutorial-toggle.is-ready .tutorial-badge{background:#fff7d0;color:#6d3b06;box-shadow:0 0 10px #ffda54}
.tutorial-toggle:focus-visible{outline:2px solid #fff1bd;outline-offset:4px}.tutorial-toggle:hover{filter:brightness(1.12)}
.tutorial-panel[hidden],.tutorial-widget[hidden]{display:none}
.tutorial-panel{position:fixed;box-sizing:border-box;width:min(350px,calc(100vw - 20px));max-width:calc(100vw - 20px);overflow:auto;overscroll-behavior:contain;padding:14px;border:1px solid #d4aa60;border-radius:10px;background:var(--surface,#182531);color:var(--ink,#e9dfcb);box-shadow:0 12px 45px #0009;font:13px/1.5 var(--sans,sans-serif)}
.tutorial-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 10px}.tutorial-heading>b{font-size:13px;color:var(--gold,#d4aa60)}.tutorial-heading>.btn{flex:none;min-height:28px;padding:4px 8px;font-size:11px}
.tutorial-panel h3{font:400 20px/1.3 var(--serif,Georgia,serif);margin:0 0 8px}.tutorial-panel p{margin:8px 0;overflow-wrap:anywhere}.tutorial-description{color:var(--muted,#a3adb4)}
.tutorial-progress{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:10px 0 5px;font-size:12px;color:var(--muted,#a3adb4)}.tutorial-progress b{font-variant-numeric:tabular-nums;color:var(--gold,#d4aa60)}.tutorial-track{height:5px;overflow:hidden;border-radius:3px;background:var(--line,#354550)}.tutorial-track>i{display:block;height:100%;background:linear-gradient(90deg,#b08842,#f2ce80);transition:width .25s}
.tutorial-objectives{list-style:none;padding:0;margin:12px 0}.tutorial-objectives li{display:flex;align-items:flex-start;gap:7px;padding:7px 0;border-bottom:1px solid var(--line,#354550)}.tutorial-objectives li>span:first-child{flex:0 0 17px;color:var(--gold,#d4aa60);font-weight:700}.tutorial-objectives li.is-done{color:var(--muted,#a3adb4)}.tutorial-objectives li a{color:var(--gold,#d4aa60);text-decoration:underline;text-underline-offset:3px}.tutorial-objectives li a:hover{filter:brightness(1.2)}
.tutorial-gift{padding:9px 10px;border:1px solid #bc944b88;border-radius:5px;background:color-mix(in srgb,var(--gold,#d4aa60) 8%,transparent);color:var(--gold,#d4aa60)}
.tutorial-rewards{display:flex;flex-wrap:wrap;gap:6px 12px;margin:10px 0;font-weight:700;color:var(--gold,#d4aa60)}.tutorial-claim{width:100%;min-height:38px;margin-top:4px}.tutorial-panel .tutorial-message{padding:8px 10px;border:1px solid var(--green,#7baf6a);border-radius:5px;color:var(--green,#7baf6a)}.tutorial-panel .tutorial-error{padding:8px 10px;border:1px solid #ce7c61;border-radius:5px;color:#e39b82}.tutorial-error .btn{display:block;margin-top:7px}
.tutorial-complete{font-size:14px;color:var(--green,#7baf6a)}.tutorial-panel .tutorial-board{display:inline-block;margin-top:9px;color:var(--gold,#d4aa60);text-decoration:underline}
@keyframes tutorial-attention{0%,100%{box-shadow:inset 0 2px #fff1bf99,inset 0 -2px #5e3a1c99,0 0 8px 2px #ffc94d88}50%{box-shadow:inset 0 2px #fff7d7,inset 0 -2px #805222,0 0 23px 5px #ffce54dd;filter:brightness(1.28)}}
@media(max-width:760px){.tutorial-widget{right:10px}.tutorial-toggle{min-height:40px;padding:6px 10px;font-size:12px}.tutorial-scroll{font-size:22px}.tutorial-panel{padding:12px}.tutorial-objectives li{padding:9px 0}.tutorial-heading>.btn{min-height:32px}}
@media(prefers-reduced-motion:reduce){.tutorial-toggle.is-active{animation:none;box-shadow:inset 0 2px #fff1bf99,0 0 15px 3px #ffce54bb}.tutorial-track>i{transition:none}}