.ftlc-core-wheel{box-sizing:border-box;width:100%;min-width:0;}
.ftlc-core-wheel{--ink:#232b50;--muted:#7a83ae;--purple:#6659dd;--purpleDeep:#5245cc;--red:#ed476e;--line:#e3e6fa}
.ftlc-core-wheel, .ftlc-core-wheel *{box-sizing:border-box}
.ftlc-core-wheel{font-family:Inter,"Microsoft YaHei",system-ui,"Noto Sans CJK SC",sans-serif;color:var(--ink);background:#f3f5ff}
.ftlc-core-wheel{margin:0;min-width:320px;background:radial-gradient(700px 440px at 16% 0%,#edeefe 0%,transparent 85%),#f5f6ff}
.ftlc-core-wheel .main{max-width:1440px;margin:0 auto;padding:24px 22px 36px}
.ftlc-core-wheel .panels{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:stretch}
.ftlc-core-wheel .panel{background:#fff;border:1px solid #e1e5fa;border-radius:24px;padding:27px 29px 25px;box-shadow:0 10px 35px #3846a208;min-width:0}
.ftlc-core-wheel h2{font-size:clamp(22px,2.3vw,29px);margin:0 0 5px;font-weight:800;line-height:1.2}
.ftlc-core-wheel .subtitle{color:#7b88b8;font-size:16px;line-height:1.4;margin:0}
.ftlc-core-wheel .wheel-wrap{position:relative;max-width:620px;margin:10px auto 0;aspect-ratio:1;container-type:inline-size}
.ftlc-core-wheel .rotor{position:absolute;inset:0;border-radius:50%;transform:rotate(var(--rotation,-150deg));transition:transform .83s cubic-bezier(.2,.7,.17,1)}
.ftlc-core-wheel .rotor>svg{width:100%;height:100%;display:block;overflow:visible}
.ftlc-core-wheel .sector{fill:#eaefff;stroke:#fff;stroke-width:5;transition:fill .26s}
.ftlc-core-wheel .sector:nth-of-type(2n){fill:#eae7ff}
.ftlc-core-wheel .sector:nth-of-type(3n){fill:#e4ebff}
.ftlc-core-wheel .sector.selected{fill:#6658db;filter:drop-shadow(0px 3px 4px rgba(95,76,217,.16))}
.ftlc-core-wheel .wheel-item{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%) rotate(var(--counter-rotation,150deg));transition:transform .83s cubic-bezier(.2,.7,.17,1),color .2s;z-index:3;border:0;background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1cqw;min-width:0;width:24cqw;height:26cqw;padding:2cqw 1cqw;color:#3e4b84;cursor:pointer;border-radius:16px}
.ftlc-core-wheel .wheel-item img{width:13cqw;height:10cqw;object-fit:contain;mix-blend-mode:multiply;transition:transform .18s;pointer-events:none}
.ftlc-core-wheel .wheel-item strong{font-size:5cqw;line-height:1.1}
.ftlc-core-wheel .wheel-item small{font-size:2.9cqw;font-weight:600}
.ftlc-core-wheel .wheel-item.selected{color:#fff}
.ftlc-core-wheel .wheel-item.selected img{background:#fff;border-radius:7px;mix-blend-mode:normal;min-height:11cqw}
.ftlc-core-wheel .wheel-item:hover img, .ftlc-core-wheel .wheel-item:focus-visible img{transform:scale(1.13)}
.ftlc-core-wheel .wheel-item:focus-visible{outline:3px solid #ec5277;outline-offset:2px}
.ftlc-core-wheel .wheel-hub{position:absolute;z-index:4;left:50%;top:50%;transform:translate(-50%,-50%);width:40cqw;height:40cqw;background:linear-gradient(160deg,#fff,#f6f5ff);border:1px solid #dfe4fa;border-radius:50%;box-shadow:0 0 0 8px #fff,0 6px 26px rgba(65,60,147,.08);display:flex;justify-content:center;align-items:center;flex-direction:column;text-align:center;pointer-events:none}
.ftlc-core-wheel .wheel-hub .hub-six{color:#ed476e;font:inherit;margin:0 .02em}
.ftlc-core-wheel .wheel-hub b{font-size:5.8cqw;letter-spacing:.03em}
.ftlc-core-wheel .wheel-hub span{font-size:2.7cqw;color:#7a83b7;margin-top:1.5cqw;letter-spacing:.05em}
.ftlc-core-wheel .pointer{position:absolute;right:-2.5%;top:50%;transform:translateY(-50%);width:0;height:0;border-top:14px solid transparent;border-bottom:14px solid transparent;border-right:22px solid #6658db;z-index:6}
.ftlc-core-wheel .right{display:flex;flex-direction:column;gap:0}
.ftlc-core-wheel .char-row{position:relative;flex:1;display:flex;align-items:center;justify-content:center;min-height:0;margin:15px 0 17px}
.ftlc-core-wheel .char-frame{width:min(100%,478px);aspect-ratio:1;position:relative;background:linear-gradient(145deg,#fafbff,#f2f4ff);border:1px solid #dfe3f9;border-radius:24px;display:grid;place-items:center;overflow:hidden}
.ftlc-core-wheel .practice-grid{position:absolute;inset:9%;border:1px solid #d8ddf5;pointer-events:none}
.ftlc-core-wheel .practice-grid:before{content:"";position:absolute;top:0;bottom:0;left:50%;border-left:1px dashed #d2d8f0}
.ftlc-core-wheel .practice-grid:after{content:"";position:absolute;left:0;right:0;top:50%;border-top:1px dashed #d2d8f0}
.ftlc-core-wheel .char-frame>img{display:block;width:100%;height:100%;object-fit:contain;position:relative;z-index:1;transition:opacity .16s}
.ftlc-core-wheel .current-stroke{position:absolute;z-index:4;right:11px;top:11px;min-width:91px;max-width:120px;padding:10px 12px;text-align:center;border:1px solid #dfe2ff;border-radius:16px;background:rgba(255,255,255,.92);box-shadow:0 6px 15px #232b5010}
.ftlc-core-wheel .current-stroke img{height:29px;width:55px;object-fit:contain;display:block;margin:auto}
.ftlc-core-wheel .current-stroke strong{display:block;font-size:27px;color:var(--purple);line-height:1.25}
.ftlc-core-wheel .current-stroke span{display:block;color:#64719d;font-size:15px}
.ftlc-core-wheel .replay-card{border:1px solid #dfe3fa;border-radius:21px;background:linear-gradient(135deg,#f8f9ff,#f0f2ff);padding:17px 20px 19px;cursor:pointer;outline-offset:3px;transition:border-color .2s,box-shadow .2s}
.ftlc-core-wheel .replay-card:hover, .ftlc-core-wheel .replay-card:focus-visible{border-color:#aca5ff;box-shadow:0 8px 26px rgba(95,83,217,.1)}
.ftlc-core-wheel .replay-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.ftlc-core-wheel .replay-title{font-size:21px;font-weight:800;line-height:1.2}
.ftlc-core-wheel .replay-sub{font-size:13px;color:#7884b0;margin:4px 0 0}
.ftlc-core-wheel .play-circle{width:50px;height:50px;border-radius:50%;background:var(--purple);color:#fff;border:5px solid #fff;box-shadow:0 3px 12px #6559dd45;display:grid;place-items:center;flex-shrink:0;font-size:22px}
.ftlc-core-wheel .replay-card.playing .play-circle{background:#4d50b6}
.ftlc-core-wheel .steps{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}
.ftlc-core-wheel .mini{min-width:0;text-align:center;color:#737fa5;font-size:12px;font-weight:700;transition:transform .18s}
.ftlc-core-wheel .mini-image{border:1px solid #e0e5fa;background:#fff;border-radius:10px;aspect-ratio:1;overflow:hidden;display:grid;place-items:center;margin-bottom:4px;transition:background .2s,border-color .2s,box-shadow .2s}
.ftlc-core-wheel .mini img{display:block;width:100%;height:100%;object-fit:contain}
.ftlc-core-wheel .mini.is-current{color:var(--purple);transform:translateY(-2px)}
.ftlc-core-wheel .mini.is-current .mini-image{border:2px solid #7166e8;background:#edeaff;box-shadow:0 3px 9px #6559dd25}
.ftlc-core-wheel .mini.is-done .mini-image{background:#f4f5fc}
@media(max-width:980px){.ftlc-core-wheel .main{padding:14px}
.ftlc-core-wheel .panels{grid-template-columns:1fr}
.ftlc-core-wheel .panel{padding:24px}
.ftlc-core-wheel .wheel-wrap{max-width:520px}
.ftlc-core-wheel .char-frame{max-width:440px}
.ftlc-core-wheel .char-row{margin:16px 0 18px}}
@media(max-width:490px){.ftlc-core-wheel .main{padding:9px}
.ftlc-core-wheel .panels{gap:10px}
.ftlc-core-wheel .panel{padding:19px 15px;border-radius:19px}
.ftlc-core-wheel h2{font-size:23px}
.ftlc-core-wheel .subtitle{font-size:13px}
.ftlc-core-wheel .wheel-wrap{margin-top:8px;max-width:100%}
.ftlc-core-wheel .wheel-item{border-radius:10px}
.ftlc-core-wheel .wheel-hub b{font-size:5.5cqw}
.ftlc-core-wheel .char-frame{width:min(100%,355px)}
.ftlc-core-wheel .current-stroke{min-width:67px;max-width:79px;padding:6px 7px;top:5px;right:5px;border-radius:12px}
.ftlc-core-wheel .current-stroke img{height:19px;width:38px}
.ftlc-core-wheel .current-stroke strong{font-size:22px}
.ftlc-core-wheel .current-stroke span{font-size:12px}
.ftlc-core-wheel .replay-card{padding:14px 11px}
.ftlc-core-wheel .replay-title{font-size:18px}
.ftlc-core-wheel .replay-sub{font-size:12px}
.ftlc-core-wheel .play-circle{width:40px;height:40px;font-size:18px}
.ftlc-core-wheel .steps{gap:3px}
.ftlc-core-wheel .mini{font-size:10px}
.ftlc-core-wheel .mini-image{border-radius:6px}}
@media(prefers-reduced-motion:reduce){.ftlc-core-wheel, .ftlc-core-wheel *, .ftlc-core-wheel *:before, .ftlc-core-wheel *:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}
@media(max-width:490px){.ftlc-core-wheel .wheel-wrap{overflow:clip}
.ftlc-core-wheel .pointer{right:0}}
