/* Shared visual language: quiet surfaces, clear hierarchy, deliberate motion. */
body.dd-pro {
  --bg: #101b2c;
  --panel: #17253a;
  --panel2: #20324a;
  --stroke: #435675;
  --text: #f1f5fb;
  --muted: #b8c7dc;
  --brand: #aac7ec;
  --accent: var(--brand);
  --header-bg: #101b2cf5;
  --header-text: var(--text);
  --input-bg: var(--panel2);
  --input-border: var(--stroke);
  --dd-primary: #223e68;
  --dd-primary-strong: #182e50;
  --dd-surface-border: 1px solid var(--stroke);
  --dd-ease: cubic-bezier(.22,.75,.25,1);
  color: var(--text);
  background: var(--bg) !important;
  -webkit-font-smoothing: antialiased;
}
[data-theme="light"] body.dd-pro, body.dd-pro[data-theme="light"] {
  --bg: #f4f7fb;
  --panel: #fff;
  --panel2: #eaf0f8;
  --stroke: #cbd6e6;
  --text: #1b2d48;
  --muted: #51647f;
  --brand: #223e68;
  --header-bg: #fffffff5;
}
body.dd-pro button, body.dd-pro input, body.dd-pro select, body.dd-pro textarea { font-family: inherit; }
body.dd-pro :is(button,a,input,select,textarea,[role="button"]):focus-visible {
  outline: 3px solid color-mix(in srgb,var(--brand) 70%,transparent);
  outline-offset: 3px;
}
body.dd-pro :is(button,[role="button"]) { -webkit-tap-highlight-color: transparent; }
body.dd-pro::before, body.dd-pro::after { display: none !important; }
body.dd-pro :is(.btn,.authBtn,.navBackBtn,.carkMenuNewBtn,.duelMatchFindBtn) {
  min-height: 44px;
  border-radius: 12px;
  font-weight: 650;
  transition: background .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s var(--dd-ease);
}
body.dd-pro :is(.btn,.authBtn,.homeAction,.homeQuick):active:not(:disabled) { transform: translateY(1px) scale(.985); }
body.dd-pro :is(.btn.primary,.authBtn.primary,.carkMenuNewBtn,.duelMatchFindBtn) {
  border: 1px solid #ffffff15;
  color: #fff;
  background: var(--dd-primary);
  box-shadow: none;
}
body.dd-pro :is(.input,.authInput,.pv2Input,.lbSearchInput) {
  min-height: 46px;
  border: var(--dd-surface-border);
  border-radius: 12px;
  color: var(--text);
  background: var(--panel2);
  box-shadow: none;
  transition: border-color .18s ease,outline-color .18s ease;
}
body.dd-pro :is(.input,.authInput,.pv2Input,.lbSearchInput)::placeholder { color: var(--muted); opacity: .8; }
body.dd-pro .topbar { border-bottom: var(--dd-surface-border) !important; background: var(--header-bg) !important; box-shadow: none !important; }
body.dd-pro .ddTabBar { border-top: var(--dd-surface-border) !important; background: var(--header-bg) !important; box-shadow: 0 -4px 24px #0000000a !important; }
body.dd-pro .ddTab { border-radius: 12px; transition: color .18s,background .18s; }
body.dd-pro .ddTab.active { color: var(--brand) !important; background: color-mix(in srgb,var(--brand) 10%,transparent) !important; }

/* Main pages share a content width and restrained section headings. */
body.dd-pro :is(.leaderboardPage,.profileV2,.storyPage,.carkMenuPage,.qbPage,.duelEntryScreen) {
  box-sizing: border-box;
  width: min(100%,1080px);
  max-width: 1080px;
  margin: 0 auto;
  padding: 28px 24px 96px;
}
body.dd-pro :is(.sectionHeader,.storyHeader,.carkMenuHeader,.qbHeader,.duelEntryHeader) {
  gap: 16px;
  margin-bottom: 24px;
  border: 0;
  background: transparent;
}
body.dd-pro :is(.sectionTitle,.storyTitle,.carkMenuTitle,.qbTitle,.duelEntryTitle) {
  color: var(--text) !important;
  font-size: clamp(23px,3vw,32px);
  font-weight: 750;
  line-height: 1.2;
  letter-spacing: -.035em;
  text-shadow: none !important;
  -webkit-text-fill-color: var(--text);
}
body.dd-pro :is(.card,.modalCard,.profileBlock,.wrongCard,.wrongsWeaknessMap,.wrongsReviewPlan,.qbSubjectCard,.qbUnitCard,.qbSlideCard,.carkMenuGameCard,.roomCard,.finishedGameCard,.duelEntryTile,.shopProductCard,.authCard,.authFeatureCard) {
  border: var(--dd-surface-border) !important;
  border-radius: 18px !important;
  color: var(--text);
  background: var(--panel) !important;
  box-shadow: 0 6px 20px #00000008 !important;
  backdrop-filter: none;
}
body.dd-pro :is(.storyWorldCard,.qbSubjectCard,.qbUnitCard,.carkMenuGameCard,.duelEntryTile) {
  transition: transform .2s var(--dd-ease),border-color .2s ease,background .2s ease;
}
@media (hover: hover) {
  body.dd-pro :is(.storyWorldCard,.qbSubjectCard,.qbUnitCard,.carkMenuGameCard,.duelEntryTile):hover {
    border-color: color-mix(in srgb,var(--brand) 45%,var(--stroke)) !important;
    transform: translateY(-2px);
    box-shadow: 0 10px 24px #0000000d !important;
  }
}
body.dd-pro :is(.pt2-sidebar,.pt2-block,.wrongsWeaknessMap,.wrongsReviewPlan,.storyMapView) { padding: 22px; }
body.dd-pro .pt2 { gap: 24px; }
body.dd-pro .pt2-main { min-width: 0; gap: 18px; }
body.dd-pro .pt2-blockTitle { color: var(--text); font-size: 15px; letter-spacing: -.01em; text-transform: none; }
body.dd-pro :is(.pt2-rank,.pv2Hint,.pv2FriendStatus,.qbSubjectMeta,.qbUnitMeta,.storyWorldCard__meta) { color: var(--muted); }
body.dd-pro .pt2-avatarWrap { border: 2px solid color-mix(in srgb,var(--brand) 35%,var(--stroke)); box-shadow: none; background: var(--panel2); }
body.dd-pro .pv2FriendRow { padding: 12px; border-radius: 12px; border-bottom-color: var(--stroke); }
body.dd-pro .pv2FriendRow:hover { background: var(--panel2); }
body.dd-pro.dashHome--t1 .btn { text-transform: none !important; letter-spacing: normal !important; }
body.dd-pro.dashHome--t1 .btn.primary { color: #fff !important; background: var(--dd-primary) !important; border-color: transparent !important; box-shadow: none !important; }
body.dd-pro.dashHome--t1 .btn.ghost { color: var(--muted) !important; background: transparent !important; border-color: var(--stroke) !important; box-shadow: none !important; }
body.dd-pro.dashHome--t1 .pv2Badge { color: var(--muted) !important; background: var(--panel2) !important; box-shadow: none !important; }
body.dd-pro.dashHome--t1 .pv2Badge.granted { color: var(--brand) !important; background: color-mix(in srgb,var(--brand) 12%,var(--panel)) !important; }
body.dd-pro :is(.avatarBtn.selected,.authAvatarBtn.selected) { border-color: var(--brand) !important; background: color-mix(in srgb,var(--brand) 12%,var(--panel)) !important; box-shadow: 0 0 0 2px color-mix(in srgb,var(--brand) 14%,transparent) !important; }
body.dd-pro :is(.carkMenuTabs,.myGamesTabsRow) { padding: 5px; gap: 5px; border: var(--dd-surface-border); border-radius: 14px; background: var(--panel); }
body.dd-pro :is(.carkMenuTab,.myGamesTabBtn) { min-height: 42px; border: 0; border-radius: 10px; color: var(--muted); background: transparent; }
body.dd-pro :is(.carkMenuTab.active,.myGamesTabBtn.active) { color: var(--text); background: var(--panel2); box-shadow: 0 2px 6px #00000008; }
body.dd-pro :is(.carkMenuGameCard,.roomCard,.finishedGameCard) { margin-bottom: 12px; padding: 18px; }
body.dd-pro :is(.carkMenuEmpty,.emptyState,.lbEmpty,.storyEmptyState,.qbEmptyState) { padding: 44px 24px; color: var(--muted); text-align: center; border-radius: 18px; background: var(--panel); }
body.dd-pro :is(.weaknessCard,.reviewPlanItem) { border: var(--dd-surface-border); border-radius: 14px; background: var(--panel2); box-shadow: none; }
body.dd-pro .wrongCard { overflow: hidden; margin-bottom: 18px; }
.wrongsPage { box-sizing: border-box; width: min(100%,800px); margin: 0 auto; padding: 24px 20px 92px; }
.wrongsHeader { display: flex; align-items: center; gap: 12px; margin-bottom: 24px; }
.wrongsCount { margin-left: auto; padding: 6px 13px; border: 1px solid var(--stroke); border-radius: 99px; color: var(--muted); background: var(--panel2); font-size: 15px; font-weight: 600; }
body.dd-pro .wrongCardHeader { padding: 16px 20px; border-bottom: var(--dd-surface-border); background: var(--panel2) !important; }
body.dd-pro .wrongCardHeader > div { color: var(--text) !important; }
body.dd-pro .wrongCardFooter { padding: 16px 20px; border-top: var(--dd-surface-border); background: transparent; }
body.dd-pro .wrongCardImgWrap { padding: 16px; background: #fff; }
body.dd-pro :is(.qbSubjectList,.qbUnitList,.storyWorldGrid) { gap: 12px; }
body.dd-pro .qbSubtitlePage { margin: 0 0 20px; padding: 0; color: var(--muted); font-size: 14px; }
.qbCatalog { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
body.dd-pro .qbCatalog .qbSlide { min-width: 0; width: auto; padding: 0; }
body.dd-pro .qbCatalog .qbSlideCard { height: 100%; overflow: hidden; }
body.dd-pro .qbCatalog .qbSlideImageWrap { height: 132px; }
body.dd-pro .qbCatalog .qbSlideImage { width: 100%; height: 100%; object-fit: cover; }
body.dd-pro .qbCatalog .qbSlideInfo { padding: 16px; }
body.dd-pro .qbCatalog .qbSlideName { color: var(--text) !important; font-size: 18px; }
body.dd-pro .qbCatalog .qbSlideActions { padding: 0 16px 16px; margin-top: auto; }
body.dd-pro .qbCatalog .qbSlideStats { font-size: 12px; }
body.dd-pro .qbCatalog .qbSlideBtn { width: 100%; font-size: 13px; }
body.dd-pro :is(.qbProgressBar,.qbUnitProgressBar,.storyWorldCard__bar) { height: 6px; overflow: hidden; border-radius: 99px; background: var(--panel2); }
body.dd-pro :is(.qbProgressFill,.qbUnitProgressFill,.storyWorldCard__fill) { border-radius: inherit; background: var(--dd-primary); transition: width .5s var(--dd-ease); }
body.dd-pro .leaderboardPrize { padding: 18px; border: var(--dd-surface-border); border-radius: 16px; background: color-mix(in srgb,var(--brand) 8%,var(--panel)); box-shadow: none; }
body.dd-pro .myRankCard { border: 1px solid color-mix(in srgb,var(--brand) 40%,var(--stroke)); border-radius: 16px; background: color-mix(in srgb,var(--brand) 9%,var(--panel)); box-shadow: none; }
body.dd-pro .myRankCard.top3 { color: var(--text) !important; border: 1px solid color-mix(in srgb,var(--brand) 40%,var(--stroke)) !important; background: color-mix(in srgb,var(--brand) 9%,var(--panel)) !important; box-shadow: none !important; }
body.dd-pro .myRankCard :is(.myRankPosition,.myRankName,.myRankLpValue) { color: var(--text) !important; text-shadow: none; }
body.dd-pro .myRankCard .myRankLabel { color: var(--muted) !important; }
body.dd-pro .lbListItem { margin: 0; padding: 15px 18px; border: 0; border-bottom: var(--dd-surface-border); border-radius: 0; background: var(--panel); }
body.dd-pro .lbListItem:hover { transform: none; background: var(--panel2); }
body.dd-pro .lbList { overflow: hidden; border: var(--dd-surface-border); border-radius: 16px; }
body.dd-pro .lbListScore { color: var(--brand); text-shadow: none; }
body.dd-pro .leaderboardInfo { color: var(--muted); background: transparent; border: 0; }
body.dd-pro .duelEntryTile { min-height: 150px; padding: 24px; }
body.dd-pro .duelEntryTileIcon { width: 54px; height: 54px; border-radius: 16px; background: var(--panel2); box-shadow: none; }
body.dd-pro .duelEntryTileTitle { color: var(--text); font-size: 20px; text-shadow: none; }
body.dd-pro .duelEntryTileSubtitle { color: var(--muted); font-size: 13px; }
body.dd-pro :is(.authTitle,.authCardTitle) { color: var(--text); text-shadow: none; letter-spacing: -.035em; }
body.dd-pro .authCardHeader { border-bottom: var(--dd-surface-border); background: transparent; }
body.dd-pro .authTagline { color: var(--muted); }

/* Quick questions: a stable sheet with tactile answer buttons. */
body.dd-pro .qq-page { background: var(--bg); }
body.dd-pro .qq-header { border-color: var(--stroke); background: var(--bg); backdrop-filter: none; }
body.dd-pro .qq-stats { position: relative; gap: 0; padding: 0 max(0px,calc((100vw - 760px)/2)) 4px; background: var(--bg); border: 0; }
body.dd-pro .qq-stats > span { padding: 10px 4px 12px; background: transparent; font-size: 10px; }
body.dd-pro .qq-stats b { margin-bottom: 2px; font-size: 17px; font-variant-numeric: tabular-nums; }
.qq-session-progress { position: absolute; inset: auto 0 0; height: 4px; overflow: hidden; background: var(--panel2); }
.qq-session-progress i { display: block; height: 100%; border-radius: 0 5px 5px 0; background: linear-gradient(90deg,var(--dd-primary),#40c9a2); transition: width .55s var(--dd-ease); }
body.dd-pro .qq-stage { padding: 18px 16px max(18px,env(safe-area-inset-bottom)); }
body.dd-pro .qq-card { gap: 12px; padding: 18px; border: var(--dd-surface-border); border-radius: 22px; box-shadow: 0 12px 36px #00000010; will-change: auto; scroll-padding: 16px; }
body.dd-pro .qq-card-meta span { border: 0; color: var(--muted); background: var(--panel2); font-weight: 500; }
body.dd-pro .qq-card-meta span:last-child { color: var(--muted); }
body.dd-pro .qq-question-text { font-size: clamp(17px,2.3vw,21px); line-height: 1.65; }
body.dd-pro .qq-question-media { min-height: 125px; }
.qq-tools { display: flex; align-items: center; gap: 8px; }
.qq-tools button { flex: 1; min-height: 40px; padding: 8px 12px; display: flex; justify-content: center; align-items: center; gap: 8px; border: 1px solid var(--stroke); border-radius: 11px; color: var(--muted); background: transparent; font-size: 12px; cursor: pointer; transition: color .18s,background .18s; }
.qq-tools button:hover { color: var(--text); background: var(--panel2); }
.qq-tools button > span { font-size: 19px; line-height: 1; }
body.dd-pro .qq-choice { min-height: 54px; border: 1px solid var(--stroke); border-bottom-width: 3px; border-radius: 13px; background: var(--panel2); color: var(--text); transition: transform .14s ease,background .2s ease,border-color .2s ease,opacity .2s ease; }
body.dd-pro .qq-choice:hover:not(:disabled) { transform: translateY(-1px); background: color-mix(in srgb,var(--brand) 8%,var(--panel2)); border-color: var(--brand); }
body.dd-pro .qq-choice:active:not(:disabled) { transform: translateY(2px); }
body.dd-pro .qq-choice b { border: 1px solid var(--stroke); color: var(--muted); background: var(--panel); font-size: 13px; }
body.dd-pro .qq-choice.is-pending { border-color: var(--brand); background: color-mix(in srgb,var(--brand) 12%,var(--panel)); animation: none; }
body.dd-pro .qq-choice.is-correct { border-color: #30ad83; color: var(--text); background: color-mix(in srgb,#32bd8f 15%,var(--panel)); }
body.dd-pro .qq-choice.is-correct b { border-color: transparent; color: white; background: #168664; }
body.dd-pro .qq-choice.is-wrong { border-color: #d9866b; color: var(--text); background: color-mix(in srgb,#d9866b 10%,var(--panel)); }
body.dd-pro .qq-choice.is-wrong b { color: #fff; background: #ac654d; }
body.dd-pro .qq-choice.is-dim { opacity: .65; }
.qq-result:empty { display: none; }
body.dd-pro .qq-feedback { position: relative; padding: 16px; border-radius: 15px; line-height: 1.6; }
body.dd-pro .qq-feedback.correct { color: var(--text); border: 1px solid #30ad8340; background: color-mix(in srgb,#32bd8f 12%,var(--panel)); }
body.dd-pro .qq-feedback.wrong { color: var(--text); border: 1px solid #d9866b35; background: color-mix(in srgb,#d9866b 9%,var(--panel)); }
.qq-feedback-heading { display: flex; align-items: center; gap: 10px; }
.qq-reward-mark { flex: 0 0 34px; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #168664; font-size: 23px; font-weight: 750; box-shadow: 0 3px 0 #096146; }
.qq-feedback.wrong .qq-reward-mark { color: #d9a58d; background: #d9866b18; box-shadow: none; }
.qq-streak-badge { margin-left: auto; padding: 4px 9px; border: 1px solid #30ad8340; border-radius: 99px; color: var(--text); font-size: 11px; white-space: nowrap; }
.qq-confetti { position: absolute; left: 50%; top: 10px; pointer-events: none; }
.qq-confetti i { position: absolute; width: 6px; height: 9px; border-radius: 2px; animation: qq-confetti .75s var(--dd-ease) both; }
@keyframes qq-confetti { 0% { opacity: 0; transform: translate(0,0) rotate(0); } 15% { opacity: 1; } 100% { opacity: 0; transform: translate(var(--x),-90px) rotate(var(--r)); } }
body.dd-pro .qq-next-hint { align-self: stretch; min-height: 46px; margin-top: 2px; padding: 10px 16px; border: 1px solid #ffffff15; border-bottom: 3px solid #4148a9; border-radius: 12px; color: #fff; background: #6067db; font-family: inherit; font-size: 14px; font-weight: 650; transition: background .18s,transform .18s; }
body.dd-pro .qq-next-hint:active { transform: translateY(2px); }
.qq-exit-up { animation: qq-exit-up .15s var(--dd-ease) both; }
.qq-enter-up { animation: qq-enter-up .25s var(--dd-ease) both; }
body.dd-pro .qq-summary-burst { background: #777df218; color: var(--brand); border: 1px solid #777df22a; border-radius: 50%; }
body.dd-pro .qq-sheet, body.dd-pro .qq-summary { padding: 26px; border: var(--dd-surface-border); background: var(--panel); box-shadow: 0 24px 80px #00000030; }

/* Quick Solve is the primary destination: luminous surfaces, short feedback loops. */
.quickHero { position: relative; isolation: isolate; display: grid; grid-template-columns: 1.15fr 1fr; min-height: 420px; overflow: hidden; padding: clamp(24px,4vw,48px); border: 1px solid #a6a0ff38; border-radius: 28px; color: #f1f3ff; background: radial-gradient(ellipse at 85% 40%,#6650dc38,transparent 52%),linear-gradient(120deg,#11182a,#14152d 65%,#171830); box-shadow: 0 24px 70px #090b241c; }
.quickHero::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .25; background-image: linear-gradient(#a59eff16 1px,transparent 1px),linear-gradient(90deg,#a59eff16 1px,transparent 1px); background-size: 44px 44px; mask-image: linear-gradient(90deg,transparent,#000); }
.quickHero__copy { position: relative; z-index: 2; }
.quickHero__eyebrow { display: flex; align-items: center; gap: 9px; color: #b7b6d1; font-size: 10px; font-weight: 650; letter-spacing: .15em; }
.quickHero__eyebrow i { width: 6px; height: 6px; flex-shrink: 0; border-radius: 50%; background: #82f1ca; box-shadow: 0 0 14px #82f1ca; }
.quickHero h1 { margin: 24px 0 15px; color: #f5f5ff; font-size: clamp(38px,5.5vw,66px); line-height: 1.06; font-weight: 800; letter-spacing: -.055em; }
.quickHero h1 span { color: #afa3ff; }
.quickHero p { margin: 0 0 24px; color: #b4b8ce; font-size: 14px; line-height: 1.8; }
.quickHero__exams,.qq-exams { display: flex; gap: 8px; margin: 0 0 18px; }
.quickHero__exams button,.qq-exams button { min-width: 0; flex: 1; min-height: 57px; padding: 10px 14px; border: 1px solid #acb4ff22; border-radius: 12px; color: #b8bdd3; background: #ffffff04; font: 700 14px inherit; font-family: inherit; text-align: left; }
.quickHero__exams button:disabled,.qq-exams button:disabled { cursor: default; opacity: .65; }
.quickHero__exams .is-selected,.qq-exams .is-selected { color: #d8d2ff; border-color: #9b8cff; background: #8b76ff1f; box-shadow: inset 0 0 20px #9a7aff0a; }
.quickHero__exams small,.qq-exams span { display: block; margin-top: 4px; font-size: 9px; font-weight: 450; white-space: nowrap; }
.quickHero__exams .is-selected span { margin-left: 12px; color: #a5f3d6; }
.quickHero__start { display: flex; justify-content: space-between; align-items: center; gap: 24px; width: 100%; min-height: 55px; padding: 14px 20px; border: 1px solid #b9b0ff; border-bottom: 4px solid #6550bc; border-radius: 13px; background: linear-gradient(100deg,#b0a0ff,#8e82f4); color: #17132e; font: inherit; font-weight: 800; font-size: 14px; cursor: pointer; box-shadow: 0 6px 26px #8d76ff25; transition: transform .18s,box-shadow .18s; }
.quickHero__start:hover { box-shadow: 0 7px 34px #8d76ff55; transform: translateY(-2px); }
.quickHero__start:active { transform: translateY(2px); }
.quickHero__start span { font-size: 22px; }
.quickHero__note { display: block; margin-top: 12px; color: #969db9; text-align: center; font-size: 10px; }
body.dd-pro .ddTab--quick { color: var(--brand); }
body.dd-pro .ddTab--quick .ddTabIcon { padding: 6px; width: 36px; height: 36px; margin-top: -10px; border: 1px solid #b7a4ff60; border-radius: 12px; color: #d6caff; background: #51427e; box-shadow: 0 3px 16px #8d76ff25; }
.quickHero__visual { position: relative; align-self: center; height: 320px; margin-left: 20px; }
.quickHero__orbit { position: absolute; top: 50%; left: 50%; width: 270px; height: 270px; border: 1px solid #b9a8ff20; border-radius: 50%; transform: translate(-50%,-50%) rotate(-25deg); }
.quickHero__orbit--outer::after { content: ""; position: absolute; left: 25px; top: 45px; width: 7px; height: 7px; border-radius: 50%; background: #b7a2ff; box-shadow: 0 0 18px #b7a2ff; }
.quickHero__orbit--inner { width: 210px; height: 210px; border-style: dashed; border-color: #b9a8ff25; }
.quickHero__energy { position: absolute; inset: 50% auto auto 50%; display: grid; place-items: center; width: 148px; height: 148px; border: 1px solid #b9a8ff65; border-radius: 42px; color: #d1c7ff; background: linear-gradient(145deg,#7260c470,#292242); box-shadow: inset 0 0 40px #af85ff15,0 0 75px #8361eb30; transform: translate(-50%,-50%) rotate(-10deg); animation: quick-energy 5s ease-in-out infinite; }
.quickHero__energy svg { width: 76px; height: 94px; filter: drop-shadow(0 0 14px #c9b5ff65); }
.quickHero__float { position: absolute; z-index: 1; display: flex; align-items: center; gap: 8px; padding: 13px 15px; border: 1px solid #a59bff33; border-radius: 13px; background: #1e2339ed; color: #b6abff; box-shadow: 0 12px 32px #06091844; font-size: 19px; transform: rotate(-5deg); }
.quickHero__float b { color: #d9ddec; font-size: 11px; font-weight: 550; }
.quickHero__float--streak { top: 34px; left: 2%; }
.quickHero__float--reward { right: -10px; bottom: 49px; color: #86e7bc; transform: rotate(5deg); }
.quickHero__float em { padding: 4px 6px; border-radius: 6px; color: #9cf1cc; background: #71efb511; font-size: 10px; font-style: normal; }
.quickHero__visual-note { position: absolute; bottom: 0; width: 100%; text-align: center; color: #8583a9; font-size: 9px; letter-spacing: .22em; }
@keyframes quick-energy { 50% { transform: translate(-50%,-55%) rotate(-6deg); } }
body.dd-pro .qq-page { --bg: #0c1120; --panel: #151d30; --panel2: #1b253b; --text: #eaf0ff; --muted: #a2aec8; --stroke: #9baed026; --brand: #aa96ff; background: radial-gradient(ellipse at 15% 15%,#6859c01d,transparent 50%),radial-gradient(ellipse at 90% 85%,#288c8614,transparent 45%),var(--bg); }
body.dd-pro .qq-header { background: #0c1120cc; backdrop-filter: blur(18px); }
body.dd-pro .qq-brand strong { font-size: 18px; letter-spacing: -.035em; }
body.dd-pro .qq-brand small { color: #92a3bd; }
body.dd-pro .qq-stats { background: transparent; padding-bottom: 10px; }
body.dd-pro .qq-stats > span { padding-top: 16px; padding-bottom: 14px; }
body.dd-pro .qq-stat-streak b { color: #ffcf86; }
body.dd-pro .qq-stat-points b { color: #b5a3ff; }
body.dd-pro .qq-session-progress { inset: auto max(18px,calc((100vw - 700px)/2)) 0; height: 6px; border-radius: 8px; }
body.dd-pro .qq-session-progress i { border-radius: inherit; background: linear-gradient(90deg,#9680ff,#7ce7cb); box-shadow: 0 0 14px #7ce7cb55; }
body.dd-pro .qq-card { width: min(100%,700px); padding: 24px; border: 1px solid #9a9fe332; background: linear-gradient(155deg,#1a2235,#121b2d); box-shadow: 0 22px 80px #00000030,inset 0 1px 0 #ffffff06; }
.qq-card-top { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px; padding-bottom: 3px; }
.qq-eyebrow { color: #a4a7cb; font-size: 10px; font-weight: 650; letter-spacing: .13em; }
.qq-solved,.qq-fresh { padding: 5px 8px; border-radius: 7px; font-size: 10px; }
.qq-solved { color: #91edc4; border: 1px solid #81eeb526; background: #75e3b00b; }
.qq-fresh { color: #b3a4ec; background: #ac93ff0d; }
body.dd-pro .qq-card-meta span { padding: 2px 0; background: transparent; font-size: 11px; }
body.dd-pro .qq-card-meta span + span::before { content: "·"; margin-right: 6px; }
body.dd-pro .qq-question-media { border-radius: 12px; }
body.dd-pro .qq-question-media:has(.qq-question-text):not(:has(img)) { background: transparent; color: var(--text); min-height: 110px; }
body.dd-pro .qq-question-text { padding: 18px 2px 22px; font-size: clamp(18px,2.2vw,22px); line-height: 1.7; }
body.dd-pro .qq-choice { min-height: 55px; border-color: #91a0c32a; background: #1a263c; }
body.dd-pro .qq-choice b { border-color: #aab9df25; background: #111b2e; color: #bfcae3; }
body.dd-pro .qq-choice:hover:not(:disabled) { border-color: #aa96ff; background: #302d4b; }
body.dd-pro .qq-choice.is-correct { border-color: #7de3b5; background: #183c34; }
body.dd-pro .qq-choice.is-wrong { border-color: #ebaa8b; background: #3b2c30; }
body.dd-pro .qq-feedback.correct { border-color: #7de3b53a; background: #18382f; }
body.dd-pro .qq-feedback.wrong { border-color: #e5a08a35; background: #30272e; }
.qq-earned { color: #99f2c7 !important; font-weight: 800; }
.qq-earned span { margin-left: 8px; color: #bbd5c9; font-size: 11px; font-weight: 450; }
.qq-encourage { color: #d9c5bb !important; font-size: 12px; }
body.dd-pro .qq-next-hint { min-height: 50px; background: linear-gradient(100deg,#ab98ff,#9283ee); border-color: #c7baff40; border-bottom-color: #6153ac; color: #15122e; font-weight: 800; }
.qq-hide { align-self: center; min-height: 36px; padding: 8px 12px; border: 0; border-radius: 8px; color: #9caac4; background: transparent; font: inherit; font-size: 11px; cursor: pointer; }
.qq-hide:hover { color: #e5ecff; background: #ffffff08; }
.qq-hide:disabled { opacity: .4; cursor: wait; }
.qq-card-actions { position: sticky; bottom: -24px; display: flex; flex-direction: column; gap: 2px; margin-top: auto; padding-top: 9px; background: linear-gradient(180deg,#131c2ded,#131c2d 20%); z-index: 2; }
.qq-page button:focus-visible,.quickHero button:focus-visible { outline: 2px solid #a8ecd9; outline-offset: 3px; }
.qq-page .qq-exams .is-selected { color: #cec3ff; }
.qq-page .qq-primary { color: #181329; background: linear-gradient(100deg,#b0a0ff,#8e82f4); }
body.dd-pro .qq-exit-up { animation: qq-exit-up .18s cubic-bezier(.4,0,1,1) both; }
body.dd-pro .qq-enter-up { animation: qq-enter-up .3s cubic-bezier(.16,1,.3,1) both; }
@media (max-width: 700px) {
  .quickHero { grid-template-columns: 1fr; min-height: 0; padding: 28px 24px 24px; border-radius: 22px; }
  .quickHero h1 { font-size: clamp(42px,10vw,58px); }
  .quickHero__visual { position: absolute; width: 180px; height: 200px; top: 24px; right: -67px; opacity: .32; z-index: 0; }
  .quickHero__energy { width: 105px; height: 105px; border-radius: 32px; }
  .quickHero__energy svg { width: 52px; }
  .quickHero__orbit--outer { width: 215px; height: 215px; }
  .quickHero__orbit--inner { width: 160px; height: 160px; }
  .quickHero__float,.quickHero__visual-note { display: none; }
  .quickHero__eyebrow { font-size: 8px; letter-spacing: .1em; }
  .quickHero__exams { max-width: none; }
  .quickHero__exams button { padding: 10px; }
  body.dd-pro .qq-card { padding: 14px; gap: 10px; border-radius: 20px; }
  .qq-card-actions { bottom: -14px; }
  body.dd-pro .qq-stats b { font-size: 16px; }
  body.dd-pro .qq-question-text { padding: 12px 2px 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .quickHero * { animation: none !important; transition: none !important; }
}

/* Full-screen paper; fixed paper coordinates keep ink aligned when resized. */
.qw-dialog { position: fixed; inset: 0; z-index: 11000; display: block; width:100%; height:100%; max-width:none; max-height:none; margin:0; padding:0; border:0; color: var(--text); background: var(--bg); isolation: isolate; font-family: inherit; }
.qw-dialog:not([open]) { display:none; }
.qw-dialog::backdrop { background:transparent; }
.qw-surface { display:grid; grid-template-rows:auto auto minmax(0,1fr) auto; width:100%; height:100%; min-height:0; color:inherit; background:var(--bg); }
.qw-dialog *, .qw-dialog *::before { box-sizing: border-box; }
.qw-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: max(14px,env(safe-area-inset-top)) 20px 14px; border-bottom: 1px solid var(--stroke); }
.qw-header h2 { margin: 0; font-size: 17px; line-height: 1.3; font-weight: 650; letter-spacing: -.02em; }
.qw-header span { color: var(--muted); font-size: 11px; }
.qw-header-actions { display: flex; gap: 8px; }
.qw-dialog button { min-width: 40px; min-height: 40px; padding: 8px 12px; border: 1px solid var(--stroke); border-radius: 10px; color: var(--muted); background: var(--panel); cursor: pointer; font: inherit; font-size: 14px; transition: background .15s,color .15s,border-color .15s; }
.qw-dialog button:hover { color: var(--text); background: var(--panel2); }
.qw-dialog button:disabled { opacity: .35; cursor: default; }
.qw-header-actions button { font-size: 23px; line-height: 1; }
.qw-toolbar { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 12px; padding: 10px 16px; border-bottom: 1px solid var(--stroke); background: var(--panel); }
.qw-tool-group, .qw-colors { display: flex; align-items: center; gap: 4px; }
.qw-tool-group button { border-color: transparent; background: transparent; }
.qw-dialog button[aria-pressed="true"] { border-color: color-mix(in srgb,var(--brand) 40%,var(--stroke)); color: var(--brand); background: color-mix(in srgb,var(--brand) 12%,var(--panel)); }
.qw-colors button { position: relative; width: 32px; min-width: 32px; min-height: 36px; padding: 6px; border-color: transparent; background: transparent; }
.qw-colors button::after { content: ""; display: block; width: 18px; height: 18px; border: 2px solid #ffffff90; border-radius: 50%; background: var(--ink); }
.qw-width { display: grid; gap: 4px; color: var(--muted); font-size: 10px; }
.qw-width input { width: 74px; accent-color: var(--brand); }
.qw-width select { min-width:78px; min-height:44px; padding:6px 8px; border:1px solid var(--stroke); border-radius:9px; color:var(--text); background:var(--panel2); font:inherit; font-size:12px; }
.qw-tool-group button { display:inline-flex; align-items:center; justify-content:center; gap:6px; min-width:44px; min-height:44px; }
.qw-tool-group button svg { width:20px; height:20px; flex:none; }
.qw-dialog :is(button,select):focus-visible { outline:2px solid var(--brand); outline-offset:2px; }
.qw-zoom output { min-width: 42px; text-align: center; color: var(--muted); font-size: 11px; }
.qw-viewport { min-height: 0; overflow: auto; padding: 16px; overscroll-behavior: contain; background: color-mix(in srgb,var(--panel2) 65%,var(--bg)); touch-action: pan-x pan-y pinch-zoom; }
.qw-paper-wrap { position: relative; margin: 0 auto; }
.qw-paper { position: relative; width: 800px; max-width: none !important; min-height: 1400px; padding-bottom: 500px; transform-origin: top left; color: #253044; background: #fff; box-shadow: 0 8px 30px #00000015; }
.qw-paper--scratch { background-image: radial-gradient(#cbd1de 1.2px,transparent 1.2px); background-size: 28px 28px; }
.qw-question { padding: 40px; font-family: Arial,sans-serif; font-size: 36px; line-height: 1.7; }
.qw-question img { display: block; width: 100%; height: auto; max-height: none; pointer-events: none; }
.qw-question p { margin: 0 0 25px; white-space: pre-wrap; }
.qw-question ol { padding-left: 42px; margin-top: 22px; }
.qw-question li { margin-bottom: 16px; padding-left: 10px; }
.qw-canvas { position: absolute; inset: 0; display: block; width: 100%; height: 100%; touch-action: none; cursor: crosshair; }
.qw-canvas[data-tool="eraser"] { cursor: cell; }
.qw-footer { display: flex; align-items: center; justify-content: center; gap: 16px; padding: 12px 16px max(12px,env(safe-area-inset-bottom)); border-top: 1px solid var(--stroke); background: var(--bg); }
.qw-answers { display: flex; gap: 8px; }
.qw-answers button { min-width: 44px; min-height: 44px; color: var(--text); font-weight: 650; }
.qw-dialog .qw-done { color: #fff; background: #6067db; border-color: transparent; }
@media (max-width: 640px) {
  .qbCatalog { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  body.dd-pro .qbCatalog .qbSlideImageWrap { height: 96px; }
  body.dd-pro .qbCatalog .qbSlideInfo { padding: 12px; }
  body.dd-pro .qbCatalog .qbSlideName { font-size: 14px; }
  body.dd-pro .qbCatalog .qbSlideActions { padding: 0 12px 12px; }
  body.dd-pro .qbCatalog .qbSlideBtn { padding: 8px; font-size: 11px; }
  body.dd-pro :is(.leaderboardPage,.profileV2,.storyPage,.carkMenuPage,.qbPage,.duelEntryScreen) { padding: 20px 16px 88px; }
  body.dd-pro :is(.pt2-sidebar,.pt2-block,.wrongsWeaknessMap,.wrongsReviewPlan,.storyMapView) { padding: 18px; }
  body.dd-pro :is(.sectionHeader,.storyHeader,.carkMenuHeader,.qbHeader,.duelEntryHeader) { flex-wrap: wrap; gap: 12px; margin-bottom: 18px; }
  body.dd-pro .qq-stage { padding: 10px 10px max(10px,env(safe-area-inset-bottom)); }
  body.dd-pro .qq-card { padding: 12px; gap: 10px; border-radius: 18px; }
  .qq-streak-badge { font-size: 10px; padding: 3px 7px; }
  .qw-header { padding-left: 14px; padding-right: 14px; }
  .qw-toolbar { gap: 6px 10px; padding: 8px; }
  .qw-tool-group button { padding: 7px 9px; font-size: 13px; }
  .qw-primary-tools { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); flex:1 0 100%; }
  .qw-primary-tools button { min-width:0; min-height:44px; padding:7px 4px; gap:4px; }
  .qw-width input { width: 60px; }
  .qw-zoom { margin-left: auto; }
  .qw-viewport { padding: 12px 16px; }
  .qw-footer { flex-wrap: wrap; gap: 8px; }
  .qw-answers { flex: 1; justify-content: center; gap: 6px; }
  .qw-dialog .qw-done { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  body.dd-pro *, body.dd-pro *::before, body.dd-pro *::after { scroll-behavior: auto !important; transition-duration: .001ms !important; animation-duration: .001ms !important; animation-iteration-count: 1 !important; }
  .qq-confetti { display: none; }
}
.logout-progress { display:inline-flex; align-items:center; justify-content:center; gap:8px; max-width:100%; color:var(--text,#1b2d48); }
.logout-progress .spinner { flex:0 0 16px; border-color:currentColor; border-top-color:transparent; }
.mobileMenuItem .logout-progress { min-height:36px; }
[data-action="logout"][aria-busy="true"] { opacity:1; cursor:progress; transform:none; }

/* Duel identity: preserve each slot's existing size and hit target. */
.dd-duel-icon { width:24px; height:24px; flex:none; vertical-align:middle; }
.duel-action { display:inline-flex; align-items:center; justify-content:center; gap:8px; }
.duel-action > .dd-duel-icon { width:24px; height:24px; }