.tutorial{--tut-bg:#020304;--tut-text:#f2f4f5;--tut-soft:#a0aab5;--tut-muted:#66717e;--tut-line:#a6d6f129;--tut-ice:#a6d6f1;--tut-ice-dim:#82b7da8c;--tut-rival:#d58a63;--tut-ease:cubic-bezier(.22, 1, .36, 1);z-index:120;height:100dvh;color:var(--tut-text);background:radial-gradient(circle at 50% -10%, #4f7a9717, transparent 36rem), var(--tut-bg);isolation:isolate;justify-content:center;animation:.42s both tut-fade;display:flex;position:fixed;inset:0;overflow:hidden}.tutorial:focus{outline:none}.tutorial,.tutorial *,.tutorial :before,.tutorial :after{box-sizing:border-box}.tutorial__frame{width:min(100%,1040px);height:100%;padding:max(16px, env(safe-area-inset-top)) max(20px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(20px, env(safe-area-inset-left));grid-template-rows:auto minmax(0,1fr) auto;grid-template-columns:minmax(0,1fr);display:grid}.tutorial__top{align-items:center;gap:12px;min-height:48px;display:flex}.tutorial__brand{color:var(--tut-soft);letter-spacing:.3em;align-items:center;gap:9px;font-size:10px;font-weight:720;display:inline-flex}.tutorial__brand svg{color:var(--tut-ice)}.tutorial__badge{color:#e6b97a;letter-spacing:.16em;border:1px solid #e6b97a59;border-radius:4px;padding:3px 7px;font-size:8px;font-weight:700}.tutorial__skip{min-height:44px;color:var(--tut-muted);cursor:pointer;font:inherit;letter-spacing:.04em;background:0 0;border:0;margin-left:auto;padding:0 4px 0 14px;font-size:12px;font-weight:560;transition:color .18s}.tutorial__skip:hover{color:var(--tut-soft)}.tutorial__stage{overscroll-behavior:contain;touch-action:pan-y;scrollbar-width:none;min-height:0;animation:tut-enter .46s var(--tut-ease) both;overflow-y:auto}.tutorial__stage::-webkit-scrollbar{display:none}.tutorial__stage[data-direction=back]{animation-name:tut-enter-back}.tut-screen{flex-direction:column;justify-content:center;gap:clamp(28px,5vh,48px);min-height:100%;padding:clamp(16px,4vh,40px) 0;display:flex}.tut-screen__text{max-width:440px}.tut-screen h1{letter-spacing:.02em;overflow-wrap:anywhere;-webkit-hyphens:auto;hyphens:auto;margin:0;font-size:clamp(30px,8.6vw,54px);font-weight:580;line-height:1.02}.tut-screen__text p{color:var(--tut-soft);margin:18px 0 0;font-size:15px;line-height:1.65}.tut-eyebrow{letter-spacing:.26em;text-transform:uppercase;font-weight:700;color:var(--tut-ice)!important;margin:0 0 18px!important;font-size:10px!important}.tut-screen--welcome h1{letter-spacing:-.035em;text-transform:none}.tut-screen__visual{width:100%;max-width:440px}.tut-note{color:var(--tut-muted);align-items:center;gap:8px;margin:18px 0 0;font-size:12px;line-height:1.5;display:flex}.tut-note--shield svg{color:var(--tut-ice-dim);flex:none}.tut-example{color:var(--tut-muted);letter-spacing:.18em;text-transform:uppercase;border:1px dashed #a0aab54d;border-radius:4px;padding:3px 7px;font-size:8px;font-weight:700;position:absolute;top:12px;right:12px}.tut-node{border:1px solid var(--tut-line);background:#10141a8c;border-radius:10px;gap:6px;padding:16px;display:grid}.tut-node strong{letter-spacing:.24em;font-size:11px;font-weight:740}.tut-node span{color:var(--tut-soft);font-size:13px;line-height:1.45}.tut-node--goal{border-color:#a6d6f157;box-shadow:inset 0 0 0 1px #ffffff04,0 16px 48px #00000059}.tut-node--goal strong{color:var(--tut-ice)}.tut-branch{width:100%;height:34px;display:block;overflow:visible}.tut-branch path{fill:none;stroke:#a6d6f16b;stroke-width:1px;stroke-dasharray:1;stroke-dashoffset:0;animation:tut-draw .52s .52s var(--tut-ease) both}.tut-pair{grid-template-columns:1fr 1fr;gap:12px;display:grid}.tut-daily{text-align:center;background:linear-gradient(#0b0f13eb,#050709eb);border:1px solid #a0aab51f;border-radius:14px;flex-direction:column;align-items:center;padding:44px 20px 28px;display:flex;position:relative;box-shadow:0 24px 70px #00000073}.tut-daily__day{letter-spacing:.32em;margin:0;font-size:14px;font-weight:720}.tut-daily__stats{color:#a0aab5c7;letter-spacing:.08em;margin:14px 0 0;font-size:11px;font-weight:530}.tut-ticks{gap:8px;margin:28px 0 0;padding:0;list-style:none;display:flex}.tut-ticks li{background:var(--tut-ice);width:22px;height:3px;animation:tut-tick .36s var(--d,0s) var(--tut-ease) both;border-radius:2px}.tut-daily__action{color:#e9eff2;letter-spacing:.2em;min-height:46px;animation:tut-settle .52s var(--d,0s) var(--tut-ease) both;background:#080c0f94;border:1px solid #a6d6f16b;border-radius:7px;align-items:center;gap:16px;margin-top:30px;padding:0 18px 0 22px;font-size:10px;font-weight:720;display:inline-flex}.tut-daily__action svg{color:var(--tut-ice)}.tut-level{background:#0b0f13cc;border:1px solid #a0aab51f;border-radius:14px;padding:28px 20px 22px;position:relative}.tut-level__value{letter-spacing:.04em;margin:0;font-size:34px;font-weight:600}.tut-level__caption{color:var(--tut-muted);letter-spacing:.24em;margin:8px 0 0;font-size:9px;font-weight:700}.tut-xpbar{background:#a0aab51f;border-radius:2px;height:3px;margin-top:18px;overflow:hidden}.tut-xpbar span{background:var(--tut-ice);border-radius:inherit;transform-origin:0;width:38%;height:100%;animation:tut-grow .9s var(--d,0s) var(--tut-ease) both;display:block}.tut-rows{margin:14px 0 0;padding:0;list-style:none;display:grid}.tut-row{border-bottom:1px solid #a0aab514;grid-template-columns:minmax(104px,auto) 1fr;align-items:baseline;gap:14px;padding:12px 2px;display:grid}.tut-row:last-child{border-bottom:0}.tut-row strong{letter-spacing:.22em;font-size:10px;font-weight:740}.tut-row span{color:var(--tut-soft);font-size:13px;line-height:1.45}.tut-battle{background:#0b0f13cc;border:1px solid #a0aab51f;border-radius:14px;padding:40px 18px 26px;position:relative}.tut-battle__label{color:var(--tut-soft);letter-spacing:.26em;text-align:center;margin:0 0 22px;font-size:10px;font-weight:720}.tut-battle__track{grid-template-columns:auto 1fr auto;align-items:center;gap:12px;display:grid}.tut-side{letter-spacing:.2em;font-size:10px;font-weight:760}.tut-side--you{color:var(--tut-ice)}.tut-side--friend{color:var(--tut-rival)}.tut-line{justify-content:space-between;align-items:center;height:18px;display:flex;position:relative}.tut-line i{transform-origin:0;width:50%;height:1px;animation:tut-grow .64s .52s var(--tut-ease) both;margin-top:-.75px;position:absolute;top:50%}.tut-line .tut-line__you{background:linear-gradient(90deg, var(--tut-ice), #a6d6f199);height:1.5px;left:0}.tut-line .tut-line__friend{background:linear-gradient(270deg, var(--tut-rival), #d58a6399);transform-origin:100%;height:1.5px;right:0}.tut-line b{background:var(--tut-bg);width:5px;height:5px;animation:tut-fade .3s var(--d,0s) ease both;border:1px solid #f2f4f573;border-radius:50%;position:relative}.tutorial__bottom{justify-content:space-between;align-items:center;gap:16px;min-height:72px;padding-top:12px;display:flex}.tutorial__progress{align-items:center;gap:12px;display:flex}.tutorial__dots{gap:6px;margin:0;padding:0;list-style:none;display:flex}.tutorial__dots li{width:6px;height:6px;transition:width .32s var(--tut-ease), background .32s ease;background:#a0aab533;border-radius:3px}.tutorial__dots li.is-done{background:#a6d6f173}.tutorial__dots li.is-current{background:var(--tut-ice);width:22px}.tutorial__count{white-space:nowrap;color:var(--tut-muted);letter-spacing:.12em;font-variant-numeric:tabular-nums;font-size:10px;font-weight:600}.tutorial__nav{align-items:center;gap:10px;min-width:0;display:flex}.tutorial__back,.tutorial__primary{cursor:pointer;min-height:52px;font:inherit;border-radius:7px;justify-content:center;align-items:center;transition:color .18s,background .18s,border-color .18s,transform .18s;display:inline-flex}.tutorial__back{width:52px;color:var(--tut-soft);background:0 0;border:1px solid #a0aab529}.tutorial__back:hover{color:var(--tut-text);border-color:#a0aab552}.tutorial__primary{white-space:nowrap;color:#e9eff2;letter-spacing:.18em;text-transform:uppercase;background:#080c0f94;border:1px solid #a6d6f152;gap:14px;min-width:140px;padding:0 18px 0 22px;font-size:11px;font-weight:720;box-shadow:0 12px 42px #00000052}.tutorial__primary svg{color:var(--tut-ice);flex:none}.tutorial__primary:hover{color:#fff;background:#10181ec7;border-color:#a6d6f18c;transform:translateY(-1px)}.tutorial__primary[data-final]{background:#16222bb8;border-color:#a6d6f199}.tutorial__skip:focus-visible,.tutorial__back:focus-visible,.tutorial__primary:focus-visible{outline:2px solid var(--tut-ice);outline-offset:3px}.tutorial__sr{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.tut-reveal{animation:tut-rise .56s var(--d,0s) var(--tut-ease) both}@keyframes tut-fade{0%{opacity:0}}@keyframes tut-rise{0%{opacity:0;transform:translateY(10px)}}@keyframes tut-enter{0%{opacity:0;transform:translate(18px)}}@keyframes tut-enter-back{0%{opacity:0;transform:translate(-18px)}}@keyframes tut-draw{0%{stroke-dashoffset:1px}}@keyframes tut-tick{0%{opacity:.12;transform:scaleX(.4)}}@keyframes tut-settle{0%{opacity:.25;border-color:#a0aab51f}}@keyframes tut-grow{0%{transform:scaleX(0)}}@media (max-width:420px){.tutorial__count{display:none}}@media (max-width:380px){.tut-pair{grid-template-columns:1fr;gap:10px}.tut-row{grid-template-columns:1fr;gap:4px}.tutorial__primary{letter-spacing:.12em;white-space:normal;text-align:center;gap:10px;min-width:0;padding:0 14px 0 16px;line-height:1.3}}@media (max-height:700px){.tut-screen{justify-content:flex-start;gap:22px}.tut-screen__text p{margin-top:12px;font-size:14px}.tut-daily{padding-top:38px}}@media (min-width:900px){.tutorial__frame{padding-left:48px;padding-right:48px}.tut-screen{grid-template-columns:minmax(0,1fr) minmax(0,440px);align-items:center;gap:clamp(48px,8vw,120px);display:grid}.tut-screen--welcome{grid-template-columns:minmax(0,620px)}.tut-screen h1{font-size:clamp(44px,4.6vw,60px)}.tut-screen__text p{font-size:16px}}@media (prefers-reduced-motion:reduce){.tutorial,.tutorial *,.tutorial :before,.tutorial :after{transition:none!important;animation:none!important}}.tutorial-replay-row .button{color:var(--text-secondary)}