/* Abstract ink on paper. Decorative motion never represents task progress. */
body.daoyan-guided .generation-art {
  position:relative;isolation:isolate;flex-shrink:0;
  width:240px;height:200px;max-width:100%;margin:-4px 0 -8px;padding:0;
  border:0;border-radius:0;background:transparent;color:#1458e8;
}
body.daoyan-guided .generation-art::before {
  content:"";position:absolute;z-index:-1;inset:10% 0 0;
  border-radius:50%;background:radial-gradient(ellipse,#eaf1ff 0%,#f4f7ff80 46%,transparent 72%);
}
body.daoyan-guided .generation-art svg { display:block;width:100%;height:100%;overflow:visible; }
body.daoyan-guided .generation-paper { filter:drop-shadow(0 8px 14px #24488809); }
body.daoyan-guided .generation-registration { stroke:#b8cdf0;stroke-width:1;stroke-linecap:round; }
body.daoyan-guided .generation-stroke-guide { stroke:#e7eefb;stroke-width:1.8;stroke-linecap:round; }
body.daoyan-guided .generation-stroke {
  stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:100;stroke-dashoffset:100;
  animation:generation-ink-reveal 5.4s cubic-bezier(.4,0,.2,1) infinite;
}
body.daoyan-guided .generation-stroke-one { stroke:#8aaef5;animation-delay:-.4s; }
body.daoyan-guided .generation-stroke-two { stroke:#1458e8;stroke-width:2.2;animation-delay:.15s; }
body.daoyan-guided .generation-stroke-three { stroke:#6e9af0;animation-delay:.7s; }
body.daoyan-guided .generation-spark { stroke:#9ab9f1;stroke-width:1;stroke-linecap:round; }
body.daoyan-guided .generation-spark-one { transform-origin:213px 48px;animation:generation-sparkle 5.4s ease-in-out infinite; }
body.daoyan-guided .generation-spark-two { transform-origin:26px 146px;animation:generation-sparkle 5.4s 1.8s ease-in-out infinite; }
body.daoyan-guided .generation-ink-dot { animation:generation-ink-pulse 5.4s ease-in-out infinite; }
body.daoyan-guided #generation-panel .generation-scroll { gap:15px; }
body.daoyan-guided #generation-panel .studio-eyebrow { color:#8fa1bc;letter-spacing:.2em; }
body.daoyan-guided #generation-panel .generation-progress { width:160px;height:3px;min-height:3px;margin:2px 0;background-color:#edf2fb; }
@keyframes generation-ink-reveal {
  0%,7% { stroke-dashoffset:100;opacity:0; }
  12% { opacity:1; }
  52%,78% { stroke-dashoffset:0;opacity:1; }
  92%,100% { stroke-dashoffset:0;opacity:0; }
}
@keyframes generation-sparkle {
  0%,18%,82%,100% { opacity:.25;transform:scale(.75); }
  45%,60% { opacity:.9;transform:scale(1); }
}
@keyframes generation-ink-pulse { 0%,100% { opacity:.3; } 50% { opacity:.9; } }
@media(max-width:600px) {
  body.daoyan-guided .generation-art { width:210px;height:175px;margin:-8px 0 -6px; }
  body.daoyan-guided #generation-panel .generation-scroll { gap:13px; }
}
@media(max-height:780px) {
  body.daoyan-guided .generation-art { width:210px;height:175px; }
}
@media(max-height:700px) {
  body.daoyan-guided .generation-art { width:180px;height:150px;margin:-7px 0 -8px; }
  body.daoyan-guided #generation-panel .generation-scroll { gap:10px; }
}
@media(max-height:520px) {
  body.daoyan-guided .generation-art { width:120px;height:100px;margin:-10px 0 -10px; }
  body.daoyan-guided #generation-panel .generation-scroll { gap:7px; }
}
@media(prefers-reduced-motion:reduce) {
  body.daoyan-guided .generation-art *,body.daoyan-guided .generation-art::before { animation:none; }
  body.daoyan-guided .generation-stroke { stroke-dashoffset:0;opacity:1; }
  body.daoyan-guided .generation-spark { opacity:.55;transform:none; }
  body.daoyan-guided .generation-ink-dot { opacity:.65; }
}
@media(forced-colors:active) {
  body.daoyan-guided .generation-art { color:CanvasText; }
  body.daoyan-guided .generation-art::before,body.daoyan-guided .generation-stroke-guide { display:none; }
  body.daoyan-guided .generation-stroke { stroke:CanvasText; }
}
