*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:100%;-webkit-text-size-adjust:100%}body{font-family:var( --font-fontFamily, -apple-system, "SF Pro Text", "Segoe UI", "Noto Sans", sans-serif );font-size:var(--font-body, 18px);font-weight:var(--font-weightRegular, 400);line-height:var(--font-lineBody, 1.5);color:var(--color-textPrimary, #1a1a1a);background-color:var(--color-background, #fafaf8);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:focus-visible{outline:3px solid var(--color-focus, #2563eb);outline-offset:2px}:focus:not(:focus-visible){outline:none}[data-reduced-motion=true] *,[data-reduced-motion=true] *:before,[data-reduced-motion=true] *:after{animation-duration:0ms!important;animation-delay:0ms!important;transition-duration:0ms!important;transition-delay:0ms!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.sr-only-focusable:focus{position:static;width:auto;height:auto;padding:inherit;margin:inherit;overflow:visible;clip:auto;white-space:normal}@keyframes skeleton-shimmer{0%{opacity:.6}50%{opacity:1}to{opacity:.6}}.skeleton-line{border-radius:var(--radius-sm, 6px);background:var(--color-surfaceDark, #f0f0f0);animation:skeleton-shimmer 1.5s ease-in-out infinite}@keyframes snackbar-rise{0%{opacity:0;transform:translate(-50%) translateY(16px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.undo-snackbar{animation:snackbar-rise var(--motion-normal, .3s) var(--motion-ease-gentle, ease-out)}.app-shell{min-height:100dvh;display:flex;flex-direction:column;align-items:center;padding:var(--space-lg, 24px);max-width:640px;margin:0 auto}@media(min-width:768px){.app-shell{max-width:800px}}@media(min-width:1024px){.app-shell{max-width:960px}}.loading-screen{display:flex;align-items:center;justify-content:center;min-height:60dvh;font-size:var(--font-bodyLarge, 20px);color:var(--color-textSecondary, #5c5c5c)}.screen{width:100%;flex:1;display:flex;flex-direction:column;align-items:center;gap:var(--space-xl, 32px)}.card{background-color:var(--color-surface, #ffffff);border-radius:var(--radius-md, 12px)}.card--low{box-shadow:var(--elevation-low, 0px 1px 3px 0px rgba(0, 0, 0, .08))}.card--mid{box-shadow:var(--elevation-mid, 0px 4px 12px 0px rgba(0, 0, 0, .1))}.card--high{box-shadow:var(--elevation-high, 0px 8px 24px 0px rgba(0, 0, 0, .14))}.card--interactive:hover{transform:translateY(-2px);box-shadow:var(--elevation-mid, 0px 4px 12px 0px rgba(0, 0, 0, .1));background-color:var(--color-surfaceHover, #f5f5f3)}.card--interactive:active{transform:translateY(0) scale(.99)}.btn{display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-fontFamily, inherit);font-weight:var(--font-weightSemibold, 600);border:none;border-radius:var(--radius-md, 12px);cursor:pointer;text-decoration:none;line-height:1.2;transition:transform var(--motion-micro, .1s) var(--motion-ease-snappy, ease-out);min-width:var(--touch-minimum, 48px);min-height:var(--touch-minimum, 48px);padding:8px 24px;font-size:var(--font-body, 18px);user-select:none}.btn:active:not(:disabled){transform:scale(.97)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn--primary{background-color:var(--color-primary, #1a237e);color:#fff}.btn--primary:hover:not(:disabled){background-color:var(--color-primaryLight, #534bae)}.btn--secondary{background-color:var(--color-premiumBg, #ede7f6);color:var(--color-primary, #1a237e)}.btn--secondary:hover:not(:disabled){background-color:var(--color-surfaceDark, #f0f0f0)}.btn--ghost{background-color:transparent;color:var(--color-textSecondary, #5c5c5c)}.btn--ghost:hover:not(:disabled){background-color:var(--color-surfaceDark, #f0f0f0);color:var(--color-primary, #1a237e)}.btn--danger{background-color:var(--color-danger, #c62828);color:#fff}.btn--small{font-size:var(--font-body, 18px);padding:var(--space-xs, 4px) var(--space-sm, 8px);min-height:var(--touch-minimum, 48px)}.btn--medium{font-size:var(--font-body, 18px);padding:var(--space-sm, 8px) var(--space-lg, 24px);min-height:var(--touch-minimum, 48px)}.btn--large{font-size:var(--font-bodyLarge, 20px);padding:var(--space-sm, 8px) var(--space-xl, 32px);min-height:var(--touch-preferred, 56px)}.btn--full{width:100%;max-width:none}.home-screen{padding-top:var(--space-xxl, 48px);text-align:center;gap:var(--space-xl, 32px);width:100%}.home-header{display:flex;flex-direction:column;align-items:center;gap:var(--space-sm, 8px)}.app-title{font-size:var(--font-headingLg, 44px);font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a);letter-spacing:var(--font-trackingTight, -.02em);line-height:1.1;margin:0}.app-subtitle{font-size:var(--font-bodyLarge, 20px);color:var(--color-textSecondary, #5c5c5c);max-width:400px;margin:0 auto}.home-section{background:var(--color-surface, #ffffff);border-radius:var(--radius-lg, 20px);box-shadow:var(--elevation-low, 0px 1px 3px 0px rgba(0, 0, 0, .08));padding:var(--space-lg, 24px);width:100%}.home-section h2{font-size:var(--font-headingSm, 28px);font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a);margin:0}.home-section p{color:var(--color-textSecondary, #5c5c5c);font-size:var(--font-bodyLarge, 20px);margin:0}.home-section__heading{font-size:var(--font-headingMd, 32px);font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a);margin:0 0 var(--space-xs, 4px);text-align:left}.home-section__subtitle{font-size:var(--font-body, 18px);color:var(--color-textSecondary, #5c5c5c);margin:0 0 var(--space-lg, 24px);text-align:left}.home-play-grid{display:grid;grid-template-columns:1fr;gap:var(--space-md, 16px);width:100%}@media(min-width:600px){.home-play-grid{grid-template-columns:1fr 1fr}.home-play-card--multiplayer{grid-column:1 / -1}}@media(min-width:900px){.home-play-grid{grid-template-columns:1fr 1fr 1fr}.home-play-card--multiplayer{grid-column:auto}}.home-play-card{display:flex;flex-direction:column;align-items:center;gap:var(--space-sm, 8px);padding:var(--space-lg, 24px);text-align:center;height:100%;box-sizing:border-box}.home-play-card>:last-child{margin-top:auto}.home-play-card__icon{display:flex;align-items:center;justify-content:center;line-height:1;color:var(--color-primary, #1a237e)}.home-play-card__title{font-size:var(--font-bodyLarge, 20px);font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a);margin:0}.home-play-card__hint{font-size:var(--font-small, 14px);color:var(--color-textSecondary, #5c5c5c);margin:0}.home-play-card--done{opacity:.6}.home-play-card--multiplayer{box-shadow:var(--elevation-mid, 0px 4px 12px 0px rgba(0, 0, 0, .1))}.mode-section{margin-bottom:var(--space-lg, 24px)}.mode-section:last-child{margin-bottom:0}.mode-section__title{font-size:var(--font-headingSm, 24px);font-weight:var(--font-weightSemibold, 600);color:var(--color-primary, #1a237e);margin:0 0 var(--space-md, 16px);text-align:left}.mode-section__toggle{display:block;margin:var(--space-md, 16px) auto 0;font-size:var(--font-body, 18px)}.mode-grid{display:grid;grid-template-columns:1fr;gap:var(--space-md, 16px);width:100%}@media(min-width:600px){.mode-grid{grid-template-columns:1fr 1fr}}@media(min-width:900px){.mode-grid{grid-template-columns:1fr 1fr 1fr}}.mode-card{display:flex;align-items:flex-start;gap:var(--space-md, 16px);padding:var(--space-md, 16px);text-align:left;position:relative;height:100%;min-height:var(--touch-preferred, 56px)}.mode-card__icon{flex-shrink:0;width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:var(--color-surfaceDark, #f0f0f0);border-radius:var(--radius-md, 12px);line-height:1;color:var(--color-primary, #1a237e)}.mode-card__body{flex:1;min-width:0}.mode-card__header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-sm, 8px);margin-bottom:var(--space-xs, 4px)}.mode-card__title{font-size:var(--font-body, 18px);font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a);margin:0;line-height:1.3}.mode-card__desc{font-size:var(--font-small, 14px);color:var(--color-textSecondary, #5c5c5c);margin:0;line-height:var(--font-lineBody, 1.5);display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.mode-card__badge{flex-shrink:0}.mode-card__lock{flex-shrink:0;align-self:center;opacity:.5;display:flex;color:var(--color-textSecondary, #5c5c5c)}.btn--icon{display:inline-flex;align-items:center;gap:6px;font-size:var(--font-bodyLarge, 20px);font-weight:var(--font-weightMedium, 500);padding:var(--space-sm, 8px) var(--space-md, 16px);min-height:var(--touch-preferred, 56px);background:var(--color-surface, #ffffff);border-radius:var(--radius-md, 12px);color:var(--color-textPrimary, #1a1a1a);border:none;cursor:pointer;transition:background .15s ease,box-shadow .15s ease,transform .1s ease;box-shadow:var(--elevation-low, 0px 1px 3px 0px rgba(0, 0, 0, .08));text-decoration:none;user-select:none}.btn--icon:hover{background:var(--color-surfaceHover, #f5f5f3);box-shadow:var(--elevation-mid, 0px 4px 12px 0px rgba(0, 0, 0, .1))}.btn--icon:active{transform:scale(.97)}.btn--icon:disabled{opacity:.4;cursor:not-allowed;box-shadow:none}.btn--icon .nav-icon{font-size:24px;line-height:1}.game-screen{padding-top:var(--space-sm, 8px);gap:var(--space-md, 16px)}.game-header{width:100%;display:flex;align-items:center;justify-content:space-between;gap:var(--space-md, 16px);padding:var(--space-md, 16px);background:var(--color-surface, #ffffff);border-radius:var(--radius-md, 12px);box-shadow:var(--elevation-low, 0px 1px 3px 0px rgba(0, 0, 0, .08))}.gh-back-btn{display:inline-flex;align-items:center;gap:6px;flex-shrink:0;font-size:var(--font-body, 18px);font-weight:var(--font-weightMedium, 500);font-family:inherit;padding:var(--space-sm, 8px) var(--space-md, 16px);min-height:var(--touch-preferred, 56px);background:transparent;border:none;border-radius:var(--radius-md, 12px);color:var(--color-textSecondary, #5c5c5c);cursor:pointer;transition:background .15s ease,color .15s ease,transform .1s ease;user-select:none}.gh-back-btn:hover{background:var(--color-surfaceHover, #f5f5f3);color:var(--color-textPrimary, #1a1a1a)}.gh-back-btn:active{transform:scale(.97)}.gh-back-btn .gh-chevron{flex-shrink:0;color:var(--color-textTertiary, #8c8c8c)}.gh-center{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;min-width:0}.gh-title{font-size:var(--font-bodyLarge, 20px);font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a);margin:0;letter-spacing:var(--trackingTight, -.01em);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.game-header-center{flex:1;display:flex;justify-content:center}.game-title{font-size:var(--font-headingSm, 24px);font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a);margin:0;letter-spacing:var(--trackingTight, -.01em)}.gh-mp-bar{display:flex;align-items:center;gap:var(--space-sm, 8px);flex-wrap:wrap;justify-content:center;font-size:var(--font-small, 14px);line-height:1.3}.gh-mp-mode{display:inline-flex;align-items:center;padding:1px 10px;border:1.5px solid;border-radius:var(--radius-full, 999px);font-weight:var(--font-weightSemibold, 600);font-size:var(--font-caption, 12px);letter-spacing:.03em;text-transform:uppercase;color:var(--color-textSecondary, #5c5c5c);line-height:1.6}.gh-mp-players{display:inline-flex;align-items:center;gap:4px;color:var(--color-textSecondary, #5c5c5c)}.gh-mp-p1{font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a)}.gh-mp-vs{color:var(--color-textTertiary, #8c8c8c);font-weight:var(--font-weightRegular, 400)}.gh-mp-p2{font-weight:var(--font-weightMedium, 500);color:var(--color-textPrimary, #1a1a1a)}.gh-mp-code{display:inline-flex;align-items:center;padding:1px 10px;border-radius:var(--radius-full, 999px);background:var(--color-surfaceDark, #f0f0f0);font-family:SF Mono,Cascadia Code,Consolas,monospace;font-size:var(--font-caption, 12px);font-weight:var(--font-weightSemibold, 600);letter-spacing:.06em;color:var(--color-textSecondary, #5c5c5c);line-height:1.6}.gh-right{display:flex;align-items:center;gap:var(--space-sm, 8px);flex-shrink:0}.gh-sync{display:inline-flex;align-items:center;gap:4px;padding:2px 10px;border-radius:var(--radius-full, 999px);font-size:var(--font-caption, 12px);font-weight:var(--font-weightMedium, 500);line-height:1.5;white-space:nowrap}.gh-sync--synced{background:var(--color-statusCorrectBg, #e8f5e9);color:var(--color-statusCorrect, #2e7d32)}.gh-sync--syncing{background:var(--color-surfaceDark, #f0f0f0);color:var(--color-textSecondary, #5c5c5c)}.gh-sync--syncing .gh-sync-icon{animation:gh-sync-spin 1.5s linear infinite}.gh-sync--offline{background:#fff3e0;color:#e65100}.gh-sync--conflict,.gh-sync--error{background:#ffebee;color:var(--color-danger, #c62828)}@keyframes gh-sync-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}[data-reduced-motion=true] .gh-sync--syncing .gh-sync-icon{animation:none}@media(max-width:480px){.gh-sync-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}}.gh-attempts{display:inline-flex;align-items:baseline;gap:0;padding:4px 14px;border-radius:var(--radius-full, 999px);background:var(--color-surfaceDark, #f0f0f0);font-variant-numeric:tabular-nums;line-height:1.4;min-height:var(--touch-minimum, 48px);align-items:center;user-select:none}.gh-attempts-used{font-size:var(--font-bodyLarge, 20px);font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a)}.gh-attempts-sep{font-size:var(--font-body, 18px);font-weight:var(--font-weightRegular, 400);color:var(--color-textTertiary, #8c8c8c);margin:0 2px}.gh-attempts-max{font-size:var(--font-body, 18px);font-weight:var(--font-weightMedium, 500);color:var(--color-textSecondary, #5c5c5c)}.gh-hint-btn{display:inline-flex;align-items:center;justify-content:center;min-width:var(--touch-minimum, 48px);min-height:var(--touch-minimum, 48px);padding:8px;border:none;border-radius:var(--radius-md, 12px);background:var(--color-surface, #ffffff);box-shadow:var(--elevation-low, 0px 1px 3px 0px rgba(0, 0, 0, .08));color:var(--color-textTertiary, #8c8c8c);cursor:pointer;transition:background .15s ease,box-shadow .15s ease,color .15s ease,transform .1s ease}.gh-hint-btn:hover:not(:disabled){background:#fff8e1;box-shadow:var(--elevation-mid, 0px 4px 12px 0px rgba(0, 0, 0, .1));color:#f9a825}.gh-hint-btn:active:not(:disabled){transform:scale(.95)}.gh-hint-btn:disabled{opacity:.35;cursor:not-allowed;box-shadow:none;background:var(--color-surfaceDark, #f0f0f0)}.gh-hint-btn .gh-bulb{display:block}.game-message{position:fixed;top:16px;left:50%;transform:translate(-50%);z-index:100;min-width:280px;max-width:420px;padding:12px 24px;border-radius:var(--radius-md, 12px);font-size:var(--font-body, 18px);font-weight:var(--font-weightSemibold, 600);text-align:center;box-shadow:var(--elevation-high, 0px 8px 24px 0px rgba(0, 0, 0, .14));animation:toast-slide-in .3s var(--motion-ease-gentle, ease-out);pointer-events:none}@keyframes toast-slide-in{0%{opacity:0;transform:translate(-50%) translateY(-12px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.message-error{background-color:#c62828;color:#fff}.message-info{background-color:var(--color-primary, #1a237e);color:#fff}.game-board{display:flex;flex-direction:column;gap:var(--space-sm, 8px)}.board-row{display:flex;gap:var(--space-sm, 8px)}.game-tile{width:60px;height:60px;display:flex;align-items:center;justify-content:center;position:relative;border:2px solid var(--color-textTertiary, #8c8c8c);border-radius:var(--radius-md, 12px);font-size:var(--font-gameTile, 36px);font-weight:var(--font-weightSemibold, 600);text-transform:uppercase;user-select:none;box-shadow:var(--elevation-low, 0px 1px 3px 0px rgba(0, 0, 0, .08))}.tile-empty{background-color:var(--color-surface, #ffffff);border-color:var(--color-textTertiary, #8c8c8c)}.tile-correct{background-color:var(--color-statusCorrect, #2e7d32);border-color:var(--color-statusCorrect, #2e7d32);color:#fff}.tile-present{background-color:var(--color-statusPresent, #e65100);border-color:var(--color-statusPresent, #e65100);color:#fff}.tile-absent{background-color:var(--color-statusAbsent, #757575);border-color:var(--color-statusAbsent, #757575);color:#fff}.tile-letter{line-height:var(--font-lineTile, 1.2)}.tile-symbol{position:absolute;bottom:2px;right:4px;font-size:10px;opacity:.8}.tile-flip{animation:tile-flip .3s var(--motion-ease-gentle, ease-out)}@keyframes tile-flip{0%{transform:rotateX(0)}50%{transform:rotateX(90deg)}to{transform:rotateX(0)}}.tile-shake{animation:tile-shake .3s ease-out}@keyframes tile-shake{0%,to{transform:translate(0)}20%{transform:translate(-4px)}40%{transform:translate(4px)}60%{transform:translate(-4px)}80%{transform:translate(4px)}}.tile-bounce{animation:tile-bounce .2s var(--motion-ease-bouncy, ease-out)}@keyframes tile-bounce{0%{transform:scale(1)}50%{transform:scale(1.08)}to{transform:scale(1)}}.keyboard{width:100%;max-width:500px;display:flex;flex-direction:column;gap:6px;padding:0 4px}.keyboard-row{display:flex;gap:5px;justify-content:center;width:100%}.keyboard-key{display:inline-flex;align-items:center;justify-content:center;flex:1;max-width:44px;font-family:var(--font-fontFamily, inherit);font-size:var(--font-body, 18px);font-weight:var(--font-weightSemibold, 600);background-color:var(--color-surfaceDark, #f0f0f0);color:var(--color-textPrimary, #1a1a1a);border:none;border-radius:var(--radius-sm, 6px);cursor:pointer;height:var(--touch-minimum, 48px);padding:0 4px;text-transform:uppercase;box-shadow:var(--elevation-low, 0px 1px 3px 0px rgba(0, 0, 0, .08));transition:transform var(--motion-micro, .1s) var(--motion-ease-snappy, ease-out);user-select:none}.keyboard-key:hover:not(:disabled){background-color:var(--color-textTertiary, #8c8c8c);color:#fff}.keyboard-key:active:not(:disabled){transform:scale(.92);background-color:var(--color-textSecondary, #5c5c5c)}.keyboard-key:disabled{opacity:.4;cursor:not-allowed}.key-wide{flex:1.5;max-width:64px;font-size:var(--font-small, 14px);text-transform:none}.key-correct{background-color:var(--color-statusCorrect, #2e7d32);color:#fff}.key-present{background-color:var(--color-statusPresent, #e65100);color:#fff}.key-absent{background-color:var(--color-statusAbsent, #757575);color:#fff}.game-help{width:100%;max-width:420px;padding:var(--space-md, 16px) var(--space-lg, 24px);margin-top:var(--space-sm, 8px);border-radius:var(--radius-md, 12px);background:var(--color-surface, #ffffff);box-shadow:var(--elevation-low, 0px 1px 3px 0px rgba(0, 0, 0, .08))}.game-help-legend{display:flex;flex-direction:column;gap:var(--space-sm, 8px)}.game-help-item{display:flex;align-items:center;gap:var(--space-md, 16px);font-size:var(--font-small, 14px);color:var(--color-textSecondary, #5c5c5c);line-height:1.4}.help-swatch{flex-shrink:0;width:24px;height:24px;border-radius:4px}.help-swatch--correct{background:var(--color-statusCorrect, #0072b2)}.help-swatch--present{background:var(--color-statusPresent, #e69f00)}.help-swatch--absent{background:var(--color-statusAbsent, #999999)}.result-screen{padding-top:var(--space-xl, 32px);text-align:center;gap:var(--space-lg, 24px)}.result-heading{font-size:var(--font-headingLg, 40px);font-weight:var(--font-weightSemibold, 600);color:var(--color-primary, #1a237e)}.result-outcome{font-size:var(--font-headingLg, 40px);font-weight:var(--font-weightSemibold, 600);margin:0}.result-outcome--won{color:var(--color-statusCorrect, #2e7d32)}.result-outcome--lost{color:var(--color-textSecondary, #5c5c5c)}.result-answer{display:flex;flex-direction:column;align-items:center;gap:4px}.result-label{font-size:var(--font-body, 18px);color:var(--color-textSecondary, #5c5c5c)}.result-word{font-size:var(--font-headingMd, 32px);font-weight:var(--font-weightSemibold, 600);letter-spacing:.15em;color:var(--color-textPrimary, #1a1a1a)}.result-attempts{font-size:var(--font-bodyLarge, 20px);color:var(--color-textSecondary, #5c5c5c)}.result-stats{display:flex;gap:var(--space-xl, 32px);justify-content:center}.stat-item{display:flex;flex-direction:column;align-items:center;gap:4px}.stat-value{font-size:var(--font-headingSm, 24px);font-weight:var(--font-weightSemibold, 600);color:var(--color-primary, #1a237e)}.stat-label{font-size:var(--font-small, 14px);color:var(--color-textSecondary, #5c5c5c);text-transform:none;letter-spacing:0}.result-guesses{width:100%;max-width:400px}.result-guesses h3{font-size:var(--font-bodyLarge, 20px);font-weight:var(--font-weightSemibold, 600);margin-bottom:var(--space-sm, 8px);color:var(--color-textPrimary, #1a1a1a)}.result-guess-row{display:flex;gap:var(--space-sm, 8px);justify-content:center;margin-bottom:var(--space-sm, 8px)}.result-letter{width:44px;height:44px;display:flex;align-items:center;justify-content:center;position:relative;border-radius:var(--radius-sm, 6px);font-size:var(--font-bodyLarge, 20px);font-weight:var(--font-weightSemibold, 600);text-transform:uppercase;color:#fff}.result-correct{background-color:var(--color-statusCorrect, #2e7d32)}.result-present{background-color:var(--color-statusPresent, #e65100)}.result-absent{background-color:var(--color-statusAbsent, #757575)}.result-symbol{position:absolute;bottom:1px;right:3px;font-size:8px;opacity:.7}.result-actions{display:flex;flex-direction:column;gap:var(--space-sm, 8px);width:100%;max-width:320px;align-items:center}.xp-gain{display:inline-flex;align-items:center;justify-content:center;background-color:var(--color-statusCorrectBg, #e8f5e9);color:var(--color-statusCorrect, #2e7d32);border-radius:var(--radius-full, 999px);padding:var(--space-sm, 8px) var(--space-md, 16px);font-size:var(--font-headingSm, 24px);font-weight:var(--font-weightSemibold, 600);animation:xp-pop .4s var(--motion-ease-bouncy, ease-out)}@keyframes xp-pop{0%{transform:scale(0);opacity:0}60%{transform:scale(1.15)}to{transform:scale(1);opacity:1}}.error-banner{position:fixed;bottom:var(--space-md, 16px);left:50%;transform:translate(-50%);background-color:#ffebee;color:var(--color-danger, #c62828);border-radius:var(--radius-md, 12px);padding:var(--space-sm, 8px) var(--space-lg, 24px);font-weight:var(--font-weightMedium, 500);box-shadow:var(--elevation-high, 0px 8px 24px 0px rgba(0, 0, 0, .14));z-index:var(--z-toast, 500);max-width:90vw;text-align:center}.settings-screen{padding-top:var(--space-lg, 24px);gap:var(--space-lg, 24px)}.settings-section{width:100%;max-width:460px;background:var(--color-surface, #ffffff);border-radius:var(--radius-md, 12px);box-shadow:var(--elevation-low, 0px 1px 3px 0px rgba(0, 0, 0, .08));padding:var(--space-lg, 24px);display:flex;flex-direction:column;gap:var(--space-md, 16px)}.settings-section h2{font-size:var(--font-headingSm, 24px);font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a);margin:0}.settings-section-desc{font-size:var(--font-bodyLarge, 20px);color:var(--color-textSecondary, #5c5c5c);line-height:var(--font-lineBody, 1.5);margin:0}.settings-toggle{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-md, 16px);padding:var(--space-sm, 8px) 0;min-height:var(--touch-minimum, 48px)}.settings-toggle+.settings-toggle{border-top:1px solid var(--color-surfaceDark, #f0f0f0)}.settings-toggle--stacked{flex-direction:column;align-items:stretch;gap:var(--space-sm, 8px)}.settings-toggle--stacked .settings-toggle-info{flex:none}.settings-toggle--stacked .settings-select{width:100%;max-width:320px}.settings-toggle-info{flex:1;min-width:0}.settings-toggle-label{display:block;font-size:var(--font-bodyLarge, 20px);font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a);cursor:pointer;line-height:var(--font-lineBody, 1.5)}.settings-toggle-desc{font-size:var(--font-body, 18px);color:var(--color-textSecondary, #5c5c5c);margin-top:var(--space-xs, 4px);line-height:var(--font-lineBody, 1.5)}.settings-select{display:block;width:auto;min-width:160px;max-width:100%;flex-shrink:0;font-family:var(--font-fontFamily, inherit);font-size:var(--font-body, 18px);font-weight:var(--font-weightMedium, 500);color:var(--color-textPrimary, #1a1a1a);background-color:var(--color-surfaceDark, #f0f0f0);border:none;border-radius:var(--radius-sm, 6px);padding:8px 12px;min-height:var(--touch-minimum, 48px);cursor:pointer;appearance:auto}.settings-select:focus-visible{outline:3px solid var(--color-focus, #2563eb);outline-offset:2px}.toggle-switch{display:inline-flex;align-items:center;gap:var(--space-sm, 8px);flex-shrink:0;background:none;border:none;cursor:pointer;padding:4px;font-family:var(--font-fontFamily, inherit);font-size:var(--font-body, 18px);min-height:var(--touch-minimum, 48px);min-width:var(--touch-minimum, 48px);border-radius:var(--radius-sm, 6px)}.toggle-switch:focus-visible{outline:3px solid var(--color-focus, #2563eb);outline-offset:2px}.toggle-track{position:relative;display:inline-block;width:56px;height:32px;background-color:var(--color-textTertiary, #8c8c8c);border-radius:var(--radius-full, 999px);flex-shrink:0;transition:background-color var(--motion-quick, .2s) var(--motion-ease-gentle, ease-out)}.toggle-thumb{position:absolute;top:4px;left:4px;width:24px;height:24px;background-color:#fff;border-radius:50%;transition:transform var(--motion-quick, .2s) var(--motion-ease-gentle, ease-out);box-shadow:0 1px 2px #00000026}.toggle-on .toggle-track{background-color:var(--color-primary, #1a237e)}.toggle-on .toggle-thumb{transform:translate(24px)}.toggle-label-text{font-size:var(--font-body, 18px);font-weight:var(--font-weightSemibold, 600);color:var(--color-textSecondary, #5c5c5c);line-height:1}.settings-footer{width:100%;max-width:460px;text-align:center;padding:var(--space-sm, 8px) 0}.settings-footer p{font-size:var(--font-body, 18px);color:var(--color-textTertiary, #8c8c8c)}.stats-screen{padding-top:var(--space-lg, 24px);gap:var(--space-lg, 24px)}.stats-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-sm, 8px);padding:var(--space-xl, 32px) var(--space-md, 16px);text-align:center;width:100%;max-width:400px}.stats-empty-state p{font-size:var(--font-bodyLarge, 20px);color:var(--color-textPrimary, #1a1a1a);font-weight:var(--font-weightMedium, 500)}.stats-empty-hint{font-size:var(--font-bodyLarge, 20px);color:var(--color-textSecondary, #5c5c5c)!important;font-weight:var(--font-weightRegular, 400)!important}.stats-overview{width:100%;max-width:460px;display:flex;flex-direction:column;gap:var(--space-md, 16px)}.stats-overview h2{font-size:var(--font-bodyLarge, 20px);font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a)}.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-sm, 8px)}.stat-card{background:var(--color-surface, #ffffff);border-radius:var(--radius-md, 12px);box-shadow:var(--elevation-low, 0px 1px 3px 0px rgba(0, 0, 0, .08));padding:var(--space-md, 16px);text-align:center;display:flex;flex-direction:column;align-items:center;gap:4px}.stat-card-value{font-size:var(--font-headingMd, 32px);font-weight:var(--font-weightSemibold, 600);color:var(--color-primary, #1a237e);line-height:1.1}.stat-card-label{font-size:var(--font-body, 18px);color:var(--color-textSecondary, #5c5c5c);font-weight:var(--font-weightMedium, 500)}.stats-section{width:100%;max-width:460px}.stats-section h2{font-size:var(--font-bodyLarge, 20px);font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a);margin-bottom:var(--space-sm, 8px)}.stats-summary-list{list-style:none;background:var(--color-surface, #ffffff);border-radius:var(--radius-md, 12px);box-shadow:var(--elevation-low, 0px 1px 3px 0px rgba(0, 0, 0, .08));padding:var(--space-md, 16px) var(--space-lg, 24px);display:flex;flex-direction:column;gap:var(--space-sm, 8px)}.stats-summary-list li{display:flex;justify-content:space-between;align-items:center;font-size:var(--font-body, 18px);padding:var(--space-xs, 4px) 0}.summary-label{color:var(--color-textSecondary, #5c5c5c);font-weight:var(--font-weightRegular, 400)}.summary-value{color:var(--color-textPrimary, #1a1a1a);font-weight:var(--font-weightSemibold, 600)}.guess-distribution{width:100%;max-width:460px;display:flex;flex-direction:column;gap:6px;background:var(--color-surface, #ffffff);border-radius:var(--radius-md, 12px);box-shadow:var(--elevation-low, 0px 1px 3px 0px rgba(0, 0, 0, .08));padding:var(--space-md, 16px) var(--space-lg, 24px)}.dist-row{display:flex;align-items:center;gap:var(--space-sm, 8px)}.dist-label{font-size:var(--font-body, 18px);font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a);width:16px;text-align:right;flex-shrink:0}.dist-bar-container{flex:1;height:24px;background-color:var(--color-surfaceDark, #f0f0f0);border-radius:var(--radius-sm, 6px);overflow:hidden}.dist-bar{height:100%;background-color:var(--color-primary, #1a237e);border-radius:var(--radius-sm, 6px);display:flex;align-items:center;justify-content:flex-end;padding-right:var(--space-sm, 8px);min-width:20px;transition:width .4s var(--motion-ease-gentle, ease-out)}.dist-count{font-size:var(--font-small, 14px);font-weight:var(--font-weightSemibold, 600);color:#fff;line-height:1}.stats-footer{width:100%;max-width:460px;text-align:center;padding:var(--space-sm, 8px) 0}.stats-footer p{font-size:var(--font-body, 18px);color:var(--color-textTertiary, #8c8c8c)}.collection-screen{padding-top:var(--space-lg, 24px);gap:var(--space-lg, 24px)}.collection-count{font-size:var(--font-body, 18px);font-weight:var(--font-weightMedium, 500);color:var(--color-textSecondary, #5c5c5c);text-align:center}.collection-grid{width:100%;max-width:460px;display:grid;grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:var(--space-sm, 8px)}.collection-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;background:var(--color-surface, #ffffff);border-radius:var(--radius-md, 12px);box-shadow:var(--elevation-low, 0px 1px 3px 0px rgba(0, 0, 0, .08));padding:var(--space-sm, 8px) var(--space-xs, 4px);min-height:72px;text-align:center}.collection-word{font-size:var(--font-body, 18px);font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a);line-height:1.2}.collection-attempts{font-size:var(--font-caption, 12px);color:var(--color-textSecondary, #5c5c5c);line-height:1}.collection-date{font-size:10px;color:var(--color-textTertiary, #8c8c8c);line-height:1}.home-screen .settings-toggle{width:100%;max-width:400px;padding:var(--space-sm, 8px) var(--space-md, 16px);background:transparent;min-height:var(--touch-minimum, 48px);border:none}.home-screen .settings-toggle-label{font-size:var(--font-body, 18px);font-weight:var(--font-weightMedium, 500);color:var(--color-textPrimary, #1a1a1a)}.home-nav{display:flex;gap:var(--space-xs, 4px);width:100%;max-width:420px;justify-content:center;padding:var(--space-xs, 4px);background:var(--color-surface, #ffffff);border-radius:var(--radius-lg, 20px);box-shadow:var(--elevation-mid, 0px 4px 12px 0px rgba(0, 0, 0, .1))}.nav-btn{flex:1;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:2px!important;font-size:var(--font-caption, 12px)!important;font-weight:var(--font-weightMedium, 500)!important;padding:var(--space-sm, 8px) var(--space-xs, 4px)!important;min-height:var(--touch-preferred, 56px)!important;min-width:auto!important;border-radius:var(--radius-md, 12px)!important;color:var(--color-textSecondary, #5c5c5c)!important;background:transparent!important;white-space:nowrap}.nav-btn:hover:not(:disabled){background-color:var(--color-surfaceDark, #f0f0f0)!important;color:var(--color-primary, #1a237e)!important}.nav-btn:active:not(:disabled){transform:scale(.96)}.nav-icon{font-size:26px;line-height:1;display:block}.version-badge{width:100%;display:flex;align-items:center;justify-content:center;gap:var(--space-sm, 8px);padding:var(--space-md, 16px) 0 var(--space-sm, 8px);font-size:var(--font-caption, 12px);color:var(--color-textTertiary, #8c8c8c);margin-top:auto;cursor:default;user-select:none}.version-badge span{font-size:var(--font-caption, 12px);color:var(--color-textTertiary, #8c8c8c)}.version-badge-env{display:inline-block;padding:1px 6px;border-radius:4px;background:var(--color-amberGlow, rgba(230, 81, 0, .1));color:var(--color-statusPresent, #e69f00);font-size:10px;font-weight:var(--font-weightSemibold, 600);letter-spacing:.04em}.stats-empty{font-size:var(--font-body, 18px);color:var(--color-textSecondary, #5c5c5c);text-align:center;padding:var(--space-md, 16px)}.home-streak{font-size:var(--font-bodyLarge, 20px);font-weight:var(--font-weightMedium, 500);color:var(--color-textSecondary, #5c5c5c);text-align:center;padding:0;margin:0}.daily-completed-badge{display:inline-flex;align-items:center;gap:var(--space-xs, 4px);font-size:var(--font-body, 18px);font-weight:var(--font-weightMedium, 500);color:var(--color-statusCorrect, #2e7d32);background:var(--color-statusCorrectBg, #e8f5e9);padding:var(--space-sm, 8px) var(--space-md, 16px);border-radius:var(--radius-full, 999px);margin-top:var(--space-sm, 8px)}.home-progression{width:100%;max-width:100%;padding:var(--space-md, 16px) 0}.premium-badge{display:inline-block;font-size:var(--font-caption, 12px);font-weight:var(--font-weightSemibold, 600);color:var(--color-premium, #5c4f8c);background:var(--color-premiumBg, #ede7f6);padding:2px var(--space-sm, 8px);border-radius:var(--radius-sm, 6px);text-transform:none;letter-spacing:0}.result-level{font-size:var(--font-bodyLarge, 20px);font-weight:var(--font-weightMedium, 500);color:var(--color-textSecondary, #5c5c5c);text-align:center}.result-progression{width:100%;max-width:400px}.progression-bar-container{display:flex;flex-direction:column;gap:var(--space-sm, 8px);width:100%}.progression-header{display:flex;justify-content:space-between;align-items:center;gap:var(--space-sm, 8px);flex-wrap:wrap;font-size:var(--font-body, 18px);color:var(--color-textSecondary, #5c5c5c)}.progression-level{font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a)}.progression-xp{font-weight:var(--font-weightMedium, 500);font-variant-numeric:tabular-nums}.progression-track{height:10px;background-color:var(--color-surfaceDark, #f0f0f0);border-radius:var(--radius-full, 999px);overflow:hidden}.progression-fill{height:100%;background-color:var(--color-primary, #1a237e);border-radius:var(--radius-full, 999px);transition:width var(--motion-durationSlow, .6s) var(--motion-ease-standard, ease-out)}.result-achievements{width:100%;max-width:400px}.result-achievements h3{font-size:var(--font-bodyLarge, 20px);font-weight:var(--font-weightSemibold, 600);margin-bottom:var(--space-sm, 8px);color:var(--color-textPrimary, #1a1a1a)}.result-achievement-list{display:flex;flex-direction:column;gap:var(--space-sm, 8px)}.achievement-badge{display:flex;align-items:center;gap:var(--space-md, 16px);padding:var(--space-sm, 8px) var(--space-md, 16px);background-color:var(--color-surfaceDark, #f0f0f0);border-radius:var(--radius-md, 12px);border:1px solid var(--color-borderLight, #e0e0e0)}.achievement-new{border-color:var(--color-statusCorrect, #2e7d32);background-color:var(--color-statusCorrectBg, #e8f5e9)}.achievement-icon{font-size:32px;flex-shrink:0;width:40px;text-align:center}.achievement-info{display:flex;flex-direction:column;gap:2px;min-width:0}.achievement-title{font-size:var(--font-body, 18px);font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a)}.achievement-desc{font-size:var(--font-small, 14px);color:var(--color-textSecondary, #5c5c5c)}.achievement-new-badge{flex-shrink:0;font-size:var(--font-small, 14px);font-weight:var(--font-weightSemibold, 600);color:var(--color-statusCorrect, #2e7d32);background-color:var(--color-statusCorrectBg, #e8f5e9);border-radius:var(--radius-full, 999px);padding:2px var(--space-sm, 8px)}.achievement-empty{text-align:center;color:var(--color-textSecondary, #5c5c5c);font-size:var(--font-body, 18px)}.hardmode-section{padding:var(--space-md, 16px) var(--space-lg, 24px);width:100%}.hardmode-section .settings-toggle{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md, 16px)}.home-section--play{padding:var(--space-lg, 24px)}.home-section--modes{padding:var(--space-lg, 24px);text-align:left}.admin-layout{display:flex;min-height:100vh}.admin-sidebar{width:260px;background-color:var(--color-primary, #1a237e);color:#fff;padding:var(--space-lg, 24px) var(--space-md, 16px);display:flex;flex-direction:column;flex-shrink:0}.admin-sidebar-header h1{font-size:var(--font-bodyLarge, 20px);font-weight:var(--font-weightSemibold, 600);margin-bottom:var(--space-xl, 32px);padding-bottom:var(--space-md, 16px);border-bottom:1px solid rgba(255,255,255,.2)}.admin-nav-list{list-style:none;display:flex;flex-direction:column;gap:4px}.admin-nav-link{display:block;color:#fffc;text-decoration:none;font-size:var(--font-body, 18px);padding:var(--space-sm, 8px) var(--space-md, 16px);border-radius:var(--radius-md, 12px);min-height:var(--touch-minimum, 48px);display:flex;align-items:center;transition:background-color var(--motion-quick, .2s) var(--motion-ease-gentle, ease-out)}.admin-nav-link:hover{background-color:#ffffff26;color:#fff}.admin-main{flex:1;padding:var(--space-xl, 32px);overflow-y:auto}.admin-page-header{margin-bottom:var(--space-xl, 32px)}.admin-page-header h1{font-size:var(--font-headingMd, 32px);font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a)}.admin-page-header p{font-size:var(--font-body, 18px);color:var(--color-textSecondary, #5c5c5c);margin-top:var(--space-sm, 8px)}.admin-stats-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--space-md, 16px);margin-bottom:var(--space-xl, 32px)}.admin-stat-card{background-color:var(--color-surface, #ffffff);border-radius:var(--radius-md, 12px);box-shadow:var(--elevation-low, 0px 1px 3px 0px rgba(0, 0, 0, .08));padding:var(--space-lg, 24px);text-align:center}.admin-stat-value{font-size:var(--font-headingMd, 32px);font-weight:var(--font-weightSemibold, 600);color:var(--color-primary, #1a237e)}.admin-stat-label{font-size:var(--font-small, 14px);color:var(--color-textSecondary, #5c5c5c);margin-top:4px}.admin-card{background-color:var(--color-surface, #ffffff);border-radius:var(--radius-md, 12px);box-shadow:var(--elevation-low, 0px 1px 3px 0px rgba(0, 0, 0, .08));padding:var(--space-lg, 24px);margin-bottom:var(--space-md, 16px)}.admin-card h2{font-size:var(--font-headingSm, 24px);font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a);margin-bottom:var(--space-md, 16px)}.admin-empty{font-size:var(--font-body, 18px);color:var(--color-textSecondary, #5c5c5c);padding:var(--space-lg, 24px);text-align:center}.admin-table{width:100%;border-collapse:collapse;font-size:var(--font-body, 18px)}.admin-table th{text-align:left;font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a);padding:var(--space-sm, 8px) var(--space-md, 16px);border-bottom:2px solid var(--color-surfaceDark, #f0f0f0)}.admin-table td{padding:var(--space-sm, 8px) var(--space-md, 16px);color:var(--color-textPrimary, #1a1a1a);border-bottom:1px solid var(--color-surfaceDark, #f0f0f0)}.admin-badge{display:inline-block;padding:2px var(--space-sm, 8px);border-radius:var(--radius-sm, 6px);font-size:var(--font-small, 14px);font-weight:var(--font-weightSemibold, 600)}.badge-active{background-color:var(--color-statusCorrectBg, #e8f5e9);color:var(--color-statusCorrect, #2e7d32)}.badge-inactive{background-color:var(--color-surfaceDark, #f0f0f0);color:var(--color-textSecondary, #5c5c5c)}@media(max-width:399px){.app-shell{padding:var(--space-sm, 8px)}.game-tile{width:44px;height:44px;font-size:28px}.keyboard-key{min-height:var(--touch-minimum, 48px);min-width:24px;padding:var(--space-xs, 4px) 6px;font-size:var(--font-small, 14px)}.home-section,.home-section--play,.home-section--modes{padding:var(--space-md, 16px)}.mode-card{padding:var(--space-sm, 8px) var(--space-md, 16px)}}@media(min-width:600px){.home-screen{padding-top:var(--space-xxl, 48px)}}@media(min-width:768px){.app-shell{padding:var(--space-xl, 32px)}.game-tile{width:64px;height:64px}.home-section,.home-section--play,.home-section--modes{padding:var(--space-xl, 32px)}}@media(min-width:1024px){.home-screen{padding-top:var(--space-xxxl, 64px)}}.multiplayer-hub-screen{padding-top:var(--space-xl, 32px);gap:var(--space-lg, 24px)}.multiplayer-hub-header{text-align:center;display:flex;flex-direction:column;gap:var(--space-sm, 8px)}.multiplayer-hub-title{font-size:var(--font-headingLg, 40px);font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a);margin:0}.multiplayer-hub-subtitle{font-size:var(--font-bodyLarge, 20px);color:var(--color-textSecondary, #5c5c5c);margin:0}.multiplayer-option-card{display:flex;align-items:center;gap:var(--space-md, 16px);width:100%;max-width:480px;padding:var(--space-lg, 24px);background:var(--color-surface, #ffffff);border:none;border-radius:var(--radius-lg, 20px);box-shadow:var(--elevation-low, 0px 1px 3px 0px rgba(0, 0, 0, .08));cursor:pointer;font-family:var(--font-fontFamily, inherit);text-align:left;min-height:var(--touch-preferred, 56px);transition:transform .1s ease,box-shadow .15s ease,background .15s ease;user-select:none}.multiplayer-option-card:hover{transform:translateY(-2px);box-shadow:var(--elevation-mid, 0px 4px 12px 0px rgba(0, 0, 0, .1));background:var(--color-surfaceHover, #f5f5f3)}.multiplayer-option-card:active{transform:scale(.98)}.multiplayer-option-card:focus-visible{outline:3px solid var(--color-focus, #2563eb);outline-offset:2px}.multiplayer-option-icon{font-size:40px;flex-shrink:0;width:56px;height:56px;display:flex;align-items:center;justify-content:center}.multiplayer-option-content{flex:1;display:flex;flex-direction:column;gap:4px}.multiplayer-option-title{font-size:var(--font-headingSm, 24px);font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a);line-height:1.2}.multiplayer-option-desc{font-size:var(--font-body, 18px);color:var(--color-textSecondary, #5c5c5c);line-height:1.4}.multiplayer-option-arrow{font-size:24px;color:var(--color-textTertiary, #8c8c8c);flex-shrink:0}.multiplayer-section-title{font-size:var(--font-headingMd, 32px);font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a);margin:0;text-align:center}.multiplayer-hint{font-size:var(--font-bodyLarge, 20px);color:var(--color-textSecondary, #5c5c5c);text-align:center;max-width:400px;line-height:1.5}.create-room-screen{padding-top:var(--space-xl, 32px);gap:var(--space-lg, 24px)}.room-code-display{display:flex;flex-direction:column;align-items:center;gap:var(--space-sm, 8px);padding:var(--space-lg, 24px) var(--space-xl, 32px);background:var(--color-surfaceDark, #f0f0f0);border-radius:var(--radius-lg, 20px);width:100%;max-width:400px}.room-code-label{font-size:var(--font-body, 18px);color:var(--color-textSecondary, #5c5c5c);font-weight:var(--font-weightMedium, 500)}.room-code-value{font-size:48px;font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a);letter-spacing:.15em;font-variant-numeric:tabular-nums;line-height:1.1}.qr-code-container{display:flex;align-items:center;justify-content:center;padding:var(--space-md, 16px);background:#fff;border-radius:var(--radius-lg, 20px);box-shadow:var(--elevation-low, 0px 1px 3px 0px rgba(0, 0, 0, .08))}.qr-code-image{display:block;width:240px;height:240px}.qr-code-fallback{width:240px;height:240px;display:flex;align-items:center;justify-content:center;background:var(--color-surfaceDark, #f0f0f0);border-radius:var(--radius-md, 12px)}.qr-code-fallback-text{font-size:28px;font-weight:var(--font-weightSemibold, 600);text-align:center;line-height:1.3;color:var(--color-textPrimary, #1a1a1a)}.room-share-hint{font-size:var(--font-bodyLarge, 20px);color:var(--color-textSecondary, #5c5c5c);text-align:center;max-width:420px;line-height:1.5}.room-actions{display:flex;flex-direction:column;gap:var(--space-sm, 8px);width:100%;max-width:400px}.join-room-screen{padding-top:var(--space-xl, 32px);gap:var(--space-lg, 24px)}.join-code-input-group{width:100%;max-width:400px;display:flex;flex-direction:column;gap:var(--space-sm, 8px)}.join-code-label{font-size:var(--font-bodyLarge, 20px);font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a)}.join-code-input{font-family:var(--font-fontFamily, inherit);font-size:36px;font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a);background:var(--color-surface, #ffffff);border:2px solid var(--color-textTertiary, #8c8c8c);border-radius:var(--radius-md, 12px);padding:16px 20px;text-align:center;letter-spacing:.2em;text-transform:uppercase;min-height:var(--touch-preferred, 56px);width:100%}.join-code-input:focus{border-color:var(--color-focus, #2563eb);outline:none;box-shadow:0 0 0 3px #2563eb33}.join-code-input::placeholder{color:var(--color-textTertiary, #8c8c8c);font-size:24px;letter-spacing:.1em}.join-code-hint{font-size:var(--font-body, 18px);color:var(--color-textSecondary, #5c5c5c);text-align:center;line-height:1.5}.join-scan-section{width:100%;max-width:400px;text-align:center;padding:var(--space-md, 16px);background:var(--color-surfaceDark, #f0f0f0);border-radius:var(--radius-md, 12px)}.join-scan-hint{font-size:var(--font-body, 18px);color:var(--color-textSecondary, #5c5c5c);margin-bottom:var(--space-sm, 8px)}.join-scan-note{font-size:var(--font-small, 14px);color:var(--color-textTertiary, #8c8c8c)}.pass-and-play-screen{padding-top:var(--space-xl, 32px);gap:var(--space-lg, 24px)}.passplay-name-inputs{display:flex;flex-direction:column;gap:var(--space-md, 16px);width:100%;max-width:400px}.passplay-name-label{display:flex;flex-direction:column;gap:var(--space-sm, 8px);font-size:var(--font-bodyLarge, 20px);font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a)}.passplay-name-input{font-family:var(--font-fontFamily, inherit);font-size:var(--font-bodyLarge, 20px);color:var(--color-textPrimary, #1a1a1a);background:var(--color-surface, #ffffff);border:2px solid var(--color-textTertiary, #8c8c8c);border-radius:var(--radius-md, 12px);padding:12px 16px;min-height:var(--touch-preferred, 56px);width:100%}.passplay-name-input:focus{border-color:var(--color-focus, #2563eb);outline:none;box-shadow:0 0 0 3px #2563eb33}.passplay-handover{justify-content:center;text-align:center;min-height:70dvh}.passplay-handover-title{font-size:var(--font-headingLg, 40px);font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a);margin:0}.passplay-handover-icon{font-size:80px;line-height:1}.passplay-handover-message{font-size:var(--font-bodyLarge, 20px);color:var(--color-textSecondary, #5c5c5c);max-width:380px;line-height:1.6;margin:0 auto}.passplay-handover-next{font-size:var(--font-headingSm, 24px);font-weight:var(--font-weightSemibold, 600);color:var(--color-primary, #1a237e);margin:0}.passplay-results{padding-top:var(--space-xl, 32px);gap:var(--space-lg, 24px)}.passplay-winner{text-align:center;padding:var(--space-md, 16px)}.passplay-winner-text{font-size:var(--font-headingMd, 32px);font-weight:var(--font-weightSemibold, 600);color:var(--color-primary, #1a237e);margin:0;animation:xp-pop .4s var(--motion-ease-bouncy, ease-out)}.passplay-result-card{width:100%;max-width:400px;padding:var(--space-lg, 24px);background:var(--color-surface, #ffffff);border-radius:var(--radius-md, 12px);box-shadow:var(--elevation-low, 0px 1px 3px 0px rgba(0, 0, 0, .08));display:flex;flex-direction:column;gap:var(--space-sm, 8px)}.passplay-result-card h2{font-size:var(--font-headingSm, 24px);font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a);margin:0}.passplay-result-card p{font-size:var(--font-bodyLarge, 20px);color:var(--color-textSecondary, #5c5c5c);margin:0}.passplay-hints{font-size:var(--font-body, 18px)!important;color:var(--color-textTertiary, #8c8c8c)!important}.passplay-result-actions{display:flex;gap:var(--space-md, 16px);width:100%;max-width:400px;justify-content:center;flex-wrap:wrap}.passplay-answer-reveal{width:100%;max-width:400px;text-align:center;padding:var(--space-md, 16px);background:var(--color-surfaceDark, #f0f0f0);border-radius:var(--radius-md, 12px);font-size:var(--font-bodyLarge, 20px);font-weight:var(--font-weightMedium, 500);color:var(--color-textPrimary, #1a1a1a)}.error-text{font-size:var(--font-body, 18px);color:var(--color-danger, #c62828);text-align:center;margin:0}.multiplayer-instructions{padding:var(--space-md, 12px) var(--space-lg, 20px);margin:0 var(--space-md, 16px);background:var(--color-surfaceDark, #f0f0f0);border-radius:var(--radius-md, 12px);border-left:4px solid var(--color-primary, #1a237e);text-align:center}.multiplayer-instructions p{margin:0;font-size:var(--font-bodyLarge, 20px);color:var(--color-textPrimary, #1a1a1a);line-height:1.5}.multiplayer-disconnect-area{display:flex;justify-content:center;padding:var(--space-lg, 24px) var(--space-md, 16px);margin-top:var(--space-md, 16px)}.multiplayer-disconnect-area .btn{min-width:200px;min-height:48px;font-size:var(--font-body, 18px)}.modal-backdrop{position:fixed;inset:0;z-index:1000;display:flex;align-items:flex-end;justify-content:center;background:#0006;backdrop-filter:blur(4px);animation:modal-fade-in .2s ease-out}@keyframes modal-fade-in{0%{opacity:0}to{opacity:1}}.modal-dialog{display:flex;flex-direction:column;width:100%;max-height:90dvh;background:var(--color-background, #fafaf8);border-radius:var(--radius-xl, 28px) var(--radius-xl, 28px) 0 0;box-shadow:var(--elevation-float, 0px 16px 48px 0px rgba(0, 0, 0, .18));outline:none;overflow:hidden;animation:modal-slide-up .3s var(--motion-ease-gentle, ease-out)}@keyframes modal-slide-up{0%{transform:translateY(100%)}to{transform:translateY(0)}}@media(min-width:600px){.modal-backdrop{align-items:center}.modal-dialog{max-width:640px;max-height:85dvh;border-radius:var(--radius-xl, 28px);margin:var(--space-lg, 24px);animation:modal-scale-in .25s var(--motion-ease-gentle, ease-out)}@keyframes modal-scale-in{0%{opacity:0;transform:scale(.95) translateY(16px)}to{opacity:1;transform:scale(1) translateY(0)}}}@media(min-width:900px){.modal-dialog{max-width:760px}}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-lg, 24px) var(--space-lg, 24px) var(--space-md, 16px);flex-shrink:0}.modal-title{font-size:var(--font-headingSm, 24px);font-weight:var(--font-weightSemibold, 600);color:var(--color-textPrimary, #1a1a1a);margin:0}.modal-close-btn{display:inline-flex;align-items:center;justify-content:center;width:var(--touch-preferred, 56px);height:var(--touch-preferred, 56px);border:none;border-radius:var(--radius-md, 12px);background:var(--color-surfaceDark, #f0f0f0);color:var(--color-textSecondary, #5c5c5c);font-size:24px;cursor:pointer;flex-shrink:0;transition:background .15s ease,color .15s ease}.modal-close-btn:hover{background:var(--color-textTertiary, #8c8c8c);color:#fff}.modal-close-btn:active{transform:scale(.95)}.modal-body{flex:1;overflow-y:auto;padding:var(--space-md, 16px) var(--space-lg, 24px) var(--space-xl, 32px);-webkit-overflow-scrolling:touch}.modal-subtitle{font-size:var(--font-body, 18px);color:var(--color-textSecondary, #5c5c5c);margin:0 0 var(--space-lg, 24px);line-height:var(--font-lineBody, 1.5)}.home-more-modes-btn{width:100%;max-width:100%;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-sm, 8px);font-size:var(--font-bodyLarge, 20px);min-height:var(--touch-preferred, 56px);border:none;background:var(--color-premiumBg, #ede7f6);color:var(--color-primary, #1a237e);border-radius:var(--radius-lg, 20px);box-shadow:var(--elevation-low, 0px 1px 3px 0px rgba(0, 0, 0, .08));cursor:pointer;transition:background .15s ease,transform .1s ease}.home-more-modes-btn:hover{background:var(--color-primaryLight, #534bae);color:#fff}.home-more-modes-btn:active{transform:scale(.98)}[data-reduced-motion=true] .modal-backdrop,[data-reduced-motion=true] .modal-dialog{animation:none}.season-backdrop{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:-1}.season-backdrop__field{position:absolute;width:60vmax;height:60vmax;border-radius:50%;filter:blur(80px);opacity:.35;animation:season-drift 60s ease-in-out infinite alternate}.season-backdrop__field--a{top:-20vmax;left:-15vmax}.season-backdrop__field--b{bottom:-25vmax;right:-15vmax;animation-delay:-30s}@keyframes season-drift{0%{transform:translateZ(0) scale(1)}to{transform:translate3d(6vmax,4vmax,0) scale(1.15)}}.season-backdrop--summer .season-backdrop__field--a{background:radial-gradient(circle,rgba(255,214,102,.5),transparent 70%)}.season-backdrop--summer .season-backdrop__field--b{background:radial-gradient(circle,rgba(129,199,245,.45),transparent 70%)}.season-backdrop--autumn .season-backdrop__field--a{background:radial-gradient(circle,rgba(230,126,34,.4),transparent 70%)}.season-backdrop--autumn .season-backdrop__field--b{background:radial-gradient(circle,rgba(192,57,43,.3),transparent 70%)}.season-backdrop--winter .season-backdrop__field--a{background:radial-gradient(circle,rgba(174,214,241,.45),transparent 70%)}.season-backdrop--winter .season-backdrop__field--b{background:radial-gradient(circle,rgba(213,219,230,.4),transparent 70%)}.season-backdrop--spring .season-backdrop__field--a{background:radial-gradient(circle,rgba(163,217,165,.45),transparent 70%)}.season-backdrop--spring .season-backdrop__field--b{background:radial-gradient(circle,rgba(255,224,178,.4),transparent 70%)}[data-reduced-motion=true] .season-backdrop__field{animation:none}.theme-picker{display:flex;flex-wrap:wrap;gap:var(--space-sm, 8px)}.theme-option{display:inline-flex;align-items:center;gap:var(--space-sm, 8px);min-height:var(--touch-minimum, 48px);padding:var(--space-sm, 8px) var(--space-md, 16px);border:none;border-radius:var(--radius-md, 12px);background:var(--color-surface, #ffffff);color:var(--color-textPrimary, #1a1a1a);font-size:var(--font-body, 18px);cursor:pointer;box-shadow:var(--elevation-low, 0px 1px 3px 0px rgba(0, 0, 0, .08));transition:box-shadow .15s ease}.theme-option--selected{box-shadow:0 0 0 3px var(--color-focus, #2563eb),var(--elevation-low, 0px 1px 3px 0px rgba(0, 0, 0, .08))}.theme-option--locked{opacity:.55;cursor:default}.theme-option__lock{display:flex;color:var(--color-textSecondary, #5c5c5c)}.theme-swatch{width:28px;height:28px;border-radius:var(--radius-sm, 6px);flex-shrink:0;box-shadow:inset 0 0 0 1px #0000001f}.theme-swatch--light{background:linear-gradient(135deg,#fafaf8 50%,#fff 50%)}.theme-swatch--hav{background:linear-gradient(135deg,#f0f5f7 50%,#aec6d4 50%)}.theme-swatch--dark{background:linear-gradient(135deg,#000 50%,#2a2a2a 50%)}.settings-theme-note{margin-top:var(--space-sm, 8px)}.paywall-dialog .modal-body{display:flex;flex-direction:column;gap:var(--space-md, 16px)}.paywall-expired-notice{padding:var(--space-sm, 8px) var(--space-md, 16px);background:var(--color-premiumBg, #ede7f6);color:var(--color-textPrimary, #1a1a1a);border-left:4px solid var(--color-premium, #5c4f8c);border-radius:var(--radius-sm, 6px)}.paywall-benefits{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--space-sm, 8px)}.paywall-benefit{display:flex;align-items:flex-start;gap:var(--space-sm, 8px);color:var(--color-textPrimary, #1a1a1a)}.paywall-benefit__check{color:var(--color-statusCorrect, #2e7d32);flex-shrink:0;margin-top:2px}.paywall-packages{display:flex;flex-direction:column;gap:var(--space-sm, 8px)}.paywall-package{display:flex;justify-content:space-between;align-items:center;gap:var(--space-md, 16px);width:100%;min-height:56px;padding:var(--space-sm, 8px) var(--space-md, 16px);background:var(--color-surface, #ffffff);border:2px solid var(--color-borderLight, #e0e0e0);border-radius:var(--radius-md, 12px);cursor:pointer;font:inherit;text-align:left}.paywall-package:focus-visible{outline:3px solid var(--color-focus, #2563eb);outline-offset:2px}.paywall-package--selected{border-color:var(--color-premium, #5c4f8c);background:var(--color-premiumBg, #ede7f6)}.paywall-package--selected .paywall-package__price{font-weight:var(--font-weightSemibold, 600)}.paywall-package__title{font-weight:var(--font-weightMedium, 500);color:var(--color-textPrimary, #1a1a1a)}.paywall-package__price{color:var(--color-textSecondary, #5c5c5c);white-space:nowrap}.paywall-purchase-btn{min-height:48px}.paywall-error{color:var(--color-danger, #c62828);margin:0}.paywall-status{color:var(--color-textSecondary, #5c5c5c);margin:0}.paywall-success{display:flex;flex-direction:column;gap:var(--space-md, 16px);align-items:flex-start}.paywall-fineprint{font-size:var(--font-caption, 12px);color:var(--color-textTertiary, #8c8c8c);margin:0}.premium-status-banner{display:flex;flex-direction:column;gap:var(--space-sm, 8px);margin:var(--space-sm, 8px) auto;max-width:640px;padding:var(--space-md, 16px);background:var(--color-premiumBg, #ede7f6);border:1px solid var(--color-premium, #5c4f8c);border-radius:var(--radius-md, 12px)}.premium-status-banner__text{margin:0;color:var(--color-textPrimary, #1a1a1a)}.premium-status-banner__actions,.settings-premium-actions{display:flex;gap:var(--space-sm, 8px);flex-wrap:wrap}button.mode-card{font:inherit;text-align:left;cursor:pointer}button.mode-card:focus-visible{outline:3px solid var(--color-focus, #2563eb);outline-offset:2px}
