.dailyPlanPanel,.planBar,.planResult,.sbLayer{--plan:#8B7AD8;--plan-deep:#6650A4;--plan-ink:#34235F;--plan-btn-a:#8978B3;--plan-btn-b:#A294C7;--plan-soft:rgba(139,122,216,.14);--plan-line:rgba(126,111,153,.18)}[data-level=N4].dailyPlanPanel,[data-level=N4].planBar,[data-level=N4].planResult,[data-level=N4].sbLayer{--plan:#5E83C8;--plan-deep:#3D64AE;--plan-ink:#2E4A85;--plan-btn-a:#5E83C8;--plan-btn-b:#8FB0E6;--plan-soft:rgba(94,131,200,.13);--plan-line:rgba(94,131,200,.22)}[data-level=N3].dailyPlanPanel,[data-level=N3].planBar,[data-level=N3].planResult,[data-level=N3].sbLayer{--plan:#C5598F;--plan-deep:#9F3C6E;--plan-ink:#7F2F57;--plan-btn-a:#BE6F94;--plan-btn-b:#D090AC;--plan-soft:rgba(193,92,149,.12);--plan-line:rgba(193,92,149,.22)}.dailyPlanPanel{position:relative;overflow:hidden;border-radius:24px;padding:18px 20px 16px;border:1px solid rgba(255,255,255,.72);background:radial-gradient(130% 190% at 100% 0,color-mix(in srgb,var(--plan) 16%,transparent) 0,rgba(255,255,255,0) 55%),linear-gradient(135deg,rgba(255,255,255,.9) 0,rgba(249,245,255,.8) 55%,rgba(240,232,255,.72) 100%);-webkit-backdrop-filter:blur(16px) saturate(1.5);backdrop-filter:blur(16px) saturate(1.5);box-shadow:0 0 0 1px rgba(102,80,164,.08),inset 0 1px 0 rgba(255,255,255,.9),0 18px 44px rgba(65,45,105,.12);color:#2f2a3d}.dailyPlanPanel:before{content:"";position:absolute;right:-52px;top:-64px;width:210px;height:210px;border-radius:50%;background:radial-gradient(circle at 35% 35%,color-mix(in srgb,var(--plan) 26%,transparent),transparent 62%);pointer-events:none}.dailyPlanPanel>*{position:relative}.dpHead{display:flex;align-items:center;gap:14px;min-width:0}.dpIcon{width:48px;height:48px;flex:0 0 48px;border-radius:16px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--plan-btn-a),var(--plan-btn-b));border:1px solid rgba(255,255,255,.55);box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 10px 22px color-mix(in srgb,var(--plan) 32%,transparent)}.dpLevelMark b{font-size:17px;font-weight:950;letter-spacing:.01em;line-height:1;font-variant-numeric:tabular-nums;text-shadow:0 1px 1px rgba(0,0,0,.08)}.cgIcon.dpLevelMark b{font-size:13.5px}.dpTitle{min-width:0;flex:1 1 auto}.dpTitle p{margin:0 0 4px;color:var(--plan-deep);font-size:13px;font-weight:950;letter-spacing:.02em}.dpTitle strong{display:block;color:#1f1833;font-size:clamp(20px, 3.6vw, 26px);line-height:1.15;font-weight:950;letter-spacing:0}.dpLevels{display:flex;gap:4px;padding:4px;border-radius:999px;flex:none;background:rgba(255,255,255,.72);border:1px solid rgba(126,111,153,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.9)}.dpLevelChip{min-width:40px;height:30px;padding:0 10px;border-radius:999px;border:1px solid transparent;background:0 0;color:#6f638b;font:inherit;font-size:12.5px;font-weight:900;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:4px;transition:background .15s,color .15s,box-shadow .15s}.dpLevelChip:hover{background:rgba(255,255,255,.7)}.dpLevelChip.isOn{color:#fff;background:linear-gradient(135deg,var(--chip,#8b7ad8),color-mix(in srgb,var(--chip,#8b7ad8) 70%,#fff));border-color:rgba(255,255,255,.55);box-shadow:inset 0 1px 0 rgba(255,255,255,.34),0 6px 14px color-mix(in srgb,var(--chip,#8b7ad8) 30%,transparent)}.dpLevelChip svg{width:12px;height:12px}.dpSub{margin:12px 0 0;color:#5f5477;font-size:13.5px;font-weight:700;line-height:1.6}.dpBar{height:10px;margin:14px 0 12px;border-radius:999px;overflow:hidden;position:relative;background:color-mix(in srgb,var(--plan) 12%,rgba(255,255,255,.4));box-shadow:inset 0 1px 2px rgba(65,45,105,.08)}.dpBar span{position:relative;display:block;height:100%;border-radius:999px;overflow:hidden;min-width:0;background:linear-gradient(90deg,var(--plan-btn-a),var(--plan-btn-b));box-shadow:0 0 10px color-mix(in srgb,var(--plan) 45%,transparent);transition:width .5s cubic-bezier(.2,.8,.3,1)}.dpBar span:after{content:"";position:absolute;inset:0;border-radius:999px;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.55) 50%,transparent 70%);transform:translateX(-100%);animation:dpShine 2.2s ease-in-out infinite}@keyframes dpShine{to{transform:translateX(100%)}}.dpStats{display:flex;flex-wrap:wrap;gap:6px 14px;color:#6f638b;font-size:12.5px;font-weight:800}.dpStats span{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}.dpStats svg{color:var(--plan)}.dpStats b{color:#1f1833;font-size:14px;font-weight:950;font-variant-numeric:tabular-nums}.dpActions{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}.dpPrimary,.dpSecondary{min-height:46px;padding:0 18px;border-radius:999px;font:inherit;font-size:14.5px;font-weight:950;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;position:relative;transition:transform .14s cubic-bezier(.4,0,.2,1),box-shadow .18s,background .18s;-webkit-tap-highlight-color:transparent}.dpPrimary{flex:1 1 auto;color:#fff;border:1px solid rgba(255,255,255,.55);background:radial-gradient(circle at 24% 18%,rgba(255,255,255,.28),transparent 48%),linear-gradient(135deg,var(--plan-btn-a),var(--plan-btn-b));box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 12px 26px color-mix(in srgb,var(--plan) 30%,transparent)}.dpPrimary:active{transform:scale(.97)}.dpSecondary{color:var(--plan-deep);border:1px solid rgba(255,255,255,.85);background:rgba(255,255,255,.82);box-shadow:0 0 0 1px color-mix(in srgb,var(--plan) 18%,transparent),inset 0 1px 0 #fff,0 5px 12px rgba(65,45,105,.05)}.dpSecondary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 0 0 1px color-mix(in srgb,var(--plan) 34%,transparent),inset 0 1px 0 #fff,0 10px 20px rgba(65,45,105,.1)}.dpSecondary:disabled{opacity:.45;cursor:default}.dpSecondary.isSuggested{box-shadow:0 0 0 1.5px color-mix(in srgb,var(--plan) 45%,transparent),inset 0 1px 0 #fff,0 6px 14px rgba(65,45,105,.07)}.dpDot{position:absolute;top:9px;right:11px;width:7px;height:7px;border-radius:50%;background:#d66ba8;box-shadow:0 0 0 2px #fff}.dpGoal{margin-top:16px;padding-top:14px;border-top:1px dashed color-mix(in srgb,var(--plan) 30%,rgba(126,111,153,.2))}.dpGoalRow{display:flex;align-items:center;flex-wrap:wrap;gap:8px 10px}.dpGoalLabel{color:var(--plan-deep);font-size:13px;font-weight:950}.dpGoalChips{display:inline-flex;gap:4px;padding:4px;border-radius:999px;background:rgba(255,255,255,.72);border:1px solid rgba(126,111,153,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.9)}.dpGoalChips button{min-width:42px;height:32px;padding:0 10px;border-radius:999px;border:1px solid transparent;background:0 0;color:#6f638b;font:inherit;font-size:13.5px;font-weight:950;font-variant-numeric:tabular-nums;cursor:pointer;transition:background .15s,color .15s}.dpGoalChips button:hover{background:rgba(255,255,255,.7)}.dpGoalChips button.isOn{color:#fff;background:linear-gradient(135deg,var(--plan-btn-a),var(--plan-btn-b));border-color:rgba(255,255,255,.55);box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 6px 14px color-mix(in srgb,var(--plan) 30%,transparent)}.dpGoalUnit{color:#6f638b;font-size:12.5px;font-weight:800}.dpHint{display:block;margin-top:9px;color:#7c748c;font-size:11.5px;font-weight:650;line-height:1.65}@media (max-width:520px){.dailyPlanPanel{padding:16px 16px 14px;border-radius:22px}.dpHead{flex-wrap:wrap;gap:10px 12px}.dpIcon{width:42px;height:42px;flex-basis:42px;border-radius:14px}.dpTitle{flex-basis:calc(100% - 54px)}.dpLevels{margin-left:54px}.dpTitle strong{font-size:20px}.dpActions .dpPrimary{flex-basis:100%}.dpActions .dpSecondary{flex:1 1 auto}.dpHint{font-size:11px}}.planBar{width:min(900px,100%);margin:0 auto 12px;display:flex;align-items:center;gap:10px;padding:8px 8px 8px 6px;border-radius:20px;border:1px solid var(--plan-line);background:radial-gradient(circle at 0 0,color-mix(in srgb,var(--plan) 16%,transparent),transparent 52%),linear-gradient(180deg,rgba(255,255,255,.94),color-mix(in srgb,var(--plan) 6%,#fff));box-shadow:inset 0 1px 0 rgba(255,255,255,.92),0 12px 30px rgba(45,32,78,.06);color:#2f2a3d}.planBar.isCards{box-sizing:border-box;width:min(720px,100%)}.planBarExit{flex:none;height:38px;padding:0 12px 0 6px;border-radius:999px;border:1px solid rgba(126,111,153,.16);background:rgba(255,255,255,.8);color:var(--plan-deep);font:inherit;font-size:12.5px;font-weight:900;cursor:pointer;display:inline-flex;align-items:center;gap:2px;box-shadow:inset 0 1px 0 rgba(255,255,255,.9)}.planBarExit:active{transform:scale(.95)}.planBarInfo{min-width:0;flex:1 1 auto;display:grid;gap:2px}.planBarInfo b{font-size:14px;font-weight:950;color:var(--plan-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.planBarStage{margin-left:8px;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:900;color:var(--plan-deep);background:color-mix(in srgb,var(--plan) 12%,#fff);vertical-align:1px}.planBarInfo small{font-size:11.5px;font-weight:800;color:#6f638b;font-variant-numeric:tabular-nums}.planBarNext{flex:none;height:40px;padding:0 12px 0 16px;border-radius:999px;font:inherit;font-size:13.5px;font-weight:950;cursor:pointer;display:inline-flex;align-items:center;gap:4px;color:var(--plan-deep);border:1px solid rgba(255,255,255,.85);background:rgba(255,255,255,.85);box-shadow:0 0 0 1px color-mix(in srgb,var(--plan) 20%,transparent),inset 0 1px 0 #fff;transition:transform .14s,background .18s,color .18s,box-shadow .18s}.planBarNext.isReady{color:#fff;border-color:rgba(255,255,255,.55);background:linear-gradient(135deg,var(--plan-btn-a),var(--plan-btn-b));box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 10px 22px color-mix(in srgb,var(--plan) 32%,transparent)}.planBarNext:active{transform:scale(.96)}@media (max-width:520px){.planBar{border-radius:18px;gap:8px}.planBarExit{padding-right:10px}.planBarInfo b{font-size:13px}.planBarStage{margin-left:6px}.planBarNext{padding:0 10px 0 13px;font-size:13px}}.planResult{position:relative;overflow:visible;width:min(640px,100%);margin:0 auto;padding:20px 20px 22px;border-radius:26px;text-align:center;color:#2f2a3d;border:1px solid rgba(255,255,255,.72);background:radial-gradient(120% 160% at 100% 0,color-mix(in srgb,var(--plan) 14%,transparent),rgba(255,255,255,0) 55%),linear-gradient(145deg,rgba(255,255,255,.9),rgba(255,255,255,.62));-webkit-backdrop-filter:blur(28px) saturate(1.45);backdrop-filter:blur(28px) saturate(1.45);box-shadow:inset 0 1px 0 rgba(255,255,255,.88),0 20px 52px rgba(52,35,95,.11)}.planResultIcon{width:78px;height:78px;margin:0 auto 12px;border-radius:50%;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--plan-btn-a),var(--plan-btn-b));box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 14px 30px color-mix(in srgb,var(--plan) 32%,transparent)}.planResult.isFail .planResultIcon{background:linear-gradient(135deg,#b08a8a,#c9a6a6);box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 14px 30px rgba(176,138,138,.3)}.planResult h2{margin:0 0 6px;font-size:22px;font-weight:950;letter-spacing:0;color:#1f1833}.planResultScore{display:flex;align-items:baseline;justify-content:center;gap:4px;font-variant-numeric:tabular-nums;margin:4px 0 8px}.planResultScore b{font-size:46px;line-height:1;font-weight:950;color:var(--plan-ink)}.planResultScore span{font-size:20px;font-weight:900;color:#6f638b}.planResultScore em{margin-left:10px;padding:4px 10px;border-radius:999px;font-style:normal;font-size:13px;font-weight:950;color:var(--plan-deep);background:color-mix(in srgb,var(--plan) 12%,#fff)}.planResultVerdict{margin:0 auto;max-width:420px;color:#5f5477;font-size:14px;font-weight:750;line-height:1.65}.planResultWrong{margin:16px auto 0;text-align:left}.planResultWrong p{margin:0 0 8px;color:var(--plan-deep);font-size:12.5px;font-weight:950}.planResultWrong ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}.planResultWrong li{display:inline-flex;align-items:baseline;gap:6px;padding:7px 11px;border-radius:14px;background:rgba(255,255,255,.8);border:1px solid rgba(126,111,153,.16);box-shadow:inset 0 1px 0 #fff}.planResultWrong b{font-size:16px;font-weight:700;color:#1f1833;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN","Hiragino Sans",sans-serif}.planResultWrong span{font-size:12px;color:#6f638b;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN","Hiragino Sans",sans-serif}.planResultWrong em{font-style:normal;font-size:12px;font-weight:800;color:#5f5477}.planResultActions{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:18px}.planResultActions .dpPrimary{flex:1 1 200px}.planResultActions .dpSecondary{flex:1 1 140px}.planPictureQuiz{width:min(620px,100%);margin:0 auto;display:grid;gap:12px}.planPicFrame{aspect-ratio:1.45/1;max-height:330px;padding:18px 14px;box-sizing:border-box;border-radius:22px;overflow:hidden;background:#fff;border:1px solid rgba(126,111,153,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 14px 34px rgba(65,45,105,.1);display:grid;place-items:center;justify-self:center;width:100%;max-width:calc(330px * 1.45)}.planPicSvg{width:100%;height:100%;display:block;filter:brightness(1.012)}.planPicQuestion{display:grid;justify-items:center;gap:4px;text-align:center;padding:0 8px}.planPicQBadge{font-size:11px;font-weight:950;letter-spacing:.12em;color:var(--plan-deep,#6650a4);background:color-mix(in srgb,var(--plan,#8b7ad8) 12%,#fff);border-radius:999px;padding:3px 10px}.planPicQuestion b{font-size:17px;font-weight:950;color:#1f1833;line-height:1.5}.planPicQuestion small{font-size:12.5px;font-weight:800;color:var(--plan-deep,#6650a4);line-height:1.5}.planPictureQuiz:not(.isAnswered) .practiceBox .promptMeaning{display:none!important}.planPictureQuiz:not(.isAnswered) .practiceBox .practicePrompt{display:none!important}.planPictureQuiz .practiceBox .practicePrompt .soundButton{display:none!important}.planPictureQuiz:not(.isAnswered) .practiceBox .promptKanji{display:none!important}.planPictureQuiz.isAnswered .practiceBox .promptMeaning{font-size:14px!important;font-weight:800!important;color:#6f638b!important}.planPicActions{width:min(560px,100%);margin:0 auto}.planPicActions button:disabled{opacity:.45;cursor:default}@keyframes dpFadeUp{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}.planStars{display:inline-flex;align-items:center;gap:3px;vertical-align:middle}.planStar{flex:none;display:block;fill:rgba(255,255,255,.75);stroke:color-mix(in srgb,var(--plan,#8B7AD8) 40%,#fff)}.planStar.isOn{fill:#F2C94C;stroke:#C99A2E}.planStars.isBig{display:flex;justify-content:center;gap:12px;margin:4px 0 8px}.planStars.isBig .planStar{overflow:visible}.planStars.isBig .planStar.isOn{filter:drop-shadow(0 5px 9px rgba(201,154,46,.32));animation:planStarPop .56s cubic-bezier(.3,1.4,.5,1) var(--d,0ms) both}@keyframes planStarPop{0%{fill:rgba(255,255,255,.75);stroke:color-mix(in srgb,var(--plan,#8B7AD8) 40%,#fff);transform:scale(1)}30%{transform:scale(.78)}65%{fill:#F2C94C;stroke:#C99A2E;transform:scale(1.24) rotate(10deg)}100%{fill:#F2C94C;stroke:#C99A2E;transform:none}}.planStamp{display:inline-block;color:var(--plan-deep)}.planStampSvg{display:block;width:100%;height:100%;overflow:visible}.planStampSvg text{fill:currentColor;stroke:none;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic",sans-serif;font-weight:900}.planResultStamp{position:absolute;top:-12px;right:-6px;width:112px;height:112px;z-index:2;pointer-events:none;opacity:.92;transform:rotate(-12deg);mix-blend-mode:multiply;animation:planStampIn .44s cubic-bezier(.2,.9,.3,1.25) var(--d,0ms) both}@keyframes planStampIn{0%{opacity:0;transform:scale(1.9) rotate(-28deg)}70%{opacity:.95;transform:scale(.93) rotate(-9deg)}100%{opacity:.92;transform:scale(1) rotate(-12deg)}}.planResultMascot{width:92px;height:92px;margin:0 auto 4px}.planResultMascot .jpl-cheer .jpl-stage{--m:92px}.planStampCaption{margin:0 0 8px;display:flex;justify-content:center;align-items:baseline;flex-wrap:wrap;gap:4px 8px;animation:dpFadeUp .4s ease var(--d,0ms) both}.planStampCaption b{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN","Hiragino Sans",sans-serif;font-size:15px;font-weight:900;letter-spacing:.04em;color:var(--plan-deep)}.planStampCaption span{font-size:12.5px;font-weight:800;color:#6f638b}.planResult.isFail .planStars.isBig{opacity:.85}.planConfetti{position:absolute;left:50%;top:92px;width:0;height:0;z-index:3;pointer-events:none}.planConfetti i{position:absolute;left:-4px;top:-6px;width:8px;height:12px;border-radius:2px;background:var(--c);opacity:0;animation:planConfetti 1.55s cubic-bezier(.2,.7,.4,1) both}.planConfetti i.isDot{width:8px;height:8px;border-radius:50%}@keyframes planConfetti{0%{opacity:0;transform:translate(0,0) rotate(0) scale(.5)}8%{opacity:1}40%{opacity:1;transform:translate(calc(var(--tx) * .7),var(--ty)) rotate(calc(var(--rot) * .45)) scale(1)}100%{opacity:0;transform:translate(var(--tx),170px) rotate(var(--rot)) scale(.9)}}.planRewardChips{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin:12px auto 0;animation:dpFadeUp .35s ease both}.planRewardChip{display:inline-flex;align-items:center;gap:5px;padding:6px 11px;border-radius:999px;font-size:12px;font-weight:900;color:var(--plan-deep);background:rgba(255,255,255,.84);border:1px solid color-mix(in srgb,var(--plan) 20%,transparent);box-shadow:inset 0 1px 0 #fff}.planRewardChip>svg{color:var(--plan)}.planBadgeNew{max-width:460px;margin:12px auto 0;padding:10px 12px 12px;border-radius:18px;background:linear-gradient(135deg,color-mix(in srgb,var(--plan) 12%,#fff),rgba(255,255,255,.86));border:1px solid color-mix(in srgb,var(--plan) 24%,transparent);animation:dpFadeUp .45s ease .1s both}.planBadgeNew>p{margin:0 0 8px;display:flex;align-items:center;justify-content:center;gap:6px;font-size:12.5px;font-weight:950;color:var(--plan-deep)}.planBadgeList{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 16px}.planBadgeItem{display:grid;justify-items:center;gap:5px}.planBadgeItem b{font-size:12px;font-weight:900;color:#2f2a3d}.badgeMark{position:relative;width:44px;height:44px;flex:none;border-radius:50%;display:grid;place-items:center;color:#a69db6;background:rgba(255,255,255,.72);border:1.5px dashed rgba(126,111,153,.32)}.badgeMark.isEarned{color:#fff;border:1px solid rgba(255,255,255,.6);background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.34),transparent 55%),linear-gradient(135deg,var(--plan-btn-a),var(--plan-btn-b));box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 8px 18px color-mix(in srgb,var(--plan) 28%,transparent)}.badgeMark i{position:absolute;right:-5px;bottom:-3px;min-width:20px;height:18px;padding:0 5px;border-radius:999px;font-style:normal;font-size:10.5px;font-weight:950;line-height:18px;text-align:center;color:var(--plan-deep);background:#fff;box-shadow:0 0 0 1.5px color-mix(in srgb,var(--plan) 30%,#fff);font-variant-numeric:tabular-nums}.badgeMark:not(.isEarned) i{color:#a69db6;box-shadow:0 0 0 1.5px rgba(126,111,153,.2)}.badgeMark .miniStamp{color:inherit}.miniStamp{display:block;flex:none}.dpReward{display:flex;align-items:center;gap:10px;margin-top:12px;padding:8px 8px 8px 10px;border-radius:18px;background:rgba(255,255,255,.66);border:1px solid rgba(255,255,255,.8);box-shadow:0 0 0 1px color-mix(in srgb,var(--plan) 12%,transparent),inset 0 1px 0 #fff}.dpWeek{flex:1 1 auto;min-width:0;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:2px}.dpDay{display:grid;justify-items:center;gap:4px;min-width:0}.dpDay small{font-size:10.5px;font-weight:900;line-height:1;color:#8a7fa6}.dpDay.isToday small{color:var(--plan-deep)}.dpDayMark{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;color:var(--plan-deep);border:1.5px dashed color-mix(in srgb,var(--plan) 26%,transparent)}.dpDay.isStamped .dpDayMark{border:0;background:color-mix(in srgb,var(--plan) 10%,#fff)}.dpDay.isStamped .miniStamp{transform:rotate(-10deg)}.dpDay.isToday .dpDayMark{border:1.5px solid var(--plan);box-shadow:0 0 0 3px color-mix(in srgb,var(--plan) 13%,transparent)}.dpDay.isFuture .dpDayMark{opacity:.5}.dpBookBtn{flex:none;display:grid;justify-items:center;align-content:center;gap:3px;min-width:66px;min-height:54px;padding:6px 9px;border-radius:15px;border:1px solid rgba(255,255,255,.85);background:rgba(255,255,255,.9);color:var(--plan-deep);font:inherit;cursor:pointer;box-shadow:0 0 0 1px color-mix(in srgb,var(--plan) 18%,transparent),inset 0 1px 0 #fff,0 5px 12px rgba(65,45,105,.05);transition:transform .14s,box-shadow .18s;-webkit-tap-highlight-color:transparent}.dpBookBtn:hover{transform:translateY(-1px);box-shadow:0 0 0 1px color-mix(in srgb,var(--plan) 32%,transparent),inset 0 1px 0 #fff,0 10px 20px rgba(65,45,105,.1)}.dpBookBtn:active{transform:scale(.96)}.dpBookStars{display:inline-flex;align-items:center;gap:4px}.dpBookStars b{font-size:15px;font-weight:950;color:#1f1833;font-variant-numeric:tabular-nums}.dpBookLabel{display:inline-flex;align-items:center;gap:1px;font-size:11.5px;font-weight:900;white-space:nowrap}@media (max-width:520px){.dpReward{gap:6px;padding:7px 6px 7px 7px}.dpDayMark{width:28px;height:28px}.dpDayMark .miniStamp{width:24px;height:24px}.dpBookBtn{min-width:58px;padding:6px 6px}}@media (max-width:360px){.dpDayMark{width:25px;height:25px}.dpDayMark .miniStamp{width:21px;height:21px}}.sbLayer{position:fixed;inset:0;z-index:70;display:grid;place-items:center;padding:16px;color:#2f2a3d;font-family:-apple-system,system-ui,"Segoe UI","Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif}.sbBackdrop{position:absolute;inset:0;background:rgba(47,42,61,.28);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);animation:sbFade .2s ease both}.sbSheet{position:relative;width:min(640px,100%);max-height:min(88vh,860px);display:flex;flex-direction:column;overflow:hidden;outline:0;border-radius:26px;background:linear-gradient(180deg,#fcfaff 0,#f6f2fc 100%);box-shadow:0 30px 80px rgba(47,32,90,.25),0 0 0 1px rgba(255,255,255,.7);animation:sbIn .28s cubic-bezier(.2,.8,.3,1) both}.sbHead{flex:none;display:flex;align-items:center;gap:12px;padding:16px 16px 12px 18px;background:rgba(255,255,255,.72);border-bottom:1px solid rgba(126,111,153,.12)}.sbHeadIcon{width:40px;height:40px;flex:none;border-radius:14px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--plan-btn-a),var(--plan-btn-b));box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 8px 18px color-mix(in srgb,var(--plan) 28%,transparent)}.sbHeadTitle{flex:1 1 auto;min-width:0}.sbHeadTitle h2{margin:0;font-size:19px;font-weight:950;letter-spacing:0;color:#1f1833}.sbHeadTitle small{display:flex;align-items:center;flex-wrap:wrap;gap:3px;margin-top:3px;font-size:12px;font-weight:800;color:#6f638b}.sbClose{width:38px;height:38px;flex:none;border-radius:50%;display:grid;place-items:center;cursor:pointer;border:1px solid rgba(126,111,153,.16);background:rgba(255,255,255,.9);color:var(--plan-deep)}.sbClose:active{transform:scale(.94)}.sbBody{flex:1 1 auto;overflow:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;display:grid;gap:12px;align-content:start;padding:14px 14px calc(20px + env(safe-area-inset-bottom,0px))}.sbSec{padding:14px;border-radius:20px;background:rgba(255,255,255,.82);border:1px solid rgba(255,255,255,.9);box-shadow:0 0 0 1px rgba(102,80,164,.07),0 10px 24px rgba(63,52,93,.05)}.sbSecHead{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 8px;margin-bottom:10px}.sbSecHead h3{margin:0;font-size:15px;font-weight:950;color:#2f2a3d}.sbSecHead small{font-size:11.5px;font-weight:800;color:#7c748c}.sbMonthNav{margin-left:auto;display:flex;gap:4px;align-self:center}.sbMonthNav button{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;cursor:pointer;border:1px solid rgba(126,111,153,.16);background:#fff;color:var(--plan-deep)}.sbMonthNav button:disabled{opacity:.35;cursor:default}.sbCal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;max-width:440px;margin:0 auto}.sbCalHead{text-align:center;font-size:11px;font-weight:900;color:#8a7fa6;padding-bottom:2px}.sbCalCell{aspect-ratio:1;min-width:0;border-radius:12px;display:grid;place-items:center;color:var(--plan-deep);background:rgba(246,243,250,.8)}.sbCalCell i{font-style:normal;font-size:12px;font-weight:800;color:#9a91ab;font-variant-numeric:tabular-nums}.sbCalCell.isEmpty{background:0 0}.sbCalCell.isStamped{background:color-mix(in srgb,var(--plan) 10%,#fff)}.sbCalCell.isStamped .miniStamp{transform:rotate(-10deg);width:78%;height:78%}.sbCalCell.isToday{box-shadow:inset 0 0 0 1.5px var(--plan)}.sbCalCell.isToday i{color:var(--plan-deep)}.sbCalCell.isFuture i{opacity:.45}.sbLegend{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:10px}.sbLegend span{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;color:var(--plan-deep)}.sbLegend b{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN","Hiragino Sans",sans-serif;font-weight:800}.sbLegend em{font-style:normal;font-weight:700;color:#7c748c}.sbTiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px}.sbTile{min-height:106px;padding:10px 10px 9px;border-radius:16px;display:grid;gap:5px;align-content:start;background:#fff;border:1px solid rgba(126,111,153,.14)}.sbTileHead{display:flex;align-items:center;justify-content:space-between;gap:6px;color:var(--plan-deep)}.sbTileHead b{font-size:13.5px;font-weight:950;color:#2f2a3d}.sbTileHead .miniStamp{transform:rotate(-10deg)}.sbTile small{font-size:11px;font-weight:800;color:#7c748c;font-variant-numeric:tabular-nums}.sbTile.isPerfect{background:linear-gradient(160deg,#fff,color-mix(in srgb,var(--plan) 9%,#fff));border-color:color-mix(in srgb,var(--plan) 26%,transparent)}.sbTile.isOpen{border-style:dashed;border-color:color-mix(in srgb,var(--plan) 42%,transparent)}.sbTile.isLocked{background:rgba(246,243,250,.6)}.sbTile.isLocked .sbTileHead,.sbTile.isLocked .sbTileHead b{color:#9a91ab}.sbTile.isMore{place-items:center;align-content:center;background:0 0;border-style:dashed}.sbTile.isMore b{font-size:12.5px;font-weight:900;color:#8a7fa6}.sbTileNote{font-size:11px;font-weight:900;color:var(--plan-deep)}.sbRetry{justify-self:start;height:28px;padding:0 10px;border-radius:999px;display:inline-flex;align-items:center;gap:4px;cursor:pointer;border:1px solid color-mix(in srgb,var(--plan) 26%,transparent);background:color-mix(in srgb,var(--plan) 8%,#fff);color:var(--plan-deep);font:inherit;font-size:11.5px;font-weight:900}.sbRetry:active{transform:scale(.95)}.sbBadges{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:12px 8px}.sbBadge{display:grid;justify-items:center;align-content:start;text-align:center;gap:5px;padding:2px}.sbBadge b{font-size:12px;font-weight:900;line-height:1.3;color:#2f2a3d}.sbBadge small{font-size:10.5px;font-weight:700;line-height:1.35;color:#8a7fa6}.sbBadge:not(.isEarned) b{color:#8a7fa6}.sbEmpty{margin:0;font-size:12.5px;font-weight:700;color:#7c748c}@keyframes sbFade{from{opacity:0}to{opacity:1}}@keyframes sbIn{from{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:none}}@keyframes sbUp{from{opacity:0;transform:translateY(48px)}to{opacity:1;transform:none}}@media (max-width:560px){.sbLayer{place-items:end center;padding:0}.sbSheet{width:100%;max-height:92vh;border-radius:26px 26px 0 0;animation-name:sbUp}.sbTiles{grid-template-columns:repeat(auto-fill,minmax(104px,1fr))}}@media (prefers-reduced-motion:reduce){.planConfetti{display:none}.planBadgeNew,.planResultStamp,.planRewardChips,.planStampCaption,.planStars.isBig .planStar.isOn,.sbBackdrop,.sbSheet{animation:none!important}.planStars.isBig .planStar.isOn{fill:#F2C94C;stroke:#C99A2E}}.cardsGoal{--plan:#8B7AD8;--plan-deep:#6650A4;--plan-ink:#34235F;--plan-btn-a:#8978B3;--plan-btn-b:#A294C7;box-sizing:border-box;width:min(720px,100%);justify-self:center;display:grid;gap:10px;padding:12px 14px;border-radius:20px;color:#2f2a3d;border:1px solid rgba(255,255,255,.72);background:radial-gradient(120% 170% at 100% 0,color-mix(in srgb,var(--plan) 14%,transparent),rgba(255,255,255,0) 55%),linear-gradient(135deg,rgba(255,255,255,.9),rgba(249,245,255,.78));box-shadow:0 0 0 1px rgba(102,80,164,.08),inset 0 1px 0 rgba(255,255,255,.9),0 12px 30px rgba(65,45,105,.08)}[data-level=N4].cardsGoal{--plan-deep:#3D64AE;--plan-ink:#2E4A85;--plan-btn-a:#5E83C8;--plan-btn-b:#8FB0E6}[data-level=N3].cardsGoal{--plan-deep:#9F3C6E;--plan-ink:#7F2F57;--plan-btn-a:#BE6F94;--plan-btn-b:#D090AC}.cgHead{display:flex;align-items:center;gap:10px;min-width:0}.cgIcon{width:36px;height:36px;flex:none;border-radius:12px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--plan-btn-a),var(--plan-btn-b));border:1px solid rgba(255,255,255,.55);box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 8px 18px color-mix(in srgb,var(--plan) 28%,transparent)}.cgTitle{flex:1 1 auto;min-width:0}.cgTitle p{margin:0 0 2px;font-size:11.5px;font-weight:900;color:var(--plan-deep);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cgTitle strong{display:block;font-size:15.5px;font-weight:950;line-height:1.3;color:#1f1833}.cgCheck{flex:none;display:inline-flex;align-items:center;gap:5px;height:30px;padding:0 10px 0 8px;border-radius:999px;font-size:12px;font-weight:900;white-space:nowrap;color:#8a7fa6;background:rgba(255,255,255,.7);border:1.5px dashed color-mix(in srgb,var(--plan) 30%,transparent)}.cgCheck.isChecked{color:var(--plan-deep);border:1px solid color-mix(in srgb,var(--plan) 26%,transparent);background:color-mix(in srgb,var(--plan) 11%,#fff)}.cgCheck.isChecked .miniStamp{color:var(--plan-deep);transform:rotate(-10deg)}.cgBody{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px 14px}.cgWeekWrap{display:flex;align-items:center;gap:8px;min-width:0;padding:6px 8px;border-radius:16px;background:rgba(255,255,255,.66);box-shadow:0 0 0 1px color-mix(in srgb,var(--plan) 12%,transparent),inset 0 1px 0 #fff}.cgWeek{flex:1 1 auto}.cgWeek .dpDayMark{width:26px;height:26px}.cgWeek .dpDay small{font-size:10px}.cgStreak{flex:none;display:inline-flex;align-items:center;gap:2px;padding:0 2px 0 6px;border-left:1px solid color-mix(in srgb,var(--plan) 16%,transparent);color:var(--plan);font-size:12px}.cgStreak b{color:#1f1833;font-size:14px;font-weight:950;font-variant-numeric:tabular-nums}.cgActions{display:flex;gap:8px}.cgActions .dpPrimary,.cgActions .dpSecondary{min-height:42px;font-size:13.5px;padding:0 16px}.cgActions .dpPrimary{flex:0 1 auto}.cgHint{display:block;margin-top:-2px;font-size:11px;font-weight:650;line-height:1.55;color:#7c748c}.cgOrder{display:flex;align-items:center;gap:10px;min-width:0}.cgOrderLabel{flex:none;font-size:11.5px;font-weight:900;color:var(--plan-deep)}.cgOrderSeg{flex:1 1 auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:4px;border-radius:16px;background:rgba(255,255,255,.66);box-shadow:0 0 0 1px color-mix(in srgb,var(--plan) 12%,transparent),inset 0 1px 0 #fff}.cgOrderBtn{appearance:none;min-width:0;min-height:44px;display:grid;align-content:center;justify-items:center;gap:1px;padding:5px 6px;border:0;border-radius:12px;background:0 0;color:#5d5670;font:inherit;cursor:pointer;transition:background .15s ease,color .15s ease,box-shadow .15s ease}.cgOrderBtn b{font-size:13px;font-weight:900;line-height:1.25;white-space:nowrap}.cgOrderBtn small{font-size:10.5px;font-weight:700;line-height:1.25;color:#8a8298;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.cgOrderBtn:not(.isOn):hover{background:rgba(255,255,255,.9);color:var(--plan-deep)}.cgOrderBtn.isOn{color:#fff;background:linear-gradient(135deg,var(--plan-btn-a),var(--plan-btn-b));box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 6px 14px color-mix(in srgb,var(--plan) 26%,transparent)}.cgOrderBtn.isOn small{color:rgba(255,255,255,.9)}.cgOrderBtn:focus-visible{outline:2px solid var(--plan);outline-offset:2px}.cgGroups{display:flex;gap:6px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;margin:0 -4px;padding:2px 4px 6px;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--plan) 30%,transparent) transparent}.cgGroup{flex:none;scroll-snap-align:center;min-width:52px;height:50px;padding:0 8px;display:grid;align-content:center;justify-items:center;gap:1px;border:1px solid color-mix(in srgb,var(--plan) 16%,transparent);border-radius:14px;background:rgba(255,255,255,.78);color:#4d4560;font:inherit;cursor:pointer;transition:background .15s ease,box-shadow .15s ease}.cgGroup b{display:inline-flex;align-items:center;gap:2px;font-size:14px;font-weight:950;line-height:1.1;font-variant-numeric:tabular-nums}.cgGroup small{max-width:64px;font-size:10.5px;font-weight:700;line-height:1.2;color:#8a8298;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cgGroup.isAll{min-width:64px}.cgGroup.isDone b{color:var(--plan-deep)}.cgGroup.isDone b svg{color:var(--plan)}.cgGroup:not(.isOn):hover{background:#fff;box-shadow:0 0 0 1px color-mix(in srgb,var(--plan) 30%,transparent)}.cgGroup.isOn{color:#fff;border-color:rgba(255,255,255,.55);background:linear-gradient(135deg,var(--plan-btn-a),var(--plan-btn-b));box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 6px 14px color-mix(in srgb,var(--plan) 26%,transparent)}.cgGroup.isOn b,.cgGroup.isOn b svg,.cgGroup.isOn small{color:#fff}.cgGroup:focus-visible{outline:2px solid var(--plan);outline-offset:2px}.dpGoalUnit b{color:var(--plan-ink);font-size:14px;font-weight:950}.dpGoalEdit{margin-left:auto;display:inline-flex;align-items:center;gap:5px;height:30px;padding:0 12px;border-radius:999px;border:1px solid color-mix(in srgb,var(--plan) 26%,transparent);background:rgba(255,255,255,.8);color:var(--plan-deep);font:inherit;font-size:12px;font-weight:900;cursor:pointer}.dpGoalEdit:hover{background:#fff}@media (max-width:640px){.cgOrder{flex-direction:column;align-items:stretch;gap:6px}.cgOrderBtn b{font-size:12.5px}.cgOrderBtn small{font-size:10px}}@media (max-width:640px){.cardsGoal{padding:11px 12px;border-radius:18px}.cgBody{grid-template-columns:minmax(0,1fr)}.cgActions .dpPrimary{flex:1 1 auto}.cgTitle strong{font-size:14.5px}}@media (max-width:380px){.cgCheck{padding:0 8px 0 6px;font-size:11px}.cgTitle p{font-size:10.5px}.cgWeek .dpDayMark{width:23px;height:23px}.cgWeek .dpDayMark .miniStamp{width:19px;height:19px}}.cgGroupPick{display:grid;gap:8px}.cgStepRow{display:grid;grid-template-columns:auto 42px minmax(0,1fr) 42px;gap:6px;align-items:stretch}.cgStepRow .cgGroup.isAll{min-width:64px}.cgStep{height:50px;padding:0;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--plan) 16%,transparent);border-radius:14px;background:rgba(255,255,255,.78);color:var(--plan-deep);font:inherit;cursor:pointer;transition:background .15s ease,opacity .15s ease}.cgStep:disabled{opacity:.35;cursor:default}.cgStep:not(:disabled):hover{background:#fff;box-shadow:0 0 0 1px color-mix(in srgb,var(--plan) 30%,transparent)}.cgStepCur{height:50px;min-width:0;display:flex;align-items:center;justify-content:space-between;gap:6px;padding:0 10px 0 13px;border:1px solid color-mix(in srgb,var(--plan) 16%,transparent);border-radius:14px;background:rgba(255,255,255,.78);color:#4d4560;font:inherit;text-align:left;cursor:pointer;transition:background .15s ease,box-shadow .15s ease}.cgStepCur.isOn{color:#fff;border-color:rgba(255,255,255,.55);background:linear-gradient(135deg,var(--plan-btn-a),var(--plan-btn-b));box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 6px 14px color-mix(in srgb,var(--plan) 26%,transparent)}.cgStepTxt{display:grid;gap:1px;min-width:0}.cgStepTxt b{display:inline-flex;align-items:center;gap:3px;font-size:14px;font-weight:950;line-height:1.15;white-space:nowrap;font-variant-numeric:tabular-nums}.cgStepTxt small{font-size:11px;font-weight:700;line-height:1.2;color:#8a8298;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cgStepCur.isOn .cgStepTxt small{color:rgba(255,255,255,.86)}.cgStepCaret{flex:none;transition:transform .15s ease}.cgGroupPick.isOpen .cgStepCaret{transform:rotate(180deg)}.cgStep:focus-visible,.cgStepCur:focus-visible{outline:2px solid var(--plan);outline-offset:2px}.cgGrid{position:relative;display:grid;grid-template-columns:repeat(auto-fill,minmax(56px,1fr));gap:6px;max-height:236px;overflow-y:auto;overscroll-behavior:contain;padding:2px;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--plan) 30%,transparent) transparent}.cgGrid .cgGroup{min-width:0;width:100%}.cgGrid .cgGroup small{max-width:100%}.dailyPlanPanel>.dpSub{min-height:1.6em}.dpActionsLoading{min-height:100px}@media (max-width:600px){.dailyPlanPanel>.dpSub{min-height:3.2em}.dailyPlanPanel .dpTitle strong{min-height:2.3em}.dailyPlanPanel .dpStats{min-height:40px}}.cqView{--cq:var(--lv, #8B7AD8);--cq-deep:var(--lv-deep, #6650A4);--cq-ink:var(--lv-ink, #34235F);--cq-a:var(--lv-btn-a, #8978B3);--cq-b:var(--lv-btn-b, #A294C7);--cq-soft:var(--lv-soft, rgba(139, 122, 216, .15));--cq-line:var(--lv-line, rgba(126, 111, 153, .22));--cq-ok:#2E8B7E;--cq-ok-bg:rgba(46, 139, 126, .10);--cq-ng:#C0564B;--cq-ng-bg:rgba(192, 86, 75, .08);max-width:760px;margin:0 auto;scroll-margin-top:84px;color:#2f2a3d}.cqView :where(button){font-family:inherit;cursor:pointer}.cqView :where(button:disabled){cursor:not-allowed}.cqCard{position:relative;border-radius:24px;padding:18px 18px 16px;border:1px solid rgba(255,255,255,.72);background:radial-gradient(130% 160% at 100% 0,color-mix(in srgb,var(--cq) 12%,transparent) 0,rgba(255,255,255,0) 55%),linear-gradient(135deg,rgba(255,255,255,.92) 0,rgba(249,245,255,.84) 60%,rgba(242,236,255,.78) 100%);-webkit-backdrop-filter:blur(16px) saturate(1.4);backdrop-filter:blur(16px) saturate(1.4);box-shadow:0 0 0 1px rgba(102,80,164,.08),inset 0 1px 0 rgba(255,255,255,.9),0 18px 44px rgba(65,45,105,.11)}.cqEmpty{margin:0;text-align:center;color:#6f638b;font-weight:800}.cqPrimary{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:46px;padding:0 22px;border-radius:999px;border:1px solid rgba(255,255,255,.55);background:linear-gradient(135deg,var(--cq-a),var(--cq-b));color:#fff;font-size:15px;font-weight:900;letter-spacing:.02em;box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 10px 22px color-mix(in srgb,var(--cq) 28%,transparent);transition:transform .12s,box-shadow .15s,opacity .15s}.cqPrimary:hover:not(:disabled){transform:translateY(-1px)}.cqPrimary:disabled{opacity:.45;box-shadow:none}.cqPrimary.isBig{min-height:52px;font-size:16px}.cqPrimary.isAuto{position:relative;overflow:hidden}.cqPrimary.isAuto::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:100%;background:rgba(255,255,255,.7);transform-origin:left;animation:cqAuto 1.1s linear forwards}@keyframes cqAuto{from{transform:scaleX(0)}to{transform:scaleX(1)}}.cqGhost{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:42px;padding:0 16px;border-radius:999px;border:1px solid var(--cq-line);background:rgba(255,255,255,.85);color:var(--cq-deep);font-size:14px;font-weight:850}.cqGhost.isOn,.cqGhost:hover{background:#fff;border-color:color-mix(in srgb,var(--cq) 45%,transparent)}.cqSound{width:40px;height:40px;flex:none;border-radius:50%;display:inline-grid;place-items:center;color:#fff;border:1px solid rgba(255,255,255,.55);background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.45),transparent 55%),linear-gradient(135deg,var(--cq),var(--cq-b));box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 6px 14px color-mix(in srgb,var(--cq) 26%,transparent)}.cqSound.isSmall{width:30px;height:30px}.cqHead{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.cqHeadIcon{width:44px;height:44px;flex:0 0 44px;border-radius:15px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--cq-a),var(--cq-b));border:1px solid rgba(255,255,255,.55);box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 10px 22px color-mix(in srgb,var(--cq) 30%,transparent)}.cqHeadText{flex:1 1 160px;min-width:0}.cqHeadText p{margin:0 0 2px;color:var(--cq-deep);font-size:13px;font-weight:950;letter-spacing:.02em}.cqHeadText h2{margin:0;color:#1f1833;font-size:clamp(18px, 3.4vw, 22px);line-height:1.25;font-weight:950;letter-spacing:0}.cqSeg{display:inline-flex;gap:3px;padding:4px;border-radius:999px;flex:none;background:rgba(255,255,255,.75);border:1px solid rgba(126,111,153,.16)}.cqSeg button{min-height:32px;padding:0 13px;border-radius:999px;border:0;background:0 0;color:#6f638b;font-size:13px;font-weight:900;white-space:nowrap}.cqSeg button.isOn{color:#fff;background:linear-gradient(135deg,var(--cq-a),var(--cq-b));box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 5px 12px color-mix(in srgb,var(--cq) 25%,transparent)}.cqMemory{margin-top:16px;display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:18px;background:rgba(255,255,255,.72);border:1px solid rgba(126,111,153,.14)}.cqMemory.isDue{background:#fff;border-color:color-mix(in srgb,var(--cq) 50%,transparent);box-shadow:0 0 0 3px var(--cq-soft)}.cqMemoryIcon{flex:none;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:var(--cq-deep);background:var(--cq-soft)}.cqMemory:not(.isDue) .cqMemoryIcon{color:var(--cq-ok);background:var(--cq-ok-bg)}.cqMemoryText{flex:1 1 auto;min-width:0;display:grid;gap:2px}.cqMemoryText strong{font-size:15.5px;font-weight:950;color:var(--cq-ink)}.cqMemoryText span{font-size:12.5px;font-weight:750;line-height:1.5;color:#7a7090}.cqMemory .cqPrimary{flex:none}.cqRetryChip{display:inline-flex;align-items:center;gap:3px;flex:none;align-self:center;font-style:normal;font-size:11.5px;font-weight:950;color:var(--cq-deep);background:var(--cq-soft);border:1px solid var(--cq-line);border-radius:999px;padding:2px 8px}.cqBar span.isRetry:not(.isRight):not(.isWrong):not(.isNow){background:color-mix(in srgb,var(--cq) 22%,transparent)}.cqResultMemo{margin:-6px auto 14px;max-width:460px;display:flex;align-items:flex-start;justify-content:center;gap:6px;font-size:13px;font-weight:750;line-height:1.55;color:#6f6585}.cqResultMemo svg{flex:none;margin-top:2px;color:var(--cq-deep)}.cqContinue{width:100%;margin-top:16px;display:flex;align-items:center;gap:12px;text-align:left;padding:14px 16px;border-radius:20px;border:1px solid rgba(255,255,255,.55);color:#fff;background:linear-gradient(135deg,var(--cq-a),var(--cq-b));box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 12px 26px color-mix(in srgb,var(--cq) 30%,transparent);transition:transform .12s}.cqContinue:hover{transform:translateY(-1px)}.cqContinueText{flex:1 1 auto;min-width:0;display:grid;gap:1px}.cqContinueText em{font-style:normal;font-size:12px;font-weight:850;opacity:.85}.cqContinueText strong{font-size:19px;font-weight:950;letter-spacing:.01em}.cqContinueText span{font-size:13px;font-weight:750;opacity:.9}.cqContinueGo{flex:none;display:inline-flex;align-items:center;gap:2px;padding:8px 12px 8px 14px;border-radius:999px;background:rgba(255,255,255,.22);font-size:14px;font-weight:900}.cqLessons{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:6px}.cqLesson{width:100%;display:flex;align-items:center;gap:12px;text-align:left;padding:10px 12px;border-radius:16px;border:1px solid rgba(126,111,153,.12);background:rgba(255,255,255,.72);color:#2f2a3d;transition:background .15s,border-color .15s}.cqLesson:hover{background:#fff}.cqLesson.isNext{border-color:color-mix(in srgb,var(--cq) 55%,transparent);background:#fff;box-shadow:0 0 0 3px var(--cq-soft)}.cqLesson>svg{flex:none;color:#b3a9c9}.cqLessonNum{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-size:13.5px;font-weight:950;color:var(--cq-deep);background:var(--cq-soft)}.cqLesson.isDone .cqLessonNum{color:#fff;background:var(--cq-ok)}.cqLesson.isMix .cqLessonNum{color:#fff;background:linear-gradient(135deg,var(--cq-a),var(--cq-b))}.cqLessonText{flex:1 1 auto;min-width:0;display:grid}.cqLessonText strong{font-size:15px;font-weight:950;color:#1f1833}.cqLessonText span{font-size:12.5px;font-weight:700;color:#8a7fa0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cqLesson em{flex:none;font-style:normal;font-size:12px;font-weight:850;color:#8a7fa0}.cqLesson.isDone em{color:var(--cq-ok)}.cqCourseFoot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:14px}.cqMistakes{display:inline-flex;align-items:center;gap:6px;min-height:42px;padding:0 14px;border-radius:999px;border:1px solid var(--cq-line);background:rgba(255,255,255,.85);color:var(--cq-deep);font-size:14px;font-weight:850}.cqMistakes b{font-size:16px;font-weight:950;color:var(--cq-ink)}.cqMistakes em{font-style:normal;font-size:12.5px;font-weight:900;color:#fff;border-radius:999px;padding:3px 9px;margin-left:2px;background:linear-gradient(135deg,var(--cq-a),var(--cq-b))}.cqMistakes:disabled{opacity:.5}.cqReviewLink{border:0;background:0 0;padding:4px 6px;color:#a79cc0;font-size:12px;font-weight:800}.cqLearnTop{display:flex;align-items:center;justify-content:space-between;gap:10px}.cqBackLink{display:inline-flex;align-items:center;gap:2px;border:0;background:0 0;padding:4px 6px 4px 0;color:var(--cq-deep);font-size:14px;font-weight:900}.cqBest{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:900;color:#8a7fa0;background:rgba(255,255,255,.8);border-radius:999px;padding:3px 10px}.cqBest.isPassed{color:var(--cq-ok);background:var(--cq-ok-bg)}.cqLearnHead{margin-top:6px}.cqLessonNo{font-size:12.5px;font-weight:950;color:var(--cq-deep);letter-spacing:.04em}.cqLearnHead h2{margin:2px 0 2px;font-size:clamp(26px, 6vw, 32px);line-height:1.15;font-weight:950;color:#1f1833;letter-spacing:0}.cqLearnHead p{margin:0;font-size:14px;font-weight:800;color:#6f638b}.cqIntro{margin:12px 0 0;font-size:14px;font-weight:700;line-height:1.65;color:#4a4063}.cqLearnSec{margin-top:16px}.cqLearnSec h3{margin:0 0 8px;font-size:13px;font-weight:950;color:var(--cq-deep);letter-spacing:.06em;display:flex;align-items:center;gap:8px}.cqLearnSec h3::after{content:"";flex:1;height:1px;background:rgba(126,111,153,.18)}.cqRule{display:grid;grid-template-columns:64px minmax(0,1fr);gap:10px;align-items:start;padding:10px 12px;border-radius:14px;background:rgba(255,255,255,.78);border:1px solid rgba(126,111,153,.1)}.cqRule+.cqRule{margin-top:6px}.cqRuleTag{justify-self:start;font-size:12px;font-weight:950;color:var(--cq-deep);background:var(--cq-soft);border-radius:999px;padding:3px 9px;white-space:nowrap}.cqRuleBody{display:grid;gap:5px;min-width:0}.cqRuleBody p{margin:0;font-size:14px;font-weight:750;line-height:1.55;color:#2f2a3d}.cqRuleBody p.isJa{font-family:"Noto Sans JP","Hiragino Sans",sans-serif;font-weight:800}.cqEgs{display:flex;flex-wrap:wrap;gap:6px}.cqEg{display:inline-flex;align-items:baseline;gap:5px;padding:3px 10px;border-radius:999px;background:rgba(246,243,250,.95);border:1px solid rgba(126,111,153,.12);font-family:"Noto Sans JP","Hiragino Sans",sans-serif;font-size:14px;font-weight:700;color:#6f638b}.cqEg i{font-style:normal;color:#b3a9c9;font-size:12px}.cqEg b{font-weight:900;color:#1f1833}.cqView{--cq-trap:#B8661F;--cq-trap-bg:rgba(226, 146, 62, .12);--cq-trap-line:rgba(214, 138, 60, .32)}.cqTraps{margin-top:16px;padding:12px 14px 12px;border-radius:16px;background:linear-gradient(135deg,rgba(255,246,234,.95),rgba(255,239,222,.88));border:1px solid var(--cq-trap-line)}.cqTraps h3{margin:0 0 8px;display:flex;align-items:center;gap:6px;font-size:14px;font-weight:950;color:var(--cq-trap);letter-spacing:.04em}.cqTraps h3 span{margin-left:auto;font-size:11.5px;font-weight:850;letter-spacing:0;color:#9a6a3c;background:rgba(255,255,255,.75);border-radius:999px;padding:2px 9px}.cqTraps ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}.cqTraps li{display:grid;grid-template-columns:minmax(78px,auto) minmax(0,1fr);gap:10px;align-items:baseline;padding:8px 10px;border-radius:12px;background:rgba(255,255,255,.78)}.cqTraps li b{font-family:"Noto Sans JP","Hiragino Sans",sans-serif;font-size:14.5px;font-weight:900;color:#5a3410}.cqTraps li span{font-size:13.5px;font-weight:750;line-height:1.55;color:#4a3a2a}.cqTrapChip{display:inline-flex;align-items:center;gap:3px;flex:none;align-self:center;font-style:normal;font-size:11.5px;font-weight:950;color:var(--cq-trap);background:var(--cq-trap-bg);border:1px solid var(--cq-trap-line);border-radius:999px;padding:2px 8px}.cqLesson.isTrap{background:rgba(255,246,234,.9);border-color:var(--cq-trap-line)}.cqLesson.isTrap .cqLessonNum{color:#fff;background:linear-gradient(135deg,#d98a3e,#e6a660)}.cqLesson.isTrap .cqLessonText strong{color:#5a3410}.cqLesson.isTrap.isDone .cqLessonNum{background:var(--cq-ok)}.cqWarn{margin:10px 0 0;display:flex;gap:8px;align-items:flex-start;padding:10px 12px;border-radius:14px;background:rgba(214,138,60,.1);color:#7a4b16;font-size:13.5px;font-weight:750;line-height:1.55}.cqWarn svg{flex:none;margin-top:2px;color:#c47a28}.cqUses{list-style:none;margin:0;padding:0;display:grid;gap:6px}.cqUse{padding:10px 12px;border-radius:14px;background:rgba(255,255,255,.78);border:1px solid rgba(126,111,153,.1)}.cqUseHead{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}.cqUseHead b{font-family:"Noto Sans JP","Hiragino Sans",sans-serif;font-size:15px;font-weight:900;color:var(--cq-ink)}.cqUseHead span{font-size:13px;font-weight:800;color:#6f638b}.cqUseEx{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:5px}.cqUseEx>div{min-width:0;display:grid}.cqUseEx p{margin:0;font-family:"Noto Sans JP","Hiragino Sans",sans-serif;font-size:15px;font-weight:800;color:#1f1833}.cqUseEx span{font-size:12.5px;font-weight:700;color:#8a7fa0}.cqLearnGo{display:grid;justify-items:center;gap:6px;margin-top:18px}.cqLearnGo .cqPrimary{width:100%;max-width:420px}.cqLearnGo>span{font-size:12.5px;font-weight:800;color:#8a7fa0}.cqTop{display:flex;align-items:center;gap:10px}.cqTopTitle{flex:1 1 auto;min-width:0;font-size:14px;font-weight:950;color:var(--cq-deep);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cqTopTitle em{font-style:normal;font-weight:800;color:#8a7fa0;margin-left:8px;font-size:12.5px}.cqCount{font-size:13px;font-weight:850;color:#8a7fa0}.cqCount b{font-size:17px;color:var(--cq-ink)}.cqClose{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(126,111,153,.18);background:rgba(255,255,255,.85);color:#7d7195}.cqBar{display:flex;gap:4px;margin:10px 0 4px}.cqBar span{flex:1;height:6px;border-radius:999px;background:rgba(126,111,153,.14);transition:background .2s}.cqBar span.isNow{background:color-mix(in srgb,var(--cq) 45%,transparent)}.cqBar span.isRight{background:var(--cq-ok)}.cqBar span.isWrong{background:var(--cq-ng)}.cqQuestion{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin-top:10px}.cqWord{display:flex;align-items:center;justify-content:center;gap:12px;padding:6px 0 2px}.cqWordMain{display:grid;justify-items:center}.cqWordMain strong{font-family:"Noto Sans JP","Hiragino Sans",sans-serif;font-size:clamp(36px, 8vw, 52px);line-height:1.1;font-weight:900;color:#1f1833;letter-spacing:0}.cqWordMain span{font-family:"Noto Sans JP","Hiragino Sans",sans-serif;font-size:14px;font-weight:700;color:#8a7fa0}.cqTask{margin:0;display:flex;align-items:baseline;gap:8px;justify-content:center;flex-wrap:wrap;text-align:center}.cqTask b{flex:none;font-size:11.5px;font-weight:950;color:var(--cq-deep);background:var(--cq-soft);border-radius:999px;padding:3px 9px;letter-spacing:.04em}.cqTask span{font-size:16.5px;font-weight:900;color:#2a2340;line-height:1.45}.cqSentence{display:grid;gap:4px;padding:12px 14px;border-radius:16px;text-align:center;background:rgba(255,255,255,.72);border:1px solid rgba(126,111,153,.12)}.cqSentence.isPlain{padding:8px 14px}.cqSentenceJa{margin:0;font-family:"Noto Sans JP","Hiragino Sans",sans-serif;font-size:19px;font-weight:800;line-height:1.6;color:#1f1833;overflow-wrap:anywhere}.cqBlank{display:inline-block;width:3.2em;height:1.05em;vertical-align:-.18em;margin:0 3px;border-bottom:2.5px solid var(--cq);background:var(--cq-soft);border-radius:6px 6px 2px 2px}.cqSentenceZh{margin:0;font-size:14px;font-weight:700;color:#6f638b;line-height:1.5}.cqSentenceNote{margin:0;display:flex;gap:6px;justify-content:center;align-items:baseline;font-size:13.5px;color:#6f638b}.cqSentenceNote b{font-size:11px;font-weight:950;color:var(--cq-ng);background:var(--cq-ng-bg);border-radius:999px;padding:2px 7px}.cqSentenceNote span{font-family:"Noto Sans JP","Hiragino Sans",sans-serif;text-decoration:line-through;text-decoration-color:rgba(192,86,75,.55)}.cqAnswer{display:flex;gap:8px;align-items:center}.cqAnswer input{flex:1 1 auto;width:100%;min-width:0;min-height:52px;padding:8px 14px;border-radius:16px;border:1.5px solid rgba(126,111,153,.22);background:rgba(255,255,255,.95);outline:0;font-family:"Noto Sans JP","Hiragino Sans",sans-serif;font-size:24px;font-weight:800;color:#1f1833;text-align:center;letter-spacing:.04em}.cqAnswer input::placeholder{font-family:inherit;font-size:14px;font-weight:700;letter-spacing:0;color:#b0a7c3}.cqAnswer input:focus{border-color:color-mix(in srgb,var(--cq) 60%,transparent);box-shadow:0 0 0 3px var(--cq-soft)}.cqAnswer.isRight input{border-color:var(--cq-ok);background:var(--cq-ok-bg);color:#1f5f56}.cqAnswer.isWrong input{border-color:rgba(192,86,75,.55);background:var(--cq-ng-bg);color:#8f3a31;text-decoration:line-through;text-decoration-thickness:2px}.cqBack{width:52px;height:52px;flex:none;border-radius:16px;display:grid;place-items:center;border:1px solid rgba(126,111,153,.2);background:rgba(255,255,255,.85);color:#7d7195}.cqBack:disabled{opacity:.4}.cqTiles{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.cqTile{min-width:46px;height:46px;padding:0 8px;border-radius:13px;border:1px solid rgba(126,111,153,.18);background:#fff;color:#1f1833;font-family:"Noto Sans JP","Hiragino Sans",sans-serif;font-size:20px;font-weight:800;box-shadow:0 2px 0 rgba(126,111,153,.18),0 6px 12px rgba(65,45,105,.06);transition:transform .1s,opacity .15s}.cqTile:active:not(:disabled){transform:translateY(1px);box-shadow:0 1px 0 rgba(126,111,153,.18)}.cqTile.isUsed{opacity:.28;box-shadow:none}.cqChoices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.cqChoices.isThree{grid-template-columns:repeat(3,minmax(0,1fr))}.cqChoices.isThree .cqChoice{font-size:18px;min-height:58px}.cqChoice{min-height:52px;padding:8px 12px;border-radius:16px;border:1.5px solid rgba(126,111,153,.18);background:#fff;color:#1f1833;font-family:"Noto Sans JP","Hiragino Sans",sans-serif;font-size:17px;font-weight:800;line-height:1.35}.cqChoice:hover:not(:disabled){border-color:color-mix(in srgb,var(--cq) 50%,transparent)}.cqChoice.isRight{border-color:var(--cq-ok);background:var(--cq-ok-bg);color:#1f5f56}.cqChoice.isWrong{border-color:rgba(192,86,75,.55);background:var(--cq-ng-bg);color:#8f3a31}.cqChoice:disabled:not(.isRight):not(.isWrong){opacity:.55}.cqFeedback,.cqHint{display:grid;gap:8px;padding:12px 14px;border-radius:16px}.cqHint{background:var(--cq-soft)}.cqHint p{margin:0;display:flex;gap:8px;align-items:baseline;font-size:13.5px;font-weight:700;line-height:1.55;color:#3d3454}.cqHint b,.cqRules b{flex:none;font-size:11px;font-weight:950;border-radius:999px;padding:2px 8px;color:var(--cq-deep);background:rgba(255,255,255,.8)}.cqFeedback.isRight{background:var(--cq-ok-bg)}.cqFeedback.isWrong{background:var(--cq-ng-bg)}.cqFeedbackHead{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.cqFeedbackHead>svg{flex:none}.cqFeedback.isRight .cqFeedbackHead{color:var(--cq-ok)}.cqFeedback.isWrong .cqFeedbackHead{color:var(--cq-ng)}.cqFeedbackHead strong{font-size:15px;font-weight:950}.cqRightAnswer{font-family:"Noto Sans JP","Hiragino Sans",sans-serif;font-size:22px;font-weight:900;color:#1f1833}.cqGroupChip{margin-left:auto;font-style:normal;font-size:11.5px;font-weight:900;border-radius:999px;padding:3px 9px;color:var(--cq-deep);background:rgba(255,255,255,.85)}.cqFull{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px}.cqFull p{margin:0;font-family:"Noto Sans JP","Hiragino Sans",sans-serif;font-size:16px;font-weight:800;color:#1f1833}.cqFull span{flex-basis:100%;order:3;font-family:"Noto Sans JP","Hiragino Sans",sans-serif;font-size:12.5px;font-weight:700;color:#8a7fa0}.cqRules{list-style:none;margin:0;padding:0;display:grid;gap:6px}.cqRules li{display:flex;gap:8px;align-items:baseline;font-size:13.5px;font-weight:700;line-height:1.55;color:#3d3454}.cqForms{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 -2px}.cqForms table{border-collapse:separate;border-spacing:0;min-width:100%;background:rgba(255,255,255,.8);border-radius:12px;overflow:hidden}.cqForms td,.cqForms th{padding:6px 10px;white-space:nowrap;text-align:center}.cqForms th{font-size:11px;font-weight:900;color:#8a7fa0;background:rgba(255,255,255,.6)}.cqForms td{font-family:"Noto Sans JP","Hiragino Sans",sans-serif;font-size:14.5px;font-weight:800;color:#1f1833}.cqActions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.cqActions .cqPrimary{min-width:150px}.cqResult{text-align:center}.cqResultMeta{margin:0;font-size:13px;font-weight:900;color:var(--cq-deep)}.cqScore{margin:8px 0 2px;display:flex;justify-content:center;align-items:baseline;gap:6px}.cqScore b{font-size:56px;line-height:1;font-weight:950;color:var(--cq-ink)}.cqScore.isPassed b{color:var(--cq-ok)}.cqScore span{font-size:20px;font-weight:900;color:#8a7fa0}.cqResultMsg{margin:4px 0 14px;font-size:15px;font-weight:800;color:#4a4063}.cqWrongList{list-style:none;margin:0 0 14px;padding:0;display:grid;gap:6px;text-align:left}.cqWrongList li{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 12px;border-radius:14px;background:rgba(255,255,255,.8);border:1px solid rgba(126,111,153,.12)}.cqWrongWord{display:grid;min-width:0}.cqWrongWord b{font-family:"Noto Sans JP","Hiragino Sans",sans-serif;font-size:16px;font-weight:900;color:#1f1833}.cqWrongWord span{font-size:12px;font-weight:700;color:#8a7fa0;overflow-wrap:anywhere}.cqWrongAns{display:grid;justify-items:end;flex:none;max-width:55%;text-align:right}.cqWrongAns s{font-family:"Noto Sans JP","Hiragino Sans",sans-serif;font-size:13px;font-weight:700;color:var(--cq-ng)}.cqWrongAns strong{font-family:"Noto Sans JP","Hiragino Sans",sans-serif;font-size:16px;font-weight:900;color:var(--cq-ok);overflow-wrap:anywhere}.cqResultActions{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}.cqPad{display:grid;gap:5px;padding:8px;border-radius:16px;background:rgba(255,255,255,.7);border:1px solid rgba(126,111,153,.14)}.cqPadTabs{display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin-bottom:2px}.cqPadTab{min-width:44px;height:32px;padding:0 10px;border-radius:999px;border:1px solid rgba(126,111,153,.2);background:#fff;color:#6f638b;font-family:"Noto Sans JP","Hiragino Sans",sans-serif;font-size:14px;font-weight:800}.cqPadTab.isOn{color:#fff;border-color:transparent;background:linear-gradient(135deg,var(--cq-a),var(--cq-b))}.cqInputSwitch{margin-left:auto;display:inline-flex;gap:2px;padding:3px;border-radius:999px;background:rgba(255,255,255,.85);border:1px solid rgba(126,111,153,.18)}.cqInputSwitch button{display:inline-flex;align-items:center;gap:4px;height:28px;padding:0 10px;border-radius:999px;border:0;background:0 0;color:#7d7195;font-size:12.5px;font-weight:850;white-space:nowrap}.cqInputSwitch button.isOn{color:#fff;background:linear-gradient(135deg,var(--cq-a),var(--cq-b))}.cqInputSwitch svg{flex:none}.cqPadRow{display:flex;gap:8px}.cqPadHalf{flex:1 1 0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}.cqPadKey{height:40px;min-width:0;padding:0;border-radius:10px;border:1px solid rgba(126,111,153,.16);background:#fff;color:#1f1833;font-family:"Noto Sans JP","Hiragino Sans",sans-serif;font-size:18px;font-weight:700;box-shadow:0 1px 0 rgba(126,111,153,.18)}.cqPadKey:active{transform:translateY(1px);background:var(--cq-soft)}.cqPadKey.isKanji{width:40px;height:32px;font-size:16px;font-weight:800;background:var(--cq-soft);border-color:transparent}.cqPadGap{display:block}.cqTilesWrap{display:grid;gap:8px;justify-items:center}.cqTilesWrap .cqInputSwitch{margin-left:0}.cqRoundPick{display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap}.cqRoundPick>span{font-size:12.5px;font-weight:800;color:#8a7fa0}.cqRoundPick button{height:30px;padding:0 12px;border-radius:999px;border:1px solid rgba(126,111,153,.2);background:#fff;color:#6f638b;font-size:13px;font-weight:850}.cqRoundPick button.isOn{color:#fff;border-color:transparent;background:linear-gradient(135deg,var(--cq-a),var(--cq-b))}.cqLessonCount{margin-left:8px;font-style:normal;font-size:11px;font-weight:800;color:#9a90ae;background:rgba(126,111,153,.1);border-radius:999px;padding:1px 7px;vertical-align:2px}.cqHeadCount{display:block;margin-top:3px;font-size:12px;font-weight:750;color:#8a7fa0}.cqSpellInput{max-width:none;margin:0}.cqSpellInput.isTiles{display:flex;justify-content:center;margin-top:10px}.cqPadKey.isBack{width:44px;height:32px;display:inline-grid;place-items:center;color:#7d7195}@media (max-width:600px){.cqPad{padding:6px;gap:4px}.cqPadRow{gap:5px}.cqPadHalf{gap:3px}.cqPadKey{height:38px;font-size:16px;border-radius:8px}.cqTraps li{grid-template-columns:1fr;gap:2px}.cqCard{padding:14px 13px 13px;border-radius:20px}.cqHead{gap:10px}.cqHeadIcon{width:38px;height:38px;flex-basis:38px;border-radius:13px}.cqSeg{width:100%}.cqSeg button{flex:1}.cqContinue{margin-top:12px;padding:12px 14px}.cqContinueText strong{font-size:17px}.cqRule{grid-template-columns:1fr;gap:6px}.cqWordMain strong{font-size:38px}.cqTask span{font-size:15.5px}.cqSentenceJa{font-size:17px}.cqTile{min-width:42px;height:44px;font-size:19px}.cqChoices{grid-template-columns:1fr}.cqChoices.isThree{grid-template-columns:repeat(3,minmax(0,1fr))}.cqActions .cqPrimary{flex:1 1 auto}}.cqFormsList{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(max-content,1fr);overflow-x:auto;-webkit-overflow-scrolling:touch;background:rgba(255,255,255,.8);border-radius:12px}.cqFormCell{display:grid;justify-items:center;align-content:start;gap:2px;padding:6px 10px}.cqFormLabel{font-size:11px;font-weight:900;color:#8a7fa0;white-space:nowrap}.cqFormValue{font-family:"Noto Sans JP","Hiragino Sans",sans-serif;font-size:14.5px;font-weight:800;color:#1f1833;white-space:nowrap}.cqFormCell.isAsked{background:color-mix(in srgb,var(--lv,#8b7ad8) 12%,#fff)}.cqFormCell.isAsked .cqFormLabel,.cqFormCell.isAsked .cqFormValue{color:var(--lv-deep,#6650a4)}@media (max-width:599px){.cqMemory{flex-wrap:wrap}.cqMemory .cqPrimary{width:100%;justify-content:center}.cqFormsList{grid-auto-flow:row;grid-template-columns:minmax(0,1fr);overflow:visible}.cqFormCell{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:9px 14px;border-top:1px solid rgba(126,111,153,.1)}.cqFormCell:first-child{border-top:0}.cqFormLabel{font-size:12.5px}.cqFormValue{font-size:17px;white-space:normal;text-align:right}}.cqPadTab.cqPadScript{font-weight:900;padding-left:12px;padding-right:12px}/*! tailwindcss v4.1.12 | MIT License | https://tailwindcss.com */@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-ease:initial;--tw-animation-delay:0s;--tw-animation-direction:normal;--tw-animation-duration:initial;--tw-animation-fill-mode:none;--tw-animation-iteration-count:1;--tw-enter-blur:0;--tw-enter-opacity:1;--tw-enter-rotate:0;--tw-enter-scale:1;--tw-enter-translate-x:0;--tw-enter-translate-y:0;--tw-exit-blur:0;--tw-exit-opacity:1;--tw-exit-rotate:0;--tw-exit-scale:1;--tw-exit-translate-x:0;--tw-exit-translate-y:0}}}@layer theme{:host,:root{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--text-base:1rem;--text-lg:1.125rem;--text-xl:1.25rem;--text-2xl:1.5rem;--font-weight-normal:400;--font-weight-medium:500;--ease-in-out:cubic-bezier(.4,0,.2,1);--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,::backdrop,:after,:before{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}:host,html{-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}menu,ol,ul{list-style:none}audio,canvas,embed,iframe,img,object,svg,video{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,optgroup,select,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){-webkit-appearance:button;-moz-appearance:button;appearance:button}::file-selector-button{-webkit-appearance:button;-moz-appearance:button;appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}*{border-color:var(--border);outline-color:var(--ring)}@supports (color:color-mix(in lab,red,red)){*{outline-color:color-mix(in oklab,var(--ring)50%,transparent)}}body{background-color:var(--background);color:var(--foreground)}html{font-size:var(--font-size)}h1{font-size:var(--text-2xl);font-weight:var(--font-weight-medium);line-height:1.5}h2{font-size:var(--text-xl);font-weight:var(--font-weight-medium);line-height:1.5}h3{font-size:var(--text-lg);font-weight:var(--font-weight-medium);line-height:1.5}button,h4,label{font-size:var(--text-base);font-weight:var(--font-weight-medium);line-height:1.5}input{font-size:var(--text-base);font-weight:var(--font-weight-normal);line-height:1.5}}@layer components;@layer utilities{.visible{visibility:visible}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.sticky{position:sticky}.container{width:100%}@media(min-width:40rem){.container{max-width:40rem}}@media(min-width:48rem){.container{max-width:48rem}}@media(min-width:64rem){.container{max-width:64rem}}@media(min-width:80rem){.container{max-width:80rem}}@media(min-width:96rem){.container{max-width:96rem}}.block{display:block}.contents{display:contents}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.inline-grid{display:inline-grid}.table{display:table}.flex-shrink{flex-shrink:1}.grow{flex-grow:1}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.resize{resize:both}.flex-wrap{flex-wrap:wrap}.border{border-style:var(--tw-border-style);border-width:1px}.text-wrap{text-wrap:wrap}.uppercase{text-transform:uppercase}.overline{text-decoration-line:overline}.underline{text-decoration-line:underline}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ring{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.backdrop-filter{-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,visibility,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.ease-in-out{--tw-ease:var(--ease-in-out);transition-timing-function:var(--ease-in-out)}.paused{animation-play-state:paused}.running{animation-play-state:running}}@property --tw-animation-delay{syntax:"*";inherits:false;initial-value:0s}@property --tw-animation-direction{syntax:"*";inherits:false;initial-value:normal}@property --tw-animation-duration{syntax:"*";inherits:false}@property --tw-animation-fill-mode{syntax:"*";inherits:false;initial-value:none}@property --tw-animation-iteration-count{syntax:"*";inherits:false;initial-value:1}@property --tw-enter-blur{syntax:"*";inherits:false;initial-value:0}@property --tw-enter-opacity{syntax:"*";inherits:false;initial-value:1}@property --tw-enter-rotate{syntax:"*";inherits:false;initial-value:0}@property --tw-enter-scale{syntax:"*";inherits:false;initial-value:1}@property --tw-enter-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-enter-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-blur{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-opacity{syntax:"*";inherits:false;initial-value:1}@property --tw-exit-rotate{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-scale{syntax:"*";inherits:false;initial-value:1}@property --tw-exit-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-translate-y{syntax:"*";inherits:false;initial-value:0}:root{--font-size:16px;--background:#f6f3fa;--foreground:#2f2a3d;--card:#fff;--card-foreground:#2f2a3d;--popover:#fff;--popover-foreground:#2f2a3d;--primary:#8b7ad8;--primary-foreground:#fff;--secondary:#cfeaff;--secondary-foreground:#2f2a3d;--muted:#f6f3fa;--muted-foreground:#7c748c;--accent:#ffd6e7;--accent-foreground:#2f2a3d;--destructive:#ba6e94;--destructive-foreground:#fff;--border:#2f2a3d1a;--input:transparent;--input-background:#f6f3fa;--switch-background:#e8e2f2;--font-weight-medium:500;--font-weight-normal:400;--ring:#8b7ad8;--chart-1:#8b7ad8;--chart-2:#fff2b8;--chart-3:#ddf6e7;--chart-4:#cfeaff;--chart-5:#ffd6e7;--radius:1rem;--sidebar:#fff;--sidebar-foreground:#2f2a3d;--sidebar-primary:#8b7ad8;--sidebar-primary-foreground:#fff;--sidebar-accent:#f6f3fa;--sidebar-accent-foreground:#2f2a3d;--sidebar-border:#2f2a3d1a;--sidebar-ring:#8b7ad8}.dark{--background:oklch(14.5% 0 0);--foreground:oklch(98.5% 0 0);--card:oklch(14.5% 0 0);--card-foreground:oklch(98.5% 0 0);--popover:oklch(14.5% 0 0);--popover-foreground:oklch(98.5% 0 0);--primary:oklch(98.5% 0 0);--primary-foreground:oklch(20.5% 0 0);--secondary:oklch(26.9% 0 0);--secondary-foreground:oklch(98.5% 0 0);--muted:oklch(26.9% 0 0);--muted-foreground:oklch(70.8% 0 0);--accent:oklch(26.9% 0 0);--accent-foreground:oklch(98.5% 0 0);--destructive:oklch(39.6% .141 25.723);--destructive-foreground:oklch(63.7% .237 25.331);--border:oklch(26.9% 0 0);--input:oklch(26.9% 0 0);--ring:oklch(43.9% 0 0);--font-weight-medium:500;--font-weight-normal:400;--chart-1:oklch(48.8% .243 264.376);--chart-2:oklch(69.6% .17 162.48);--chart-3:oklch(76.9% .188 70.08);--chart-4:oklch(62.7% .265 303.9);--chart-5:oklch(64.5% .246 16.439);--sidebar:oklch(20.5% 0 0);--sidebar-foreground:oklch(98.5% 0 0);--sidebar-primary:oklch(48.8% .243 264.376);--sidebar-primary-foreground:oklch(98.5% 0 0);--sidebar-accent:oklch(26.9% 0 0);--sidebar-accent-foreground:oklch(98.5% 0 0);--sidebar-border:oklch(26.9% 0 0);--sidebar-ring:oklch(43.9% 0 0)}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}body .bottomNav{grid-template-columns:repeat(5,minmax(0,1fr))!important}body .bottomNav button:nth-child(5){background:#f0ebf8;color:#5d4d89}body .bottomNav button:nth-child(5).active{background:#6f5aa2;color:#fff;box-shadow:0 7px 18px rgba(79,60,128,.2)}.practiceModeHub{max-width:1100px;margin:0 auto 14px;padding:16px;border:1px solid rgba(92,75,135,.13);border-radius:22px;background:rgba(255,255,255,.86);box-shadow:0 12px 30px rgba(45,32,78,.06)}.practiceModeHeading{display:flex;align-items:baseline;gap:10px;margin-bottom:12px}.practiceModeHeading strong{color:#2f2a3d;font-size:20px;font-weight:850}.practiceModeHeading span{color:#746b84;font-size:12px;font-weight:650}.practiceModeOptions{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.practiceModeOptions button{display:flex;align-items:center;gap:10px;min-height:66px;min-width:0;padding:12px 14px;border:1px solid rgba(92,75,135,.13);border-radius:15px;background:#f8f6fb;color:#574c6b;text-align:left;cursor:pointer;touch-action:manipulation;font:inherit}.practiceModeOptions button:hover{background:#f1edf8}.practiceModeOptions button.active{border-color:#7969a6;background:#eee8f7;color:#514475;box-shadow:inset 0 0 0 1px rgba(121,105,166,.22)}.practiceModeOptions button:focus-visible{outline:2px solid #7969a6;outline-offset:2px}.practiceModeOptions button svg{flex:none;width:24px;height:24px}.practiceModeOptions button span{display:grid;gap:2px;min-width:0}.practiceModeOptions button b{font-size:14px;font-weight:800;white-space:nowrap}.practiceModeOptions button small{font-size:11px;color:#766e82;white-space:nowrap}@media (max-width:600px){.practiceModeHub{padding:12px;margin-bottom:10px;border-radius:18px}.practiceModeHeading{margin-bottom:9px}.practiceModeHeading strong{font-size:17px}.practiceModeOptions{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.practiceModeOptions button{min-height:64px;gap:8px;padding:10px 12px;justify-content:flex-start}.practiceModeOptions button svg{width:23px;height:23px}.practiceModeOptions button b{font-size:13px}.practiceModeOptions button small{display:none}}@media (max-width:370px){.practiceModeOptions button{gap:5px;padding:9px}}.practiceMistakeBar{--mistake-accent:#8B7AD8;--mistake-soft:rgba(139, 122, 216, .15);--mistake-tint:color-mix(in srgb, var(--mistake-accent) 7%, #fff);--mistake-line:color-mix(in srgb, var(--mistake-accent) 22%, rgba(92, 75, 135, .13));width:min(720px,100%);margin:0 auto 14px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 10px 10px 12px;border:1px solid var(--mistake-line);border-radius:20px;background:radial-gradient(circle at 0 0,color-mix(in srgb,var(--mistake-accent) 16%,transparent),transparent 52%),linear-gradient(180deg,rgba(255,255,255,.94),var(--mistake-tint));box-shadow:inset 0 1px 0 rgba(255,255,255,.92),0 12px 30px rgba(45,32,78,.06)}.practiceMistakeBar.trainingMistakeBar{margin-bottom:2px}.practiceMistakeBar .mistakeBarInfo{display:flex;align-items:center;gap:10px;min-width:0;flex:1 1 auto}.practiceMistakeBar .mistakeBarIcon{flex:none;width:34px;height:34px;border-radius:12px;display:grid;place-items:center;color:#fff;background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.45),transparent 55%),linear-gradient(135deg,var(--mistake-accent),color-mix(in srgb,var(--mistake-accent) 68%,#cfeaff 32%));box-shadow:inset 0 1px 0 rgba(255,255,255,.38),0 6px 14px color-mix(in srgb,var(--mistake-accent) 26%,transparent)}.practiceMistakeBar .mistakeBarIcon svg{width:16px;height:16px;stroke-width:2.2}.practiceMistakeBar .mistakeBarLabel{display:grid;gap:3px;min-width:0}.practiceMistakeBar .mistakeBarLabel b{display:inline-flex;align-items:center;gap:7px;color:#2f2a3d;font-size:14px;font-weight:850;line-height:1.15}.practiceMistakeBar .mistakeBarCount{font-style:normal;display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 7px;border-radius:999px;font-size:12px;font-weight:900;letter-spacing:.02em;color:var(--mistake-accent);background:color-mix(in srgb,var(--mistake-accent) 14%,#fff);border:1px solid color-mix(in srgb,var(--mistake-accent) 24%,transparent)}.practiceMistakeBar.isEmpty .mistakeBarCount{color:#8a819a;background:#f1eef6;border-color:rgba(92,75,135,.1)}.practiceMistakeBar .mistakeBarLabel small{color:#746b84;font-size:11.5px;font-weight:650;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.practiceMistakeBar.isDrill .mistakeBarLabel small{color:var(--mistake-accent);font-weight:750}.practiceMistakeBar .mistakeBarActions{display:flex;align-items:center;gap:6px;flex:none}.practiceMistakeBar .practiceMistakeClear,.practiceMistakeBar .practiceMistakeToggle{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:36px;padding:0 13px;border-radius:999px;font:inherit;font-size:13px;font-weight:800;line-height:1;white-space:nowrap;cursor:pointer;touch-action:manipulation;transition:background .15s,color .15s,box-shadow .15s,border-color .15s}.practiceMistakeBar .practiceMistakeClear svg,.practiceMistakeBar .practiceMistakeToggle svg{width:14px;height:14px;stroke-width:2.2;flex:none}.practiceMistakeBar .practiceMistakeToggle{color:var(--mistake-accent);background:#fff;border:1px solid color-mix(in srgb,var(--mistake-accent) 36%,transparent);box-shadow:0 1px 0 rgba(255,255,255,.8)}.practiceMistakeBar .practiceMistakeToggle:hover:not(:disabled){background:color-mix(in srgb,var(--mistake-accent) 9%,#fff)}.practiceMistakeBar .practiceMistakeToggle.active{color:#fff;border-color:rgba(255,255,255,.54);background:radial-gradient(circle at 24% 18%,rgba(255,255,255,.32),transparent 48%),linear-gradient(135deg,var(--mistake-accent),color-mix(in srgb,var(--mistake-accent) 68%,#cfeaff 32%));box-shadow:inset 0 1px 0 rgba(255,255,255,.34),0 7px 16px color-mix(in srgb,var(--mistake-accent) 22%,transparent)}.practiceMistakeBar .practiceMistakeClear{color:#8a819a;background:0 0;border:1px solid transparent;padding:0 10px}.practiceMistakeBar .practiceMistakeClear:hover:not(:disabled){background:rgba(92,75,135,.07);color:#574c6b}.practiceMistakeBar .practiceMistakeClear:disabled,.practiceMistakeBar .practiceMistakeToggle:disabled{opacity:1;cursor:default}.practiceMistakeBar .practiceMistakeToggle:disabled{color:#ada5bb;border-color:rgba(92,75,135,.12);background:rgba(255,255,255,.55);box-shadow:none}.practiceMistakeBar .practiceMistakeClear:disabled{color:#c3bccd}.practiceMistakeBar .practiceMistakeClear:focus-visible,.practiceMistakeBar .practiceMistakeToggle:focus-visible{outline:2px solid var(--mistake-accent);outline-offset:2px}@media (max-width:600px){.practiceMistakeBar{border-radius:18px;padding:9px 9px 9px 11px;gap:8px}.practiceMistakeBar .mistakeBarInfo{gap:9px}.practiceMistakeBar .mistakeBarIcon{width:30px;height:30px;border-radius:10px}.practiceMistakeBar .mistakeBarIcon svg{width:15px;height:15px}.practiceMistakeBar .mistakeBarLabel b{font-size:13px;gap:6px}.practiceMistakeBar .mistakeBarCount{min-width:20px;height:20px;font-size:11.5px;padding:0 6px}.practiceMistakeBar .mistakeBarLabel small{font-size:11px}.practiceMistakeBar .practiceMistakeClear,.practiceMistakeBar .practiceMistakeToggle{height:34px;font-size:12.5px;padding:0 11px}.practiceMistakeBar .practiceMistakeClear{padding:0 8px}}@media (max-width:370px){.practiceMistakeBar .mistakeBarLabel small{display:none}.practiceMistakeBar .mistakeBarActions{gap:4px}}@media (max-width:760px){html body .app>.bottomNav{position:relative!important;left:auto!important;right:auto!important;width:min(760px,calc(100% - 24px))!important;margin:10px auto 10px!important;padding:6px!important;gap:4px!important;border-radius:24px!important;justify-content:center!important}html body .app>.bottomNav>button{border-radius:18px!important}}html body .app>.bottomNav>button{display:grid!important;grid-template-rows:auto auto!important;grid-template-columns:1fr!important;align-content:center!important;justify-content:center!important;justify-items:center!important;align-items:center!important;gap:4px!important;padding:6px 0!important;text-align:center!important}html body .app>.bottomNav>button>svg{display:block!important;margin:0 auto!important}html body .app>.bottomNav>button>span{display:block!important;width:100%!important;text-align:center!important;line-height:1.15!important}html body .app>.bottomNav{margin-top:10px!important}.sentenceBuilder{display:grid;gap:12px;align-content:start}.sentenceBuilder .exampleHeader{margin-bottom:0}.sentenceBuilder .sbPrompt{display:grid;gap:4px}.sentenceBuilder .sbPromptLabel{color:#746b84;font-size:11.5px;font-weight:750;letter-spacing:.02em}.sentenceBuilder .sbPromptZh{color:#2f2a3d;font-size:clamp(17px, 2.2vw, 21px);line-height:1.5;font-weight:850}.sentenceBuilder .sbAnswer{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-height:58px;padding:10px 40px 10px 12px;border:1.5px dashed rgba(92,75,135,.28);border-radius:16px;background:rgba(255,255,255,.6);transition:border-color .15s,background .15s}.sentenceBuilder .sbAnswer[data-state=ok]{border-style:solid;border-color:rgba(62,173,229,.72);background:linear-gradient(150deg,rgba(239,250,255,.98),rgba(203,237,255,.9))}.sentenceBuilder .sbAnswer[data-state=ng]{border-style:solid;border-color:rgba(190,72,96,.6);background:linear-gradient(160deg,rgba(255,243,246,.96),rgba(251,229,236,.86))}.sentenceBuilder .sbPlaceholder{color:#a49bb5;font-size:13px;font-weight:650}.sentenceBuilder .sbMark{position:absolute;right:10px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:28px;height:28px;border-radius:999px;color:#fff}.sentenceBuilder .sbMark.ok{background:linear-gradient(145deg,#61c8ff,#2f95d2);box-shadow:0 8px 16px rgba(47,149,210,.26)}.sentenceBuilder .sbMark.ng{background:linear-gradient(145deg,#e58aa3,#c05070);box-shadow:0 8px 16px rgba(190,72,96,.24)}.sentenceBuilder .sbPool{display:flex;flex-wrap:wrap;gap:8px}.sentenceBuilder .sbChip{--mark:#8B7AD8;--mark-bg:rgba(139, 122, 216, .14);--mark-bg-strong:rgba(139, 122, 216, .24);--mark-text:#4D3E8E;appearance:none;cursor:pointer;touch-action:manipulation;font:inherit;font-family:"Noto Sans JP","Hiragino Sans",sans-serif;font-size:19px;font-weight:700;line-height:1;color:var(--mark-text);padding:9px 12px 10px;border-radius:12px;border:1px solid color-mix(in srgb,var(--mark) 45%,transparent);background:linear-gradient(180deg,#fff,var(--mark-bg));box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 6px 14px color-mix(in srgb,var(--mark) 14%,transparent);transition:transform .14s cubic-bezier(.34, 1.5, .5, 1),box-shadow .14s,opacity .14s}.sentenceBuilder .sbChip:hover{transform:translateY(-1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 10px 20px color-mix(in srgb,var(--mark) 22%,transparent)}.sentenceBuilder .sbChip:active{transform:scale(.95)}.sentenceBuilder .sbChip.isPlaced{font-size:18px;padding:7px 10px 8px;background:linear-gradient(180deg,#fff,var(--mark-bg-strong))}.sentenceBuilder .sbChip.isUsed{opacity:.28;pointer-events:none;border-style:dashed;background:0 0;box-shadow:none}.sentenceBuilder .sbAnswer[data-state=ok] .sbChip.isPlaced{cursor:default}.sentenceBuilder .sbActions{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap;margin-top:2px}.exampleCardBackContent.sentenceBuilder{padding-bottom:16px!important;padding-left:6px!important;margin-left:-6px!important}.sentenceBuilder .sbActions button{display:inline-flex;align-items:center;gap:6px;min-height:42px;padding:0 14px;border-radius:14px;font:inherit;font-size:14px;font-weight:850;cursor:pointer}.sentenceBuilder .sbActions button:disabled{opacity:.45;cursor:default}.sentenceBuilder .sbHint{margin:0;color:#a4485c;font-size:12.5px;font-weight:700}.sentenceBuilder .sbReveal{display:grid;gap:6px;padding-top:10px;border-top:1px solid rgba(92,75,135,.12)}.sentenceBuilder .sbReveal .jpSentence{font-size:clamp(20px, 2.6vw, 26px)!important;margin:0 0 4px!important}.sentenceBuilder .sbReveal .exampleRomaji,.sentenceBuilder .sbReveal .reading{margin:0}@media (max-width:600px){.sentenceBuilder{gap:10px}.sentenceBuilder .sbChip{font-size:17px;padding:8px 10px 9px;border-radius:11px}.sentenceBuilder .sbChip.isPlaced{font-size:16px;padding:6px 9px 7px}.sentenceBuilder .sbAnswer{min-height:52px;padding:8px 38px 8px 10px}.sentenceBuilder .sbActions button{min-height:40px;padding:0 12px;font-size:13px}}.sentenceBuilder .exampleHeader{padding-right:6px!important}.sentenceBuilder .exampleHeaderActions{display:inline-flex!important;align-items:center;gap:12px!important;justify-self:end;margin-left:auto}.sentenceBuilder .exampleHeaderActions .exampleTurnButton,.sentenceBuilder .exampleHeaderActions .miniSound{position:static!important;margin:0!important}.trainingView .trainingCard.isSentenceOnly{gap:12px!important;justify-items:center!important}.trainingView .trainingCard.isSentenceOnly .sentenceStage{width:min(720px,100%)!important}.sentenceStageCard{width:100%;padding:clamp(18px,3vw,28px);border:1px solid rgba(255,255,255,.72);border-radius:26px;background:linear-gradient(145deg,rgba(255,255,255,.88),rgba(255,255,255,.6));-webkit-backdrop-filter:blur(28px) saturate(1.45);backdrop-filter:blur(28px) saturate(1.45);box-shadow:inset 0 1px 0 rgba(255,255,255,.86),0 18px 48px rgba(63,52,93,.08);display:grid;gap:14px}.sentenceStageWord{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 10px;padding-bottom:12px;border-bottom:1px solid rgba(92,75,135,.12)}.sentenceStageWord b{font-family:"Noto Sans JP","Hiragino Sans",sans-serif;font-size:clamp(24px, 3vw, 30px);font-weight:800;color:#1f1833;line-height:1.1}.sentenceStageWord span{font-family:"Noto Sans JP","Hiragino Sans",sans-serif;font-size:15px;font-weight:600;color:#6650a4}.sentenceStageWord em{font-style:normal;font-size:14px;font-weight:700;color:#746b84;margin-left:auto}.sentenceStageCard .sentenceBuilder .exampleHeader{min-height:40px!important}@media (max-width:600px){.sentenceStageCard{padding:16px 14px;border-radius:22px}.sentenceStageWord em{margin-left:0;flex-basis:100%}}.audioChoiceGrid .audioChoiceButton{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-align:center}.audioChoiceGrid .audioChoiceButton .choiceJapanese{order:-1;display:grid;justify-items:center;gap:2px;margin:0 0 6px}.audioChoiceGrid .audioChoiceButton .choiceJapanese b{font-size:clamp(26px, 7.4vw, 32px);font-weight:700;line-height:1.15;letter-spacing:.02em;overflow-wrap:anywhere}.audioChoiceGrid .audioChoiceButton .choiceJapanese small,.audioChoiceGrid .audioChoiceButton.isCorrect .choiceJapanese small,.audioChoiceGrid .audioChoiceButton.isWrong .choiceJapanese small{font-size:15px;font-weight:700;letter-spacing:.06em;color:#7462c0}.audioChoiceGrid .audioChoiceButton .choiceMeaning{font-size:20px;font-weight:800;line-height:1.35;color:#3a3547}.audioChoiceGrid .audioChoiceButton:has(.choiceJapanese) .choiceMeaning{font-size:16px;font-weight:700;color:#4a4557}@media (max-width:680px){.audioChoiceGrid .audioChoiceButton{padding:14px 44px}.audioChoiceGrid .audioChoiceButton .choiceMeaning{font-size:18px}.audioChoiceGrid .audioChoiceButton:has(.choiceJapanese) .choiceMeaning{font-size:15px}}.sentenceBuilder .exampleHeader{gap:8px}.sentenceBuilder .sbModeToggle{display:inline-flex;flex:none;gap:2px;padding:3px;margin-left:auto;border-radius:999px;background:rgba(255,255,255,.82);border:1px solid rgba(126,111,153,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.9)}.sentenceBuilder .sbModeToggle button{height:28px;padding:0 11px;border:0;border-radius:999px;background:0 0;color:#6f638b;font:inherit;font-size:12px;font-weight:850;letter-spacing:.02em;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .15s,color .15s}.sentenceBuilder .sbModeToggle button:hover:not(.isOn){background:rgba(255,255,255,.9);color:#4f4466}.sentenceBuilder .sbModeToggle button.isOn{color:#fff;background:linear-gradient(135deg,var(--lv-btn-a,#8978b3),var(--lv-btn-b,#a294c7));box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 4px 10px var(--lv-glow,rgba(139,122,216,.24))}.sentenceBuilder .sbModeToggle+.exampleHeaderActions{margin-left:0}.sentenceBuilder .sbKanaNote{display:block;margin-top:6px;font-size:11.5px;font-weight:700;color:#8a7fa6}@media (max-width:380px){.sentenceBuilder .sbModeToggle button{padding:0 9px;font-size:11.5px}}.practiceModeOptions button{min-width:0;overflow:hidden}@media (min-width:601px) and (max-width:900px){.practiceModeOptions button{flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:10px 8px;text-align:center}.practiceModeOptions button span{justify-items:center}.practiceModeOptions button small{white-space:normal;line-height:1.25}}html[data-level=N5]{--lv:#8B7AD8;--lv-deep:#6650A4;--lv-ink:#34235F;--lv-light:#A294C7;--lv-pale:#CFEAFF;--lv-alt:#B07AD0;--lv-2:#6F8FD8;--lv-pale-2:#EBD9F5;--lv-btn-a:#8978B3;--lv-btn-b:#A294C7;--lv-soft:rgba(139, 122, 216, .15);--lv-line:rgba(126, 111, 153, .22);--lv-glow:rgba(139, 122, 216, .24)}html[data-level=N4]{--lv:#5E83C8;--lv-deep:#3D64AE;--lv-ink:#2E4A85;--lv-light:#8FB0E6;--lv-pale:#CFEAFF;--lv-alt:#7A7BD2;--lv-2:#4E9EC6;--lv-pale-2:#DDE0F8;--lv-btn-a:#5E83C8;--lv-btn-b:#8FB0E6;--lv-soft:rgba(94, 131, 200, .14);--lv-line:rgba(94, 131, 200, .22);--lv-glow:rgba(94, 131, 200, .24);--lv-bg:#F3F5FB;--lv-bg-2:#F8F9FD}html[data-level=N3]{--lv:#C5598F;--lv-deep:#9F3C6E;--lv-ink:#7F2F57;--lv-light:#E090B5;--lv-pale:#FFD6E7;--lv-alt:#D9687A;--lv-2:#A85AAE;--lv-pale-2:#FBE3DF;--lv-btn-a:#BE6F94;--lv-btn-b:#D090AC;--lv-soft:rgba(193, 92, 149, .13);--lv-line:rgba(193, 92, 149, .22);--lv-glow:rgba(193, 92, 149, .24);--lv-bg:#F8F3F7;--lv-bg-2:#FBF8FA}html:is([data-level=N4],[data-level=N3]) body{background:var(--lv-bg)!important}html:is([data-level=N4],[data-level=N3]) .app{background:radial-gradient(circle at 10% 0,color-mix(in srgb,var(--lv) 10%,transparent),transparent 28%),radial-gradient(circle at 92% 9%,color-mix(in srgb,var(--lv-alt) 9%,transparent),transparent 30%),radial-gradient(circle at 12% 86%,color-mix(in srgb,var(--lv-pale-2) 45%,transparent),transparent 26%),linear-gradient(180deg,#fff 0,var(--lv-bg) 48%,var(--lv-bg-2) 100%)!important}html:is([data-level=N4],[data-level=N3]) .appHeader{border-bottom-color:var(--lv-line)!important}html:is([data-level=N4],[data-level=N3]) .appHeader p{color:var(--lv-deep)!important}html:is([data-level=N4],[data-level=N3]) .brandMark{background:linear-gradient(135deg,var(--lv) 0,var(--lv-light) 62%,var(--lv-alt) 100%)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.34),0 16px 36px var(--lv-glow)!important}html:is([data-level=N4],[data-level=N3]) .jlptStrip{border-color:var(--lv-line)!important}html:is([data-level=N4],[data-level=N3]) .goalBar span,html:is([data-level=N4],[data-level=N3]) .progressLine span{background:linear-gradient(90deg,var(--lv-2) 0,var(--lv) 60%,var(--lv-alt) 100%)!important}html:is([data-level=N4],[data-level=N3]) .dots .dotOn{background:var(--lv)!important}html:is([data-level=N4],[data-level=N3]) .categoryPickerHeader strong{color:var(--lv-deep)!important}html:is([data-level=N4],[data-level=N3]) .categoryPicker,html:is([data-level=N4],[data-level=N3]) .goalPanel,html:is([data-level=N4],[data-level=N3]) .hero,html:is([data-level=N4],[data-level=N3]) .searchBox,html:is([data-level=N4],[data-level=N3]) .selectCard{border-color:var(--lv-line)!important}html:is([data-level=N4],[data-level=N3]) .knownButton{color:var(--lv-ink)!important;border-color:var(--lv-line)!important}html:is([data-level=N4],[data-level=N3]) .flashcardView .navArea>.sideNav,html:is([data-level=N4],[data-level=N3]) .miniSound,html:is([data-level=N4],[data-level=N3]) .sideNav,html:is([data-level=N4],[data-level=N3]) .soundButton{color:var(--lv-deep)!important;border-color:var(--lv-line)!important}html:is([data-level=N4],[data-level=N3]) .exampleCardBackContent .exampleHeader .exampleTurnButton,html:is([data-level=N4],[data-level=N3]) .exampleCardBackContent .exampleHeader .miniSound,html:is([data-level=N4],[data-level=N3]) .flashcardFlipFrame .cardFlipTurnButton,html:is([data-level=N4],[data-level=N3]) .flashcardView .imageCardFrame>.soundButton.mainSound,html:is([data-level=N4],[data-level=N3]) .practiceStudyFlip .cardFlipTurnButton,html:is([data-level=N4],[data-level=N3]) .trainingView .practiceStudyFlip>.soundButton.mainSound,html:is([data-level=N4],[data-level=N3]) .trainingView .studyOnlyCard>.soundButton.mainSound{color:#fff!important;background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.5),transparent 55%),linear-gradient(135deg,var(--lv) 0,var(--lv-light) 55%,color-mix(in srgb,var(--lv-light) 70%,#fff) 100%)!important;box-shadow:inset 0 2px 4px rgba(255,255,255,.55),inset 0 -2px 4px rgba(0,0,0,.12),0 6px 16px var(--lv-glow),0 2px 5px rgba(0,0,0,.12)!important}html:is([data-level=N4],[data-level=N3]) .exampleCardBackContent .exampleHeader strong{color:var(--lv)!important}html:is([data-level=N4],[data-level=N3]) .flashcardView .imageCardFrame{border-color:var(--lv-line)!important}html:is([data-level=N4],[data-level=N3]) .categoryRail button.active,html:is([data-level=N4],[data-level=N3]) .conjugationShuffle,html:is([data-level=N4],[data-level=N3]) .conjugationView .conjHeaderBadge,html:is([data-level=N4],[data-level=N3]) .conjugationView .conjTypeDrillLaunchIcon,html:is([data-level=N4],[data-level=N3]) .conjugationView .conjugationHeader:after,html:is([data-level=N4],[data-level=N3]) .conjugationView .conjugationModes button.active .conjModeIcon,html:is([data-level=N4],[data-level=N3]) .conjugationView .conjugationModes button.active:before,html:is([data-level=N4],[data-level=N3]) .flashcardCardActions .startPracticeAction,html:is([data-level=N4],[data-level=N3]) .listeningView .listeningShuffleBtn.active,html:is([data-level=N4],[data-level=N3]) .primaryAction,html:is([data-level=N4],[data-level=N3]) .wideAction{background:linear-gradient(135deg,var(--lv-btn-a),var(--lv-btn-b))!important;box-shadow:0 14px 30px var(--lv-glow)!important;color:#fff!important}html:is([data-level=N4],[data-level=N3]) .conjugationView .conjugationActions .primaryAction{background:radial-gradient(circle at 28% 22%,rgba(255,255,255,.42),transparent 54%),linear-gradient(135deg,var(--lv),var(--lv-light))!important}html:is([data-level=N4],[data-level=N3]) .conjugationHeader p,html:is([data-level=N4],[data-level=N3]) .conjugationView .conjModeIcon,html:is([data-level=N4],[data-level=N3]) .conjugationView .conjugationHeader p,html:is([data-level=N4],[data-level=N3]) .conjugationView .conjugationModes:before,html:is([data-level=N4],[data-level=N3]) .listeningView .listeningShuffleBtn,html:is([data-level=N4],[data-level=N3]) .secondaryPracticeAction{color:var(--lv-deep)!important}html:is([data-level=N4],[data-level=N3]) .practiceModeOptions button.active{border-color:var(--lv)!important;background:color-mix(in srgb,var(--lv) 12%,#fff)!important;color:var(--lv-ink)!important;box-shadow:inset 0 0 0 1px var(--lv-line)!important}html:is([data-level=N4],[data-level=N3]) .practiceModeOptions button:focus-visible{outline-color:var(--lv)!important}html:is([data-level=N4],[data-level=N3]) .categoryPickerGrid .categoryOption:first-child{--category:var(--lv)}html[data-level] .knownButton{color:var(--lv-ink)!important;border-color:var(--lv-line)!important;background:rgba(255,255,255,.78)!important;transition:background .18s,color .18s,box-shadow .18s,border-color .18s,transform .15s}html[data-level] .knownButton.isKnown,html[data-level] .knownButton:active,html[data-level] .knownButton:hover{color:#fff!important;border-color:rgba(255,255,255,.6)!important;background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.5),transparent 55%),linear-gradient(135deg,var(--lv) 0,var(--lv-light) 55%,color-mix(in srgb,var(--lv-light) 70%,#fff) 100%)!important;box-shadow:inset 0 2px 4px rgba(255,255,255,.55),inset 0 -2px 4px rgba(0,0,0,.12),0 6px 16px var(--lv-glow),0 2px 5px rgba(0,0,0,.12)!important}html[data-level] .knownButton:active{transform:scale(.96)}html[data-level] .knownButton.isKnown:hover{background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.5),transparent 55%),linear-gradient(135deg,var(--lv-deep) 0,var(--lv) 55%,var(--lv-light) 100%)!important}html[data-level] .examplePanel .exampleHeader .miniSound,html[data-level] .flashcardView .exampleHeader .exampleHeaderActions .miniSound{color:#fff!important;border:1px solid rgba(255,255,255,.6)!important;background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.5),transparent 55%),linear-gradient(135deg,var(--lv) 0,var(--lv-light) 55%,color-mix(in srgb,var(--lv-light) 70%,#fff) 100%)!important;box-shadow:inset 0 2px 4px rgba(255,255,255,.55),inset 0 -2px 4px rgba(0,0,0,.12),0 6px 14px var(--lv-glow),0 2px 5px rgba(0,0,0,.12)!important}html:is([data-level=N4],[data-level=N3]) .exampleCardBackContent .exampleHeader strong,html:is([data-level=N4],[data-level=N3]) .grammarItem>span,html:is([data-level=N4],[data-level=N3]) .grammarSummaryAction{color:var(--lv-deep)!important}html:is([data-level=N4],[data-level=N3]) .exampleCardBackContent .exampleHeader strong,html:is([data-level=N4],[data-level=N3]) .grammarSummaryAction{color:var(--lv-2)!important}html:is([data-level=N4],[data-level=N3]) .practiceMistakeBar{--mistake-accent:var(--lv)}html:is([data-level=N4],[data-level=N3]) .practiceMistakeBar .mistakeBarCount{color:var(--lv-2);background:color-mix(in srgb,var(--lv-2) 14%,#fff);border-color:color-mix(in srgb,var(--lv-2) 24%,transparent)}html:is([data-level=N4],[data-level=N3]) .practiceMistakeBar .mistakeBarIcon,html:is([data-level=N4],[data-level=N3]) .practiceMistakeBar .practiceMistakeToggle.active{background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.45),transparent 55%),linear-gradient(135deg,var(--lv-btn-a),var(--lv-btn-b))}html[data-level] .practiceView .practiceBox .soundButton,html[data-level] .trainingView .practiceBox .soundButton{color:#fff!important;border:1px solid rgba(255,255,255,.6)!important;background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.5),transparent 55%),linear-gradient(135deg,var(--lv) 0,var(--lv-light) 55%,color-mix(in srgb,var(--lv-light) 70%,#fff) 100%)!important;box-shadow:inset 0 2px 4px rgba(255,255,255,.55),inset 0 -2px 4px rgba(0,0,0,.12),0 6px 16px var(--lv-glow),0 2px 5px rgba(0,0,0,.12)!important}html[data-level] .practiceBox .answerLine{color:var(--lv-ink)!important;background:linear-gradient(180deg,color-mix(in srgb,var(--lv) 9%,#fff),color-mix(in srgb,var(--lv) 5%,#fff))!important;border-color:var(--lv-line)!important}html[data-level] .practiceBox .practiceActions .primaryAction{background:linear-gradient(135deg,var(--lv-btn-a),var(--lv-btn-b))!important;box-shadow:0 10px 22px var(--lv-glow)!important;color:#fff!important}html[data-level] .practiceBox .practiceActions button:not(.primaryAction){color:var(--lv-ink)!important;border-color:var(--lv-line)!important}html[data-level] .practiceBox .promptMeaning{color:var(--lv-deep)!important}.practiceBox .practicePrompt>.promptText{min-width:0;flex:1 1 auto}.practiceBox .promptKanji{font-size:clamp(24px, calc(280px / var(--klen, 2)), 66px)!important;white-space:normal!important;overflow-wrap:anywhere!important;line-height:1.08!important}@media (max-width:600px){.practiceBox .promptKanji{font-size:clamp(22px, calc(230px / var(--klen, 2)), 44px)!important}}html[data-level] .flashcardView .navArea>.sideNav,html[data-level] .flashcardView .sideNav{color:#fff!important;border:1px solid rgba(255,255,255,.6)!important;background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.5),transparent 55%),linear-gradient(135deg,var(--lv) 0,var(--lv-light) 55%,color-mix(in srgb,var(--lv-light) 70%,#fff) 100%)!important;box-shadow:inset 0 2px 4px rgba(255,255,255,.55),inset 0 -2px 4px rgba(0,0,0,.12),0 8px 18px var(--lv-glow),0 2px 5px rgba(0,0,0,.12)!important}html[data-level] .flashcardView .sideNav:disabled,html[data-level] .flashcardView .sideNav[aria-disabled=true]{opacity:.35!important;box-shadow:none!important}html:is([data-level=N4],[data-level=N3]) .glAtlasLink,html:is([data-level=N4],[data-level=N3]) .grammarItem>span,html:is([data-level=N4],[data-level=N3]) .sgKeyPoint b{background:linear-gradient(135deg,var(--lv-btn-a),var(--lv-btn-b))!important;color:#fff!important;box-shadow:0 4px 10px color-mix(in srgb,var(--lv) 24%,transparent)!important}html:is([data-level=N4],[data-level=N3]) .sgRole{color:var(--lv-deep)!important}html:is([data-level=N4],[data-level=N3]) .sgCardAtlas{border-color:color-mix(in srgb,var(--lv) 35%,transparent)!important;background:color-mix(in srgb,var(--lv) 8%,#fff)!important;color:var(--lv-deep)!important}.flashcardView .imageCardFrame .imageCardTextOverlay{justify-content:flex-start!important;gap:10px!important}.flashcardView .imageCardFrame.cross-level-N5{--cross-level-border:rgba(65, 126, 224, 0.84);--cross-level-soft:rgba(65, 126, 224, 0.16);--cross-level-glow:rgba(65, 126, 224, 0.46);--cross-level-inset:rgba(65, 126, 224, 0.12)}.flashcardView .imageCardFrame.cross-level-N4{--cross-level-border:rgba(52, 158, 105, 0.86);--cross-level-soft:rgba(52, 158, 105, 0.16);--cross-level-glow:rgba(52, 158, 105, 0.46);--cross-level-inset:rgba(52, 158, 105, 0.12)}.flashcardView .imageCardFrame.cross-level-N3{--cross-level-border:rgba(231, 139, 45, 0.9);--cross-level-soft:rgba(231, 139, 45, 0.18);--cross-level-glow:rgba(231, 139, 45, 0.52);--cross-level-inset:rgba(231, 139, 45, 0.14)}body .flashcardView .imageCardFrame.cross-level-N3,body .flashcardView .imageCardFrame.cross-level-N4,body .flashcardView .imageCardFrame.cross-level-N5{position:relative;isolation:isolate;border:2px solid var(--cross-level-border)!important;background:linear-gradient(145deg,rgba(255,255,255,.9) 0,rgba(255,255,255,.66) 48%,var(--cross-level-soft) 100%)!important;-webkit-backdrop-filter:blur(28px) saturate(1.38) contrast(1.03);backdrop-filter:blur(28px) saturate(1.38) contrast(1.03);box-shadow:inset 1px 1px 0 rgba(255,255,255,.98),inset -1px -1px 0 var(--cross-level-soft),0 0 0 1px var(--cross-level-soft),0 0 22px 3px var(--cross-level-soft),0 20px 48px rgba(70,56,110,.16)!important}body .flashcardView .imageCardFrame.cross-level-N3::before,body .flashcardView .imageCardFrame.cross-level-N4::before,body .flashcardView .imageCardFrame.cross-level-N5::before{content:"";display:block!important;position:absolute;z-index:3;inset:0;border-radius:inherit;pointer-events:none;opacity:.58;background:radial-gradient(circle at 12% 4%,rgba(255,255,255,.98) 0,rgba(255,255,255,.5) 13%,transparent 34%),radial-gradient(circle at 92% 92%,var(--cross-level-soft) 0,transparent 42%),linear-gradient(118deg,transparent 18%,rgba(255,255,255,.4) 42%,transparent 64%);box-shadow:inset 0 2px 0 rgba(255,255,255,.96),inset 0 -2px 0 var(--cross-level-soft)}body .flashcardView .imageCardFrame.cross-level-N3::after,body .flashcardView .imageCardFrame.cross-level-N4::after,body .flashcardView .imageCardFrame.cross-level-N5::after{content:"";display:block!important;position:absolute;z-index:4;top:-2px;left:-72px;width:72px;height:2px;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(255,255,255,.98),transparent);filter:drop-shadow(0 0 5px var(--cross-level-glow));animation:cross-level-line-slide 3.4s ease-in-out infinite}@keyframes cross-level-line-slide{0%,8%{left:-72px;opacity:0}18%,82%{opacity:1}100%,92%{left:100%;opacity:0}}.flashcardView .imageCardFrame .imageCardTextOverlay>p{order:3!important;max-width:min(94%,520px)!important;margin:auto 0 0!important;color:rgba(49,43,68,.9)!important;font-size:clamp(19px, 3.5cqw, 28px)!important;line-height:1.3!important;font-weight:800!important}.flashcardView .imageCardFrame .imageCardTextOverlay>.accentContrast{order:2!important;margin-top:8px!important}.flashcardView .imageCardFrame .imageCardTextOverlay>.imageCardTextTop{order:1!important}.flashcardView .imageCardFrame .crossLevelBadge{position:absolute;z-index:5;top:22px;left:22px;padding:5px 10px;border:1px solid rgba(124,92,199,.26);border-radius:999px;background:rgba(248,246,255,.92);color:#6f5bad;font-size:13px;font-weight:800;letter-spacing:.02em;box-shadow:0 4px 12px rgba(68,52,110,.1)}@media (max-width:680px){.flashcardView .imageCardFrame .imageCardTextOverlay>p{font-size:clamp(17px, 5cqw, 22px)!important}}@media (max-width:560px){body .levelStrip.jlptStrip{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:4px!important;width:100%!important;max-width:100%!important;padding:4px!important;overflow:visible!important}body .levelStrip.jlptStrip .chip{min-width:0!important;width:100%!important;padding:0 6px!important;font-size:12px!important;letter-spacing:0!important}body .levelStrip.jlptStrip .chip.reviewModeBtn,body .levelStrip.jlptStrip .chip.shuffleBtn{min-width:0!important;gap:3px!important}body .levelStrip.jlptStrip .chip svg{width:13px!important;height:13px!important;flex:none!important}}.flashcardView .imageCardFrame .imageCardTextOverlay>.accentContrast{order:4!important;margin-top:4px!important;margin-bottom:0!important;max-width:96%!important;flex-wrap:wrap!important;row-gap:2px!important}@media (max-width:560px){.flashcardView .imageCardFrame .imageCardTextOverlay{padding-bottom:12px!important}.flashcardView .imageCardFrame .imageCardTextOverlay>.accentContrast{margin-top:2px!important;font-size:10px!important;line-height:1.25!important;gap:4px!important}.flashcardView .imageCardFrame .imageCardTextOverlay>.accentContrast .accentContrastLabel{font-size:9px!important;padding:0 4px!important}.flashcardView .imageCardFrame .imageCardTextTop strong.titleLong{font-size:clamp(13px, 7.6cqw, 30px)!important;line-height:1.06!important}}@media (max-width:560px){.flashcardView .imageCardFrame .imageCardTextOverlay:has(> .accentContrast)>p{font-size:clamp(13px, 4cqw, 17px)!important;line-height:1.2!important}}@media (max-height:620px){.flashcardView .imageCardFrame .imageCardTextOverlay{padding:2.6cqw 3cqw 1.6cqw!important;gap:.8cqw!important}.flashcardView .imageCardFrame .imageCardTextTop{gap:.8cqw!important}.flashcardView .imageCardFrame .imageCardTextTop strong{font-size:clamp(10px, 11cqw, 40px)!important;line-height:1.04!important}.flashcardView .imageCardFrame .imageCardTextTop span svg{height:8.5cqw!important;width:auto!important}.flashcardView .imageCardFrame .imageCardTextTop span{font-size:clamp(9px, 5cqw, 20px)!important}.flashcardView .imageCardFrame .imageCardTextTop em{font-size:clamp(8px, 4cqw, 15px)!important}.flashcardView .imageCardFrame .imageCardTextOverlay>p{font-size:clamp(9px, 5cqw, 18px)!important;line-height:1.2!important}.flashcardView .imageCardFrame .imageCardTextOverlay>.accentContrast{font-size:clamp(7px, 2.6cqw, 11px)!important;line-height:1.15!important;margin-top:0!important}.flashcardView .imageCardFrame .imageCardTextOverlay:has(> .accentContrast)>p{font-size:clamp(8px, 4.2cqw, 15px)!important}.flashcardView .imageCardFrame .imageCardTextTop strong.titleLong{font-size:clamp(8px, 6.2cqw, 22px)!important}}@media (max-width:430px){.flashcardView .imageCardFrame .cardVisualImageBox{transform:translateY(0)!important}}@media (min-width:431px) and (max-width:680px){.flashcardView .imageCardFrame .cardVisualImageBox{transform:translateY(0)!important}.flashcardView .imageCardFrame .imageCardTextOverlay{padding:3cqw 4cqw 2.2cqw!important;gap:.8cqw!important}.flashcardView .imageCardFrame .imageCardTextTop{gap:.6cqw!important}.flashcardView .imageCardFrame .imageCardTextTop strong{font-size:clamp(18px, 12cqw, 44px)!important;line-height:1.04!important}.flashcardView .imageCardFrame .imageCardTextTop strong.titleLong{font-size:clamp(14px, 6.4cqw, 26px)!important}.flashcardView .imageCardFrame .imageCardTextTop span svg{height:7cqw!important;width:auto!important}.flashcardView .imageCardFrame .imageCardTextTop em{font-size:clamp(9px, 3.2cqw, 14px)!important}.flashcardView .imageCardFrame .imageCardTextOverlay>p{font-size:clamp(11px, 3.6cqw, 17px)!important;line-height:1.2!important}.flashcardView .imageCardFrame .imageCardTextOverlay:has(> .accentContrast)>p{font-size:clamp(10px, 3.1cqw, 15px)!important}.flashcardView .imageCardFrame .imageCardTextOverlay>.accentContrast{font-size:clamp(8px, 2.4cqw, 11px)!important;line-height:1.15!important;margin-top:0!important}}@media (min-width:681px) and (min-height:621px){.flashcardView .imageCardFrame .imageCardTextOverlay{padding-top:min(34px,6cqw)!important;padding-bottom:min(20px,3.4cqw)!important;row-gap:min(10px,1.7cqw)!important}.flashcardView .imageCardFrame .imageCardTextTop{row-gap:min(7px,1.2cqw)!important}.flashcardView .imageCardFrame .imageCardTextTop strong{font-size:min(76px, 13.4cqw)!important}.flashcardView .imageCardFrame .imageCardTextTop strong.titleLong{font-size:min(36px, 6.4cqw)!important;line-height:1.05!important}.flashcardView .imageCardFrame .imageCardTextTop span svg{height:min(62px,11.2cqw)!important;width:auto!important}.flashcardView .imageCardFrame .imageCardTextTop em{font-size:min(18px, 3.2cqw)!important}.flashcardView .imageCardFrame .imageCardTextOverlay>p{font-size:min(20px, 3.5cqw)!important;line-height:1.2!important}.flashcardView .imageCardFrame .imageCardTextOverlay:has(> .accentContrast)>p{font-size:min(16px, 2.9cqw)!important}.flashcardView .imageCardFrame .imageCardTextOverlay>.accentContrast{font-size:min(12px, 2.1cqw)!important;line-height:1.15!important;margin-top:min(2px,.4cqw)!important}}.listeningView .listeningPanel{grid-template-columns:minmax(0,1fr)}html[lang=en] .listeningView .listeningHeader h2{font-size:clamp(21px,5.6vw,42px);-webkit-hyphens:auto;hyphens:auto;overflow-wrap:break-word}html[lang=en] .listeningMetaGrid b,html[lang=en] .listeningMetaGrid em{white-space:normal;overflow-wrap:break-word;text-overflow:clip}html[lang=en] .levelStrip.jlptStrip{grid-template-columns:repeat(3,minmax(0,1fr)) auto auto!important}html[lang=en] .levelStrip.jlptStrip .chip{padding-left:8px!important;padding-right:8px!important}html[lang=en] .categoryOptionText b{white-space:normal!important;overflow-wrap:break-word;text-overflow:clip!important;line-height:1.15!important}html[lang=en] .levelCard>em{white-space:nowrap}@media (max-width:480px){html[lang=en] .practiceModeOptions button{flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:10px 6px;text-align:center}html[lang=en] .practiceModeOptions button>span{min-width:0;max-width:100%}html[lang=en] .practiceModeOptions button b{white-space:normal;overflow-wrap:break-word;font-size:12.5px;line-height:1.15}html[lang=en] .practiceMistakeBar{flex-wrap:wrap}html[lang=en] .practiceMistakeBar .mistakeBarInfo{flex:1 1 170px;min-width:0}html[lang=en] .practiceMistakeBar .mistakeBarActions{flex:0 0 auto;margin-left:auto}}.jpl-ui{--ink:#2F2A3D;--ink2:#433760;--soft:#6F638B;--deep:var(--lv-deep,#6650A4);--err:#A4485C;--hair:rgba(102,80,164,.10);--track:rgba(63,52,93,.09);--fa:var(--lv-btn-a,#8978B3);--fb:var(--lv-btn-b,#A294C7);--eo:cubic-bezier(.22,1,.36,1);--es:cubic-bezier(.4,0,.2,1);--eb:cubic-bezier(.45,0,.55,1);--er:cubic-bezier(.33,1,.68,1);--ef:cubic-bezier(.32,0,.67,0);--ep:cubic-bezier(.34,1.36,.64,1);--m:80px;--hop:10px;color:var(--ink);font-size:14px;line-height:1.5;font-family:-apple-system,system-ui,"Segoe UI","Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;-webkit-font-smoothing:antialiased;box-sizing:border-box}.jpl-ui:lang(zh-Hans){font-family:-apple-system,system-ui,"PingFang SC","Noto Sans SC","Microsoft YaHei",sans-serif}.jpl-ui *{box-sizing:border-box}.jpl-ui .jpl-stage{position:relative;width:var(--m);height:var(--m);margin:0 auto;flex:none}.jpl-ui .jpl-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px}.jpl-ui .jpl-title{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:13.5px;font-weight:900;color:var(--ink2)}.jpl-ui .jpl-pct{flex:none;font-size:13px;font-weight:900;color:var(--deep);font-variant-numeric:tabular-nums}.jpl-ui .jpl-bar{position:relative;height:6px;margin-top:9px;border-radius:999px;background:var(--track);overflow:hidden}.jpl-ui .jpl-bar>i{position:absolute;inset:0;border-radius:inherit;overflow:hidden;background:linear-gradient(90deg,var(--fa),var(--fb));transform:translateX(calc((var(--p,0) - 1) * 100%));transition:transform .24s var(--eo)}.jpl-ui .jpl-bar>i::after{content:"";position:absolute;top:0;bottom:0;left:0;width:40%;background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.38),rgba(255,255,255,0));animation:jpl-sheen 2.4s linear infinite}.jpl-ui.is-indet .jpl-pct{visibility:hidden}.jpl-ui.is-indet .jpl-bar>i{width:30%;transform:none;animation:jpl-comet 1.6s var(--eb) infinite}.jpl-ui.st-fail .jpl-bar>i{background:linear-gradient(90deg,#dcd6e6,#cfc7de);animation:none}.jpl-ui.st-fail .jpl-bar>i::after{display:none}.jpl-ui .jpl-meta{margin-top:6px;font-size:11.5px;font-weight:750;color:var(--soft);font-variant-numeric:tabular-nums}.jpl-ui .jpl-meta:empty{display:none}.jpl-ui .jpl-lesson{margin-top:11px;padding-top:9px;border-top:1px solid var(--hair)}.jpl-ui .jpl-eyebrow{display:flex;align-items:center;gap:5px;font-size:10.5px;font-weight:800;letter-spacing:.16em;color:var(--soft)}.jpl-ui .jpl-eyebrow svg{width:13px;height:13px;flex:none}.jpl-ui .jpl-word{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:4px;transition:opacity .2s cubic-bezier(.4,0,1,1),transform .2s cubic-bezier(.4,0,1,1)}.jpl-ui .jpl-word.is-out{opacity:0;transform:translateY(-4px)}.jpl-ui .jpl-jp{font:500 24px/1.15 "Noto Sans JP","Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic",sans-serif;color:var(--ink)}.jpl-ui .jpl-kana{display:block;margin-top:1px;font-size:12px;font-weight:600;color:var(--soft)}.jpl-ui .jpl-mean{text-align:right;font-size:13px;font-weight:800;color:var(--deep)}.jpl-ui .jpl-pill{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:0 20px;border-radius:999px;border:1px solid rgba(102,80,164,.12);background:rgba(255,255,255,.76);color:#6650a4;font-family:inherit;font-size:14px;font-weight:850;line-height:1;cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.86),0 10px 24px rgba(63,52,93,.07);transition:transform .13s var(--es)}.jpl-ui .jpl-pill svg{width:18px;height:18px;flex:none}.jpl-ui .jpl-pill:active{transform:scale(.96)}.jpl-toast button:focus-visible,.jpl-ui .jpl-pill:focus-visible{outline:2px solid #6650A4;outline-offset:2px}.jpl-ui .jpl-pills{display:flex;gap:10px;justify-content:center;margin-top:14px}.jpl-ui .jpl-pills .jpl-pill{flex:1}.jpl-ui .jpl-etitle{display:flex;align-items:center;justify-content:center;gap:7px;font-size:16px;font-weight:900;color:var(--err);outline:0}.jpl-ui .jpl-etitle svg{width:18px;height:18px;flex:none}.jpl-ui .jpl-ebody{margin-top:6px;font-size:13px;font-weight:700;line-height:1.6;color:var(--soft);text-align:center}.jpl-ui details{margin-top:8px;font-size:12px;color:var(--soft);text-align:left}.jpl-ui summary{cursor:pointer;font-weight:800}.jpl-ui pre{margin-top:6px;max-height:120px;overflow:auto;white-space:pre-wrap;word-break:break-all;font:11px/1.45 ui-monospace,Menlo,monospace}.jpLoaderMount.jpl-on,.jpLoaderMount:has(>.jpl-inline){font-size:0!important;color:transparent!important;gap:0!important}.jpLoaderMount.jpl-on>:not(.jpl-inline),.jpLoaderMount:has(>.jpl-inline)>:not(.jpl-inline){display:none!important}.jpl-inline{display:grid;justify-items:center;gap:6px;width:min(300px,100%);animation:jpl-reveal .24s var(--eo) .25s both;font-weight:400}.jpl-inline .jpl-icard{width:100%;padding:14px 16px;border-radius:22px;border:1px solid rgba(255,255,255,.72);background:linear-gradient(145deg,rgba(255,255,255,.86),rgba(255,255,255,.56));-webkit-backdrop-filter:blur(24px) saturate(1.4);backdrop-filter:blur(24px) saturate(1.4);box-shadow:inset 0 1px 0 rgba(255,255,255,.82),0 18px 48px rgba(63,52,93,.08);text-align:left}.jpl-inline.st-fail .jpl-icard{text-align:center}@media (min-width:768px){.jpl-inline{--m:96px}}.jplLayer{position:fixed;inset:0;z-index:141;display:grid;place-items:center;padding:18px;pointer-events:none}.jplLayer .jpl-panel{pointer-events:auto;width:min(440px,100%);padding:26px 24px 22px;border-radius:26px;text-align:center;border:1px solid rgba(255,255,255,.72);background:linear-gradient(145deg,#fff,#f4efff);box-shadow:0 28px 80px rgba(31,24,51,.32);animation:jpl-reveal .24s var(--eo) both}.jplLayer .jpl-eye{font-size:10px;font-weight:950;letter-spacing:.14em;color:#6f638b}.jplLayer h2{margin:6px 0 12px;font-size:21px;font-weight:900;color:#211832;transition:opacity .16s var(--es)}.jplLayer .jpl-stage{--m:88px;margin-bottom:14px;animation:jpl-drop .36s var(--eo) both}.jplLayer .jpl-bar{height:8px}.jplLayer .jpl-meta2{display:flex;justify-content:space-between;margin-top:8px;font-size:13px;font-weight:850;color:var(--soft);font-variant-numeric:tabular-nums}.jplLayer .jpl-meta2 b{font-weight:900;color:var(--deep)}.jplLayer .jpl-hint{margin-top:10px;font-size:12.5px;font-weight:750;color:#665b78}.jplLayer .jpl-pills .jpl-pill{min-height:46px;border-radius:14px}@media (max-width:520px){.jplLayer .jpl-panel{border-radius:22px;padding:22px 18px 18px}}@media (min-width:768px){.jplLayer h2{font-size:24px}}.jpl-toast{position:fixed;left:0;right:0;top:calc(env(safe-area-inset-top,0px) + 12px);z-index:2147483000;width:min(340px,calc(100vw - 32px));min-height:56px;margin:0 auto;padding:10px 14px 12px 10px;border-radius:18px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;border:1px solid rgba(255,255,255,.72);background:linear-gradient(145deg,rgba(255,255,255,.97),rgba(250,248,253,.93));-webkit-backdrop-filter:blur(24px) saturate(1.4);backdrop-filter:blur(24px) saturate(1.4);box-shadow:inset 0 1px 0 rgba(255,255,255,.82),0 18px 48px rgba(63,52,93,.12);animation:jpl-toast-in .26s var(--eo) .4s backwards;transition:opacity .2s var(--es),transform .2s var(--es)}.jpl-toast.is-now{animation-delay:0s}.jpl-toast.is-out{opacity:0;transform:translateY(-8px)}.jpl-toast .jpl-stage{--m:32px}.jpl-toast .jpl-ttext{min-width:0;font-size:13px;font-weight:850;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.jpl-toast.st-fail .jpl-ttext{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.jpl-toast .jpl-x{font-size:18px!important;font-weight:700!important;min-width:36px!important;margin-left:4px!important}.jpl-ui .jpl-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.jpl-ui.st-fail .jpl-pct{visibility:hidden}.jpl-toast .jpl-tend{font-size:12px;font-weight:850;color:#6650a4;font-variant-numeric:tabular-nums;display:flex;align-items:center}.jpl-toast .jpl-tend svg{width:16px;height:16px}.jpl-toast .jpl-tend button{min-width:44px;min-height:44px;margin:-10px -8px -10px 0;border:0;background:0 0;color:#6650a4;font-family:inherit;font-size:12.5px;font-weight:900;cursor:pointer}.jpl-toast .jpl-bar{position:absolute;left:14px;right:14px;bottom:6px;height:3px;margin:0}.jpl-toast.st-done .jpl-bar,.jpl-toast.st-fail .jpl-bar{opacity:0;transition:opacity .2s}@keyframes jpl-reveal{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes jpl-toast-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}@keyframes jpl-drop{0%{opacity:0;transform:translateY(-12px)}100%{opacity:1;transform:none}}@keyframes jpl-sheen{0%{transform:translateX(-100%)}100%,70%{transform:translateX(260%)}}@keyframes jpl-comet{0%{transform:translateX(-110%)}100%{transform:translateX(330%)}}@keyframes jpl-fade{from{opacity:0}to{opacity:1}}@keyframes jpl-pulse{0%,100%{opacity:.55}50%{opacity:1}}@media (prefers-reduced-motion:reduce){.jpl-inline,.jpl-toast,.jplLayer .jpl-panel{animation-name:jpl-fade}.jpl-ui.is-indet .jpl-bar>i{width:40%;animation:jpl-pulse 2s linear infinite}.jpl-ui .jpl-bar>i{transition:transform .12s linear}.jpl-ui .jpl-word.is-out{transform:none}}@media (prefers-reduced-transparency:reduce){.jpl-inline .jpl-icard,.jpl-toast,.jplLayer .jpl-panel{background:#fff;-webkit-backdrop-filter:none;backdrop-filter:none}}@media (forced-colors:active){.jpl-ui .jpl-bar{border:1px solid CanvasText}.jpl-ui .jpl-bar>i{background:Highlight}}.jpl-ui .jpl-walk{position:absolute;inset:0;transform:translateX(var(--wx,0));transition:transform var(--wt,.6s) linear}.jpl-ui .jpl-floor{position:absolute;left:50%;width:calc(var(--m) * .633);height:calc(var(--m) * .092);margin-left:calc(var(--m) * -.3165);top:calc(100% - var(--m) * .071);border-radius:50%;background:radial-gradient(closest-side,rgba(102,80,164,.18),rgba(102,80,164,0))}.jpl-ui .jpl-arm,.jpl-ui .jpl-body,.jpl-ui .jpl-feet,.jpl-ui .jpl-foot,.jpl-ui .jpl-tail,.jpl-ui .jpl-tw,.jpl-ui .jpl-up{position:absolute;inset:0}.jpl-ui .jpl-arm img,.jpl-ui .jpl-foot img,.jpl-ui .jpl-p,.jpl-ui .jpl-tail img{position:absolute;inset:0;width:100%;height:100%;display:block;user-select:none;-webkit-user-drag:none}.jpl-ui .jpl-arm{transform-origin:var(--ap)}.jpl-ui .jpl-arm-r{--ap:85% 52%}.jpl-ui .jpl-arm-l{--ap:14.14% 52%}/* 尾巴：在身體後面。外層 .jpl-tw 一直輕搖、裡面的圖走路時再加擺動（兩個轉動疊加，切換時不會跳）。 要藏的那一條往身體中間滑進去；要出來的那一條晚一點從身體後面滑出 */ .jpl-ui .jpl-tail-r{--tp:76% 82%;--ts:1}.jpl-ui .jpl-tail-l{--tp:23.14% 82%;--ts:-1}.jpl-ui .jpl-tail img,.jpl-ui .jpl-tw{transform-origin:var(--tp)}.jpl-ui .jpl-tw{animation:jpl-wag 2.8s var(--eb) infinite}.jpl-ui .jpl-tail{translate:0 0;opacity:1;transition:translate .36s cubic-bezier(.2,.7,.3,1) .22s,opacity .08s linear .22s}.jpl-ui .jpl-tail-l,.jpl-ui.face-r .jpl-tail-r{opacity:0;transition:translate .32s cubic-bezier(.5,0,.75,.3),opacity .14s linear .18s}.jpl-ui .jpl-tail-l{translate:22% 0}.jpl-ui.face-r .jpl-tail-r{translate:-22% 0}.jpl-ui.face-r .jpl-tail-l{opacity:1;translate:0 0;transition:translate .36s cubic-bezier(.2,.7,.3,1) .22s,opacity .08s linear .22s}.jpl-ui.dir-l .jpl-eyes{translate:-3.5% 0}.jpl-ui.dir-r .jpl-eyes{translate:3.5% 0}.jpl-ui.is-walking .jpl-foot-l{animation:jpl-foot-l var(--cycle,1.3s) linear infinite}.jpl-ui.is-walking .jpl-foot-r{animation:jpl-foot-r var(--cycle,1.3s) linear infinite}.jpl-ui.is-walking .jpl-arm{animation:jpl-arm var(--cycle,1.3s) linear infinite}.jpl-ui.is-walking .jpl-tail img{animation:jpl-tailwalk var(--cycle,1.3s) linear infinite}.jpl-ui .jpl-eyes{position:absolute;inset:0;width:100%;height:100%;overflow:visible;transition:translate .45s cubic-bezier(.4,0,.2,1)}.jpl-ui .jpl-pupil{transition:transform .28s cubic-bezier(.3,.7,.3,1)}.jpl-ui .jpl-pupil-y{transition:transform .4s var(--es)}.jpl-ui .jpl-lid,.jpl-ui .jpl-mlid{transform-box:fill-box;transform-origin:50% 0;transform:scaleY(0)}.jpl-ui .jpl-mlid{transition:transform .45s var(--es)}.jpl-ui .jpl-lash,.jpl-ui .jpl-tear{opacity:0}.jpl-ui .jpl-tear{transition:opacity .5s var(--es) .25s}.jpl-ui .jpl-mouth{stroke-dasharray:1;stroke-dashoffset:1;opacity:0;transition:stroke-dashoffset .45s var(--es),opacity .1s linear .35s}.jpl-ui.look-l .jpl-pupil{transform:translateX(-34px)}.jpl-ui.look-r .jpl-pupil{transform:translateX(34px)}.jpl-ui.is-blink .jpl-lid{animation:jpl-lid .26s cubic-bezier(.45,0,.55,1) 1}.jpl-ui.is-blink .jpl-lash{animation:jpl-lash .26s linear 1}.jpl-ui.mood-slow .jpl-pupil{animation:jpl-scan 3.2s var(--eb) infinite}.jpl-ui.mood-happy .jpl-mouth{stroke-dashoffset:0;opacity:1;transition:stroke-dashoffset .45s var(--es),opacity 0s}.jpl-ui.mood-sad .jpl-mlid{transform:scaleY(1)}.jpl-ui.mood-sad .jpl-pupil-y{transform:translateY(16px)}.jpl-ui.mood-sad .jpl-tear{opacity:1}.jpl-ui .jpl-sparks{position:absolute;left:50%;top:38%;width:0;height:0}.jpl-ui .jpl-sparks i{position:absolute;left:-7px;top:-7px;width:14px;height:14px;color:var(--lv,#a294c7);opacity:0;animation:jpl-spark .56s var(--eo) both}.jpl-ui .jpl-sparks i.dot{left:-2px;top:-2px;width:4px;height:4px;border-radius:50%;background:rgba(162,148,199,.55)}.jpl-ui .jpl-sparks svg{display:block;width:100%;height:100%}@keyframes jpl-wag{0%,100%{rotate:0deg}50%{rotate:calc(-4deg * var(--ts,1))}}@keyframes jpl-lid{0%{transform:scaleY(0)}38%,62%{transform:scaleY(1)}100%{transform:scaleY(0)}}@keyframes jpl-lash{0%,32%{opacity:0}40%,60%{opacity:1}100%,68%{opacity:0}}@keyframes jpl-scan{0%,12%{transform:translateX(0)}30%,46%{transform:translateX(-30px)}64%,80%{transform:translateX(30px)}100%{transform:translateX(0)}}@keyframes jpl-spark{0%{opacity:0;transform:translate(0,0) scale(.2)}25%{opacity:1}70%{transform:translate(var(--dx),var(--dy)) scale(1) rotate(20deg)}100%{opacity:0;transform:translate(calc(var(--dx) * 1.15),calc(var(--dy) * 1.15)) scale(.6) rotate(30deg)}}@media (prefers-reduced-motion:reduce){.jpl-ui .jpl-arm,.jpl-ui .jpl-foot,.jpl-ui .jpl-tail img,.jpl-ui .jpl-tw,.jpl-ui.mood-slow .jpl-pupil{animation:none!important}.jpl-ui .jpl-walk{transition:none!important;transform:none!important}.jpl-ui .jpl-sparks{display:none}}@keyframes jpl-foot-l{0%{translate:0 0.000%}4.16667%{translate:0 -0.214%}8.33333%{translate:0 -0.800%}12.5%{translate:0 -1.600%}16.6667%{translate:0 -2.400%}20.8333%{translate:0 -2.986%}25%{translate:0 -3.200%}29.1667%{translate:0 -2.986%}33.3333%{translate:0 -2.400%}37.5%{translate:0 -1.600%}41.6667%{translate:0 -0.800%}45.8333%{translate:0 -0.214%}50%{translate:0 0.000%}54.1667%{translate:0 0.000%}58.3333%{translate:0 0.000%}62.5%{translate:0 0.000%}66.6667%{translate:0 0.000%}70.8333%{translate:0 0.000%}75%{translate:0 0.000%}79.1667%{translate:0 0.000%}83.3333%{translate:0 0.000%}87.5%{translate:0 0.000%}91.6667%{translate:0 0.000%}95.8333%{translate:0 0.000%}100%{translate:0 0.000%}}@keyframes jpl-foot-r{0%{translate:0 0.000%}4.16667%{translate:0 0.000%}8.33333%{translate:0 0.000%}12.5%{translate:0 0.000%}16.6667%{translate:0 0.000%}20.8333%{translate:0 0.000%}25%{translate:0 0.000%}29.1667%{translate:0 0.000%}33.3333%{translate:0 0.000%}37.5%{translate:0 0.000%}41.6667%{translate:0 0.000%}45.8333%{translate:0 0.000%}50%{translate:0 -0.000%}54.1667%{translate:0 -0.214%}58.3333%{translate:0 -0.800%}62.5%{translate:0 -1.600%}66.6667%{translate:0 -2.400%}70.8333%{translate:0 -2.986%}75%{translate:0 -3.200%}79.1667%{translate:0 -2.986%}83.3333%{translate:0 -2.400%}87.5%{translate:0 -1.600%}91.6667%{translate:0 -0.800%}95.8333%{translate:0 -0.214%}100%{translate:0 -0.000%}}@keyframes jpl-arm{0%{rotate:0.000deg}4.16667%{rotate:4.141deg}8.33333%{rotate:8.000deg}12.5%{rotate:11.314deg}16.6667%{rotate:13.856deg}20.8333%{rotate:15.455deg}25%{rotate:16.000deg}29.1667%{rotate:15.455deg}33.3333%{rotate:13.856deg}37.5%{rotate:11.314deg}41.6667%{rotate:8.000deg}45.8333%{rotate:4.141deg}50%{rotate:0.000deg}54.1667%{rotate:-4.141deg}58.3333%{rotate:-8.000deg}62.5%{rotate:-11.314deg}66.6667%{rotate:-13.856deg}70.8333%{rotate:-15.455deg}75%{rotate:-16.000deg}79.1667%{rotate:-15.455deg}83.3333%{rotate:-13.856deg}87.5%{rotate:-11.314deg}91.6667%{rotate:-8.000deg}95.8333%{rotate:-4.141deg}100%{rotate:-0.000deg}}@keyframes jpl-tailwalk{0%{rotate:calc(0.000deg * var(--ts,1))}4.16667%{rotate:calc(3.000deg * var(--ts,1))}8.33333%{rotate:calc(5.196deg * var(--ts,1))}12.5%{rotate:calc(6.000deg * var(--ts,1))}16.6667%{rotate:calc(5.196deg * var(--ts,1))}20.8333%{rotate:calc(3.000deg * var(--ts,1))}25%{rotate:calc(0.000deg * var(--ts,1))}29.1667%{rotate:calc(-3.000deg * var(--ts,1))}33.3333%{rotate:calc(-5.196deg * var(--ts,1))}37.5%{rotate:calc(-6.000deg * var(--ts,1))}41.6667%{rotate:calc(-5.196deg * var(--ts,1))}45.8333%{rotate:calc(-3.000deg * var(--ts,1))}50%{rotate:calc(-0.000deg * var(--ts,1))}54.1667%{rotate:calc(3.000deg * var(--ts,1))}58.3333%{rotate:calc(5.196deg * var(--ts,1))}62.5%{rotate:calc(6.000deg * var(--ts,1))}66.6667%{rotate:calc(5.196deg * var(--ts,1))}70.8333%{rotate:calc(3.000deg * var(--ts,1))}75%{rotate:calc(0.000deg * var(--ts,1))}79.1667%{rotate:calc(-3.000deg * var(--ts,1))}83.3333%{rotate:calc(-5.196deg * var(--ts,1))}87.5%{rotate:calc(-6.000deg * var(--ts,1))}91.6667%{rotate:calc(-5.196deg * var(--ts,1))}95.8333%{rotate:calc(-3.000deg * var(--ts,1))}100%{rotate:calc(-0.000deg * var(--ts,1))}}.jpl-cheer{display:block}.jpl-cheer .jpl-stage{--m:92px;margin:0 auto}.jpl-ui.is-cheer .jpl-arm-l{animation:jpl-cheer-l 2.6s var(--eb) infinite}.jpl-ui.is-cheer .jpl-arm-r{animation:jpl-cheer-r 2.6s var(--eb) infinite}@keyframes jpl-cheer-l{0%,100%,58%{rotate:0deg}13%{rotate:18deg}26%{rotate:3deg}40%{rotate:18deg}}@keyframes jpl-cheer-r{0%,100%,58%{rotate:0deg}13%{rotate:-18deg}26%{rotate:-3deg}40%{rotate:-18deg}}@media (prefers-reduced-motion:reduce){.jpl-ui.is-cheer .jpl-arm{animation:none!important}}.np-host{position:absolute!important;z-index:-1!important;pointer-events:none!important;display:block!important;margin:0!important;padding:0!important;grid-area:auto!important;inset:auto;--np-fur:#C7B6E4;--np-limb:#B3A0D8;--np-line:#6F5A9A;--np-mouth:#7A66A0;--np-yawn:#5B4B78;--np-z:#8B7AD8;--np-sh:102,80,164}.np-host[data-lv=N4]{--np-fur:#B4C8EC;--np-limb:#98B2E2;--np-line:#3D64AE;--np-mouth:#4E6FA8;--np-yawn:#2E4A85;--np-z:#5E83C8;--np-sh:61,100,174}.np-host[data-lv=N3]{--np-fur:#EFB3CE;--np-limb:#E297BB;--np-line:#9F3C6E;--np-mouth:#A8497A;--np-yawn:#7F2F57;--np-z:#C5598F;--np-sh:159,60,110}.dailyPlanPanel:has(>.np-host),/* 角色在卡片內容後面（文字、按鈕蓋在上面）、被卡片邊緣切掉；有角色的級別卡不顯示淡灰底圖 */ .levelCard:has(>.np-host){isolation:isolate}.levelCard:has(>.np-host) .levelGhostIcon{opacity:0!important}.np-host *{pointer-events:none;user-select:none;-webkit-user-select:none}.np-c-fur,.np-lid{fill:var(--np-fur)}.np-c-limb{fill:var(--np-limb)}.np-lash{stroke:var(--np-line)}.np-mouth{stroke:var(--np-mouth)}.np-yawn{fill:var(--np-yawn)}.np-slide{position:absolute;left:0;top:0;width:var(--np-m,50px);height:var(--np-m,50px);will-change:transform}.np-l{position:absolute;inset:0}.np-l>svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;display:block}.np-torso{transform-origin:50% 95.6%}.np-body{transform-origin:50% 90.1%}.np-arm-l{transform-origin:15.8% 54.8%}.np-arm-r{transform-origin:84.2% 55.2%}.np-foot-l{transform-origin:36.2% 95.6%}.np-foot-r{transform-origin:63.4% 95.6%}.np-tail{transform-origin:50% 50%}.np-tailr{transform-origin:83.2% 83.6%}.np-lid{transform-box:fill-box;transform-origin:50% 0;transform:scaleY(0)}.np-lash{opacity:0}.np-yawn{transform-box:fill-box;transform-origin:50% 25%;transform:scale(0)}.np-shadow{position:absolute;left:20%;right:20%;top:92.5%;height:6.2%;border-radius:50%;background:radial-gradient(closest-side,rgba(var(--np-sh),.2),rgba(var(--np-sh),0))}.np-z{color:var(--np-z);opacity:0;transform-origin:6.5% 6.5%}:is(.homeGrid,.levelGrid) .levelCard.np-comp.np-comp{grid-template-columns:auto 1fr!important;grid-template-rows:auto auto 1fr!important;justify-items:start!important;align-items:center!important;align-content:stretch!important;text-align:left!important;gap:8px 10px!important;padding:22px 24px 20px!important}:is(.homeGrid,.levelGrid) .levelCard.np-comp.np-comp>.levelIconMark{grid-area:1/1/2/2!important;margin:0!important;place-self:center start!important}:is(.homeGrid,.levelGrid) .levelCard.np-comp.np-comp>strong{grid-area:1/2/2/3!important;margin:0!important;place-self:center start!important;line-height:1!important}:is(.homeGrid,.levelGrid) .levelCard.np-comp.np-comp>.n3GateTierLabel{grid-area:2/1/3/3!important;margin:0!important;place-self:start start!important}:is(.homeGrid,.levelGrid) .levelCard.np-comp.np-comp>em{grid-area:3/1/4/3!important;margin:0!important;place-self:end start!important;white-space:nowrap!important;width:auto!important;height:auto!important;min-width:0!important;padding:5px 12px!important;border-radius:999px!important}:is(.homeGrid,.levelGrid) .levelCard.np-comp.np-comp[data-np-side=left]{grid-template-columns:1fr auto!important;justify-items:end!important;text-align:right!important}:is(.homeGrid,.levelGrid) .levelCard.np-comp.np-comp[data-np-side=left]>.levelIconMark{grid-area:1/2/2/3!important;place-self:center end!important}:is(.homeGrid,.levelGrid) .levelCard.np-comp.np-comp[data-np-side=left]>strong{grid-area:1/1/2/2!important;place-self:center end!important}:is(.homeGrid,.levelGrid) .levelCard.np-comp.np-comp[data-np-side=left]>.n3GateTierLabel{place-self:start end!important}:is(.homeGrid,.levelGrid) .levelCard.np-comp.np-comp[data-np-side=left]>em{place-self:end end!important}.dailyPlanPanel.np-plan-comp .dpHead{flex-wrap:wrap;row-gap:10px}.dailyPlanPanel.np-plan-comp .dpTitle{flex-basis:calc(100% - 62px)}.dailyPlanPanel.np-plan-comp .dpLevels{margin-left:62px}.dailyPlanPanel.np-plan-comp .dpBar,.dailyPlanPanel.np-plan-comp .dpStats,.dailyPlanPanel.np-plan-comp .dpSub{margin-right:var(--np-zone,0)}.dailyPlanPanel.np-plan-comp .dpReward{background:#fdfcff}:is(.homeGrid,.levelGrid) .levelCard.np-comp.np-comp{min-height:156px!important;padding:20px 24px!important;grid-template-columns:40px 1fr!important;gap:8px 10px!important;background:linear-gradient(115deg,#fff 32%,var(--pet-wash,#f1ecfa) 100%)!important;border:1px solid var(--pet-border,#e4dcf3)!important;box-shadow:0 8px 24px rgba(65,45,105,.045)!important}.levelCard[data-np-level=N4]{--pet-wash:#edf3fd;--pet-border:#dce6f5}.levelCard[data-np-level=N3]{--pet-wash:#fceef5;--pet-border:#f2dce7}:is(.homeGrid,.levelGrid) .levelCard.np-comp.np-comp>.n3GateTierLabel{max-width:54%;font-size:18px!important}:is(.homeGrid,.levelGrid) .levelCard.np-comp.np-comp>.levelIconMark{width:40px!important;height:40px!important}.dailyPlanPanel.np-plan-comp .dpHead{margin-right:230px}.dailyPlanPanel.np-plan-comp .dpTitle{flex-basis:calc(100% - 62px)}.dailyPlanPanel.np-plan-comp .dpBar,.dailyPlanPanel.np-plan-comp .dpStats{margin-right:0}@media(max-width:599px){:is(.homeGrid,.levelGrid) .levelCard.np-comp.np-comp{min-height:132px!important;padding:16px 20px!important}.dailyPlanPanel:has(>.np-host) .dpHead{padding-right:88px}.dailyPlanPanel:has(>.np-host) .dpSub{padding-right:70px}}.levelGrid.np-bento.np-bento.np-bento{grid-template-columns:minmax(0,1.08fr) minmax(0,1fr)!important}.levelGrid.np-bento>.levelCard[data-np-level=N5]{grid-column:1!important;grid-row:auto/span 2!important}.levelGrid.np-bento>.levelCard[data-np-level=N3],.levelGrid.np-bento>.levelCard[data-np-level=N4]{grid-column:2!important;grid-row:auto!important;min-height:214px!important}@media (max-width:599px){.levelGrid.np-bento>:not(.levelCard){grid-column:1/-1!important}.levelCard.np-bento-card[data-np-level=N3],.levelCard.np-bento-card[data-np-level=N4]{--pet-minh:196px}:is(.homeGrid,.levelGrid) .levelCard.np-bento-card.np-comp.np-comp{padding:16px 14px 14px!important}}:is(.homeGrid,.levelGrid) .levelCard.np-bento-card.np-comp.np-comp{min-height:var(--pet-minh,0)!important;height:auto!important;grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto auto auto 1fr!important;align-content:start!important;justify-items:start!important;gap:4px!important;padding:22px 22px 18px!important;background:var(--pet-tint,#f2eefb)!important;border:1px solid var(--pet-border,#e4dcf3)!important;box-shadow:0 8px 24px rgba(65,45,105,.05)!important}.levelCard.np-bento-card[data-np-level=N5]{--pet-tint:#F2EEFB;--pet-border:#e4dcf3}.levelCard.np-bento-card[data-np-level=N4]{--pet-tint:#EDF3FC;--pet-border:#dce6f5;--pet-minh:214px}.levelCard.np-bento-card[data-np-level=N3]{--pet-tint:#FCEEF4;--pet-border:#f2dce7;--pet-minh:214px}:is(.homeGrid,.levelGrid) .levelCard.np-bento-card.np-comp.np-comp>.levelIconMark{display:none!important}:is(.homeGrid,.levelGrid) .levelCard.np-bento-card.np-comp.np-comp>strong{grid-area:1/1/2/2!important;font-size:clamp(34px,7.4vw,50px)!important;line-height:1!important;letter-spacing:-.01em}:is(.homeGrid,.levelGrid) .levelCard.np-bento-card.np-comp.np-comp[data-np-level=N5]>strong{font-size:clamp(46px,11vw,76px)!important}:is(.homeGrid,.levelGrid) .levelCard.np-bento-card.np-comp.np-comp>.n3GateTierLabel{grid-area:2/1/3/2!important;max-width:none!important;margin-top:4px!important;font-size:clamp(15px,3.3vw,22px)!important;font-weight:900!important;color:#1f1833!important}:is(.homeGrid,.levelGrid) .levelCard.np-bento-card.np-comp.np-comp>em{grid-area:3/1/4/2!important;place-self:start start!important;margin-top:8px!important;background:rgba(255,255,255,.85)!important}.np-deco-back,.np-deco-front{position:absolute!important;inset:0!important;margin:0!important;padding:0!important;pointer-events:none!important;display:block!important;grid-area:auto!important;overflow:hidden;border-radius:inherit}.np-deco-back{z-index:-2!important}.np-deco-front{z-index:0!important}.np-deco-back>svg,.np-deco-front>svg{position:absolute;left:0;top:0;overflow:visible}.np-note{position:absolute;white-space:nowrap;line-height:1.45;letter-spacing:.06em;font-weight:400;transform-origin:0 50%;font-family:"LXGW WenKai TC","HanziPen TC","Klee One","Yuppy TC",cursive}.np-mark{position:absolute;text-align:right;font:800 12px/1.15 "Plus Jakarta Sans",system-ui,sans-serif;letter-spacing:.08em}:is(.homeGrid,.levelGrid) .levelCard.np-bento-card.np-comp.np-comp>.n3GateTierLabel{white-space:normal!important;line-height:1.2!important}html[lang=en] :is(.homeGrid,.levelGrid) .levelCard.np-bento-card.np-comp.np-comp:not([data-np-level=N5])>.n3GateTierLabel{max-width:58%!important}html[lang=en] :is(.homeGrid,.levelGrid) .levelCard.np-bento-card.np-comp.np-comp>.n3GateTierLabel{font-size:clamp(13px,2.6vw,18px)!important}html[lang=en] :is(.homeGrid,.levelGrid) .levelCard.np-bento-card.np-comp.np-comp[data-np-level=N4]>.n3GateTierLabel{max-width:50%!important}.np-deco-front{--np-fur:#C7B6E4;--np-limb:#B3A0D8;--np-line:#6F5A9A}.np-deco-front[data-lv=N4]{--np-fur:#B4C8EC;--np-limb:#98B2E2;--np-line:#3D64AE}.np-deco-front[data-lv=N3]{--np-fur:#EFB3CE;--np-limb:#E297BB;--np-line:#9F3C6E}.np-paw{position:absolute;display:block;overflow:visible;transform:rotate(var(--r,0deg));transform-origin:50% 100%}.np-paw-fill{fill:var(--np-limb)}.np-paw-crease{fill:none;stroke:var(--np-line);stroke-width:3.4;stroke-linecap:round;opacity:.32}.np-paw.np-wave{animation:np-wave 7.2s ease-in-out infinite}@keyframes np-wave{0%,100%,58%{transform:rotate(var(--r,0deg))}64%{transform:rotate(calc(var(--r,0deg) - 22deg))}70%{transform:rotate(calc(var(--r,0deg) + 2deg))}76%{transform:rotate(calc(var(--r,0deg) - 22deg))}82%{transform:rotate(calc(var(--r,0deg) + 2deg))}88%{transform:rotate(var(--r,0deg))}}@media (prefers-reduced-motion:reduce){.np-paw.np-wave{animation:none}}.dailyPlanPanel>.np-deco-front{z-index:1!important}:is(.homeGrid,.levelGrid) .levelCard.np-bento-card.np-comp.np-comp{background:linear-gradient(160deg,#fff 38%,var(--pet-tint,#f2eefb) 100%)!important}.levelCard.np-bento-card[data-np-level=N5]{--pet-tint:#F4F1FB}.levelCard.np-bento-card[data-np-level=N4]{--pet-tint:#F0F4FB}.levelCard.np-bento-card[data-np-level=N3]{--pet-tint:#FBF1F5}.dailyPlanPanel.np-plan-comp{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(200px,32%);column-gap:22px;align-items:start}.dailyPlanPanel.np-plan-comp>*{grid-column:1}.dailyPlanPanel.np-plan-comp>.dpHead{grid-column:1/-1;margin-right:0!important}.dailyPlanPanel.np-plan-comp>.dpGoal,.dailyPlanPanel.np-plan-comp>.dpHint{grid-column:1/-1}.dailyPlanPanel.np-plan-comp>.dpActions{grid-column:2;grid-row:3/span 4;align-self:end;display:flex!important;flex-direction:column;gap:8px;margin-top:0}.dailyPlanPanel.np-plan-comp>.dpActions>*{flex:none!important;width:100%!important}.dailyPlanPanel.np-plan-comp .dpBar,.dailyPlanPanel.np-plan-comp .dpStats,.dailyPlanPanel.np-plan-comp .dpSub{margin-right:0!important}.dailyPlanPanel.np-plan-comp>.np-deco-front,.dailyPlanPanel.np-plan-comp>.np-host{grid-column:auto}.np-grin{transform-box:fill-box;transform-origin:50% 0;transform:scale(0)}.np-grin-mouth{fill:var(--np-yawn)}.np-grin-tongue{fill:#E98AA8}.np-in-card[data-lv=N4] .np-grin,.np-in-card[data-lv=N4] .np-mouth,.np-in-card[data-lv=N4] .np-yawn{display:none}.np-pen{transform-origin:79% 69%}@media (max-width:599px){.levelGrid.np-bento.np-bento.np-bento{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important}}.ced-root{--ced-ink:#322c46;--ced-muted:#7b7490;--ced-line:rgba(124, 92, 199, 0.22);--ced-accent:#6650a4;--ced-accent-soft:rgba(124, 92, 199, 0.12);--ced-panel:rgba(255, 255, 255, 0.94);--ced-shadow:0 18px 48px rgba(62, 44, 24, 0.18);font-family:"Plus Jakarta Sans","Noto Sans JP",system-ui,sans-serif;color:var(--ced-ink)}.ced-launcher{position:fixed;right:18px;bottom:104px;z-index:900;display:inline-flex;align-items:center;gap:8px;padding:11px 17px;border:1px solid var(--ced-line);border-radius:999px;background:var(--ced-panel);backdrop-filter:blur(14px);box-shadow:var(--ced-shadow);color:var(--ced-accent);font-size:14px;font-weight:800;cursor:pointer}.ced-launcher:hover{background:#fff}.ced-launcher[hidden]{display:none!important}.ced-launcher .ced-dot{width:8px;height:8px;border-radius:50%;background:#d9534f}.ced-launcher .ced-dot[hidden]{display:none}.ced-panel{position:fixed;top:0;right:0;bottom:0;width:min(360px,100vw);z-index:950;display:flex;flex-direction:column;background:var(--ced-panel);backdrop-filter:blur(22px);border-left:1px solid var(--ced-line);box-shadow:var(--ced-shadow);transform:translateX(100%);transition:transform .22s ease}.ced-panel.ced-open{transform:none}.ced-head{display:flex;align-items:flex-start;gap:10px;padding:16px 16px 12px;border-bottom:1px solid var(--ced-line)}.ced-head-main{flex:1;min-width:0}.ced-title{margin:0;font-size:13px;font-weight:800;letter-spacing:.04em;color:var(--ced-muted);text-transform:uppercase}.ced-word{margin:3px 0 0;font-size:20px;font-weight:900;line-height:1.25;word-break:break-all}.ced-sub{margin:2px 0 0;font-size:12px;color:var(--ced-muted);word-break:break-all}.ced-close{flex:none;width:32px;height:32px;border:1px solid var(--ced-line);border-radius:50%;background:#fff;color:var(--ced-muted);font-size:16px;line-height:1;cursor:pointer}.ced-tabs{display:flex;gap:6px;padding:12px 16px 0}.ced-tab{flex:1;padding:9px 4px;border:1px solid var(--ced-line);border-radius:12px;background:#fff;color:var(--ced-muted);font-size:13px;font-weight:800;cursor:pointer}.ced-tab.ced-active{background:var(--ced-accent);border-color:var(--ced-accent);color:#fff}.ced-confirm-bar{display:flex;align-items:center;gap:8px;margin:12px 16px 0;padding:10px 12px;border:1px solid rgba(217,83,79,.35);border-radius:12px;background:rgba(217,83,79,.09)}.ced-confirm-bar[hidden]{display:none!important}.ced-others-bar{border-color:rgba(124,92,199,.3);background:rgba(124,92,199,.08)}.ced-others-bar .ced-confirm-text{color:#6650a4}.ced-lock-bar{border-color:rgba(47,125,85,.32);background:rgba(47,125,85,.09)}.ced-lock-bar .ced-confirm-text{color:#2f7d55}body.ced-panel-open .app{box-sizing:border-box;padding-right:min(360px,100vw);transition:padding-right .22s ease}@media (max-width:640px){body.ced-panel-open .app{padding-right:0}}.ced-confirm-text{flex:1;font-size:12px;font-weight:800;color:#b4453f}.ced-confirm-bar .ced-btn{flex:0 0 auto;min-width:0;padding:7px 12px}.ced-body{flex:1;overflow-y:auto;padding:14px 16px 24px}.ced-pane[hidden]{display:none}.ced-hint{margin:0 0 14px;padding:9px 11px;border-radius:10px;background:var(--ced-accent-soft);font-size:12px;line-height:1.55;color:#4f4370}.ced-field{margin-bottom:14px}.ced-field-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:5px;font-size:12px;font-weight:800;color:var(--ced-muted)}.ced-field-head b{font-variant-numeric:tabular-nums;color:var(--ced-ink);font-size:13px}.ced-field input[type=range]{width:100%;accent-color:var(--ced-accent)}.ced-row{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}.ced-btn{flex:1 1 auto;min-width:84px;padding:9px 12px;border:1px solid var(--ced-line);border-radius:11px;background:#fff;color:var(--ced-accent);font-size:13px;font-weight:800;cursor:pointer}.ced-btn:hover{background:var(--ced-accent-soft)}.ced-btn:disabled{opacity:.45;cursor:not-allowed}.ced-btn.ced-primary{background:var(--ced-accent);border-color:var(--ced-accent);color:#fff}.ced-btn.ced-danger{color:#b4453f;border-color:rgba(180,69,63,.3)}.ced-check{display:flex;align-items:center;gap:8px;margin-bottom:12px;font-size:13px;font-weight:700;color:var(--ced-ink);cursor:pointer}.ced-check input{accent-color:var(--ced-accent)}.ced-status{min-height:18px;font-size:12px;font-weight:700;color:var(--ced-muted)}.ced-status.ced-ok{color:#2f7d55}.ced-status.ced-err{color:#b4453f}.ced-label{display:block;margin-bottom:5px;font-size:12px;font-weight:800;color:var(--ced-muted)}.ced-input,.ced-select,.ced-textarea{width:100%;padding:9px 11px;border:1px solid var(--ced-line);border-radius:11px;background:#fff;color:var(--ced-ink);font-size:13px;font-family:inherit}.ced-textarea{min-height:132px;line-height:1.5;resize:vertical;font-size:12px}.ced-queue{margin-top:16px}.ced-queue h4{margin:0 0 8px;font-size:12px;font-weight:800;color:var(--ced-muted);text-transform:uppercase;letter-spacing:.04em}.ced-queue-item{display:flex;align-items:center;gap:8px;padding:8px 10px;margin-bottom:6px;border:1px solid var(--ced-line);border-radius:10px;background:#fff;font-size:12px}.ced-queue-item b{font-size:13px}.ced-queue-item .ced-grow{flex:1;min-width:0}.ced-badge{padding:2px 8px;border-radius:999px;background:var(--ced-accent-soft);color:var(--ced-accent);font-size:11px;font-weight:800}.ced-badge.ced-done{background:rgba(47,125,85,.14);color:#2f7d55}.ced-badge.ced-failed{background:rgba(180,69,63,.14);color:#b4453f}.ced-mini{border:none;background:0 0;color:var(--ced-muted);font-size:15px;cursor:pointer}.ced-empty{padding:10px;border-radius:10px;background:rgba(0,0,0,.03);font-size:12px;color:var(--ced-muted)}.ced-card-active{cursor:grab}.ced-card-active.ced-dragging{cursor:grabbing}.ced-frame-guide{position:absolute;border:1.5px dashed rgba(102,80,164,.55);border-radius:8px;pointer-events:none;z-index:6}.ced-modal{position:fixed;inset:0;z-index:1000;display:flex;flex-direction:column;background:rgba(28,22,44,.72);backdrop-filter:blur(6px)}.ced-modal[hidden]{display:none!important}.ced-modal-bar{display:flex;flex-wrap:nowrap;align-items:center;gap:8px;padding:12px 16px;overflow-x:auto;background:var(--ced-panel);border-bottom:1px solid var(--ced-line)}.ced-modal-bar>*{flex:none}.ced-modal-bar .ced-status{min-width:150px;text-align:right}.ced-modal-bar .ced-spacer{flex:1}.ced-tool{padding:8px 13px;border:1px solid var(--ced-line);border-radius:10px;background:#fff;color:var(--ced-accent);font-size:13px;font-weight:800;cursor:pointer}.ced-tool.ced-active{background:var(--ced-accent);border-color:var(--ced-accent);color:#fff}.ced-brush{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:800;color:var(--ced-muted)}.ced-brush input{width:130px;accent-color:var(--ced-accent)}.ced-canvas-wrap{flex:1;display:grid;place-items:center;overflow:auto;padding:18px}.ced-canvas-stage{position:relative;background:linear-gradient(45deg,#eee 25%,transparent 25%,transparent 75%,#eee 75%) 0 0/18px 18px,linear-gradient(45deg,#eee 25%,transparent 25%,transparent 75%,#eee 75%) 9px 9px/18px 18px,#fff;box-shadow:0 12px 40px rgba(0,0,0,.35)}.ced-canvas-stage canvas{display:block;cursor:crosshair;touch-action:none}.ced-crop-guide{position:absolute;border:2px solid rgba(102,80,164,.8);box-shadow:0 0 0 9999px rgba(255,255,255,.45);pointer-events:none}.ced-crop-guide[hidden]{display:none}@media (max-width:640px){.ced-panel{top:auto;height:min(72vh,560px);width:100vw;border-left:none;border-top:1px solid var(--ced-line);border-radius:20px 20px 0 0;transform:translateY(100%)}.ced-panel.ced-open{transform:none}.ced-launcher{right:12px;bottom:92px}}.ced-worker{font-size:12px;color:#7b7490;margin:4px 0 8px;min-height:16px;word-break:break-all}.ced-worker-on{color:#1a7f37}.ced-worker-paused{color:#b26a00}.ced-review{display:flex;align-items:center;gap:8px;margin:4px 0 0}.ced-cat{font-size:12px;padding:2px 8px;border-radius:999px;background:#eee;color:#555}.ced-cat:empty{display:none}.ced-cat-ok{background:#dff3e4;color:#1a7f37}.ced-cat-regen{background:#e3ecfb;color:#2b5fb8}.ced-cat-queued{background:#fff1d6;color:#9a6400}.ced-cat-bad{background:#fde2e2;color:#b42318}.ced-cat-auto{background:#efe9fb;color:#6b4fbb}.ced-cat-todo{background:#f1f1f1;color:#666}.ced-counts{font-size:11px;color:#7b7490;margin:4px 0 0}.ced-review{flex-wrap:wrap}.ced-next-kind{max-width:210px;font-size:12px}.ced-mark-checked{background:#dff3e4;color:#1a7f37;border-color:#b7e2c2}.reviewLogOverlay{position:fixed;inset:0;z-index:240;display:flex;align-items:flex-end;justify-content:center;padding:18px;background:rgba(25,18,42,.38);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}.reviewLogPanel{width:min(1180px,100%);max-height:min(88vh,900px);display:grid;grid-template-rows:auto auto minmax(0,1fr);gap:12px;border:1px solid rgba(139,122,216,.22);border-radius:26px;background:linear-gradient(145deg,#fff,#fbf9ff);box-shadow:0 28px 70px rgba(33,25,56,.26);padding:20px 22px 18px;color:#211938}.reviewLogHead{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}.reviewLogHead p{margin:0 0 3px;color:#6650a4;font-size:12px;font-weight:900;letter-spacing:.02em}.reviewLogHead h2{margin:0;font-size:22px;font-weight:950;line-height:1.15}.reviewLogHead h2 small{font-size:13px;font-weight:800;color:#8f85a3;margin-left:6px}.reviewLogHeadActions{display:flex;align-items:center;gap:8px}.reviewLogClose{width:38px;height:38px;padding:0;border:0;border-radius:12px;background:#f0ebff;color:#6650a4;font-size:24px;line-height:1;cursor:pointer}.reviewLogTools{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.reviewLogFilters{display:flex;flex-wrap:wrap;gap:6px}.reviewLogSearch{flex:1 1 220px;min-width:0;min-height:36px;padding:6px 12px;border-radius:999px;border:1px solid rgba(102,80,164,.22);background:rgba(255,255,255,.9);font:inherit;font-size:13px;color:#1f1833}.reviewLogSearch:focus{outline:0;border-color:rgba(102,80,164,.55);box-shadow:0 0 0 2px rgba(137,120,179,.16)}.reviewLogTableWrap{overflow:auto;border:1px solid rgba(102,80,164,.12);border-radius:16px;background:rgba(255,255,255,.7)}.reviewLogTable{min-width:820px}.reviewLogTable td{font-size:12.5px;line-height:1.45;vertical-align:top;padding:7px 8px}.reviewLogTable .colTime{white-space:nowrap;color:#8f85a3;font-variant-numeric:tabular-nums}.reviewLogTable .colWord small{display:block;color:#a49bb5;font-size:10px;font-weight:800}.reviewLogJump{padding:0;border:0;background:0 0;font:inherit;font-weight:900;color:#2f2a3d;cursor:pointer;text-align:left}.reviewLogJump:hover{color:#6650a4;text-decoration:underline}.reviewLogTable .colBefore{color:#8f85a3;max-width:260px}.reviewLogTable .colAfter{max-width:360px;color:#1f1833}.reviewLogTag{display:inline-block;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:900;white-space:nowrap;background:#eee8f7;color:#514475}.reviewLogTag.is-maint{background:#e4f1fb;color:#2e5f8f}.reviewLogTag.is-recheck{background:#dff5e9;color:#1f7a55}.reviewLogStatus{display:inline-block;padding:3px 8px;border-radius:999px;font-size:10.5px;font-weight:900;white-space:nowrap}.reviewLogStatus.is-done{background:rgba(47,174,107,.14);color:#1f7a55}.reviewLogStatus.is-pending{background:rgba(216,163,76,.18);color:#a8781f}.reviewLogRow.is-recheck td{background:rgba(47,174,107,.04)}.reviewLogEmpty{margin:0;padding:28px;text-align:center;color:#8f85a3;font-weight:800}@media (max-width:680px){.reviewLogOverlay{padding:8px}.reviewLogPanel{padding:16px 14px 14px;border-radius:22px;max-height:92vh}.reviewLogHead h2{font-size:19px}}
/* 2026-10-11：放大字卡輔助文字，分開等級、學習階段與進度。 */
.cardsGoal .cgTitle p { font-size: 13px; line-height: 1.5; white-space: normal; }
.cardsGoal .cgTitle strong { font-size: 18px; line-height: 1.4; }
.cardsGoal .cgCheck { font-size: 13px; }
.cardsGoal .cgWeek .dpDay small { font-size: 12px; }
.cardsGoal .cgOrderLabel { font-size: 13px; }
.cardsGoal .cgOrderBtn b { font-size: 15px; }
.cardsGoal .cgOrderBtn small { font-size: 12px; line-height: 1.4; }
.cardsGoal .cgHint { font-size: 13px; line-height: 1.65; color: #655b78; }
.planBar.isCards { padding: 12px; gap: 14px; }
.planBar .planBarHeading { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; font-size: 17px; line-height: 1.4; white-space: normal; }
.planBarLevel { display: inline-flex; padding: 2px 7px; border-radius: 8px; background: var(--plan-deep); color: #fff; font-size: 13px; }
.planBar .planBarStage { margin-left: 0; font-size: 12px; padding: 3px 8px; }
.planBar.isCards .planBarInfo { gap: 7px; }
.planBarStats { display: flex; flex-wrap: wrap; gap: 6px 16px; color: #655b78; font-size: 13px; line-height: 1.5; }
.planBarStats > span { display: inline-flex; align-items: baseline; gap: 5px; white-space: nowrap; }
.planBarStats strong { font-size: 18px; color: var(--plan-ink); font-weight: 900; font-variant-numeric: tabular-nums; }
.planBarTotal { font-variant-numeric: tabular-nums; }
.planBar.isCards .planBarExit, .planBar.isCards .planBarNext { min-height: 44px; font-size: 14px; }
@media (max-width: 520px) {
  .planBar.isCards { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px; }
  .planBar.isCards .planBarInfo { grid-column: 2; }
  .planBar.isCards .planBarNext { grid-column: 1 / -1; justify-content: center; }
  .planBar .planBarHeading { font-size: 16px; }
  .planBarStats { column-gap: 12px; }
  .cardsGoal .cgHead { flex-wrap: wrap; }
  .cardsGoal .cgCheck { margin-left: auto; }
  .cardsGoal .cgOrder { flex-wrap: wrap; gap: 6px; }
  .cardsGoal .cgOrderSeg { flex-basis: 100%; }
  .cardsGoal .cgOrderBtn small { white-space: normal; }
}

/* Character-based supporting colors for practice modes. */
.practiceModeHub .practiceModeOptions > button:nth-child(1) { --mode-base: #C7B6E4; --mode-ink: #66508A; }
.practiceModeHub .practiceModeOptions > button:nth-child(2) { --mode-base: #B4C8EC; --mode-ink: #365B91; }
.practiceModeHub .practiceModeOptions > button:nth-child(3) { --mode-base: #FCD878; --mode-ink: #785613; }
.practiceModeHub .practiceModeOptions > button:nth-child(4) { --mode-base: #EFB3CE; --mode-ink: #943A64; }
.practiceModeHub .practiceModeOptions > button:nth-child(5) { --mode-base: #6BB96E; --mode-ink: #316B3B; }
.practiceModeHub .practiceModeOptions > button { background: color-mix(in srgb, var(--mode-base) 16%, white); border-color: color-mix(in srgb, var(--mode-base) 48%, white); color: var(--mode-ink); }
.practiceModeHub .practiceModeOptions > button small { color: #655F70; }
.practiceModeHub .practiceModeOptions > button:hover { background: color-mix(in srgb, var(--mode-base) 27%, white); }
.practiceModeHub .practiceModeOptions > button.active { background: color-mix(in srgb, var(--mode-base) 38%, white); border-color: var(--mode-ink); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--mode-ink) 25%, transparent); }
.practiceModeHub .practiceModeOptions > button:focus-visible { outline-color: var(--mode-ink); }

/* 2026-10-14 cgGroupPick (same as daily-plan.css tail) */
.cgGroupPick .cgStepRow { display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; gap: 8px; } .cgGroupPick .cgStep { display: grid; place-items: center; min-height: 48px; border: 1px solid color-mix(in srgb, var(--plan) 28%, #fff); border-radius: 12px; background: #fff; color: var(--plan-deep); } .cgGroupPick .cgStep:disabled { opacity: .35; } .cgGroupPick .cgStepCur { display: grid; grid-template-columns: auto minmax(0, 1fr) 16px; align-items: center; gap: 10px; min-height: 48px; padding: 0 14px; border: 1px solid color-mix(in srgb, var(--plan) 28%, #fff); border-radius: 12px; background: #fff; color: var(--plan-deep); text-align: left; font: inherit; cursor: pointer; box-shadow: none; } .cgGroupPick .cgStepCur b { display: inline-flex; align-items: center; gap: 4px; font-size: 15px; font-weight: 850; white-space: nowrap; } .cgGroupPick .cgStepCur span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #847a91; font-size: 13px; font-weight: 600; } .cgGroupPick .cgStepCaret { color: var(--plan); transition: transform .2s ease; } .cgGroupPick.isOpen .cgStepCur { border-color: var(--plan); } .cgChips { display: flex; gap: 6px; overflow-x: auto; padding: 2px 18px 2px 2px; scrollbar-width: none; scroll-snap-type: x proximity; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 14px, #000 calc(100% - 28px), transparent); mask-image: linear-gradient(90deg, transparent 0, #000 14px, #000 calc(100% - 28px), transparent); } .cgChips.atStart { -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent); } .cgChips.atEnd { -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 14px); mask-image: linear-gradient(90deg, transparent 0, #000 14px); } .cgChips::-webkit-scrollbar { display: none; } .cgChip { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; gap: 2px; min-width: 40px; height: 40px; padding: 0 10px; border: 1px solid color-mix(in srgb, var(--plan) 28%, #fff); border-radius: 999px; background: #fff; color: #6f6680; font: inherit; font-size: 14px; font-weight: 700; font-variant-numeric: tabular-nums; scroll-snap-align: center; cursor: pointer; } .cgChip.isAll { padding: 0 14px; } .cgChip.isDone { color: var(--plan-deep); } .cgChip.isDone svg { color: var(--plan); } .cgChip.isOn { background: var(--plan); border-color: var(--plan); color: #fff; } .cgChip.isOn svg { color: #fff; } .cgChip:focus-visible { outline: 2px solid var(--plan); outline-offset: 2px; }

/* 2026-10-16 nav-pet.css：聽力頁標題角色加大、標題區加高（來源 assets/nav-pet.css，重建時會一併產生） */
.listeningView .listeningHeader:has(>.np-host){min-height:var(--np-listen-h,148px);padding-right:var(--np-listen-pad,200px)}

/* 2026-10-16 錯誤檢查（nav-pet.js 設的變數／屬性）：聽力頁窄版不顯示耳機小方塊、英文標題不自動斷字；手機版每日計畫副標依角色位置留右邊 */
.listeningView .listeningHeader[data-np-narrow="true"]:has(>.np-host) .listeningHeaderBadge{display:none!important}
html .listeningView .listeningHeader:has(>.np-host) h2{-webkit-hyphens:manual;hyphens:manual}
@media (max-width:599px){.dailyPlanPanel:has(>.np-host) .dpSub{padding-right:var(--np-plan-r,70px)}}

/* MODEHUB_20261016（同日使用者：「改成圓的看看」→ 圖示色塊改正圓）使用者圈「練習 選擇練習方式」：「這邊視覺風格要調整好看一點」
   → 跟首頁級別卡同一套：白底往角色色漸層的小卡、右上淡色圓、圖示放進圓角色塊、標題加大；
     選中＝角色深色外框＋右上打勾圓點＋浮起陰影；滑過微微浮起。五個顏色沿用五隻角色（紫藍黃粉綠）。 */
.practiceModeHub.practiceModeHub{padding:18px 18px 16px;border-radius:28px;border-color:rgba(124,104,186,.14);background:linear-gradient(160deg,#fff 35%,#f7f3fc);box-shadow:0 10px 28px rgba(65,45,105,.06)}
.practiceModeHub .practiceModeHeading{align-items:center;margin-bottom:14px}
.practiceModeHub .practiceModeHeading strong{font-size:21px;letter-spacing:.02em;color:#2b2440}
.practiceModeHub .practiceModeHeading span{padding:3px 10px;border-radius:999px;background:#f0ebf8;color:#6a5a92;font-size:12px;font-weight:700}
.practiceModeHub .practiceModeOptions{gap:10px}
.practiceModeHub .practiceModeOptions > button{position:relative;overflow:hidden;isolation:isolate;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:10px;min-height:112px;padding:14px 14px 13px;border-radius:24px;
  border:1px solid color-mix(in srgb,var(--mode-base) 42%,#fff);background:linear-gradient(155deg,#fff 42%,color-mix(in srgb,var(--mode-base) 24%,#fff));
  box-shadow:0 4px 12px color-mix(in srgb,var(--mode-ink) 7%,transparent);text-align:left;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}
.practiceModeHub .practiceModeOptions > button::before{content:"";position:absolute;z-index:-1;right:-22px;top:-22px;width:70px;height:70px;border-radius:50%;background:color-mix(in srgb,var(--mode-base) 20%,transparent)}
.practiceModeHub .practiceModeOptions > button svg{box-sizing:border-box;width:40px;height:40px;padding:9px;border-radius:50%;background:color-mix(in srgb,var(--mode-base) 34%,#fff);color:var(--mode-ink);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--mode-base) 45%,#fff)}
.practiceModeHub .practiceModeOptions > button span{gap:3px;justify-items:start}
.practiceModeHub .practiceModeOptions > button b{font-size:15px;font-weight:850;color:var(--mode-ink)}
.practiceModeHub .practiceModeOptions > button small{font-size:11.5px;font-weight:600;color:#6f6880}
.practiceModeHub .practiceModeOptions > button:hover{background:linear-gradient(155deg,#fff 30%,color-mix(in srgb,var(--mode-base) 32%,#fff));transform:translateY(-2px);box-shadow:0 8px 18px color-mix(in srgb,var(--mode-ink) 12%,transparent)}
.practiceModeHub .practiceModeOptions > button.active{border-color:color-mix(in srgb,var(--mode-ink) 70%,#fff);background:linear-gradient(155deg,#fff 20%,color-mix(in srgb,var(--mode-base) 40%,#fff));
  box-shadow:0 8px 20px color-mix(in srgb,var(--mode-ink) 16%,transparent),inset 0 0 0 1px color-mix(in srgb,var(--mode-ink) 30%,transparent)}
.practiceModeHub .practiceModeOptions > button.active svg{background:var(--mode-ink);color:#fff;box-shadow:none}
.practiceModeHub .practiceModeOptions > button.active::after{content:"";position:absolute;right:10px;top:10px;width:20px;height:20px;border-radius:50%;background:var(--mode-ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/13px no-repeat}
@media (prefers-reduced-motion:reduce){.practiceModeHub .practiceModeOptions > button{transition:none}.practiceModeHub .practiceModeOptions > button:hover{transform:none}}
/* 級別主題（N4／N3）原本用 !important 把選中的格子改成級別色 → 保留級別色外框，但用新的漸層與圖示色塊 */
html:is([data-level=N4],[data-level=N3]) .practiceModeHub .practiceModeOptions > button.active{background:linear-gradient(155deg,#fff 20%,color-mix(in srgb,var(--mode-base) 40%,#fff))!important;border-color:color-mix(in srgb,var(--mode-ink) 70%,#fff)!important;color:var(--mode-ink)!important}
@media (max-width:900px) and (min-width:601px){.practiceModeHub .practiceModeOptions > button{min-height:118px;padding:12px 11px}.practiceModeHub .practiceModeOptions > button b{font-size:14px;white-space:normal;line-height:1.2}.practiceModeHub .practiceModeOptions > button small{white-space:normal}}
/* 手機：六格網格，前三個一格寬、後兩個各一點五格寬，兩排排滿不留空洞；只留圖示＋標題 */
@media (max-width:600px){
  .practiceModeHub.practiceModeHub{padding:14px 12px 12px}
  .practiceModeHub .practiceModeHeading strong{font-size:18px}
  .practiceModeHub .practiceModeOptions{grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
  .practiceModeHub .practiceModeOptions > button{grid-column:span 2;min-height:92px;gap:8px;padding:11px 10px;border-radius:20px}
  .practiceModeHub .practiceModeOptions > button:nth-child(n+4){grid-column:span 3;flex-direction:row;align-items:center;min-height:62px}
  .practiceModeHub .practiceModeOptions > button svg{width:34px;height:34px;padding:7px;border-radius:50%}
  .practiceModeHub .practiceModeOptions > button b{font-size:13px;white-space:normal;line-height:1.2}
  .practiceModeHub .practiceModeOptions > button.active::after{width:16px;height:16px;right:7px;top:7px;background-size:11px}
}
/* 同日「改成圓的」續：錯題記錄的旗子色塊也改正圓，跟練習方式圖示一致 */.practiceMistakeBar .mistakeBarIcon{border-radius:50%}/* 同日使用者圈「N5 N4 N3 隨機」箭頭指到「練習」上方：「感覺可以對調一下」→ 級別列移到練習方式上面。   只動 CSS：練習頁 appMain 改直排 flex，controlStack 攤平（display:contents），只有 levelStrip 往前；其餘（單字分類等）留在練習方式下面。 */.appMain:has(>.practiceModeHub){display:flex;flex-direction:column}.appMain:has(>.practiceModeHub)>*,.appMain:has(>.practiceModeHub)>.controlStack>*{flex-shrink:0}.appMain>.practiceModeHub,.appMain:has(>.practiceModeHub)>.cqView{width:100%}.appMain:has(>.practiceModeHub)>.controlStack{display:contents}.appMain:has(>.practiceModeHub)>.controlStack>.levelStrip{order:-1;align-self:center;margin-bottom:12px!important}.appMain:has(>.practiceModeHub)>.controlStack>:last-child:not(.levelStrip){margin-bottom:18px}/* SPELL_SENTENCE_20261016 使用者：第一格改「複習＋單字＋例句測驗」，另外新增「單字＋例句」（拼字測完接例句組裝）→ 六格。   顏色改用 data-mode 綁定（不靠第幾格），沿用角色色：拼字＝黃（五十音）、聽力＝藍（N4 耳機）、例句＝粉（N3）、變形＝綠（文法）、複習＝紫（N5 拿あ卡）；單字＋例句組裝＝黃＋粉雙色（拼字＋例句）；桌機與手機都排成三欄兩排。 */.practiceModeHub .practiceModeOptions > button[data-mode=review]{--mode-base:#C7B6E4;--mode-ink:#66508A}.practiceModeHub .practiceModeOptions > button[data-mode=spellSentence]{--mode-base:#EFB3CE;--mode-ink:#943A64}.practiceModeHub .practiceModeOptions > button[data-mode=spellSentence]:not(.active){background:linear-gradient(155deg,#fff 30%,color-mix(in srgb,#FCD878 26%,#fff) 62%,color-mix(in srgb,#EFB3CE 30%,#fff))}.practiceModeHub .practiceModeOptions > button[data-mode=spellSentence]::before{background:color-mix(in srgb,#FCD878 34%,transparent)}.practiceModeHub .practiceModeOptions > button[data-mode=spellSentence]:not(.active) svg{background:linear-gradient(135deg,color-mix(in srgb,#FCD878 45%,#fff),color-mix(in srgb,#EFB3CE 45%,#fff))}.practiceModeHub .practiceModeOptions > button[data-mode=quiz]{--mode-base:#B4C8EC;--mode-ink:#365B91}.practiceModeHub .practiceModeOptions > button[data-mode=practice]{--mode-base:#FCD878;--mode-ink:#785613}.practiceModeHub .practiceModeOptions > button[data-mode=sentence]{--mode-base:#EFB3CE;--mode-ink:#943A64}.practiceModeHub .practiceModeOptions > button[data-mode=conjugation]{--mode-base:#6BB96E;--mode-ink:#316B3B}.practiceModeHub .practiceModeOptions:has(>button:nth-child(6)){grid-template-columns:repeat(3,minmax(0,1fr))}.practiceModeHub .practiceModeOptions:has(>button:nth-child(6)) > button{min-height:104px;padding-right:30px}@media (max-width:600px){  .practiceModeHub .practiceModeOptions:has(>button:nth-child(6)) > button,.practiceModeHub .practiceModeOptions:has(>button:nth-child(6)) > button:nth-child(n+4){grid-column:auto;flex-direction:column;align-items:flex-start;gap:8px;min-height:96px;padding:11px 10px}}/* PRACTICE_GROUP_20261016 使用者：「練習的分組也可以依照前面字卡分別組別」→ 練習方式下面一列「分組 ‹ 第 N 組 主題 ⌄ ›」（daily-plan.js 的 GroupStrip，跟字卡、聽力同一個） */.practiceGroupBar{box-sizing:border-box;display:flex;align-items:flex-start;gap:12px;width:min(720px,100%);margin:0 auto 12px;padding:10px 12px 10px 16px;border:1px solid color-mix(in srgb,var(--plan) 22%,#fff);border-radius:22px;background:linear-gradient(160deg,#fff 40%,color-mix(in srgb,var(--plan) 7%,#fff));box-shadow:0 6px 18px color-mix(in srgb,var(--plan) 9%,transparent)}.practiceGroupLabel{flex:none;padding-top:9px;font-size:13px;font-weight:800;letter-spacing:.04em;color:var(--plan)}.practiceGroupBar .cgGroupPick{flex:1;min-width:0;margin:0}@media (max-width:600px){.practiceGroupBar{gap:8px;padding:8px 8px 8px 12px;border-radius:18px}}/* SPELL_HIDE_20261016 純假名的字拼字時大字改顯示中文 */.practiceBox .practicePrompt .promptKanji.isMeaning{display:flex;align-items:center;gap:10px;font-size:clamp(26px,6vw,40px)!important;line-height:1.2;letter-spacing:.02em;font-weight:800}.practiceBox .practicePrompt .promptKanji.isMeaning::before{content:"中文";flex:none;padding:3px 9px;border-radius:999px;background:color-mix(in srgb,currentColor 9%,#fff);font-size:12px;font-weight:800;letter-spacing:.06em;opacity:.75}/* MODEHUB_COMPACT_20261016 使用者：「這邊配色很醜 而且圖示編排有點浪費空間」→ 圖示放左邊一列排（高度約減半）；接著「原本的配色好看 但有點佔空間」→ 保留原本的角色色漸層、右上淡圓、選中深色圖示＋打勾，只把版面縮小。 */.practiceModeHub.practiceModeHub{padding:14px 14px 12px}.practiceModeHub .practiceModeHeading{margin-bottom:10px}.practiceModeHub .practiceModeHeading strong{font-size:18px}.practiceModeHub .practiceModeOptions,.practiceModeHub .practiceModeOptions:has(>button:nth-child(6)){grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.practiceModeHub .practiceModeOptions > button,.practiceModeHub .practiceModeOptions:has(>button:nth-child(6)) > button{flex-direction:row;align-items:center;gap:10px;min-height:0;padding:10px 26px 10px 10px;border-radius:16px;  box-shadow:0 3px 10px color-mix(in srgb,var(--mode-ink) 6%,transparent);transform:none}.practiceModeHub .practiceModeOptions > button::before{right:-18px;top:-26px;width:58px;height:58px}.practiceModeHub .practiceModeOptions > button svg,.practiceModeHub .practiceModeOptions > button[data-mode] svg{flex:none;width:36px;height:36px;padding:8px}.practiceModeHub .practiceModeOptions > button span{min-width:0;gap:1px}.practiceModeHub .practiceModeOptions > button b{font-size:14px;line-height:1.25;white-space:normal}.practiceModeHub .practiceModeOptions > button small{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.practiceModeHub .practiceModeOptions > button:hover{transform:translateY(-1px)}.practiceModeHub .practiceModeOptions > button.active::after{right:8px;top:8px;width:16px;height:16px;background-size:10px}@media (max-width:600px){  .practiceModeHub.practiceModeHub{padding:12px 10px 10px}  .practiceModeHub .practiceModeOptions,.practiceModeHub .practiceModeOptions:has(>button:nth-child(6)){grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}  .practiceModeHub .practiceModeOptions > button,.practiceModeHub .practiceModeOptions > button:nth-child(n+4),.practiceModeHub .practiceModeOptions:has(>button:nth-child(6)) > button,.practiceModeHub .practiceModeOptions:has(>button:nth-child(6)) > button:nth-child(n+4){grid-column:auto;flex-direction:row;align-items:center;gap:8px;min-height:52px;padding:8px 22px 8px 8px;border-radius:14px}  .practiceModeHub .practiceModeOptions > button svg,.practiceModeHub .practiceModeOptions > button[data-mode] svg{width:30px;height:30px;padding:6px}  .practiceModeHub .practiceModeOptions > button b{font-size:13px}  .practiceModeHub .practiceModeOptions > button small{display:none}  .practiceModeHub .practiceModeOptions > button.active::after{right:6px;top:6px;width:14px;height:14px;background-size:9px}}@media (max-width:900px) and (min-width:601px){.practiceModeHub .practiceModeOptions > button,.practiceModeHub .practiceModeOptions:has(>button:nth-child(6)) > button{gap:8px;padding-right:22px}.practiceModeHub .practiceModeOptions > button svg,.practiceModeHub .practiceModeOptions > button[data-mode] svg{width:32px;height:32px;padding:7px}.practiceModeHub .practiceModeOptions > button b{font-size:13px;letter-spacing:-.01em}}/* GROUP_GRID_20261016 使用者：「這網頁上操作滑動似乎有點困難 但我又不要滑動式啦把 如何美觀一點」→ 組別號碼不再橫向捲動：   展開後排成多列格子，全部一次看到、直接點；「全部」佔兩格；不能選取文字（拖曳時不會反白）。 */.cgChips,.cgChips.atStart,.cgChips.atEnd{display:grid;grid-template-columns:repeat(auto-fill,minmax(42px,1fr));gap:6px;overflow:visible;padding:8px 2px 2px;scroll-snap-type:none;-webkit-mask-image:none;mask-image:none;user-select:none;-webkit-user-select:none}.cgChips .cgChip{min-width:0;width:100%;height:38px;padding:0;scroll-snap-align:none}.cgChips .cgChip.isAll{grid-column:span 2;padding:0}.cgPages{display:grid;grid-template-columns:repeat(auto-fill,minmax(74px,1fr));gap:6px;padding:8px 2px 0;user-select:none;-webkit-user-select:none}.cgPage{height:30px;padding:0 4px;white-space:nowrap;border:1px solid color-mix(in srgb,var(--plan) 22%,#fff);border-radius:999px;background:#fff;color:#7a7088;font:inherit;font-size:12.5px;font-weight:700;font-variant-numeric:tabular-nums;cursor:pointer}.cgPage.hasOn{color:var(--plan-deep,var(--plan));border-color:color-mix(in srgb,var(--plan) 55%,#fff)}.cgPage.isCur{background:color-mix(in srgb,var(--plan) 14%,#fff);border-color:var(--plan);color:var(--plan-deep,var(--plan))}.cgPage.isAll.isOn{background:var(--plan);border-color:var(--plan);color:#fff}.cgPage:focus-visible{outline:2px solid var(--plan);outline-offset:2px}
/* QUIZ_MULTI_GROUP_20261024 測驗分組可複選：面板底下一列「可複選 已選 N 組 · M 字｜完成」 */
.cgMultiFoot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 2px 0;font-size:12.5px;font-weight:700;color:#847a91}
.cgMultiFoot span{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;min-width:0}
.cgMultiFoot b{color:var(--plan-deep,#6650a4);font-weight:800;font-variant-numeric:tabular-nums}
.cgMultiDone{flex:none;display:inline-flex;align-items:center;gap:4px;height:34px;padding:0 14px;border:1px solid var(--plan);border-radius:999px;background:var(--plan);color:#fff;font:inherit;font-size:13px;font-weight:800;cursor:pointer}
.cgMultiDone:focus-visible{outline:2px solid var(--plan);outline-offset:2px}
/* MODEHUB_CALM_20261024 使用者圈「練習 選擇練習方式＋分組」：「這邊的視覺配色很醜 介面也是」
   → 六種顏色的漸層小卡＋右上淡圓拿掉，改成白底小卡、圖示圓塊與選中狀態都用目前等級色（N5 薰衣草／N4 藍／N3 桃紅），選中＝淡底＋外框＋實心圖示（不另加打勾，免得長標題被擠成兩行）；
     練習方式與分組合成同一張卡（寬度跟下面的弱點分析、題目卡一樣 720），中間一條細線分開；
     分組的箭頭與目前組別改成淺底無框，不再是卡中卡。
   同日使用者：「每種練習方式的圖示想保留各自的顏色（統一淡彩，不要漸層）」「風格跟 APP 風格搭起來好看的」
   → 圖示圓塊改回各自角色色，但六色用同一個亮度／彩度（OKLCH 同 L、C，只換色相）、彩度壓低往 App 的薰衣草靠；
     選中＝該色極淡底＋該色外框＋實心圖示＋該色標題；全部純色，沒有漸層。 */
.practiceModeHub .practiceModeOptions > button{--mh-chip:color-mix(in srgb,var(--lv,#8B7AD8) 12%,#fff);--mh-ink:var(--lv-deep,#6650A4);--mh-fill:var(--lv,#8B7AD8);--mh-line:color-mix(in srgb,var(--lv,#8B7AD8) 45%,#fff);--mh-tint:color-mix(in srgb,var(--lv,#8B7AD8) 6%,#fff)}
.practiceModeHub .practiceModeOptions > button[data-mode=practice]{--mh-chip:#FBECD7;--mh-ink:#8D6725;--mh-fill:#B48A46;--mh-line:#D3BA93;--mh-tint:#FEF8F0}
.practiceModeHub .practiceModeOptions > button[data-mode=quiz]{--mh-chip:#E3EFFF;--mh-ink:#506EA6;--mh-fill:#7092D0;--mh-line:#A9BFE5;--mh-tint:#F5F9FF}
.practiceModeHub .practiceModeOptions > button[data-mode=sentence]{--mh-chip:#FFE6F2;--mh-ink:#975778;--mh-fill:#BF789D;--mh-line:#DCAFC4;--mh-tint:#FFF6FA}
.practiceModeHub .practiceModeOptions > button[data-mode=spellSentence]{--mh-chip:#FFE8E0;--mh-ink:#9E5948;--mh-fill:#C77B68;--mh-line:#E1B1A4;--mh-tint:#FFF6F4}
.practiceModeHub .practiceModeOptions > button[data-mode=conjugation]{--mh-chip:#DEF5E6;--mh-ink:#367F59;--mh-fill:#58A57B;--mh-line:#9ECAAF;--mh-tint:#F3FCF6}
.practiceModeHub .practiceModeOptions > button[data-mode=review]{--mh-chip:#EEEBFF;--mh-ink:#7064A1;--mh-fill:#9387CB;--mh-line:#BEB7E2;--mh-tint:#F9F8FF}
.practiceModeHub.practiceModeHub{box-sizing:border-box;width:min(720px,100%);margin:0 auto 14px;padding:14px 14px 12px;border:1px solid rgba(126,111,153,.16);border-radius:22px;background:rgba(255,255,255,.9);box-shadow:0 12px 28px -16px rgba(65,45,105,.22)}
.appMain:has(>.practiceModeHub)>.practiceModeHub{width:min(720px,100%)}
.practiceModeHub .practiceModeHeading{display:flex;align-items:baseline;gap:8px;margin:0 2px 10px}
.practiceModeHub .practiceModeHeading strong{font-size:16px;font-weight:850;letter-spacing:.02em;color:#2b2440}
.practiceModeHub .practiceModeHeading span{padding:0;border-radius:0;background:none;color:#8a8199;font-size:12.5px;font-weight:600}
.practiceModeHub .practiceModeOptions,.practiceModeHub .practiceModeOptions:has(>button:nth-child(6)){grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
html .practiceModeHub .practiceModeOptions > button,html .practiceModeHub .practiceModeOptions:has(>button:nth-child(6)) > button{--mode-base:var(--lv,#8B7AD8);--mode-ink:var(--lv-deep,#6650A4);
  flex-direction:row;align-items:center;gap:10px;min-height:58px;padding:9px 10px;border:1px solid #e9e6ef;border-radius:14px;background:#fff;color:#2b2440;box-shadow:none;transform:none;transition:background-color .15s ease,border-color .15s ease}
html .practiceModeHub .practiceModeOptions > button::before,html .practiceModeHub .practiceModeOptions > button[data-mode]::before{content:none}
html .practiceModeHub .practiceModeOptions > button svg,html .practiceModeHub .practiceModeOptions > button[data-mode] svg,html .practiceModeHub .practiceModeOptions > button[data-mode]:not(.active) svg{flex:none;box-sizing:border-box;width:36px;height:36px;padding:8px;border-radius:50%;background:var(--mh-chip);color:var(--mh-ink);box-shadow:none}
html .practiceModeHub .practiceModeOptions > button span{min-width:0;gap:1px;justify-items:start}
html .practiceModeHub .practiceModeOptions > button b{font-size:14px;font-weight:800;line-height:1.25;color:#2b2440;white-space:normal}
html .practiceModeHub .practiceModeOptions > button small{max-width:100%;overflow:hidden;font-size:11.5px;font-weight:600;color:#8a8199;text-overflow:ellipsis;white-space:nowrap}
html .practiceModeHub .practiceModeOptions > button:hover{background:var(--mh-tint);border-color:var(--mh-line);transform:none;box-shadow:none}
html .practiceModeHub .practiceModeOptions > button[data-mode=spellSentence]:not(.active){background:#fff}
html .practiceModeHub .practiceModeOptions > button[data-mode=spellSentence]:not(.active):hover{background:var(--mh-tint)}
html:is([data-level],:not([data-level])) .practiceModeHub .practiceModeOptions > button.active{background:var(--mh-tint)!important;border-color:var(--mh-fill)!important;color:#2b2440!important;box-shadow:inset 0 0 0 1px var(--mh-fill)!important}
html .practiceModeHub .practiceModeOptions > button.active svg,html .practiceModeHub .practiceModeOptions > button[data-mode].active svg{background:var(--mh-fill);color:#fff}
html .practiceModeHub .practiceModeOptions > button.active b{color:var(--mh-ink)}
html .practiceModeHub .practiceModeOptions > button.active::after{content:none}
html .practiceModeHub .practiceModeOptions > button:focus-visible{outline:2px solid var(--mh-fill);outline-offset:2px}
/* 分組接在練習方式下面，看起來是同一張卡 */
.appMain:has(>.controlStack>.practiceGroupBar)>.practiceModeHub.practiceModeHub{margin-bottom:0;padding-bottom:12px;border-bottom:0;border-radius:22px 22px 0 0;box-shadow:none}
.appMain>.controlStack>.practiceGroupBar{position:relative;align-items:flex-start;gap:10px;width:min(720px,100%);margin:0 auto 18px;padding:10px 14px 12px;border:1px solid rgba(126,111,153,.16);border-top:0;border-radius:0 0 22px 22px;background:rgba(255,255,255,.9);box-shadow:0 12px 28px -16px rgba(65,45,105,.22)}
.appMain>.controlStack>.practiceGroupBar::before{content:"";position:absolute;top:0;left:14px;right:14px;height:1px;background:color-mix(in srgb,var(--plan,#8B7AD8) 12%,#f1eff4)}
.practiceGroupBar .practiceGroupLabel{min-width:36px;padding:10px 0 0 2px;font-size:13px;font-weight:800;letter-spacing:.04em;color:#2b2440}
.practiceGroupBar .cgGroupPick .cgStepRow{grid-template-columns:40px minmax(0,1fr) 40px;gap:6px}
.practiceGroupBar .cgGroupPick .cgStep,.practiceGroupBar .cgGroupPick .cgStepCur{height:40px;min-height:40px;border:1px solid transparent;border-radius:12px;background:color-mix(in srgb,var(--plan,#8B7AD8) 8%,#fff);box-shadow:none}
.practiceGroupBar .cgGroupPick .cgStep{color:var(--plan-deep,#6650A4)}
.practiceGroupBar .cgGroupPick .cgStep:not(:disabled):hover,.practiceGroupBar .cgGroupPick .cgStepCur:hover{background:color-mix(in srgb,var(--plan,#8B7AD8) 13%,#fff)}
.practiceGroupBar .cgGroupPick .cgStepCur b{font-size:14px;color:#2b2440}
.practiceGroupBar .cgGroupPick.isOpen .cgStepCur{border-color:color-mix(in srgb,var(--plan) 45%,#fff);background:#fff}
@media (max-width:900px) and (min-width:601px){
  html .practiceModeHub .practiceModeOptions > button,html .practiceModeHub .practiceModeOptions:has(>button:nth-child(6)) > button{gap:8px;padding:8px}
  html .practiceModeHub .practiceModeOptions > button svg,html .practiceModeHub .practiceModeOptions > button[data-mode] svg{width:32px;height:32px;padding:7px}
  html .practiceModeHub .practiceModeOptions > button b{font-size:13px}
}
@media (max-width:600px){
  .practiceModeHub.practiceModeHub{padding:12px 10px 10px;border-radius:20px}
  .appMain:has(>.controlStack>.practiceGroupBar)>.practiceModeHub.practiceModeHub{padding-bottom:10px;border-radius:20px 20px 0 0}
  .practiceModeHub .practiceModeHeading{margin-bottom:8px}
  .practiceModeHub .practiceModeHeading strong{font-size:15px}
  .practiceModeHub .practiceModeOptions,.practiceModeHub .practiceModeOptions:has(>button:nth-child(6)){grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
  html .practiceModeHub .practiceModeOptions > button,html .practiceModeHub .practiceModeOptions > button:nth-child(n+4),html .practiceModeHub .practiceModeOptions:has(>button:nth-child(6)) > button,html .practiceModeHub .practiceModeOptions:has(>button:nth-child(6)) > button:nth-child(n+4){grid-column:auto;flex-direction:row;align-items:center;gap:8px;min-height:50px;padding:7px 8px;border-radius:12px}
  html .practiceModeHub .practiceModeOptions > button svg,html .practiceModeHub .practiceModeOptions > button[data-mode] svg{width:30px;height:30px;padding:6.5px}
  html .practiceModeHub .practiceModeOptions > button b{font-size:13px}
  html .practiceModeHub .practiceModeOptions > button small{display:none}
  .appMain>.controlStack>.practiceGroupBar{gap:8px;padding:8px 10px 10px;border-radius:0 0 20px 20px}
  .appMain>.controlStack>.practiceGroupBar::before{left:10px;right:10px}
  .practiceGroupBar .practiceGroupLabel{min-width:0;padding-top:10px}
}
@media (prefers-reduced-motion:reduce){html .practiceModeHub .practiceModeOptions > button{transition:none}}