.tutorial-workspace[data-v-df9a5d3d]{gap:18px;display:grid}.tutorial-hero[data-v-df9a5d3d]{background:linear-gradient(135deg,rgba(var(--wf-palette-primary-rgb),.18),var(--wf-color-surface-strong) 62%,rgba(var(--wf-palette-cool-rgb),.14));border:1px solid var(--wf-color-line-soft);border-radius:24px;justify-content:space-between;align-items:center;padding:clamp(24px,4vw,42px);display:flex}.tutorial-content header span[data-v-df9a5d3d],.tutorial-hero span[data-v-df9a5d3d]{color:#168467;letter-spacing:.08em;text-transform:uppercase;font-size:.7rem;font-weight:900}.tutorial-hero h1[data-v-df9a5d3d]{color:var(--wf-color-primary-strong);margin:7px 0;font-size:clamp(1.8rem,4vw,3rem)}.tutorial-hero p[data-v-df9a5d3d]{color:var(--wf-color-muted);margin:0}.hero-mark[data-v-df9a5d3d]{background:var(--wf-color-primary);box-shadow:0 16px 40px rgba(var(--wf-palette-primary-rgb),.3);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:92px;height:92px;font-size:2.2rem;font-weight:900;display:flex}.tutorial-tracks[data-v-df9a5d3d]{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;display:grid}.tutorial-tracks button[data-v-df9a5d3d]{background:var(--wf-color-surface-strong);border:1px solid var(--wf-color-line-soft);color:var(--wf-color-ink);text-align:left;border-radius:16px;grid-template-columns:46px 1fr;align-items:center;gap:12px;padding:15px;display:grid}.tutorial-tracks button>b[data-v-df9a5d3d]{background:rgba(var(--wf-palette-primary-rgb),.12);border-radius:12px;justify-content:center;align-items:center;height:46px;display:flex}.tutorial-tracks span[data-v-df9a5d3d]{display:grid}.tutorial-tracks small[data-v-df9a5d3d]{color:var(--wf-color-muted)}.tutorial-tracks button.active[data-v-df9a5d3d]{background:var(--wf-color-primary);color:#fff}.tutorial-tracks button.active>b[data-v-df9a5d3d]{background:#ffffff2e}.tutorial-tracks button.active small[data-v-df9a5d3d]{color:#ffffffc7}.tutorial-content[data-v-df9a5d3d]{background:var(--wf-color-surface-strong);border:1px solid var(--wf-color-line-soft);border-radius:22px;gap:18px;padding:22px;display:grid}.tutorial-content>header[data-v-df9a5d3d]{justify-content:space-between;align-items:center;display:flex}.tutorial-content h2[data-v-df9a5d3d]{color:var(--wf-color-primary-strong);margin:5px 0 0}.tutorial-content>header>b[data-v-df9a5d3d]{background:var(--wf-color-surface-soft);color:var(--wf-color-primary-strong);border-radius:999px;padding:8px 12px}.step-list[data-v-df9a5d3d]{gap:9px;display:grid}.step-list article[data-v-df9a5d3d]{background:#f5edf6;border:1px solid #dec9e3;border-radius:14px;overflow:hidden}.step-list article.open[data-v-df9a5d3d]{background:#dec9e3;border-color:#ba95c5}.step-head[data-v-df9a5d3d]{color:#6c3e83;text-align:left;background:0 0;border:0;grid-template-columns:40px 1fr auto;align-items:center;gap:12px;width:100%;padding:13px 15px;display:grid}.step-head i[data-v-df9a5d3d]{background:var(--wf-color-primary);color:#fff;border-radius:50%;justify-content:center;align-items:center;height:40px;font-style:normal;font-weight:900;display:flex}.step-head span[data-v-df9a5d3d]{display:grid}.step-head small[data-v-df9a5d3d]{color:#9666a8;text-transform:uppercase;font-size:.66rem;font-weight:900}.step-head>b[data-v-df9a5d3d]{color:#6c3e83;font-size:1.3rem}.step-body[data-v-df9a5d3d]{border-top:1px solid #ba95c5;padding:0 15px 16px 67px}.step-body p[data-v-df9a5d3d]{color:#6c3e83;line-height:1.55}.step-body a[data-v-df9a5d3d]{color:#6c3e83;font-weight:900;text-decoration:none}@media (width<=800px){.tutorial-tracks[data-v-df9a5d3d]{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=600px){.tutorial-hero[data-v-df9a5d3d]{align-items:flex-start;padding:22px}.hero-mark[data-v-df9a5d3d]{width:52px;height:52px}.tutorial-tracks[data-v-df9a5d3d]{grid-template-columns:1fr}.tutorial-content[data-v-df9a5d3d]{padding:16px}.tutorial-content>header[data-v-df9a5d3d]{align-items:flex-start;gap:10px}.step-body[data-v-df9a5d3d]{padding-left:15px}}.tutorial-hero[data-v-df9a5d3d]{will-change:background-position,background-size;background-color:#0000;background-image:radial-gradient(circle,#9666a857 0,#dec9e333 34%,#0000 62%),radial-gradient(circle,#e0edf8e6 0,#f5edf640 38%,#0000 66%),linear-gradient(135deg,#f5edf6,#fff 58%,#e0edf8);background-position:-20% 16%,116% 78%,50%;background-repeat:no-repeat;background-size:112% 270%,108% 280%,100% 100%;background-attachment:scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box;min-height:340px;animation:20s cubic-bezier(.45,0,.25,1) infinite tutorial-hero-breath-df9a5d3d;position:relative;overflow:hidden}.tutorial-hero>div[data-v-df9a5d3d]{min-width:0}.tutorial-hero h1[data-v-df9a5d3d]{overflow-wrap:anywhere}@keyframes tutorial-hero-breath-df9a5d3d{0%,to{background-position:-20% 16%,116% 78%,50%;background-size:112% 270%,108% 280%,100% 100%}21%{background-position:8% -18%,92% 112%,50%;background-size:128% 310%,116% 248%,100% 100%}47%{background-position:26% 72%,72% -28%,50%;background-size:104% 244%,130% 320%,100% 100%}72%{background-position:-8% 108%,106% 18%,50%;background-size:132% 320%,102% 236%,100% 100%}88%{background-position:-28% 44%,84% 92%,50%;background-size:118% 284%,122% 304%,100% 100%}}.step-list article.open[data-v-df9a5d3d]{background:#eee5f0}.tutorial-hero .hero-mark[data-v-df9a5d3d]{box-shadow:none;filter:drop-shadow(0 18px 24px #6c3e8333);-o-object-fit:contain;object-fit:contain;background:0 0;border-radius:0;flex:none;width:156px;height:156px}.tutorial-tracks button.active[data-v-df9a5d3d] :where(strong,small){color:#fff}@media (width<=900px){.tutorial-hero[data-v-df9a5d3d]{gap:18px}.tutorial-hero .hero-mark[data-v-df9a5d3d]{width:112px;height:112px}}.start-tutorial[data-v-df9a5d3d],.step-actions button[data-v-df9a5d3d]{background:var(--wf-color-primary);color:#fff;cursor:pointer;font:inherit;border:0;border-radius:9px;padding:10px 13px;font-weight:800}.tutorial-content>header>.start-tutorial[data-v-df9a5d3d]{margin-left:auto}.tutorial-complete[data-v-df9a5d3d]{color:#176b56;background:#1684671a;border:1px solid #1684673d;border-radius:12px;padding:15px}.tutorial-complete p[data-v-df9a5d3d]{margin:5px 0 0}.step-actions[data-v-df9a5d3d]{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.step-actions button.practice[data-v-df9a5d3d],.step-actions button.secondary[data-v-df9a5d3d]{color:#6c3e83;background:0 0;border:1px solid #9666a8}.step-actions button[data-v-df9a5d3d]:last-child{margin-left:auto}@media (width<=600px){.tutorial-hero[data-v-df9a5d3d]{min-height:250px}.tutorial-hero .hero-mark[data-v-df9a5d3d]{width:88px;height:88px}.tutorial-content>header[data-v-df9a5d3d]{flex-wrap:wrap}.tutorial-content>header>.start-tutorial[data-v-df9a5d3d]{width:100%;margin-left:0}.step-actions[data-v-df9a5d3d]{grid-template-columns:1fr;display:grid}.step-actions[data-v-df9a5d3d] :where(a,button){box-sizing:border-box;text-align:center;width:100%}.step-actions button[data-v-df9a5d3d]:last-child{margin-left:0}}@media (prefers-reduced-motion:reduce){.tutorial-hero[data-v-df9a5d3d]{animation:none}}[data-theme=dark] .tutorial-workspace .tutorial-hero{background:radial-gradient(circle,#975ecf42 0,#975ecf14 34%,#0000 62%),radial-gradient(circle,#528eb033 0,#528eb00f 38%,#0000 66%),linear-gradient(135deg,#211829,#17121d 58%,#18222b);border-color:#d3b5e52e}[data-theme=dark] .tutorial-workspace .tutorial-hero h1{color:#ead8f3}[data-theme=dark] .tutorial-workspace .tutorial-hero p{color:#c8bbcf}[data-theme=dark] .tutorial-workspace .step-list article,[data-theme=dark] .tutorial-workspace .step-list article.open{background:#241b29;border-color:#4d3a58}[data-theme=dark] .tutorial-workspace .step-actions button.practice,[data-theme=dark] .tutorial-workspace .step-actions button.secondary,[data-theme=dark] .tutorial-workspace .step-body a,[data-theme=dark] .tutorial-workspace .step-body p,[data-theme=dark] .tutorial-workspace .step-head,[data-theme=dark] .tutorial-workspace .step-head>b{color:#e2c7ee}[data-theme=dark] .tutorial-workspace .step-head small{color:#c99cdd}[data-theme=dark] .tutorial-workspace .step-body{border-color:#5f4670}.tutorial-workspace :is(.tutorial-hero>div>span,.tutorial-content>header span){font-size:.75rem;line-height:1.45}.tutorial-workspace .step-head small{font-size:.73rem;line-height:1.4}.tutorial-workspace :is(.tutorial-hero span,.tutorial-content header span){color:var(--pet-care-label-color,#5574e5b8)}
