.typing-app-grid{display:grid;grid-template-columns:1fr;grid-template-areas:"game" "leaderboard" "ad";gap:calc(var(--spacing-unit) * 2)}.game-header{text-align:center;margin-bottom:1.5rem}.game-title{font-size:2.2rem;font-weight:700;color:var(--color-text-primary);margin:0 0 .5rem 0}@media(max-width:480px){.game-title{font-size:1.6rem;word-break:break-word;hyphens:auto}}.game-subtitle{font-size:1.1rem;color:var(--color-text-secondary);max-width:600px;margin:0 auto}.game-content-column{display:flex;flex-direction:column;gap:calc(var(--spacing-unit) * 1);min-width:0;grid-area:game}.leaderboard-area{grid-area:leaderboard;min-width:0}.game-ad-section{grid-area:ad;display:flex;justify-content:center;align-items:center;margin-top:0}.game-ad-section .homepage-ad-wrapper{margin:0 auto}@media(max-width:1023px){.game-ad-section{margin-top:max(calc(var(--spacing-unit) * 4),100vh)}}@media(min-width:1024px){.typing-app-grid{grid-template-columns:minmax(0,2.8fr) minmax(320px,1.2fr);grid-template-areas:"game leaderboard" "game ad"}.game-ad-section{align-self:start;margin-top:calc(var(--spacing-unit) * 2)}}@media(min-width:1280px){.typing-app-grid{grid-template-columns:minmax(0,3fr) minmax(340px,1fr)}.game-ad-section{margin-top:calc(var(--spacing-unit) * 1.5)}}@media(min-width:1440px){.typing-app-grid{grid-template-columns:minmax(0,3.2fr) minmax(360px,1fr)}}.settings-container{display:flex;flex-wrap:wrap;gap:var(--spacing-unit);align-items:stretch}.setting-item{display:flex;flex-direction:column;justify-content:flex-start;gap:calc(var(--spacing-unit) * .25);flex-grow:1;flex-basis:220px;min-width:200px}.setting-help{margin:0;font-size:.8rem;color:var(--color-text-tertiary);line-height:1.4}.setting-help+.setting-help{margin-top:calc(var(--spacing-unit) * .25)}.setting-item select+.setting-help{margin-top:calc(var(--spacing-unit) * .15)}.setting-item label{font-weight:500;color:var(--color-text-secondary);font-size:.85rem;margin-bottom:0;display:flex;align-items:center;gap:.3em}.setting-item label .icon{color:var(--color-icon-settings);transition:color .3s ease}.setting-item select,.setting-item input[type="text"]{width:100%;padding:calc(var(--spacing-unit) * .45) calc(var(--spacing-unit) * .7);font-size:.9rem}.wordlist-selector.setting-item{}#wordlistFilterInput{width:100%;margin-bottom:calc(var(--spacing-unit) * .5);padding:calc(var(--spacing-unit) * .4) calc(var(--spacing-unit) * .6);font-size:.85rem}.additional-options{display:flex;flex-wrap:wrap;gap:var(--spacing-unit);align-items:center;padding:calc(var(--spacing-unit) * .5) var(--spacing-unit);background-color:var(--color-surface-card);border:1px solid var(--color-border-primary);border-radius:var(--border-radius-base);transition:background-color .3s ease,border-color .3s ease}.homepage-ad-wrapper{margin:calc(var(--spacing-unit) * 1.5) auto 0;padding:calc(var(--spacing-unit) * 1.5) 0;text-align:center;width:100%;max-width:380px}.homepage-ad-wrapper.homepage-ad-wrapper--bottom{max-width:728px}.homepage-ad-wrapper>*{display:inline-block}@media(max-width:768px){.homepage-ad-wrapper{width:100%;padding:calc(var(--spacing-unit) * 1.25) 0;margin-top:calc(var(--spacing-unit) * 2)}}.modal-stat{position:relative}.modal-stat-label{display:inline-flex;align-items:center;gap:.45rem}.modal-stat-label__icon{display:inline-flex;align-items:center;justify-content:center;font-size:1.05rem;line-height:1;color:color-mix(in srgb,var(--color-primary-base,#2563eb) 72%,var(--color-text-secondary,#475569));filter:drop-shadow(0 8px 16px color-mix(in srgb,currentColor 26%,transparent));flex-shrink:0}[data-theme="dark"] .modal-stat-label__icon{color:color-mix(in srgb,var(--color-primary-text-on-base,#e2e8f0) 86%,#93c5fd);filter:drop-shadow(0 10px 18px color-mix(in srgb,currentColor 28%,transparent))}.modal-stat-info{display:inline-flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;border:none;border-radius:50%;background:transparent;color:var(--color-text-tertiary,#64748b);cursor:pointer;padding:0;transition:color .2s ease,background-color .2s ease}.modal-stat-info[aria-expanded="true"]{color:var(--color-primary-strong,#1d4ed8);background-color:color-mix(in srgb,var(--color-primary-base,#2563eb) 20%,transparent)}.modal-stat-info .icon{font-size:.95rem}.modal-stat-info:hover,.modal-stat-info:focus{color:var(--color-primary-base,#2563eb);background-color:var(--color-surface-highlight,rgba(37,99,235,0.12))}.modal-stat-info:focus-visible{outline:2px solid var(--color-primary-strong,#2563eb);outline-offset:2px}.modal-stat-help{--popover-arrow-size:10px;--popover-hidden-offset:-0.35rem;--popover-top:0;--popover-left:0;--popover-arrow-left:50%;position:absolute;top:var(--popover-top);left:var(--popover-left);transform:translate3d(-50%,var(--popover-hidden-offset),0);font-size:.85rem;line-height:1.4;color:var(--color-text-secondary,#475569);background:var(--color-surface-card,#fff);border:1px solid var(--color-border-subtle,rgba(148,163,184,0.4));border-radius:var(--border-radius-small,8px);padding:.6rem .75rem;box-shadow:0 12px 24px rgba(15,23,42,0.16);max-width:min(360px,calc(100vw - 32px));width:max-content;box-sizing:border-box;opacity:0;visibility:hidden;pointer-events:none;z-index:30;margin:0;transition:opacity .18s ease,transform .18s ease}.modal-stat-help::after{content:"";position:absolute;width:var(--popover-arrow-size);height:var(--popover-arrow-size);background:var(--color-surface-card,#fff);border-left:1px solid var(--color-border-subtle,rgba(148,163,184,0.4));border-top:1px solid var(--color-border-subtle,rgba(148,163,184,0.4));transform:translate(-50%,0) rotate(45deg);left:var(--popover-arrow-left);z-index:-1;box-shadow:0 6px 12px rgba(15,23,42,0.12)}.modal-stat-help[data-placement="bottom"]::after{top:calc(-0.5 * var(--popover-arrow-size))}.modal-stat-help[data-placement="top"]{--popover-hidden-offset:.35rem}.modal-stat-help[data-placement="top"]::after{bottom:calc(-0.5 * var(--popover-arrow-size));border-left:none;border-top:none;border-right:1px solid var(--color-border-subtle,rgba(148,163,184,0.4));border-bottom:1px solid var(--color-border-subtle,rgba(148,163,184,0.4));box-shadow:0 6px 12px rgba(15,23,42,0.12)}.modal-stat-help.is-visible{opacity:1;visibility:visible;pointer-events:auto;transform:translate3d(-50%,0,0)}@media(prefers-reduced-motion:reduce){.modal-stat-help{transition:opacity .01ms linear;transform:translate3d(-50%,0,0)}.modal-stat-help.is-visible{transform:translate3d(-50%,0,0)}}@media(max-width:575px){.modal-stat-help{position:static;display:none;width:100%;max-width:100%;transform:none;opacity:1;visibility:visible;pointer-events:auto;margin-top:calc(var(--spacing-unit) * .5);box-shadow:none;transition:none;z-index:auto}.modal-stat-help.is-visible{display:block;transform:none}.modal-stat-help::after{display:none}}.sound-controls-wrapper{display:flex;align-items:center;gap:calc(var(--spacing-unit) * .75);flex-wrap:wrap;flex-grow:1}#soundToggleBtn{border:1px solid var(--color-border-primary);color:var(--color-text-secondary);border-radius:50%;width:38px;height:38px;font-size:1rem;transition:all .2s;display:flex;justify-content:center;align-items:center;padding:0;background:transparent}#soundToggleBtn:hover{background-color:var(--color-surface-highlight);color:var(--color-primary-base);border-color:var(--color-primary-base)}#soundToggleBtn.sound-on{color:var(--color-primary-base);border-color:var(--color-primary-base);background-color:var(--color-surface-highlight)}#soundToggleBtn:focus-visible{box-shadow:0 0 0 3px color-mix(in srgb,var(--color-primary-base) 25%,transparent)}#soundToggleBtn:disabled{opacity:.5;cursor:not-allowed}#soundToggleBtn:disabled:hover{background-color:transparent;color:var(--color-text-secondary);border-color:var(--color-border-primary)}.individual-sound-controls{display:flex;align-items:center;gap:calc(var(--spacing-unit) * .6);flex-wrap:wrap;padding:calc(var(--spacing-unit) * .2) calc(var(--spacing-unit) * .4);transition:opacity .3s ease,max-height .3s ease,visibility .3s ease;overflow:hidden;max-height:0;opacity:0;visibility:hidden}.individual-sound-controls.visible{max-height:200px;opacity:1;visibility:visible}.sound-settings-label{font-size:.8rem;color:var(--color-text-secondary);margin-right:calc(var(--spacing-unit) * .3);font-weight:500;flex-shrink:0}.sound-toggle-item{display:flex;align-items:center;gap:calc(var(--spacing-unit) * .45)}.sound-toggle-item input[type="checkbox"]{cursor:pointer;margin:0;width:1.6rem;height:1.6rem;flex-shrink:0;accent-color:var(--color-primary-base)}.sound-toggle-item label{font-size:.85rem;color:var(--color-text-primary);cursor:pointer;user-select:none;transition:color .3s ease}.wpm-graph-toggle{display:flex;align-items:center;gap:.4rem;font-size:.85rem;cursor:pointer;flex-shrink:0;padding:calc(var(--spacing-unit) * .3) calc(var(--spacing-unit) * .5);border-radius:var(--border-radius-small);transition:background-color .2s ease}.wpm-graph-toggle:hover{background-color:var(--color-surface-highlight)}.wpm-graph-toggle input[type="checkbox"]{cursor:pointer;margin:0;width:15px;height:15px;accent-color:var(--color-primary-base)}.wpm-graph-toggle label{cursor:pointer;user-select:none;color:var(--color-text-secondary);font-weight:500;transition:color .3s ease}.wpm-graph-toggle:hover label{color:var(--color-primary-base)}.leaderboard-more-link{display:block;margin:calc(var(--spacing-unit) * .5) 0 calc(var(--spacing-unit) * 1);text-align:right;font-weight:500;color:var(--color-primary-base);text-decoration:none;transition:color .2s ease,text-decoration-color .2s ease}.leaderboard-filter-note{display:inline-flex;align-items:center;gap:calc(var(--spacing-unit) * .5);margin:calc(var(--spacing-unit) * .6) 0 calc(var(--spacing-unit) * 1.1);padding:calc(var(--spacing-unit) * .6) calc(var(--spacing-unit) * .9);border-radius:var(--border-radius-medium,14px);background-color:var(--color-state-info-bg);color:var(--color-state-info,#1d4ed8);background-color:color-mix(in srgb,var(--color-state-info-bg) 82%,transparent);color:color-mix(in srgb,var(--color-state-info) 92%,var(--color-text-primary));font-size:.9rem;line-height:1.4}.leaderboard-filter-note .icon{color:inherit;font-size:1rem}[data-theme="dark"] .leaderboard-filter-note{background-color:var(--color-state-info-bg);color:var(--color-primary-text-on-base);background-color:color-mix(in srgb,var(--color-state-info-bg) 30%,transparent);color:color-mix(in srgb,var(--color-state-info) 85%,var(--color-primary-text-on-base))}.filter-chip{appearance:none;border:1px solid var(--color-border-primary);background-color:var(--color-surface-card);color:var(--color-text-secondary);font-size:.85rem;font-weight:600;border-radius:999px;padding:calc(var(--spacing-unit) * .3) calc(var(--spacing-unit) * .9);cursor:pointer;transition:background-color .2s ease,border-color .2s ease,color .2s ease,box-shadow .2s ease}.filter-chip:hover,.filter-chip:focus-visible{background-color:var(--color-surface-highlight);border-color:color-mix(in srgb,var(--color-primary-base) 65%,white);color:var(--color-text-primary)}.filter-chip:focus-visible{outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--color-primary-base) 30%,transparent)}.filter-chip--active{background-color:var(--color-primary-base);border-color:var(--color-primary-base);color:var(--color-primary-text-on-base)}.filter-chip--active:hover,.filter-chip--active:focus-visible{background-color:var(--color-primary-hover);border-color:var(--color-primary-hover);color:var(--color-primary-text-on-base)}@supports(background-color:color-mix(in srgb,red 50%,white)){.filter-chip--active{background-color:color-mix(in srgb,var(--color-primary-base) 92%,var(--color-surface-card) 8%);border-color:color-mix(in srgb,var(--color-primary-base) 88%,var(--color-surface-card) 12%)}.filter-chip--active:hover,.filter-chip--active:focus-visible{background-color:color-mix(in srgb,var(--color-primary-base) 85%,var(--color-surface-card) 15%);border-color:color-mix(in srgb,var(--color-primary-base) 80%,var(--color-surface-card) 20%)}}.filter-chip:disabled{cursor:not-allowed;opacity:.6;box-shadow:none}.leaderboard-more-link:hover,.leaderboard-more-link:focus-visible{color:color-mix(in srgb,var(--color-primary-base) 90%,black);text-decoration:underline}@media(max-width:600px){.leaderboard-more-link{text-align:left}.leaderboard-filter-note{flex-direction:row;align-items:flex-start}}#stats{position:relative}.stats-bar{position:relative;display:grid;grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));gap:calc(var(--spacing-unit) * .75);align-items:stretch;padding:calc(var(--spacing-unit) * .8);background-color:color-mix(in srgb,var(--color-surface-card,#fff) 94%,transparent);overflow:hidden;isolation:isolate}.stats-bar::before{content:"";position:absolute;inset:0;background-image:linear-gradient(135deg,color-mix(in srgb,var(--color-primary-base,#2563eb) 14%,transparent) 25%,transparent 25%),linear-gradient(135deg,transparent 75%,color-mix(in srgb,var(--color-primary-base,#2563eb) 12%,transparent) 75%);background-size:26px 26px;opacity:.12;pointer-events:none;z-index:0}.stat-item{position:relative;z-index:1;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:calc(var(--spacing-unit) * .6);row-gap:calc(var(--spacing-unit) * .35);align-items:center;padding:calc(var(--spacing-unit) * .55) calc(var(--spacing-unit) * .8);font-size:.95rem;font-weight:500;color:var(--color-text-secondary);border-radius:var(--border-radius-medium,14px);background-color:color-mix(in srgb,var(--color-surface-card,#fff) 96%,transparent);box-shadow:0 1px 2px rgba(15,23,42,0.08);min-width:0}.stat-content{display:inline-flex;align-items:baseline;gap:.35rem;min-width:0}.stat-label{font-weight:600;color:var(--color-text-secondary)}.stat-value{display:inline-flex;align-items:baseline;color:var(--color-text-primary);font-weight:600;min-width:0}.stat-value span[id]{min-width:2.5ch;text-align:right}.stat-separator{color:color-mix(in srgb,var(--color-text-secondary,#475569) 80%,transparent)}.stat-icon{grid-row:1 / span 2;display:inline-flex;align-items:center;justify-content:center;width:2.4rem;height:2.4rem;border-radius:50%;background:color-mix(in srgb,var(--color-primary-base,#2563eb) 18%,transparent);color:var(--color-primary-base,#2563eb);box-shadow:0 6px 16px rgba(15,23,42,0.12);transition:transform .2s ease-out,box-shadow .3s ease}.stat-icon .icon{font-size:1.1rem}.stat-item[data-metric="accuracy"] .stat-icon{background:color-mix(in srgb,var(--color-state-success,#16a34a) 22%,transparent);color:var(--color-state-success,#16a34a)}.stat-item[data-metric="wpm"] .stat-icon{background:color-mix(in srgb,var(--color-primary-strong,#2563eb) 24%,transparent);color:var(--color-primary-strong,#2563eb)}.stat-item[data-metric="streak"] .stat-icon{background:color-mix(in srgb,var(--color-streak,#f97316) 26%,transparent);color:var(--color-streak,#f97316)}.stat-meter{--stat-meter-progress:0;--stat-meter-fill-color:var(--color-primary-base,#2563eb);position:relative;grid-column:1 / -1;display:block;width:100%;height:.4rem;border-radius:999px;background:color-mix(in srgb,var(--color-border-subtle,rgba(148,163,184,0.4)) 60%,transparent);overflow:hidden;pointer-events:none}.stat-meter .stat-meter-fill{display:block;width:100%;height:100%;background:var(--stat-meter-fill-color);transform-origin:left;transform:scaleX(var(--stat-meter-progress));transition:transform .35s ease,background-color .3s ease,opacity .3s ease}.stat-meter[data-metric="accuracy"]{--stat-meter-fill-color:var(--color-state-success,#16a34a)}.stat-meter[data-metric="wpm"]{--stat-meter-fill-color:var(--color-primary-strong,#2563eb)}.stat-meter[data-metric="streak"]{--stat-meter-fill-color:var(--color-streak,#f97316)}.stat-meter[data-metric="time"]{--stat-meter-fill-color:var(--color-primary-base,#2563eb)}.stat-meter.is-warning{--stat-meter-fill-color:var(--color-state-warning,#f59e0b)}.stat-meter.is-critical{--stat-meter-fill-color:var(--color-state-danger,#dc2626)}[data-theme="dark"] .stats-bar{background-color:color-mix(in srgb,rgba(15,23,42,0.92) 70%,transparent)}[data-theme="dark"] .stats-bar::before{opacity:.2;background-image:linear-gradient(135deg,color-mix(in srgb,var(--color-primary-base,#2563eb) 28%,transparent) 25%,transparent 25%),linear-gradient(135deg,transparent 75%,color-mix(in srgb,var(--color-primary-base,#2563eb) 24%,transparent) 75%)}[data-theme="dark"] .stat-item{background-color:color-mix(in srgb,rgba(15,23,42,0.88) 78%,transparent);box-shadow:0 1px 2px rgba(15,23,42,0.6)}[data-theme="dark"] .stat-icon{box-shadow:0 10px 20px rgba(15,23,42,0.55)}[data-theme="dark"] .stat-meter{background:color-mix(in srgb,rgba(148,163,184,0.35) 45%,transparent)}#accuracy::after{content:'%';margin-left:.1em}#liveWpmDisplay{min-width:2.5ch}#streak{min-width:1.5ch}.streak-counter{color:var(--color-text-secondary);transition:opacity .3s ease,color .3s ease;opacity:.75}.streak-counter[data-active="true"]{opacity:1;color:var(--color-streak,#f97316)}.streak-counter .streak-icon{transition:transform .2s ease-out,box-shadow .3s ease;transform:scale(1);box-shadow:0 0 0 0 color-mix(in srgb,var(--color-streak,#f97316) 20%,transparent)}.streak-counter[data-active="true"] .streak-icon{transform:scale(1.08);box-shadow:0 0 0 3px color-mix(in srgb,var(--color-streak,#f97316) 24%,transparent)}.streak-pulse{animation:pulse-effect .35s ease-out}@keyframes pulse-effect{0%{transform:scale(1);opacity:1}50%{transform:scale(1.2);opacity:.9}100%{transform:scale(1);opacity:1}}.word-completed-effect{animation:pulse-effect .4s ease-out}#liveWpmGraphContainer{display:none;background-color:var(--color-surface-card);border:1px solid var(--color-border-primary);border-radius:var(--border-radius-base);padding:0;height:30px;box-sizing:border-box;position:relative;overflow:hidden;box-shadow:inset 0 1px 2px rgba(0,0,0,0.1);background-image:linear-gradient(to right,var(--color-border-secondary) 1px,transparent 1px);background-size:25% 100%;background-repeat:repeat-x;transition:opacity .3s ease,background-color .3s ease,border-color .3s ease}#liveWpmGraphBar{position:absolute;left:0;top:0;bottom:0;width:100%;background-color:var(--color-primary-base);border-radius:var(--border-radius-small);opacity:.8;transform:scaleX(0);transform-origin:left;transition:transform .4s linear,background-color .3s ease}@keyframes newMaxPulse{0%,100%{transform:scaleY(1);opacity:.8}50%{transform:scaleY(1.15) scaleX(var(--current-scaleX,1));opacity:1}}.new-max-wpm-pulse{animation:newMaxPulse .5s ease-out;--current-scaleX:inherit}@media(prefers-reduced-motion:reduce){.stat-meter .stat-meter-fill,.stat-icon,.streak-counter .streak-icon{transition:none!important}.streak-pulse,.word-completed-effect,.new-max-wpm-pulse{animation:none!important}}#wpmMaxMarker{position:absolute;top:0;bottom:0;left:0;width:3px;background-color:var(--color-state-danger);opacity:.8;z-index:1;pointer-events:none;display:none;border-radius:1px;box-shadow:0 0 4px var(--color-state-danger);transform:translateX(0%);transition:transform .3s linear,background-color .3s ease}#liveWpmGraphContainer .graph-label{position:absolute;right:10px;top:50%;transform:translateY(-50%);color:var(--color-text-secondary);font-size:.85rem;font-weight:500;z-index:2;text-shadow:1px 1px 1px var(--color-surface-card);transition:color .3s ease,text-shadow .3s ease}.words-container{padding:var(--words-padding-vertical) calc(var(--spacing-unit) * 1.2);font-size:var(--words-font-size);line-height:var(--words-line-height);text-align:left;height:calc(var(--words-font-size) * var(--words-line-height) * 2+2 * var(--words-padding-vertical));overflow-y:hidden;scroll-behavior:auto;position:relative;box-shadow:inset 0 1px 3px var(--color-shadow-default);perspective:500px;-webkit-overflow-scrolling:touch;transition:background-color .3s ease,border-color .3s ease;-webkit-user-select:none;-ms-user-select:none;user-select:none}@keyframes fadeInWord{from{opacity:0}to{opacity:1}}.word-fade-in{opacity:0;animation:fadeInWord .3s ease forwards}.words-container>span{margin-right:.4em;padding:.1em 0;display:inline-block;white-space:nowrap;transition:background-color .2s ease;position:relative}.current-word{background-color:var(--color-surface-highlight);border-radius:var(--border-radius-small);font-weight:500}.correct{color:var(--color-state-success)}.incorrect{color:var(--color-state-danger);background-color:color-mix(in srgb,var(--color-state-danger) 10%,transparent);border-radius:3px}.incorrect-char{background-color:color-mix(in srgb,var(--color-state-danger) 20%,transparent);color:var(--color-state-danger)!important;border-radius:2px;text-decoration:underline wavy var(--color-state-danger) 1px;text-underline-offset:3px}.correct-char{color:var(--color-state-success)!important;background-color:transparent;text-decoration:none}.error-char-bold{font-weight:700!important}.caret{position:absolute;top:.2em;height:calc(var(--words-font-size) * var(--words-line-height) * .60);width:2.5px;background-color:var(--color-primary-base);opacity:1;animation:blink 1.1s infinite;pointer-events:none;border-radius:1px;transition:left 0s,background-color .3s ease;z-index:5;display:none}@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}.caret.space-caret{background-color:var(--color-state-danger);width:5px}#timerBarContainer{width:100%;height:8px;background-color:var(--color-border-secondary);border-radius:var(--border-radius-small);margin-top:5px;overflow:hidden;box-shadow:inset 0 1px 2px var(--color-shadow-default);transition:background-color .3s ease}#timerBarProgress{height:100%;width:100%;background-color:var(--color-primary-base);border-radius:var(--border-radius-small);transform:scaleX(1);transform-origin:left;transition:transform .5s linear,background-color .3s ease}#timerBarProgress.timer-bar-warning{background-color:var(--color-state-warning)}#timerBarProgress.timer-bar-critical{background-color:var(--color-state-danger)}.input-wrapper{position:relative;display:flex;align-items:center;width:100%}#inputBox{flex-grow:1;width:100%;box-sizing:border-box;padding:calc(var(--spacing-unit) * .9);padding-right:calc(var(--spacing-unit) * 7.5);font-size:1.2em}.timer-in-input{position:absolute;right:calc(var(--spacing-unit) * 3.5);top:50%;transform:translateY(-50%);color:var(--color-text-secondary);font-size:1.7em;font-weight:600;padding:0 calc(var(--spacing-unit) * .5);background-color:var(--color-surface-input);pointer-events:none;z-index:1;transition:color .3s ease,background-color .3s ease;white-space:nowrap}.timer-in-input .timer-display{min-width:2ch;text-align:right;display:inline-block}.timer-in-input.timer-warning{color:var(--color-state-warning);font-weight:700}.timer-in-input.timer-critical{color:var(--color-state-danger);font-weight:700}.reload-button{position:absolute;right:calc(var(--spacing-unit) * .6);top:50%;transform:translateY(-50%);background:none;border:none;color:var(--color-text-secondary);font-size:1.6em;padding:calc(var(--spacing-unit) * .5);line-height:1;opacity:.7;transition:color .2s ease,opacity .2s ease,transform .1s ease;display:flex;align-items:center;justify-content:center;z-index:2;cursor:pointer;border-radius:50%}.reload-button:hover:not(:disabled){color:var(--color-primary-base);opacity:1;transform:translateY(-50%) scale(1.1)}.reload-button:focus-visible{box-shadow:0 0 0 3px color-mix(in srgb,var(--color-primary-base) 25%,transparent)}.reload-button:disabled{opacity:.4;cursor:not-allowed;transform:translateY(-50%)}.reload-button i{display:block}@media(max-width:991px){#inputBox{padding-right:calc(var(--spacing-unit) * 7)}.timer-in-input{right:calc(var(--spacing-unit) * 3.2);font-size:1.6em}.reload-button{font-size:1.5em}}@media(max-width:767px){.settings-container{flex-direction:column;align-items:stretch;padding:calc(var(--spacing-unit)*0.8)}.setting-item{flex-basis:auto;min-width:unset}.setting-item select,.setting-item input[type="text"]{font-size:.95rem;padding:calc(var(--spacing-unit) * .6) calc(var(--spacing-unit) * .8)}.additional-options{flex-direction:column;align-items:flex-start;gap:var(--spacing-unit)}.sound-controls-wrapper{width:100%;justify-content:space-between;padding:calc(var(--spacing-unit)*0.4)}.individual-sound-controls{flex-grow:1;justify-content:flex-end;font-size:.8rem;gap:.5rem;padding:.2rem .4rem}.sound-toggle-item label{font-size:.85rem}.wpm-graph-toggle{margin-left:0}.stats-bar{font-size:.9rem;padding:calc(var(--spacing-unit)*0.5);justify-content:center;gap:calc(var(--spacing-unit) * .8)}#liveWpmGraphContainer{height:25px}#liveWpmGraphContainer .graph-label{font-size:.8rem}.caret{height:calc(var(--words-font-size) * var(--words-line-height) * .75)}#timerBarContainer{height:6px}#inputBox{font-size:1.1em;padding:calc(var(--spacing-unit) * .8);padding-right:calc(var(--spacing-unit) * 6.5)}.timer-in-input{font-size:1.5em;right:calc(var(--spacing-unit) * 3.0)}.reload-button{font-size:1.5em;padding:calc(var(--spacing-unit) * .5);right:calc(var(--spacing-unit) * .5)}}@media(max-width:575px){.setting-item select,.setting-item input[type="text"]{font-size:1rem;padding:calc(var(--spacing-unit) * .7) calc(var(--spacing-unit) * .9)}.additional-options{padding:.5rem}.sound-controls-wrapper{flex-direction:column;align-items:flex-start;gap:.3rem;padding:.1rem}.individual-sound-controls{width:100%;justify-content:flex-start;align-items:center;padding:.01rem;gap:.6rem}.sound-settings-label{display:none}.sound-toggle-item{margin-bottom:.1rem;width:100%;gap:.6rem}.sound-toggle-item label{flex:1}.stats-bar{flex-direction:column;align-items:center}.stat-item{margin:.2rem 0}.caret{height:calc(var(--words-font-size) * var(--words-line-height) * .75)}#timerBarContainer{height:5px}#inputBox{font-size:1rem;padding-right:calc(var(--spacing-unit) * 6.0)}.timer-in-input{font-size:1.3em;right:calc(var(--spacing-unit) * 2.8)}.reload-button{font-size:1.4em;padding:calc(var(--spacing-unit) * .4);right:calc(var(--spacing-unit) * .4)}}.leaderboard-area{min-width:0;max-width:800px;margin-left:auto;margin-right:auto;width:100%}.leaderboard-area h2#leaderboardTitle{word-break:break-word;font-size:1.6rem;line-height:1.4;margin-bottom:var(--spacing-unit);color:var(--color-text-primary);display:flex;align-items:center;gap:.5em;transition:color .3s ease;justify-content:center}.leaderboard-area h2#leaderboardTitle .icon{font-size:1em;color:var(--color-primary-base);transition:color .3s ease}#scoreList{list-style-type:none;padding-left:0;margin-top:0;overflow:hidden}#scoreList li{display:flex;align-items:center;padding:calc(var(--spacing-unit) * .7) var(--spacing-unit);border-bottom:1px solid var(--color-border-primary);font-size:.95rem;transition:background-color .3s ease,border-color .3s ease,box-shadow .3s ease;gap:.6em;background-color:var(--color-table-row-odd)}#scoreList li.leaderboard-entry{--leaderboard-entry-accent:transparent;--leaderboard-entry-surface:var(--color-surface-card,var(--color-background-body,#fff));position:relative;background:linear-gradient(135deg,color-mix(in srgb,var(--leaderboard-entry-surface) 88%,var(--leaderboard-entry-accent)) 0,color-mix(in srgb,var(--leaderboard-entry-surface) 94%,transparent) 100%);border-bottom-color:color-mix(in srgb,var(--leaderboard-entry-accent) 42%,var(--color-border-primary));box-shadow:0 12px 26px color-mix(in srgb,var(--leaderboard-entry-accent) 22%,transparent)}#scoreList li.leaderboard-entry.leaderboard-entry--gold{--leaderboard-entry-accent:color-mix(in srgb,var(--color-trophy-gold) 70%,#fff)}#scoreList li.leaderboard-entry.leaderboard-entry--silver{--leaderboard-entry-accent:color-mix(in srgb,var(--color-trophy-silver) 78%,#fff)}#scoreList li.leaderboard-entry.leaderboard-entry--bronze{--leaderboard-entry-accent:color-mix(in srgb,var(--color-trophy-bronze) 72%,#fff)}#scoreList li.leaderboard-entry:hover,#scoreList li.leaderboard-entry:focus-within{background:linear-gradient(135deg,color-mix(in srgb,var(--leaderboard-entry-surface) 78%,var(--leaderboard-entry-accent)) 0,color-mix(in srgb,var(--leaderboard-entry-surface) 88%,transparent) 100%);box-shadow:0 16px 30px color-mix(in srgb,var(--leaderboard-entry-accent) 30%,transparent)}[data-theme="dark"] #scoreList li.leaderboard-entry{--leaderboard-entry-surface:var(--color-surface-elevated,var(--color-background-body,#0f172a));background:linear-gradient(135deg,color-mix(in srgb,var(--leaderboard-entry-surface) 70%,var(--leaderboard-entry-accent)) 0,color-mix(in srgb,var(--leaderboard-entry-surface) 92%,transparent) 100%);border-bottom-color:color-mix(in srgb,var(--leaderboard-entry-accent) 60%,var(--color-border-primary));box-shadow:0 16px 32px color-mix(in srgb,var(--leaderboard-entry-accent) 32%,transparent)}[data-theme="dark"] #scoreList li.leaderboard-entry:hover,[data-theme="dark"] #scoreList li.leaderboard-entry:focus-within{background:linear-gradient(135deg,color-mix(in srgb,var(--leaderboard-entry-surface) 62%,var(--leaderboard-entry-accent)) 0,color-mix(in srgb,var(--leaderboard-entry-surface) 86%,transparent) 100%);box-shadow:0 20px 36px color-mix(in srgb,var(--leaderboard-entry-accent) 38%,transparent)}@media(prefers-reduced-motion:reduce){#scoreList li,#scoreList li.leaderboard-entry,#scoreList li.leaderboard-entry:hover,#scoreList li.leaderboard-entry:focus-within,[data-theme="dark"] #scoreList li.leaderboard-entry,[data-theme="dark"] #scoreList li.leaderboard-entry:hover,[data-theme="dark"] #scoreList li.leaderboard-entry:focus-within{transition:none}}@keyframes fadeInLeaderboard{from{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:translateX(0)}}.leaderboard-entry-fade-in{opacity:0;animation:fadeInLeaderboard .4s ease forwards}#scoreList li:last-child{border-bottom:none}.leaderboard-rank{font-weight:600;color:var(--color-text-secondary);min-width:3.2em;text-align:right;margin-right:.75em;flex-shrink:0;display:flex;align-items:center;gap:.4em;transition:color .3s ease}.leaderboard-rank .icon[data-icon="trophy"]{font-size:1em;line-height:1;display:inline-block;width:1.2em;text-align:center}.trophy-gold{color:var(--color-trophy-gold);text-shadow:0 0 5px color-mix(in srgb,var(--color-trophy-gold) 50%,transparent)}.trophy-silver{color:var(--color-trophy-silver);text-shadow:0 0 5px color-mix(in srgb,var(--color-trophy-silver) 50%,transparent)}.trophy-bronze{color:var(--color-trophy-bronze);text-shadow:0 0 5px color-mix(in srgb,var(--color-trophy-bronze) 50%,transparent)}.leaderboard-rank.rank-gold,.leaderboard-rank.rank-silver,.leaderboard-rank.rank-bronze{color:var(--color-text-primary);font-weight:700}.leaderboard-rank-placeholder{color:var(--color-text-secondary);font-style:italic;font-weight:600}#scoreList li.optimistic-entry{background:color-mix(in srgb,var(--color-surface-highlight) 65%,transparent);border-left:3px solid var(--color-secondary-base)}#scoreList li.optimistic-entry .leaderboard-rank{color:var(--color-secondary-base)}#scoreList li.optimistic-entry .leaderboard-time-ago{color:var(--color-text-secondary)}.leaderboard-optimistic-badge{display:inline-flex;align-items:center;gap:.25em;padding:.1em .45em;border-radius:var(--border-radius-small);background:var(--color-state-info-bg);color:var(--color-state-info);font-size:.7rem;font-weight:600}.leaderboard-profile-pic.leaderboard-profile-pic-fallback{background-color:var(--color-surface-highlight);object-fit:contain}.leaderboard-user-info{display:flex;align-items:center;flex-grow:1;min-width:0;margin-right:.5em;gap:.65em;flex-wrap:nowrap}.leaderboard-profile-pic{width:30px;height:30px;border-radius:50%;object-fit:cover;flex-shrink:0;background-color:var(--color-border-secondary);border:2px solid var(--color-surface-card);box-shadow:0 0 0 2px color-mix(in srgb,var(--color-border-secondary) 65%,transparent),0 0 0 4px color-mix(in srgb,var(--color-border-secondary) 35%,transparent);transition:box-shadow .3s ease,border-color .3s ease}.leaderboard-profile-pic.is-online{box-shadow:0 0 0 2px color-mix(in srgb,var(--color-online-indicator) 75%,transparent),0 0 0 4px color-mix(in srgb,var(--color-online-indicator) 35%,transparent)}.leaderboard-profile-pic.is-offline{box-shadow:0 0 0 2px color-mix(in srgb,var(--color-border-primary) 65%,transparent),0 0 0 4px color-mix(in srgb,var(--color-border-primary) 35%,transparent)}#scoreList li:not(.optimistic-entry):not(.leaderboard-entry):nth-child(odd){background-color:var(--color-table-row-odd)}#scoreList li:not(.optimistic-entry):not(.leaderboard-entry):nth-child(even){background-color:var(--color-table-row-even)}#scoreList li:not(.optimistic-entry):not(.leaderboard-entry):hover{background-color:var(--color-table-row-hover)}#scoreList li a.username-link{text-decoration:none;color:var(--color-text-primary);flex-grow:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:color .3s ease}#scoreList li a.username-link .username{font-weight:500;display:inline-block;vertical-align:middle}#scoreList li a.username-link:hover .username{color:var(--color-text-link-hover);text-decoration:underline}.leaderboard-stats-group{display:flex;flex-direction:column;align-items:flex-end;flex-shrink:0;margin-left:auto;gap:.15em}#scoreList li .score-details{display:flex;align-items:baseline;gap:.7em;flex-wrap:nowrap}#scoreList li .score{color:var(--color-text-primary);font-weight:600;font-size:1rem;transition:color .3s ease;white-space:nowrap}#scoreList li .leaderboard-extra{font-size:.8rem;color:var(--color-text-secondary);display:inline-flex;align-items:center;gap:.25em;background-color:var(--color-background-body);padding:.15em .4em;border-radius:var(--border-radius-small);transition:background-color .3s ease,color .3s ease;white-space:nowrap}#scoreList li .leaderboard-extra .icon-streak{color:var(--color-streak)}#scoreList li .leaderboard-extra .icon-accuracy{color:var(--color-state-success)}@media(min-width:1024px){.typing-app-grid #scoreList li{display:grid;grid-template-columns:minmax(2.6em,max-content) minmax(0,1fr) minmax(7.5em,0.9fr);align-items:center;column-gap:.6em;row-gap:.35em}.typing-app-grid #scoreList li .leaderboard-rank{margin-right:0;justify-self:end;min-width:2.8em}.typing-app-grid #scoreList li .leaderboard-user-info{margin-right:0;gap:.55em;min-width:0}.typing-app-grid #scoreList li .leaderboard-stats-group{margin-left:0;min-width:0;max-width:100%;flex-shrink:1;justify-self:stretch;align-items:flex-end;gap:.3em}.typing-app-grid #scoreList li .score-details{justify-content:flex-end;flex-wrap:wrap;gap:.35em;width:100%}.typing-app-grid #scoreList li .score{flex:0 0 auto;text-align:right}.typing-app-grid #scoreList li .leaderboard-extra{flex:0 1 auto}}.leaderboard-time-ago{font-size:.8rem;color:var(--color-text-secondary);line-height:1.2;text-align:right;transition:color .3s ease;white-space:nowrap;margin-top:.2em}#scoreList li.new-entry-highlight{background-color:var(--color-surface-highlight)}@media(max-width:767px){.leaderboard-area{max-width:100%}#scoreList li{font-size:.9rem;padding:calc(var(--spacing-unit)*0.55) calc(var(--spacing-unit)*0.7);gap:.5em}.leaderboard-user-info{gap:.5em}.leaderboard-profile-pic{width:26px;height:26px}.leaderboard-rank{min-width:2.8em;margin-right:.4em}#scoreList li .score-details{gap:.4em;flex-wrap:wrap;justify-content:flex-end}#scoreList li .score{font-size:.9rem}#scoreList li .leaderboard-extra{font-size:.75rem;padding:.1em .25em}.leaderboard-time-ago{font-size:.7rem}}@media(max-width:575px){.leaderboard-area h2#leaderboardTitle{font-size:1.3rem}#scoreList li{font-size:.8rem;gap:.4em;padding:calc(var(--spacing-unit)*0.5) calc(var(--spacing-unit)*0.6);flex-wrap:wrap;justify-content:space-between}.leaderboard-user-info{margin-right:0;flex-basis:100%;order:2;margin-bottom:.3em;gap:.45em}.leaderboard-stats-group{margin-left:0;flex-basis:100%;align-items:flex-start;order:3}#scoreList li .score-details{justify-content:flex-start}.leaderboard-profile-pic{width:22px;height:22px}.leaderboard-rank{min-width:auto;margin-right:.5em;font-size:.9em;order:1;flex-basis:content}.leaderboard-rank .icon[data-icon="trophy"]{font-size:.85em}#scoreList li .leaderboard-extra.accuracy-detail{display:inline-flex}#scoreList li .leaderboard-extra.streak-detail{display:none}.leaderboard-time-ago{margin-top:.1em;text-align:left;width:auto}}.leaderboard-flag-icon{display:inline-flex;align-items:center;justify-content:center;font-size:1.1rem;line-height:1;min-width:1.6rem;height:1.2rem;border-radius:var(--border-radius-small);box-shadow:0 0 0 1px color-mix(in srgb,var(--color-border-secondary) 60%,transparent);flex-shrink:0;margin-right:0}@media(max-width:767px){.leaderboard-flag-icon{font-size:1rem;min-width:1.4rem;height:1.1rem}}@media(max-width:575px){.leaderboard-flag-icon{min-width:1.2rem;height:1rem}}#scoreList li:hover .leaderboard-extra{background-color:color-mix(in srgb,var(--color-table-row-hover) 65%,var(--color-background-body));color:var(--color-text-primary)}[data-theme="dark"] #scoreList li .leaderboard-extra{background-color:color-mix(in srgb,var(--color-nav-link-bg) 55%,transparent);color:var(--color-nav-link-hover-text)}[data-theme="dark"] #scoreList li:hover .leaderboard-extra{background-color:color-mix(in srgb,var(--color-nav-link-hover-bg) 65%,transparent)}