.diff-wrap{max-width:1320px;margin:0 auto;padding:18px 0 45px;font-size:15px}.diff-wrap>.fg-back{display:inline-block;margin-bottom:16px}.diff-stage{padding:clamp(18px,3vw,36px);border-radius:26px;background:radial-gradient(ellipse at 50% 0,#573781,#292148 65%,#1d1d36);color:#fff;box-shadow:0 20px 60px #28154430}.diff-top,.diff-tools{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.diff-eyebrow{font-size:12px;font-weight:800;letter-spacing:1.6px;color:#e7cffa}.diff-stage h1{font-size:clamp(28px,4vw,46px);line-height:1.15;text-align:center;color:#fff;margin:20px 0 10px;letter-spacing:-1px}.diff-intro{text-align:center;color:#e2d7ed;line-height:1.6;margin:0 auto 20px;max-width:620px}.diff-progress{display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap;margin:20px 0}.diff-progress>strong{font-size:25px;color:#ffe0a3}.diff-progress>div{display:flex;gap:7px}.diff-progress>div span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;border:1px solid #c9b5db77;background:#ffffff0c;color:#dfd2ea;font-size:13px;font-weight:800}.diff-progress>div .is-found{background:#b9f3d6;color:#164d3b;border-color:#b9f3d6}.diff-progress>div .is-revealed{background:#ffdda0;color:#5b3d16}.diff-progress>span{font-size:12px;color:#d8cbe6}.diff-tools{justify-content:center;margin:20px 0}.diff-tool{font:inherit;background:#ffffff14;color:#fff;border:1px solid #cbb0e366;border-radius:10px;min-height:44px;padding:10px 16px;cursor:pointer}.diff-tool:hover{background:#ffffff28}.diff-tool:disabled{opacity:.4;cursor:default}.diff-pan{display:flex;gap:5px}.diff-pan button{min-width:44px}.diff-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(10px,2vw,24px)}.diff-pair figure{margin:0;min-width:0}.diff-pair figcaption{display:flex;align-items:center;gap:9px;font-size:13px;letter-spacing:.3px;font-weight:700;margin:0 0 10px;color:#f2e8ff}.diff-pair figcaption span{width:25px;height:25px;background:#ffffff16;display:grid;place-items:center;border:1px solid #ffffff30;border-radius:7px;color:#ffe2a3}.diff-picture{display:block;width:100%;aspect-ratio:1;border:2px solid #ddc38b88;border-radius:14px;background:#2c263e;box-shadow:0 10px 28px #0005;overflow:hidden;touch-action:manipulation}.diff-picture[role=application]{cursor:crosshair}.diff-marker ellipse{fill:none;stroke:#bdffda;stroke-width:.65;filter:drop-shadow(0 .1px .2px #000)}.diff-marker text{font-size:2.8px;font-weight:900;text-anchor:middle;fill:#fff;paint-order:stroke;stroke:#16382e;stroke-width:.6}.diff-marker.is-revealed ellipse{stroke:#ffe1a0;stroke-dasharray:1 .7}.diff-hint-zone{fill:#ffdd6e18;stroke:#ffe39b;stroke-width:.45;stroke-dasharray:2 1}.diff-cursor{fill:none;stroke:#fff;stroke-width:.35;filter:drop-shadow(0 .1px .15px #000)}.diff-keyboard{font-size:12px;color:#c8badb;line-height:1.6;text-align:center;margin:16px auto;max-width:760px}.diff-status{font-size:15px;line-height:1.6;text-align:center;min-height:48px;padding:12px 18px;background:#ffffff0b;border-radius:12px;border:1px solid #ffffff15;margin:18px 0;color:#f4e7ff}.diff-text{display:block;font:inherit;background:none;border:0;color:#d7c8e6;text-decoration:underline;text-underline-offset:4px;cursor:pointer;min-height:44px;margin:0 auto;padding:10px}.diff-footer{text-align:center;font-size:12px;color:#c1b0d4;line-height:1.6;margin:20px 0 0}.diff-paused{display:grid;place-content:center;min-height:400px;text-align:center;background:#ffffff09;border:1px dashed #c6a9df66;border-radius:20px}.diff-paused h2,.diff-complete h2{color:#fff}.diff-complete{max-width:760px;margin:25px auto;text-align:center}.diff-complete ol{text-align:left;padding:20px 20px 20px 42px;border:1px solid #ffffff20;border-radius:16px;background:#ffffff0b;line-height:1.8}.diff-complete li{padding:4px 0}.diff-complete li span{display:inline-block;font-size:11px;background:#ffffff14;padding:1px 7px;border-radius:6px;margin-left:6px;color:#e6d4f1}.diff-next{font:inherit;font-weight:800;min-height:50px;padding:14px 28px;border:0;border-radius:12px;background:#ffda91;color:#372246;cursor:pointer}.diff-result{max-width:760px;margin:auto;padding:clamp(24px,5vw,50px);text-align:center;background:linear-gradient(140deg,#fff9ea,#f3edff)}.diff-result h1{font-size:clamp(28px,4vw,42px);line-height:1.2}.diff-total{font-size:64px;font-weight:900;color:#6536af;margin:24px 0}.diff-total small{font-size:18px}.diff-result ul{padding:0;list-style:none;text-align:left;margin:24px 0}.diff-result li{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:14px 0;border-bottom:1px solid #ddcdea}.diff-result li span{font-size:13px}.diff-result .primary,.diff-result .secondary{display:inline-block;min-height:46px;margin:8px}.diff-result>p{color:#705c82;font-size:13px}.diff-wrap :focus-visible{outline:3px solid #ffc867;outline-offset:4px}.diff-picture:focus-visible{outline:3px solid #fff0ae;outline-offset:4px}
@media(max-width:620px){.diff-stage{padding:18px 12px;border-radius:18px}.diff-pair{gap:10px}.diff-pair figcaption{font-size:11px;gap:5px}.diff-picture{border-radius:8px}.diff-progress{gap:10px}.diff-progress>div{gap:5px}.diff-progress>div span{width:25px;height:25px}.diff-tool{font-size:13px;padding:9px 12px}.diff-tools{gap:8px}.diff-intro{font-size:14px}.diff-complete ol{font-size:14px}.diff-total small{display:block}.diff-paused{min-height:250px}}
@media(prefers-reduced-motion:reduce){.diff-wrap *{animation:none!important;transition:none!important}}
body.fq-high-contrast .diff-stage{background:#100d1d}body.fq-high-contrast .diff-tool{border-color:#fff}body.fq-large-text .diff-wrap{font-size:18px}

.diff-setting-note{text-align:center;color:#d7c1ed;font-size:12px;line-height:1.5;margin:0 auto 16px}
