:root{--color-bg:#fdf0d0;--color-bg-alt:#f5e0b0;--color-surface:#fffcf0d9;--color-surface-solid:#fff9;--color-surface-hover:#ffffffd9;--color-text:#3d1800;--color-text-muted:#9b6a30;--color-text-soft:#6b4010;--color-primary:#5c2d00;--color-accent:#8b4513;--color-accent-light:#c0703a;--color-accent-warm:#7a3a0e;--color-border:#b4823c59;--color-border-strong:#b4823c99;--color-shadow:#643c001f;--color-shadow-deep:#8b45134d;--color-canvas-bg:#fffcf0d9;--color-canvas-border:#b4823c66;--color-ghost:#8b5a2b2e;--color-btn-clear-bg:#dcb4784d;--color-btn-nav-bg:#fff9;--color-btn-showme-bg:#8b45131a;--color-btn-ai-bg:linear-gradient(135deg, #8b4513, #c0703a);--color-btn-alpha-bg:#ffffff80;--color-btn-alpha-hover:#fff8e6f2;--color-dot-complete:#5a9e4e;--color-dot-started:#c0703a;--color-offline-bg:#b4823c33;--color-feedback-error-bg:#ffebebe6;--color-feedback-error-border:#c8646466;--color-feedback-error-text:#8b2000;--color-star-filled:#c0703a;--color-star-empty:#b4823c40;--color-form-active-bg:linear-gradient(150deg, #7a3a0e, #c0703a);--color-input-bg:#fffcf0e6;--color-progress-badge-bg:#b4823c26;--color-scrollbar-thumb:#8b5a2b59;--color-scrollbar-thumb-hover:#8b5a2b99;--color-outline:#c0703a;--color-gradient-start:#fdf0d0;--color-gradient-mid:#f5e0b0;--color-gradient-end:#eedfa8;--color-link:#8b4513;--color-card-bg:#ffffffb3}[data-theme=dark]{--color-bg:#1a0e05;--color-bg-alt:#2b1508;--color-surface:#231205e0;--color-surface-solid:#231205bf;--color-surface-hover:#371c08e0;--color-text:#f5e0b0;--color-text-muted:#c0905a;--color-text-soft:#d4a870;--color-primary:#e8c89a;--color-accent:#c0703a;--color-accent-light:#d4905a;--color-accent-warm:#a0602a;--color-border:#c0703a59;--color-border-strong:#c0703a99;--color-shadow:#0006;--color-shadow-deep:#00000080;--color-canvas-bg:#1e0f04e6;--color-canvas-border:#c0703a73;--color-ghost:#c0703a26;--color-btn-clear-bg:#3c1e0a80;--color-btn-nav-bg:#32190899;--color-btn-showme-bg:#32190866;--color-btn-ai-bg:linear-gradient(135deg, #7a3a0e, #c0703a);--color-btn-alpha-bg:#3219088c;--color-btn-alpha-hover:#46230ce6;--color-dot-complete:#6abf5e;--color-dot-started:#d4905a;--color-offline-bg:#3c1e0a80;--color-feedback-error-bg:#320f0fe6;--color-feedback-error-border:#c8505066;--color-feedback-error-text:#e88080;--color-star-filled:#d4905a;--color-star-empty:#c0703a4d;--color-form-active-bg:linear-gradient(150deg, #8b4513, #d4905a);--color-input-bg:#1e0f04e6;--color-progress-badge-bg:#c0703a33;--color-scrollbar-thumb:#c0703a66;--color-scrollbar-thumb-hover:#c0703aa6;--color-outline:#d4905a;--color-gradient-start:#1a0e05;--color-gradient-mid:#2b1508;--color-gradient-end:#231008;--color-link:#d4905a;--color-card-bg:#231205cc}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{background:var(--color-bg);transition:background .2s}html[lang=ar] body,[data-locale=ar] body{direction:rtl}.skip-link{background:var(--color-accent);color:#fff8ee;z-index:9999;border-radius:0 0 8px 8px;padding:8px 16px;font-family:Georgia,serif;font-size:14px;text-decoration:none;transition:top .15s;position:absolute;top:-100%;left:50%;transform:translate(-50%)}.skip-link:focus{outline:2px solid var(--color-outline);outline-offset:2px;top:0}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--color-scrollbar-thumb);border-radius:99px}::-webkit-scrollbar-thumb:hover{background:var(--color-scrollbar-thumb-hover)}button{cursor:pointer;transition:opacity .12s,transform .1s,box-shadow .12s,background .12s,color .15s}button:active:not(:disabled){transform:scale(.96)}button:disabled{cursor:not-allowed}.btn-nav:hover:not(:disabled){box-shadow:0 2px 8px var(--color-shadow-deep);background:var(--color-surface-hover)!important}.btn-nav:focus-visible{outline:2px solid var(--color-outline);outline-offset:2px}.btn-clear:hover:not(:disabled){background:var(--color-btn-clear-bg)!important}.btn-clear:focus-visible{outline:2px solid var(--color-outline);outline-offset:2px}.btn-ai:hover:not(:disabled){filter:brightness(1.08);box-shadow:0 4px 18px var(--color-shadow-deep)!important}.btn-ai:focus-visible{outline:2px solid var(--color-outline);outline-offset:2px}.btn-form:hover:not(:disabled){background:var(--color-surface-hover)!important;border-color:var(--color-border-strong)!important}.btn-form:focus-visible{outline:2px solid var(--color-outline);outline-offset:2px}.btn-alpha:hover:not(:disabled){transform:scale(1.12);background:var(--color-btn-alpha-hover)!important;border-color:var(--color-border-strong)!important}.btn-alpha:focus-visible{outline:2px solid var(--color-outline);outline-offset:2px}.btn-gear:hover{color:var(--color-primary)!important}.btn-gear:focus-visible{outline:2px solid var(--color-outline);outline-offset:2px;border-radius:4px}.btn-panel:hover{background:var(--color-surface-hover)!important}.btn-panel:focus-visible,select:focus-visible{outline:2px solid var(--color-outline);outline-offset:2px}input[type=range]{accent-color:var(--color-accent)}input[type=range]:focus-visible{outline:2px solid var(--color-outline);outline-offset:3px;border-radius:4px}.btn-history:hover{color:var(--color-primary)!important}.btn-history:focus-visible{outline:2px solid var(--color-outline);outline-offset:2px;border-radius:4px}.btn-theme:hover{border-color:var(--color-border-strong)!important;background:var(--color-surface-hover)!important}.btn-theme:focus-visible{outline:2px solid var(--color-outline);outline-offset:2px;border-radius:8px}.btn-swatch:hover{transform:scale(1.15)}.btn-swatch:focus-visible{outline:2px solid var(--color-outline);outline-offset:2px;border-radius:50%}.affiliate-link:hover{background:var(--color-surface-hover)!important;border-color:var(--color-border-strong)!important}.affiliate-link:focus-visible{outline:2px solid var(--color-outline);outline-offset:2px;border-radius:8px}.analytics-heat-btn:hover{box-shadow:0 2px 8px var(--color-shadow-deep);transform:scale(1.08)}.analytics-heat-btn:focus-visible{outline:2px solid var(--color-outline);outline-offset:2px;border-radius:8px}@media (width<=399px){.practice-root{gap:6px!important;padding:10px 8px 24px!important}.alpha-row-wrap{overflow-x:auto;flex-wrap:nowrap!important;justify-content:flex-start!important;max-width:100%!important;padding:6px 4px!important}.alpha-row-wrap::-webkit-scrollbar{height:0}.canvas-max{max-width:100%!important}.btn{padding:8px 12px!important;font-size:13px!important}.info-bar{padding:6px 10px!important}.form-switcher{gap:6px!important}}@media (width>=400px) and (width<=639px){.practice-root{padding:14px 10px 28px!important}.canvas-max{max-width:100%!important}}@media (width>=640px) and (width<=899px){.practice-root{padding:16px 20px 36px!important}.canvas-max{max-width:min(480px,100%)!important}}@media (width>=900px){.practice-root{padding:20px 24px 48px!important}}@keyframes scorePop{0%{opacity:0;transform:scale(.5)}40%{opacity:1;transform:scale(1.4)}to{opacity:0;transform:scale(1)}}.score-celebrate{color:var(--color-star-filled);pointer-events:none;z-index:1000;font-size:64px;animation:.8s ease-out forwards scorePop;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}@media (prefers-reduced-motion:reduce){.score-celebrate{opacity:0;animation:none}}[data-reduced-motion=true] *,[data-reduced-motion=true] :before,[data-reduced-motion=true] :after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}[data-reduced-motion=true] .score-celebrate{opacity:0;animation:none}[data-high-contrast=true]{--color-bg:#fff;--color-bg-alt:#fff;--color-surface:#fff;--color-surface-solid:#fff;--color-surface-hover:#f0f0f0;--color-text:#000;--color-text-muted:#000;--color-text-soft:#000;--color-primary:#000;--color-accent:#000;--color-accent-light:#000;--color-accent-warm:#000;--color-border:#000;--color-border-strong:#000;--color-shadow:#00000080;--color-shadow-deep:#000c;--color-canvas-bg:#fff;--color-canvas-border:#000;--color-ghost:#00000073;--color-btn-clear-bg:#fff;--color-btn-nav-bg:#fff;--color-btn-showme-bg:#fff;--color-btn-ai-bg:#000;--color-btn-alpha-bg:#fff;--color-btn-alpha-hover:#f0f0f0;--color-dot-complete:#000;--color-dot-started:#000;--color-offline-bg:#fff;--color-feedback-error-bg:#fff;--color-feedback-error-border:#000;--color-feedback-error-text:#000;--color-star-filled:#000;--color-star-empty:#00000059;--color-form-active-bg:#000;--color-input-bg:#fff;--color-progress-badge-bg:#fff;--color-scrollbar-thumb:#000;--color-scrollbar-thumb-hover:#000;--color-outline:#000;--color-gradient-start:#fff;--color-gradient-mid:#fff;--color-gradient-end:#fff;--color-link:#000;--color-card-bg:#fff}[data-theme=dark][data-high-contrast=true]{--color-bg:#000;--color-bg-alt:#000;--color-surface:#000;--color-surface-solid:#000;--color-surface-hover:#1a1a1a;--color-text:#fff;--color-text-muted:#fff;--color-text-soft:#fff;--color-primary:#fff;--color-accent:#fff;--color-accent-light:#fff;--color-accent-warm:#fff;--color-border:#fff;--color-border-strong:#fff;--color-shadow:#00000080;--color-shadow-deep:#000c;--color-canvas-bg:#000;--color-canvas-border:#fff;--color-ghost:#ffffff73;--color-btn-clear-bg:#000;--color-btn-nav-bg:#000;--color-btn-showme-bg:#000;--color-btn-ai-bg:#fff;--color-btn-alpha-bg:#000;--color-btn-alpha-hover:#1a1a1a;--color-dot-complete:#fff;--color-dot-started:#fff;--color-offline-bg:#000;--color-feedback-error-bg:#000;--color-feedback-error-border:#fff;--color-feedback-error-text:#fff;--color-star-filled:#fff;--color-star-empty:#ffffff59;--color-form-active-bg:#fff;--color-input-bg:#000;--color-progress-badge-bg:#000;--color-scrollbar-thumb:#fff;--color-scrollbar-thumb-hover:#fff;--color-outline:#fff;--color-gradient-start:#000;--color-gradient-mid:#000;--color-gradient-end:#000;--color-link:#fff;--color-card-bg:#000}