html[data-page="practice"] .official-tool{--color-bg-surface-1:#152c30;--color-bg-surface-2:#203c40;--color-text-primary:#f0faf5;--color-text-secondary:#bbd5ce;--color-brand-primary:#b8e879;--color-brand-alpha-20:#476854;max-width:1000px}
html[data-page="practice"][data-world-theme="day"] .official-tool{--color-bg-surface-1:#f8fff6;--color-bg-surface-2:#e7f2e3;--color-text-primary:#173e32;--color-text-secondary:#436352;--color-brand-primary:#345f24;--color-brand-alpha-20:#99b79b}
[data-page="practice"] .official-tool .section-dark{background:transparent}
[data-page="practice"] .official-tool :is(p,span,label,select,button,small){font-family:Arial,sans-serif!important}
[data-page="practice"] :is(.pa-card,.pa-quiz,.pa-result){background:var(--color-bg-surface-1)!important;border:2px solid var(--color-brand-alpha-20);border-radius:16px;padding:clamp(20px,4vw,40px);box-shadow:0 8px 0 #102a2520;color:var(--color-text-primary)}
[data-page="practice"] .pa-q__text{font:600 clamp(22px,3vw,30px)/1.45 Arial,sans-serif!important;color:var(--color-text-primary);margin:24px 0}
[data-page="practice"] .pa-opts{display:grid;grid-template-columns:1fr 1fr;gap:12px}
[data-page="practice"] .pa-opt{min-height:76px;text-align:left;background:var(--color-bg-surface-2);color:var(--color-text-primary);border:2px solid var(--color-brand-alpha-20);border-radius:10px;padding:16px;line-height:1.5}
[data-page="practice"] .pa-opt:disabled{opacity:1}
[data-page="practice"] .pa-opt.is-correct{background:#d9f6dc!important;color:#164a29!important;border-color:#398854!important}
[data-page="practice"] .pa-opt.is-wrong{background:#fff0e3!important;color:#783d19!important;border-color:#c87844!important;animation:arena-nudge .4s ease}
[data-page="practice"] .pa-explain{font:16px/1.7 Arial!important;background:var(--color-bg-surface-2)!important;color:var(--color-text-primary)!important;padding:20px;border-radius:10px;margin-top:20px}
[data-page="practice"] .pa-quiz__actions{margin-top:24px;gap:16px}
[data-page="practice"] .pa-chip{min-height:48px}
.arena-guide{position:relative;display:flex;align-items:center;gap:20px;margin-top:28px;min-height:140px}
.arena-guide>img{width:120px;height:120px;object-fit:contain;flex-shrink:0;filter:drop-shadow(0 8px 6px #0002)}
.arena-bubble{position:relative;border:2px solid var(--color-brand-alpha-20);background:var(--color-bg-surface-2);color:var(--color-text-primary);border-radius:20px 20px 20px 2px;padding:18px 22px;flex:1}
.arena-bubble strong{font:600 17px/1.5 Arial}.arena-bubble p{font:15px/1.6 Arial;margin:6px 0 0;min-height:72px}
.arena-guide[data-state="correct"]>img{animation:arena-cheer .75s ease both}
.arena-guide[data-state="wrong"]>img{animation:arena-think .8s ease both}
.arena-sparks{position:absolute;left:60px;top:35px;pointer-events:none}.arena-sparks i{position:absolute;width:7px;height:7px;background:#d9ad45;animation:arena-spark .9s ease-out both}
@keyframes arena-cheer{0%,100%{transform:translateY(0) rotate(0)}35%{transform:translateY(-22px) rotate(-9deg)}65%{transform:translateY(-5px) rotate(7deg)}}
@keyframes arena-think{0%{transform:translateX(-10px);opacity:0}60%{transform:rotate(-7deg)}100%{transform:none;opacity:1}}
@keyframes arena-spark{from{transform:translate(0,0);opacity:1}to{transform:translate(var(--x),-85px) rotate(var(--r));opacity:0}}
@keyframes arena-nudge{25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}
@media(max-width:600px){[data-page="practice"] .pa-opts{grid-template-columns:1fr}.arena-guide{gap:10px;align-items:flex-start}.arena-guide>img{width:76px;height:96px}.arena-bubble{padding:14px}.arena-bubble p{min-height:120px}.arena-sparks{left:38px}}
@media(prefers-reduced-motion:reduce){[data-page="practice"] *,[data-page="practice"] *:before{animation:none!important;transition:none!important}}

[data-page=practice] .pa-quiz__actions{display:flex;justify-content:space-between;flex-wrap:wrap}[data-page=practice] .pa-quiz__actions .btn{flex:0 1 auto;width:auto;min-width:120px;max-width:100%;padding:14px 24px}[data-page=practice] .pa-explain strong{font-family:Arial,sans-serif!important}

.arena-feedback-overlay{position:fixed;inset:0;margin:auto;width:min(620px,calc(100vw - 32px));max-height:85dvh;overflow:auto;padding:28px;border:2px solid var(--color-brand-alpha-20);border-radius:24px;background:var(--color-bg-surface-1);color:var(--color-text-primary);box-shadow:0 24px 100px #0006}.arena-feedback-overlay::backdrop{background:#081720aa;backdrop-filter:blur(5px)}.arena-feedback-overlay[open]{animation:arena-arrive .3s ease-out}.arena-feedback-overlay .arena-guide{margin:0;min-height:170px}.arena-feedback-overlay .arena-bubble p{min-height:96px}.arena-feedback-close{display:block;margin:24px 0 0 auto;padding:14px 24px;border:0;border-radius:10px;background:#b8e879;color:#173e32;font:700 16px Arial;cursor:pointer}.arena-feedback-close:focus-visible{outline:3px solid var(--color-text-primary);outline-offset:4px}@keyframes arena-arrive{from{opacity:0;transform:translateY(20px) scale(.96)}to{opacity:1;transform:none}}@media(max-width:600px){.arena-feedback-overlay{padding:20px}.arena-feedback-overlay .arena-guide{flex-direction:column;align-items:center}.arena-feedback-overlay .arena-guide>img{width:110px;height:110px}.arena-feedback-overlay .arena-bubble{width:100%;box-sizing:border-box}.arena-feedback-close{width:100%}}

.arena-feedback-actions{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:10px;margin-top:24px}.arena-feedback-actions .arena-feedback-close{margin:0}.arena-feedback-actions [data-dismiss]{background:transparent;color:var(--color-text-primary);border:1px solid var(--color-brand-alpha-20)}.arena-feedback-actions [hidden]{display:none!important}

html.pixel-world dialog.arena-feedback-overlay:not([open]){display:none!important}html.pixel-world dialog.arena-feedback-overlay[open]{display:block;border:2px solid var(--color-brand-alpha-20);border-radius:24px;background:var(--color-bg-surface-1);box-shadow:0 24px 100px #0006}
