@import url('./question-page-pen.css');
/* Pending, confirmed and retry states use the same question geometry. */
body.dd-pro .cg-page .cg-question { height:100%; overflow-anchor:none; }
body.dd-pro .cg-page .cg-question .qq-result { display:block; block-size:64px; min-block-size:64px; max-block-size:64px; flex:0 0 64px; overflow:auto; scrollbar-gutter:stable; }
body.dd-pro .cg-page .cg-question .qq-result .cg-error { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:8px; box-sizing:border-box; block-size:64px; min-height:0; margin:0; padding:4px 0; font-size:13px; }
body.dd-pro .cg-page .cg-question .qq-result .cg-error>span { display:block; min-width:0; max-block-size:56px; overflow:auto; overflow-wrap:anywhere; }
body.dd-pro .cg-page .cg-question .qq-result .cg-error>button { width:120px; max-width:100%; min-height:44px; margin:0; padding:6px 8px; font-size:13px; line-height:1.3; }
body.dd-pro .cg-page .cg-question .qq-feedback { animation:none; }
body.dd-pro .cg-page .cg-question .qq-choice,body.dd-pro .cg-page .cg-question .qq-choice:hover,body.dd-pro .cg-page .cg-question .qq-choice:active { transform:none; animation:none; transition:background-color 150ms ease,border-color 150ms ease,color 150ms ease; }
/* Locked and unlocked solution copy share a two-line description budget. */
body.dd-pro .cg-page .cg-question .qs-inline-toggle .qs-toggle-copy small { min-block-size:36px; line-height:18px; }
body.dd-pro .cg-page .cg-session-nav .qq-next-hint { display:grid; grid-template-columns:minmax(0,1fr) 24px; column-gap:8px; padding-inline:16px; }
body.dd-pro .cg-page .cg-session-nav .qq-next-hint>.cg-next-label { display:flex; align-items:center; justify-content:center; gap:8px; min-width:0; height:21px; min-height:21px; line-height:21px; font-size:inherit; }
body.dd-pro .cg-page .cg-session-nav .qq-next-hint>.cg-next-icon { width:24px; text-align:center; }
body.dd-pro .cg-page>.cg-live-wheel .cg-live-state { display:grid; grid-template-columns:16px minmax(0,176px); justify-content:center; min-height:23px; }
body.dd-pro .cg-page>.cg-live-wheel .cg-hud-label { min-width:0; text-align:left; }
/* A failed manual return keeps the confirmed answer alongside its error. */
body.dd-pro .cg-page .cg-question .qq-result:has(.qq-feedback):has(.cg-error) { display:grid; grid-template-rows:20px 44px; }
body.dd-pro .cg-page .cg-question .qq-result:has(.cg-error) .qq-feedback { min-height:0; margin:0; padding:0 4px; border:0; border-radius:0; overflow:auto; }
body.dd-pro .cg-page .cg-question .qq-result:has(.cg-error) .qq-feedback-heading { min-height:20px; line-height:20px; }
body.dd-pro .cg-page .cg-question .qq-result:has(.cg-error) .qq-reward-mark { width:18px; height:18px; flex-basis:18px; font-size:14px; }
body.dd-pro .cg-page .cg-question .qq-feedback+.cg-error { block-size:44px; padding:0; }
body.dd-pro .cg-page .cg-question .qq-feedback+.cg-error>span { max-block-size:44px; }
body.dd-pro .cg-page .cg-question .qq-feedback+.cg-error>button { height:44px; min-height:44px; padding:4px 6px; line-height:1.2; }
/* Focused question sheets and compact match comparisons. */
.cg-session-dialog { box-sizing:border-box; width:min(420px,calc(100% - 32px)); max-height:calc(100dvh - 32px); margin:auto; padding:28px; border:1px solid var(--stroke,#dce0eb); border-radius:24px; background:var(--panel,#fff); color:var(--text,#192137); box-shadow:0 20px 60px #10152b33; text-align:left; animation:cg-session-enter 200ms ease-out; }
.cg-session-dialog::backdrop { background:#10172d88; }
.cg-session-dialog-icon { display:grid; place-items:center; width:48px; height:48px; border-radius:15px; background:#7772e51a; color:var(--accent,#6963d9); }
.cg-session-dialog-icon svg { width:27px; height:27px; }
.cg-session-dialog-count { margin:20px 0 8px; font-size:12px; font-weight:700; color:var(--muted,#667085); font-variant-numeric:tabular-nums; }
.cg-session-dialog h2 { margin:0 0 12px; font-size:22px; line-height:1.3; letter-spacing:-.3px; }
.cg-session-dialog #cgSessionDialogText,.cg-session-dialog-pending { margin:0; color:var(--muted,#667085); font-size:14px; line-height:1.6; }
.cg-session-dialog .cg-session-dialog-pending { margin-top:12px; font-size:12px; }
.cg-session-dialog-actions { display:grid; gap:10px; margin-top:24px; }
.cg-session-dialog-actions button { width:100%; min-height:48px; font-size:15px; }
.cg-session-dialog-actions button:focus-visible { outline:3px solid var(--accent,#6963d9); outline-offset:3px; }
@keyframes cg-session-enter { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }
@media (prefers-reduced-motion:reduce) { .cg-session-dialog { animation:none; } }
.cg-section-head .cg-matches-toggle { display:flex; align-items:center; gap:10px; min-height:44px; padding:0; color:var(--text); font:inherit; text-align:left; }
.cg-matches-toggle svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:2; transition:transform 200ms; }
.cg-matches-toggle[aria-expanded="true"] svg { transform:rotate(180deg); }
.cg-home-matches [hidden] { display:none!important; }
.cg-analysis { --answer-correct:#85d4b3; --answer-wrong:#f0a8b3; width:100%; text-align:left; margin:28px 0; }
.cg-analysis-title { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:16px; }
.cg-analysis-title > span { color:var(--muted); font-size:12px; font-variant-numeric:tabular-nums; }
.cg-analysis h3 { font-size:14px; margin:24px 0 12px; }
.cg-analysis-summary { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.cg-analysis-summary > div { min-width:0; padding:16px 12px; border-top:3px solid var(--duel-color); border-radius:4px 4px 12px 12px; background:color-mix(in srgb,var(--duel-color) 7%,var(--panel)); }
.cg-analysis-summary h3 { margin:0 0 8px; overflow-wrap:anywhere; color:var(--duel-color); }
.cg-analysis-summary strong { display:block; font-size:30px; font-variant-numeric:tabular-nums; letter-spacing:-.04em; }
.cg-analysis-summary strong small { font-size:10px; font-weight:500; margin-left:4px; color:var(--muted); letter-spacing:normal; }
.cg-analysis-summary p { display:flex; flex-wrap:wrap; gap:4px 10px; font-size:11px; line-height:1.6; color:var(--muted); margin:10px 0 0; }
.cg-analysis-summary p b { color:var(--text); font-variant-numeric:tabular-nums; }
.cg-analysis-track { display:flex; gap:3px; margin-top:14px; }
.cg-analysis-track i { height:5px; flex:1; border-radius:2px; background:var(--muted); }
.cg-analysis-track .is-correct { background:var(--answer-correct); }
.cg-analysis-track .is-wrong { background:var(--answer-wrong); }
.cg-analysis-track .is-blank { background:transparent; border:1px solid var(--muted); }
.cg-analysis-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.cg-analysis-heading > span { color:var(--muted); font-size:10px; }
.cg-analysis-table { width:100%; table-layout:fixed; border-collapse:collapse; font-size:12px; }
.cg-analysis-table th,.cg-analysis-table td { padding:12px 4px; border-bottom:1px solid var(--stroke); overflow-wrap:anywhere; }
.cg-analysis-table th:first-child { width:36%; text-align:left; }
.cg-analysis-table :is(td,th:not(:first-child)) { text-align:center; font-variant-numeric:tabular-nums; }
.cg-analysis-table thead { color:var(--muted); }
.cg-analysis-questions { margin:0; padding:0; list-style:none; }
.cg-analysis-questions li { display:grid; grid-template-columns:28px repeat(2,minmax(0,1fr)); align-items:center; gap:10px; padding:16px 0; border-bottom:1px solid var(--stroke); }
.cg-analysis-number { align-self:start; grid-row:1 / span 2; padding-top:2px; font-size:12px; font-weight:700; font-variant-numeric:tabular-nums; color:var(--muted); }
.cg-analysis-lesson { grid-column:2 / -1; min-width:0; font-size:13px; overflow-wrap:anywhere; }
.cg-analysis-lesson small { display:block; margin-top:4px; color:var(--muted); font-size:11px; line-height:1.5; }
.cg-analysis-answer { display:grid; align-self:stretch; align-content:center; justify-items:start; gap:8px; min-width:0; padding:10px; border-radius:10px; border-left:2px solid var(--duel-color); background:color-mix(in srgb,var(--duel-color) 7%,var(--panel)); }
.cg-analysis-owner { overflow-wrap:anywhere; max-width:100%; font-size:11px; font-weight:650; line-height:1.4; color:var(--duel-color,var(--text)); }
.cg-analysis-mark { display:flex; align-items:center; gap:6px; }
.cg-analysis-mark i { display:grid; place-items:center; width:24px; height:24px; background:color-mix(in srgb,currentColor 10%,transparent); border:1px solid color-mix(in srgb,currentColor 35%,transparent); border-radius:7px; font-style:normal; font-size:15px; font-weight:700; }
.cg-analysis-mark small { font-size:11px; font-weight:600; }
.cg-analysis-mark.is-correct { color:var(--answer-correct); }
.cg-analysis-mark.is-wrong { color:var(--answer-wrong); }
.cg-analysis-mark.is-blank { color:var(--muted); }
[data-theme="light"] .cg-analysis { --answer-correct:#237455; --answer-wrong:#a8445a; }
@media(min-width:600px) {
  .cg-analysis-questions li { grid-template-columns:32px minmax(0,1fr) 124px 124px; gap:14px; }
  .cg-analysis-number { grid-row:auto; align-self:center; }
  .cg-analysis-lesson { grid-column:auto; }
  .cg-analysis-answer { padding:12px 14px; }
  .cg-analysis-summary > div { padding:18px; }
}
@media(prefers-reduced-motion:reduce) { .cg-matches-toggle svg { transition:none; } }
body.dd-pro .cg-page,body.dd-pro .cg-portal { --bg:#101420; --panel:#191f2f; --panel2:#20283a; --stroke:#ffffff18; --text:#edf0f8; --muted:#a3aec2; --brand:#9298ef; color:var(--text); font-family:inherit; }
body.dd-pro .cg-page { background:var(--bg); }
body.dd-pro .cg-page.cg-session-active { grid-template-rows:auto auto minmax(0,1fr) auto; }
.cg-session-nav { padding:10px max(16px,calc((100% - 700px)/2)) max(12px,env(safe-area-inset-bottom)); background:var(--bg); border-top:1px solid var(--stroke); z-index:3; }
.cg-session-nav.has-blanks { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.5fr); gap:10px; }
.cg-session-nav .cg-return-blank { display:flex; align-items:center; justify-content:center; gap:8px; min-height:50px; padding:8px 10px; color:var(--text); background:var(--panel2); border:1px solid var(--stroke); border-radius:12px; font-size:14px; font-weight:650; white-space:nowrap; }
.cg-session-nav .cg-return-blank b { display:grid; place-items:center; min-width:22px; height:22px; padding:0 5px; color:var(--brand); background:var(--panel); border-radius:7px; font-size:12px; font-variant-numeric:tabular-nums; }
.cg-session-nav .cg-return-blank:hover { border-color:var(--brand); }
body.dd-pro .cg-session-nav .qq-next-hint { display:flex; align-items:center; justify-content:center; gap:14px; width:100%; min-height:50px; margin:0; border-radius:12px; border-bottom:3px solid #4e569d; }
.cg-session-nav .qq-next-hint > span { margin:0; font-size:20px; }
.cg-blank-note { align-self:flex-start; padding:5px 10px; border-radius:8px; background:color-mix(in srgb,var(--brand) 12%,transparent); color:var(--brand); font-size:12px; font-weight:650; }
.cg-review { width:min(100%,640px); margin:auto; display:grid; gap:16px; align-content:center; padding:20px 0; }
.cg-review h1 { margin:0; }
.cg-review p { margin:0; color:var(--muted); font-size:14px; line-height:1.5; }
.cg-review-list { display:grid; gap:8px; }
.cg-review-question { display:flex; align-items:center; gap:14px; width:100%; min-height:56px; padding:9px 14px; text-align:left; color:var(--text); background:var(--panel); border:1px solid var(--stroke); border-radius:12px; }
.cg-review-question:hover { border-color:var(--brand); background:var(--panel2); }
.cg-review-question b { display:grid; place-items:center; width:30px; height:30px; flex:0 0 30px; color:var(--brand); background:var(--panel2); border-radius:9px; font-variant-numeric:tabular-nums; }
.cg-review-question span:nth-child(2) { flex:1; min-width:0; font-size:14px; font-weight:650; overflow:hidden; text-overflow:ellipsis; }
.cg-review-question span:last-child { color:var(--brand); font-size:13px; font-weight:650; white-space:nowrap; }
.cg-review .cg-finish-review { width:100%; min-height:52px; margin-top:4px; }
.cg-review-saving { display:flex; align-items:center; gap:14px; color:var(--muted); }
.cg-review-retry { justify-self:start; }
.cg-result-duel-loading { min-height:320px; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:12px; color:var(--muted); font-size:14px; }
.cg-finished-duel { border-top:1px solid var(--stroke); border-bottom:1px solid var(--stroke); padding:22px 0; }
.cg-duel-verdict { display:grid; justify-items:center; gap:9px; margin-bottom:20px; }
.cg-verdict-mark { display:grid; place-items:center; width:44px; height:44px; border:1px solid var(--stroke); border-radius:14px; background:var(--panel2); font-size:26px; font-weight:700; }
.cg-duel-verdict[data-outcome="win"] .cg-verdict-mark { color:#85d4b3; border-color:#85d4b355; }
.cg-duel-verdict h1,.cg-duel-verdict h2 { margin:0; font-size:clamp(22px,4vw,28px); overflow-wrap:anywhere; }
[data-theme="light"] .cg-duel-verdict[data-outcome="win"] .cg-verdict-mark { color:#237455; }
@media(min-width:700px) { .cg-session-nav { padding-left:max(24px,calc((100% - 900px)/2)); padding-right:max(24px,calc((100% - 900px)/2)); } }
body.dd-pro .cg-page .qq-header { padding-top:max(12px,env(safe-area-inset-top)); background:var(--bg); backdrop-filter:none; border:0; max-width:760px; width:100%; margin:auto; padding-left:20px; padding-right:20px; }
body.dd-pro .cg-page .qq-icon-btn { width:44px; height:44px; flex-shrink:0; }
/* A quiet header aligned with the question, shared by every test state. */
body.dd-pro .cg-page .qq-header.cg-header { display:grid; grid-template-columns:44px minmax(0,1fr) auto; align-items:center; gap:12px; width:calc(100% - 24px); max-width:700px; min-height:60px; margin:0 auto; padding:max(8px,env(safe-area-inset-top)) 0 8px; background:var(--bg); border:0; box-shadow:none; }
body.dd-pro .cg-page .cg-header .qq-icon-btn { display:grid; place-items:center; width:44px; height:44px; padding:0; border:0; border-radius:8px; background:var(--panel2); color:var(--text); box-shadow:none; }
body.dd-pro .cg-page .cg-header .qq-icon-btn svg { display:block; }
body.dd-pro .cg-page .cg-header .qq-icon-btn:hover { background:var(--stroke); }
body.dd-pro .cg-page .cg-header .qq-brand { display:block; min-width:0; margin:0; color:var(--text); }
body.dd-pro .cg-page .cg-header .qq-brand strong { display:block; margin:0; font-size:18px; line-height:1.25; font-weight:700; letter-spacing:-.02em; }
body.dd-pro .cg-page .cg-header .cg-progress { display:flex; align-items:baseline; justify-content:flex-end; gap:3px; min-width:56px; padding:0; color:var(--text); font-size:18px; font-weight:700; font-variant-numeric:tabular-nums; white-space:nowrap; }
body.dd-pro .cg-page .cg-header .cg-progress small { margin:0; color:var(--muted); font-size:14px; font-weight:500; }
body.dd-pro .cg-page .cg-header .cg-header-link { min-height:44px; padding:8px 0 8px 8px; font-size:14px; color:var(--brand); white-space:nowrap; }
body.dd-pro .cg-page .cg-header :focus-visible { outline:2px solid var(--brand); outline-offset:3px; }
body.dd-pro .cg-page>.cg-header+.cg-progress-track { width:calc(100% - 24px); max-width:700px; height:3px; margin:0 auto 4px; border-radius:0; background:var(--stroke); }
body.dd-pro .cg-page>.cg-header+.cg-progress-track i { border-radius:0; }
.cg-page button,.cg-portal button { font:inherit; cursor:pointer; }
.cg-page button:disabled { opacity:.55; cursor:default; }
.cg-page h1 { margin:12px 0 24px; font-size:clamp(24px,4vw,32px); letter-spacing:-.045em; line-height:1.2; }
.cg-page h2,.cg-portal h2 { margin:0; font-size:19px; letter-spacing:-.03em; }
.cg-progress { font-size:22px; font-weight:750; font-variant-numeric:tabular-nums; line-height:1; }
.cg-progress small { font-size:13px; font-weight:550; color:var(--muted); margin-left:3px; }
.cg-progress-track { height:6px; margin:6px max(20px,calc((100vw - 720px)/2)); background:var(--panel2); border-radius:6px; overflow:hidden; }
.cg-progress-track i { display:block; height:100%; border-radius:inherit; background:var(--brand); transition:width 220ms ease; }
body.dd-pro .cg-page .qq-stage { display:flex; flex-direction:column; justify-content:center; padding:18px 16px max(18px,env(safe-area-inset-bottom)); overflow:auto; }
body.dd-pro .cg-page .qq-card { width:min(100%,700px); margin:0 auto; padding:24px; gap:14px; border:1px solid var(--stroke); border-radius:18px; background:var(--panel); box-shadow:none; transform:translateY(var(--drag,0)); scroll-padding-bottom:84px; }
.cg-question { --question-accent:#aab1ff; }
.cg-question:has([data-question-area="turkce"]) { --question-accent:#b1a2f5; }
.cg-question:has([data-question-area="matematik"]) { --question-accent:#88bfff; }
.cg-question:has([data-question-area="sosyal"]) { --question-accent:#e9bb7a; }
.cg-question:has([data-question-area="fen"]) { --question-accent:#7dcdb5; }
.cg-question-meta { display:flex; align-items:center; justify-content:space-between; gap:12px; color:var(--muted); font-size:11px; line-height:1.4; }
.cg-question-meta > span:first-child { display:inline-flex; align-items:center; gap:8px; min-height:30px; padding:5px 10px; border-radius:8px; color:var(--question-accent); background:color-mix(in srgb,var(--question-accent) 10%,transparent); font-weight:650; }
.cg-question-meta > span:first-child::before { content:""; width:6px; height:6px; flex:0 0 6px; border-radius:2px; background:currentColor; }
.cg-question-meta > span:last-child { flex-shrink:0; }
body.dd-pro .cg-page .qq-question-text { font-size:clamp(18px,2.4vw,22px); font-weight:550; letter-spacing:-.015em; line-height:1.65; padding:16px 0 20px; }
body.dd-pro .cg-page .qq-question-media:has(.qq-question-text):not(:has(img)) { background:transparent; min-height:100px; color:var(--text); }
body.dd-pro .cg-page .qq-choices { gap:9px; }
body.dd-pro .cg-page .qq-choice { background:var(--panel2); border:1px solid var(--stroke); border-bottom-width:3px; min-height:56px; border-radius:12px; }
body.dd-pro .cg-page .cg-question .qq-choice { transition:transform 200ms ease,background 200ms ease,border-color 200ms ease; }
body.dd-pro .cg-page .qq-choices.has-text .qq-choice { gap:12px; padding:10px 12px; }
body.dd-pro .cg-page .qq-choice b { width:30px; height:30px; flex-basis:30px; border-radius:8px; background:var(--panel); font-size:13px; font-weight:700; }
body.dd-pro .cg-page .qq-choices.has-text .qq-choice-text { min-width:0; flex:1; font-size:15px; line-height:1.45; font-weight:500; }
.qq-choices.has-text .qq-choice .qq-choice-status,.qq-choices:not(.has-text) .qq-choice .qq-choice-status { display:flex; align-items:center; justify-content:center; width:22px; min-width:22px; height:22px; flex:0 0 22px; margin-left:auto; }
.qq-choices .qq-choice .qq-choice-status .qq-choice-progress { display:flex; justify-content:center; margin:0; }
.qq-choice .qq-choice-status .qq-choice-progress > span { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.qq-choices .qq-choice .qq-choice-status .question-answer-mark { display:grid; place-items:center; margin:0; width:21px; height:21px; border:1px solid currentColor; border-radius:50%; font-size:14px; font-weight:750; line-height:1; }
.qq-choices:not(.has-text) .qq-choice .qq-choice-status { position:absolute; top:4px; right:3px; width:14px; min-width:14px; height:14px; }
.qq-choices:not(.has-text) .qq-choice .qq-choice-status .qq-choice-progress { position:static; }
.qq-choices:not(.has-text) .qq-choice .qq-choice-status .question-answer-mark { width:13px; height:13px; font-size:10px; }
body.dd-pro .cg-page .cg-question .qq-choice.is-pending { box-shadow:0 0 0 1px var(--brand); }
body.dd-pro .cg-page .qq-choice:disabled { opacity:1; }
body.dd-pro .cg-page .qq-choice.is-dim { color:var(--muted); }
body.dd-pro .cg-page .qq-choice.is-correct { border-color:#5aa68b; background:#254238; }
body.dd-pro .cg-page .qq-choice.is-wrong { border-color:#ba897a; background:#44312f; }
body.dd-pro .cg-page .qq-choice:is(.is-correct,.is-wrong) b { background:color-mix(in srgb,currentColor 8%,transparent); border-color:color-mix(in srgb,currentColor 20%,transparent); }
body.dd-pro .cg-page .qq-next-hint,body.dd-pro .cg-page .qq-primary,.cg-portal .qq-primary { border:0; color:#fff; background:#666ec4; font-size:14px; font-weight:650; box-shadow:none; }
body.dd-pro .cg-page .qq-card-actions { background:var(--panel); padding-top:12px; bottom:-24px; }
body.dd-pro .cg-page .qq-card-actions .qq-next-hint { display:flex; align-items:center; justify-content:center; gap:12px; min-height:48px; border-bottom:3px solid #4e569d; border-radius:12px; }
body.dd-pro .cg-page .qq-card-actions .qq-next-hint > span { display:grid; place-items:center; width:24px; height:24px; margin:0; border:1px solid #ffffff55; border-radius:7px; font-size:16px; }
body.dd-pro .cg-page .qq-tools { gap:8px; }
body.dd-pro .cg-page .qq-tools button { min-height:44px; padding:10px 12px; border:1px solid var(--stroke); border-radius:9px; background:transparent; color:var(--muted); font-size:12px; }
body.dd-pro .cg-page .qq-tools button:hover { color:var(--text); background:var(--panel2); }
body.dd-pro .cg-page .cg-writing-action { justify-content:flex-end; }
body.dd-pro .cg-page .cg-question-head { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:10px; padding-bottom:12px; border-bottom:1px solid var(--stroke); }
body.dd-pro .cg-page .cg-question-head .cg-question-meta { flex-direction:column; align-items:flex-start; justify-content:center; min-width:0; gap:5px; padding:0; margin:0; border:0; }
body.dd-pro .cg-page .cg-question-head .cg-question-meta > span:first-child { flex-wrap:wrap; max-width:100%; padding:5px 8px; gap:5px; font-size:11px; }
body.dd-pro .cg-page .cg-question-head .cg-question-meta > span:last-child { font-size:10px; font-weight:500; }
body.dd-pro .cg-page .qq-tools.cg-writing-action button { flex:0 1 auto; min-height:48px; min-width:136px; padding:11px 12px; gap:8px; border-radius:12px; border-color:color-mix(in srgb,var(--brand) 32%,var(--stroke)); background:color-mix(in srgb,var(--brand) 8%,var(--panel)); color:var(--text); font-size:14px; font-weight:650; }
body.dd-pro .cg-page .cg-writing-action button:focus-visible { outline:2px solid var(--brand); outline-offset:3px; }
body.dd-pro .cg-page .qq-feedback { border-radius:12px; padding:14px; font-size:14px; animation:cg-feedback-enter 200ms ease-out; }
body.dd-pro .cg-page .qq-feedback-heading { gap:9px; }
body.dd-pro .cg-page .qq-feedback .qq-reward-mark { width:26px; height:26px; flex-basis:26px; border:1px solid currentColor; border-radius:50%; font-size:17px; box-shadow:none; }
body.dd-pro .cg-page .qq-feedback strong { font-size:14px; font-weight:650; }
body.dd-pro .cg-page .qq-feedback.correct { background:#21392f; border:1px solid #5aa68b55; }
body.dd-pro .cg-page .qq-feedback.wrong { background:#352a2b; border:1px solid #ba897a44; }
@keyframes cg-feedback-enter { from { opacity:0; transform:translateY(4px); } to { opacity:1; transform:translateY(0); } }
.cg-page .qq-confetti { display:none; }
.cg-hide-question { min-height:44px; border:0; background:transparent; color:var(--muted); padding:8px 0 12px; font-size:11px!important; text-align:left; }
.cg-centered { width:min(100%,460px); margin:auto; padding:24px 12px; text-align:center; }
.cg-centered.cg-duel-result { width:min(100%,700px); }
.cg-duel-result > h1 { margin:8px 0 18px; font-size:16px; letter-spacing:-.02em; }
.cg-duel-result .cg-duel-comparison { border:1px solid var(--stroke); border-radius:14px; overflow:hidden; }
.cg-duel-result .cg-finished-duel { margin-bottom:22px; padding-top:0; border-top:0; }
.cg-duel-result .cg-duel-verdict { grid-template-columns:44px minmax(0,auto); grid-template-rows:auto auto; justify-content:center; justify-items:start; column-gap:12px; row-gap:4px; text-align:left; }
.cg-duel-result .cg-verdict-mark { grid-row:1 / span 2; align-self:center; }
.cg-duel-result .cg-duel-verdict .cg-kicker { grid-column:2; }
.cg-duel-result .cg-duel-verdict h2 { grid-column:2; font-size:22px; }
.cg-kicker { display:block; margin-bottom:18px; color:var(--muted); font-size:12px; letter-spacing:.04em; }
.cg-error { max-width:660px; padding:10px 16px; margin:10px auto 0; color:#e9ba9c; font-size:12px; line-height:1.5; }
.cg-sync-note { padding:10px; color:var(--muted); font-size:12px; }
.cg-totals,.cg-record { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin:24px 0; }
.cg-totals span,.cg-record span { color:var(--muted); font-size:12px; }
.cg-totals b,.cg-record b { display:block; color:var(--text); font-size:32px; margin-bottom:5px; font-variant-numeric:tabular-nums; }
body.dd-pro .cg-result .cg-totals { gap:0; padding:20px 0; }
.cg-result .cg-totals > span { text-align:center; }
.cg-result .cg-totals > span + span { border-left:1px solid var(--stroke); }
.cg-result .cg-totals b { font-size:38px; font-weight:750; letter-spacing:-.04em; }
.cg-result .cg-totals > span:first-child b { color:#85d4b3; }
.cg-result .cg-totals > span:nth-child(2) b { color:#e9a3ae; }
.cg-result .cg-totals > span:last-child b { color:var(--muted); }
.cg-area-results { border-top:1px solid var(--stroke); text-align:left; margin:22px 0; }
.cg-area-results > div { display:flex; justify-content:space-between; gap:16px; padding:12px 0; border-bottom:1px solid var(--stroke); font-size:13px; }
.cg-area-results b { font-size:12px; font-weight:600; font-variant-numeric:tabular-nums; }
.cg-area-results .cg-result-labels { color:var(--muted); font-size:10px; }
.cg-primary-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.cg-text-button,.cg-section-head button { min-height:42px; padding:8px 4px; border:0; background:transparent; color:var(--muted); font:inherit; font-size:12px; cursor:pointer; }
.cg-section-head { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:12px; }
.cg-section-head h1 { margin:0; }
.cg-home-matches { margin:12px 0 24px; }
.cg-home-matches h2 { font-size:18px; font-weight:650; letter-spacing:-.025em; }
.cg-empty-line { color:var(--muted); font-size:13px; padding:12px 0; }
.cg-match-list { width:min(100%,700px); margin:0 auto; padding:8px 0; }
.cg-match-row { display:flex; align-items:center; gap:16px; min-height:86px; padding:14px 0; border-bottom:1px solid var(--stroke); cursor:pointer; }
.cg-match-person { flex:1; min-width:0; }
.cg-person { display:inline-flex; align-items:center; gap:11px; min-width:0; max-width:100%; padding:0; border:0; background:transparent; color:var(--text); font:inherit; font-size:14px; font-weight:600; text-align:left; }
.cg-person > span:last-child { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cg-avatar { display:grid; place-items:center; flex:0 0 38px; width:38px; height:38px; border-radius:50%; background:var(--panel2); font-size:23px; overflow:hidden; }
.cg-avatar img { width:100%; height:100%; object-fit:cover; }
.cg-status { display:block; margin-left:49px; margin-top:3px; color:var(--muted); font-size:11px; }
.cg-status.win { color:#83c6ab; }.cg-status.loss { color:#cfa392; }
.cg-row-action { min-height:42px; padding:8px 0 8px 10px; border:0; color:var(--text); background:transparent; font:inherit; font-size:12px; white-space:nowrap; cursor:pointer; }
.cg-row-action span { color:var(--muted); margin-left:5px; }
.cg-match-score { font-size:18px; font-weight:650; white-space:nowrap; font-variant-numeric:tabular-nums; }
.cg-match-score small { font-size:12px; margin:0 7px; color:var(--muted); }
.cg-waiting-avatar { display:inline-grid; place-items:center; width:38px; height:38px; margin-right:11px; border:1px dashed var(--stroke); border-radius:50%; color:var(--muted); }
.cg-versus { display:flex; justify-content:center; align-items:center; gap:36px; margin:30px 0; }
.cg-versus b { display:block; font-size:52px; letter-spacing:-.05em; }
.cg-versus span { color:var(--muted); font-size:12px; }.cg-versus b { color:var(--text); }
.cg-page .qq-overlay,.cg-portal .qq-overlay { background:#080c16b3; backdrop-filter:none; }
.cg-player-modal,.cg-invite-modal { width:min(100%,420px); max-height:90dvh; overflow:auto; padding:24px; background:var(--panel); border:1px solid var(--stroke); border-radius:18px; box-shadow:0 20px 70px #0004; }
.cg-player-modal > .cg-person { margin:12px 0; font-size:20px; }.cg-player-modal .cg-avatar { width:56px; height:56px; flex-basis:56px; font-size:30px; }
.cg-player-modal h3 { margin:28px 0 20px; font-size:12px; color:var(--muted); font-weight:550; }
.cg-player-areas { display:grid; gap:20px; }
.cg-area-label { display:flex; justify-content:space-between; gap:10px; font-size:12px; margin-bottom:9px; }
.cg-area-label b { color:var(--muted); font-size:11px; font-weight:500; }
.cg-meter { height:6px; background:var(--panel2); border-radius:4px; overflow:hidden; }
.cg-meter i { display:block; height:100%; background:var(--brand); border-radius:inherit; }
.cg-invite-modal label { display:block; margin:18px 0 8px; font-size:12px; color:var(--muted); }
.cg-search { display:flex; gap:8px; }.cg-search input,.cg-share-url { min-width:0; width:100%; min-height:46px; padding:10px 12px; border:1px solid var(--stroke); background:var(--panel2); border-radius:9px; color:var(--text); font:inherit; font-size:14px; }
.cg-search button { border:1px solid var(--stroke); padding:10px 15px; border-radius:9px; background:var(--panel2); color:var(--text); }
.cg-invite-target { margin:20px 0; }.cg-share-url { font-size:12px; margin-top:8px; }
.cg-page button:focus-visible,.cg-portal button:focus-visible,.cg-match-row:focus-visible,.cg-person:focus-visible { outline:2px solid var(--brand); outline-offset:4px; }
.cg-question.cg-leave { animation:cg-leave 180ms ease both; }.cg-question.cg-enter { animation:cg-enter 200ms ease-out both; }
@keyframes cg-leave { to { transform:translateY(-20px); opacity:0; } }@keyframes cg-enter { from { transform:translateY(20px); opacity:0; } }
.cg-home-entry { padding:28px 0; border-bottom:1px solid var(--stroke); margin-bottom:14px; }
.cg-home-entry .cg-kicker { margin:0 0 10px; }
.cg-home-heading { display:flex; justify-content:space-between; align-items:start; gap:16px; }
.cg-energy { width:120px; flex-shrink:0; color:var(--muted); }
.cg-energy-label { display:flex; justify-content:space-between; font-size:11px; gap:12px; }
.cg-energy-label strong { color:var(--text); font-variant-numeric:tabular-nums; }
.cg-energy-cells { display:grid; grid-template-columns:repeat(5,1fr); gap:4px; margin:7px 0 5px; }
.cg-energy-cells i { height:6px; border-radius:2px; background:var(--panel2); border:1px solid var(--stroke); }
.cg-energy-cells i.filled { background:#9298ef; border-color:#9298ef; }
.cg-energy small { display:block; font-size:9px; text-align:right; }
.cg-home-start:disabled { opacity:.5; cursor:default; }
.cg-home-entry h1 { margin:0 0 22px; color:var(--text); font-size:clamp(30px,5vw,44px); letter-spacing:-.045em; line-height:1.15; }
.cg-home-entry-line { display:flex; align-items:center; justify-content:space-between; gap:18px; }
.cg-home-exams { display:flex; align-items:center; gap:18px; flex-wrap:wrap; color:var(--muted); font-size:12px; }
.cg-home-exams strong { color:var(--text); }.cg-home-exams small { display:block; margin-top:3px; font-size:9px; }
.cg-home-start { min-height:48px; padding:12px 24px; border:0; border-radius:10px; background:#666ec4; color:#fff; font:inherit; font-size:14px; font-weight:650; cursor:pointer; }
body.dd-pro .ddTab--quick .ddTabIcon { border:0; background:var(--panel2); color:var(--brand); box-shadow:none; }
[data-theme="light"] body.dd-pro .cg-page,[data-theme="light"] body.dd-pro .cg-portal { --bg:#f4f6fa; --panel:#fff; --panel2:#eef0f6; --stroke:#25365320; --text:#233047; --muted:#617087; --brand:#626abe; }
[data-theme="light"] .cg-question { --question-accent:#565eb0; }
[data-theme="light"] .cg-question:has([data-question-area="turkce"]) { --question-accent:#7254b1; }
[data-theme="light"] .cg-question:has([data-question-area="matematik"]) { --question-accent:#2b6cb0; }
[data-theme="light"] .cg-question:has([data-question-area="sosyal"]) { --question-accent:#916021; }
[data-theme="light"] .cg-question:has([data-question-area="fen"]) { --question-accent:#25755e; }
[data-theme="light"] .cg-result .cg-totals > span:first-child b { color:#237455; }
[data-theme="light"] .cg-result .cg-totals > span:nth-child(2) b { color:#a8445a; }
[data-theme="light"] body.dd-pro .cg-page .qq-choice.is-correct,[data-theme="light"] body.dd-pro .cg-page .qq-feedback.correct { background:#e6f3eb; color:var(--text); }
[data-theme="light"] body.dd-pro .cg-page .qq-choice.is-wrong,[data-theme="light"] body.dd-pro .cg-page .qq-feedback.wrong { background:#f6eae5; color:var(--text); }
@media(max-width:600px) {
  body.dd-pro .cg-page .qq-card { padding:16px; gap:12px; }body.dd-pro .cg-page .qq-stage { padding:12px 10px max(12px,env(safe-area-inset-bottom)); }
  body.dd-pro .cg-page .qq-question-text { padding:12px 0 16px; }
  body.dd-pro .cg-page .qq-choices:not(.has-text) { gap:6px; }
  body.dd-pro .cg-page .qq-card-actions { bottom:-16px; }
  .cg-match-row { gap:10px; }.cg-row-action { font-size:11px; }.cg-match-score { font-size:16px; }
  .cg-player-overlay,.cg-page .qq-overlay { padding:0; align-items:end; }
  .cg-player-modal,.cg-invite-modal { width:100%; border-radius:22px 22px 0 0; padding:24px 22px max(28px,env(safe-area-inset-bottom)); animation:cg-enter 200ms ease-out; }
  .cg-home-entry-line { flex-wrap:wrap; }.cg-home-start { width:100%; }
  .cg-centered { padding:16px 4px; }
}
@media(prefers-reduced-motion:reduce) { .cg-page *,.cg-portal * { animation:none !important; transition:none !important; scroll-behavior:auto !important; } }

.cg-invite-friends { margin:18px 0; }
.cg-invite-friends h3 { font-size:14px; margin:0 0 8px; }
.cg-invite-friends-list { max-height:280px; overflow:auto; overscroll-behavior:contain; }
.cg-invite-friend { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 0; border-bottom:1px solid var(--stroke); }
.cg-invite-friend .cg-person { min-width:0; flex:1; text-align:left; }
.cg-invite-friend .cg-person > span:last-child { overflow:hidden; text-overflow:ellipsis; }
.cg-invite-friend .qq-secondary { width:auto; min-width:0; flex-shrink:0; font-size:12px; min-height:42px; padding:8px 12px; }
.cg-page button[aria-busy="true"] { opacity:.85; cursor:progress; }
.cg-button-spinner { display:inline-block; width:14px; height:14px; flex:0 0 14px; margin-right:7px; border:2px solid currentColor; border-right-color:transparent; border-radius:50%; vertical-align:-2px; animation:cg-spin .7s linear infinite; }
@keyframes cg-spin { to { transform:rotate(360deg); } }
.cg-invite-target { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.cg-invite-target .qq-primary { width:auto; flex-shrink:0; font-size:12px; }
.cg-inbox-count { color:var(--muted); font-size:14px; font-variant-numeric:tabular-nums; }
body.dd-pro .cg-page .qq-stage:has(.cg-inbox) { justify-content:flex-start; }
.cg-inbox { text-align:left; }
.cg-inbox-row { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:20px 0; border-bottom:1px solid var(--stroke); }
.cg-inbox-person { min-width:0; flex:1; }
.cg-inbox-person .cg-avatar { border:1px solid color-mix(in srgb,var(--duel-a) 55%,transparent); background:color-mix(in srgb,var(--duel-a) 12%,var(--panel)); border-radius:12px; }
.cg-inbox-meta { display:block; margin:5px 0 0 49px; color:var(--muted); font-size:11px; }
.cg-inbox-actions { display:flex; align-items:center; flex-shrink:0; gap:10px; }
.cg-inbox-actions .qq-primary { width:auto; min-height:44px; padding:10px 16px; font-size:12px; }
.cg-inbox-actions .cg-text-button { min-height:44px; padding:10px 8px; font-size:12px; }
.cg-inbox-loading { min-height:160px; display:flex; align-items:center; justify-content:center; gap:14px; color:var(--muted); font-size:13px; }
.cg-inbox-loading .qq-loader { width:22px; height:22px; margin:0; }
@media(max-width:480px) {
  .cg-inbox-row { flex-wrap:wrap; gap:14px; padding:18px 4px; }
  .cg-inbox-person { flex-basis:100%; }
  .cg-inbox-actions { padding-left:49px; width:100%; }
  .cg-inbox-actions .qq-primary { min-width:110px; }
  .cg-invite-friend { gap:8px; }
  .cg-invite-friend .qq-secondary { padding-inline:9px; }
  .cg-invite-target { flex-wrap:wrap; }
}

/* Each invitation owns one pair of colors; host and guest keep their color. */
.cg-duel-palette-0 { --duel-a:#76b6ff; --duel-b:#f0aa6e; }
.cg-duel-palette-1 { --duel-a:#af9bfa; --duel-b:#72c8ad; }
.cg-duel-palette-2 { --duel-a:#eb94b0; --duel-b:#70c3d9; }
.cg-duel-palette-3 { --duel-a:#d5b862; --duel-b:#94a4ef; }
.cg-duel-palette-4 { --duel-a:#87c4a5; --duel-b:#df9ce8; }
.cg-duel-palette-5 { --duel-a:#ed9b83; --duel-b:#91b4e9; }
[data-theme="light"] .cg-duel-palette-0 { --duel-a:#2367b5; --duel-b:#a65b21; }
[data-theme="light"] .cg-duel-palette-1 { --duel-a:#7152bc; --duel-b:#21785e; }
[data-theme="light"] .cg-duel-palette-2 { --duel-a:#ad3c63; --duel-b:#19798e; }
[data-theme="light"] .cg-duel-palette-3 { --duel-a:#846309; --duel-b:#5265b9; }
[data-theme="light"] .cg-duel-palette-4 { --duel-a:#28754d; --duel-b:#9949a3; }
[data-theme="light"] .cg-duel-palette-5 { --duel-a:#b15137; --duel-b:#466caa; }
body.dd-pro .cg-match-row.cg-duel-card { display:block; min-height:0; padding:0; margin:0 0 12px; overflow:hidden; border:1px solid var(--stroke); border-radius:14px; background:var(--panel); transition:border-color 200ms ease,transform 200ms ease; }
.cg-duel-card:hover { border-color:color-mix(in srgb,var(--text) 30%,transparent)!important; }
.cg-duel-card:active { transform:translateY(1px); }
.cg-duel-comparison { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); position:relative; gap:2px; }
.cg-duel-comparison.cg-versus { margin:0; gap:2px; }
.cg-duel-player { display:flex; align-items:center; justify-content:space-between; gap:8px; min-width:0; padding:14px 16px 13px; background:color-mix(in srgb,var(--duel-color) 12%,var(--panel)); border-top:3px solid var(--duel-color); }
.cg-duel-host { --duel-color:var(--duel-a); }
.cg-duel-guest { --duel-color:var(--duel-b); }
.cg-duel-player .cg-person { display:grid; justify-items:start; gap:7px; min-width:0; color:var(--text); font-size:12px; line-height:1.2; text-decoration:none; }
.cg-duel-player .cg-person > span:last-child { display:block; max-width:100%; color:var(--text); }
.cg-duel-player .cg-person:hover > span:last-child { text-decoration:underline; text-underline-offset:3px; }
body.dd-pro .cg-duel-player .cg-avatar { width:36px; height:36px; min-width:36px; border:1px solid color-mix(in srgb,var(--duel-color) 38%,transparent); border-radius:11px; background:var(--panel); font-size:22px; }
.cg-avatar > svg { display:block; width:100%; height:100%; }
.cg-duel-player .cg-waiting-avatar { width:36px; height:36px; margin:0; border:1px dashed var(--duel-color); border-radius:11px; color:var(--duel-color); }
.cg-waiting-avatar svg { width:22px; height:22px; }
.cg-duel-player.is-waiting { background:color-mix(in srgb,var(--duel-color) 5%,var(--panel)); border-top-style:dashed; }
.cg-duel-player.is-waiting .cg-person { color:var(--muted); font-weight:500; }
.cg-duel-player.is-waiting .cg-person > span:last-child { white-space:normal; color:var(--muted); }
.cg-duel-vs { position:absolute; top:33px; left:50%; transform:translate(-50%,-50%); display:grid; place-items:center; width:25px; height:25px; border:1px solid var(--stroke); border-radius:8px; background:var(--panel); color:var(--muted); font-size:9px; font-weight:700; letter-spacing:.03em; }
.cg-duel-comparison .cg-duel-score { display:grid; justify-items:center; flex:0 0 auto; color:var(--duel-color); font-variant-numeric:tabular-nums; }
.cg-duel-comparison .cg-duel-score b { font-size:30px; line-height:1; font-weight:750; letter-spacing:-.04em; color:var(--duel-color); }
.cg-duel-score small { margin-top:5px; font-size:10px; font-weight:500; color:var(--muted); }
.cg-duel-footer { display:flex; align-items:center; justify-content:space-between; min-height:44px; gap:8px; padding:0 14px; }
.cg-duel-footer .cg-status { display:flex; align-items:center; gap:6px; margin:0; min-width:0; font-size:11px; }
.cg-duel-footer .cg-status > span { display:inline-grid; place-items:center; width:16px; height:16px; border:1px solid currentColor; border-radius:50%; font-size:11px; font-weight:700; }
.cg-duel-footer .cg-row-action { min-height:44px; padding:0 0 0 8px; font-size:12px; font-weight:650; }
.cg-duel-footer .cg-row-action span { margin-left:7px; }
[data-theme="light"] .cg-duel-footer .cg-status.win { color:#31705b; }
[data-theme="light"] .cg-duel-footer .cg-status.loss { color:#975541; }
.cg-match-detail { width:min(100%,700px); }
.cg-match-detail .cg-duel-comparison { border:1px solid var(--stroke); border-radius:16px; overflow:hidden; margin:28px 0; }
.cg-match-detail .cg-duel-player { flex-direction:column; justify-content:center; padding:22px 12px; gap:20px; }
.cg-match-detail .cg-duel-player .cg-person { justify-items:center; font-size:14px; width:100%; }
body.dd-pro .cg-match-detail .cg-duel-player .cg-avatar, .cg-match-detail .cg-waiting-avatar { width:56px; height:56px; font-size:32px; border-radius:16px; }
.cg-match-detail .cg-duel-score b { font-size:50px; }
.cg-match-detail .cg-duel-score small { font-size:12px; }
.cg-match-detail .cg-duel-vs { top:54px; }
.cg-match-detail > .cg-text-button { display:block; margin:12px auto 0; }
@media(min-width:650px) {
  .cg-duel-card .cg-person { display:flex; gap:11px; }
  .cg-duel-card .cg-duel-player { min-height:80px; padding:16px 22px; }
  .cg-duel-card .cg-duel-vs { top:40px; }
  body.dd-pro .cg-duel-card .cg-avatar { width:42px; height:42px; min-width:42px; }
}
@media(min-width:900px) {
  body.dd-pro .cg-home-matches { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  .cg-home-matches > .cg-section-head,.cg-home-matches > .cg-empty-line { grid-column:1/-1; margin-bottom:0; }
  body.dd-pro .cg-home-matches .cg-match-row.cg-duel-card { margin:0; }
  .cg-home-matches .cg-duel-player { padding-inline:14px; }
  .cg-home-matches .cg-person { display:grid; gap:7px; }
  body.dd-pro .cg-home-matches .cg-avatar { width:36px; height:36px; min-width:36px; }
}
@media(max-width:359px) {
  .cg-duel-player { padding:12px 11px; }
  .cg-duel-comparison .cg-duel-score b { font-size:26px; }
  .cg-duel-footer { padding:0 10px; }
  .cg-duel-footer .cg-status { font-size:10px; }
  .cg-duel-footer .cg-row-action { font-size:11px; }
}
@media(prefers-reduced-motion:reduce) {
  .cg-duel-card { transition:none!important; }
  .cg-duel-card:active { transform:none; }
}
/* Pull-down scratch paper stays white in both themes. */
.cg-paper { border:1px solid var(--stroke); border-radius:12px; overflow:hidden; flex-shrink:0; }
.cg-paper-area { position:relative; overflow:hidden; background:#fff; color:#25334b; }
.cg-paper-area[hidden] { display:none !important; }
.cg-paper-canvas { display:block; width:100%; height:100%; touch-action:pinch-zoom; cursor:crosshair; }
.cg-paper-tools { position:absolute; top:0; left:0; right:0; z-index:1; display:flex; gap:2px; padding:2px 4px; background:#ffffffed; border-bottom:1px solid #d4dbe5; }
.cg-paper-tools button { display:grid; place-items:center; width:44px; height:44px; padding:10px; border:0; border-radius:8px; background:transparent; color:#42516a; cursor:pointer; }
.cg-paper-tools button[aria-pressed="true"] { background:#e8ecfa; color:#394d99; }
.cg-paper-tools button:disabled { opacity:.35; cursor:default; }
.cg-paper-tools .cg-paper-close { margin-left:auto; }
.cg-paper--advanced .cg-paper-tools { position:relative; flex-wrap:wrap; align-items:center; gap:3px; padding:4px; }
.cg-paper--advanced .cg-paper-tools button { flex:none; min-width:44px; min-height:44px; }
.cg-paper-width { display:flex; align-items:center; gap:6px; margin-inline:auto 0; color:#42516a; font-size:11px; font-weight:650; }
.cg-paper-width select { min-width:76px; min-height:44px; padding:6px; border:1px solid #d4dbe5; border-radius:8px; color:#25334b; background:#fff; font:inherit; }
.cg-paper-width select:focus-visible { outline:2px solid #6d7bd0; outline-offset:2px; }
.cg-paper--advanced .cg-paper-canvas { flex:none; }
@media(max-width:560px) {
  .cg-paper--advanced .cg-paper-tools { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); }
  .cg-paper--advanced .cg-paper-tools button { width:100%; }
  .cg-paper--advanced .cg-paper-width { grid-column:1 / span 4; justify-content:flex-start; margin-left:4px; }
  .cg-paper--advanced .cg-paper-close { grid-column:5; margin-left:0; }
}
.cg-paper svg { width:22px; height:22px; flex-shrink:0; }
.cg-paper-handle { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:44px; padding:0 12px; color:var(--muted); background:var(--panel2); font-size:12px; cursor:ns-resize; touch-action:pinch-zoom; user-select:none; }
.cg-paper-handle i { width:36px; height:4px; border-radius:4px; background:currentColor; opacity:.45; }
.cg-paper-handle > span { min-width:105px; }
.cg-paper-handle > svg { width:18px; transition:transform .2s; }
.cg-paper.is-open .cg-paper-handle > svg { transform:rotate(180deg); }
.cg-paper-handle:focus-visible,.cg-paper-tools button:focus-visible { outline:2px solid #6d7bd0; outline-offset:-3px; }
@media (prefers-reduced-motion:reduce) { .cg-paper-handle > svg { transition:none; } }

.cg-home-matches > .cg-duel-groups { grid-column:1/-1; }
.cg-duel-groups { display:grid; gap:26px; min-width:0; width:100%; }
.cg-duel-group { min-width:0; }
.cg-duel-group-heading { display:flex; align-items:center; gap:9px; margin:0 0 12px; }
.cg-duel-group-heading h3 { margin:0; font-size:14px; font-weight:700; color:var(--text); }
.cg-duel-group-heading > span { display:grid; place-items:center; min-width:22px; height:22px; border-radius:7px; background:var(--panel2); color:var(--muted); font-size:11px; font-variant-numeric:tabular-nums; }
.cg-duel-group[data-duel-group="completed"] { padding-top:18px; border-top:1px solid var(--stroke); }
.cg-duel-group[data-duel-group="completed"] .cg-duel-group-heading h3 { color:var(--muted); }
.cg-duel-group-empty { margin:0; padding:12px 0; color:var(--muted); font-size:12px; }
.cg-duel-group .wheel-home-rows { min-width:0; margin:0; }
.cg-duel-group .wheel-match-row { height:100%; margin:0; }
.cg-duel-group-error { color:var(--muted); font-size:12px; }
.cg-turn-transition { position:fixed; inset:0; z-index:80; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; background:color-mix(in srgb,var(--bg,#111522) 92%,transparent); color:var(--text); animation:cg-turn-fade 200ms ease both; }
.cg-turn-transition .qq-loader { width:32px; height:32px; margin:0; }
.cg-turn-transition strong { font-size:14px; font-weight:650; }
.cg-turn-returning > .qq-stage { transition:opacity 200ms ease,transform 200ms ease; opacity:.35; transform:translateY(-6px); }
@keyframes cg-turn-fade { from { opacity:0; } to { opacity:1; } }
@media(prefers-reduced-motion:reduce) {
  .cg-turn-transition { animation:none; }
  .cg-turn-returning > .qq-stage { transition:none; transform:none; }
}