:root{--color-text-primary: #0d0d0d;--color-text-secondary: #5d5d5d;--color-text-tertiary: #909090;--color-text-inverted: #ffffff;--color-background: #ffffff;--color-background-secondary: #f0f0ff;--color-background-tertiary: #fff5ff;--color-border: rgba(255, 158, 199, .2);--color-border-hover: rgba(255, 158, 199, .35);--color-primary: #ff9ec7;--color-primary-hover: #ff8ab8;--color-primary-active: #ff76a9;--color-accent-blue: #5de4ff;--color-accent-green: #7affb0;--color-accent-pink: #ff9ec7;--color-accent-yellow: #fff9a5;--color-wordle-correct: var(--color-accent-green);--color-wordle-present: var(--color-accent-yellow);--color-wordle-absent: var(--color-text-tertiary);--color-wordle-empty: var(--color-background-secondary);--color-wordle-text-correct: #0d0d0d;--color-wordle-text-present: #0d0d0d;--color-wordle-text-absent: #ffffff;--color-success: #3aff7d;--color-success-hover: #2aff6d;--color-error: #ff5a8d;--color-error-hover: #ff4a7d;--color-warning: #ffcc55;--color-warning-hover: #ffbb44;--font-family-system: "Roboto", -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Segoe UI", "Helvetica Neue", Arial, sans-serif;--font-family-title: "Fredoka One", cursive;--font-family-mono: "SF Mono", "Monaco", "Menlo", "Courier New", monospace;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-full: 9999px;--transition-fast: .15s ease;--transition-base: .2s ease;--transition-slow: .3s ease;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px rgba(0, 0, 0, .1);--shadow-lg: 0 8px 16px rgba(0, 0, 0, .15);--z-base: 1;--z-dropdown: 100;--z-modal: 200;--z-tooltip: 300}body.light-system,html.light-system{background-color:#fff;--color-background: #ffffff;--color-background-secondary: #f0f0ff;--color-background-tertiary: #fff5ff;--color-text-primary: #0d0d0d;--color-text-secondary: #5d5d5d;--color-text-tertiary: #909090;--color-text-inverted: #ffffff;--color-primary: #ff9ec7;--color-primary-hover: #ff8ab8;--color-primary-active: #ff76a9;--color-accent-blue: #5de4ff;--color-accent-green: #7affb0;--color-accent-pink: #ff9ec7;--color-accent-yellow: #fff9a5;--color-success: #3aff7d;--color-success-hover: #2aff6d;--color-error: #ff5a8d;--color-error-hover: #ff4a7d;--color-warning: #ffcc55;--color-warning-hover: #ffbb44;--color-border: rgba(255, 158, 199, .2);--color-border-hover: rgba(255, 158, 199, .35);--color-wordle-correct: var(--color-accent-green);--color-wordle-present: var(--color-accent-yellow);--color-wordle-absent: var(--color-text-tertiary);--color-wordle-empty: var(--color-background-secondary);--color-wordle-text-correct: #0d0d0d;--color-wordle-text-present: #0d0d0d;--color-wordle-text-absent: #ffffff}body.dark-system,html.dark-system{background-color:#212121;--color-background: #212121;--color-background-secondary: #303030;--color-background-tertiary: #414141;--color-text-primary: #ffffff;--color-text-secondary: #cdcdcd;--color-text-tertiary: #afafaf;--color-text-inverted: #0d0d0d;--color-primary: #ff71ce;--color-primary-hover: #ff8dd8;--color-primary-active: #ffa9e2;--color-accent-cyan: #01cdfe;--color-accent-green: #05ffa1;--color-accent-pink: #ff71ce;--color-accent-yellow: #fffb96;--color-success: #05ffa1;--color-success-hover: #1affb0;--color-error: #ff4677;--color-error-hover: #ff6b91;--color-warning: #fffb96;--color-warning-hover: #fffcb0;--color-border: rgba(255, 255, 255, .12);--color-border-hover: rgba(255, 255, 255, .2);--color-wordle-correct: var(--color-accent-green);--color-wordle-present: var(--color-accent-yellow);--color-wordle-absent: var(--color-text-tertiary);--color-wordle-empty: var(--color-background-secondary);--color-wordle-text-correct: #0d0d0d;--color-wordle-text-present: #0d0d0d;--color-wordle-text-absent: #ffffff}body.light-gpt,html.light-gpt{background-color:#fff;--color-background: #ffffff;--color-background-secondary: #e8e8e8;--color-background-tertiary: #f3f3f3;--color-text-primary: #0d0d0d;--color-text-secondary: #5d5d5d;--color-text-tertiary: #909090;--color-text-inverted: #ffffff;--color-primary: #0285ff;--color-primary-hover: #0270cc;--color-primary-active: #015a99;--color-error: #c82925;--color-warning: #e25605;--color-success: #008635;--color-success-hover: #006a2a;--color-border: rgba(13, 13, 13, .12);--color-border-hover: rgba(13, 13, 13, .2);--color-wordle-correct: var(--color-success);--color-wordle-present: var(--color-warning);--color-wordle-absent: var(--color-text-tertiary);--color-wordle-empty: var(--color-background-secondary);--color-wordle-text-correct: #ffffff;--color-wordle-text-present: #ffffff;--color-wordle-text-absent: #ffffff}body.dark-gpt,html.dark-gpt{background-color:#212121;--color-background: #212121;--color-background-secondary: #303030;--color-background-tertiary: #414141;--color-text-primary: #ffffff;--color-text-secondary: #cdcdcd;--color-text-tertiary: #afafaf;--color-text-inverted: #0d0d0d;--color-primary: #48aaff;--color-primary-hover: #6bb8ff;--color-primary-active: #7cc3ff;--color-error: #ff8583;--color-warning: #ff9e6c;--color-success: #41c977;--color-success-hover: #5dd18a;--color-border: rgba(255, 255, 255, .12);--color-border-hover: rgba(255, 255, 255, .2);--color-wordle-correct: var(--color-success);--color-wordle-present: var(--color-warning);--color-wordle-absent: var(--color-text-tertiary);--color-wordle-empty: var(--color-background-secondary);--color-wordle-text-correct: #0d0d0d;--color-wordle-text-present: #0d0d0d;--color-wordle-text-absent: #ffffff}@media(prefers-color-scheme:dark){:root{--color-background: #212121;--color-background-secondary: #303030;--color-background-tertiary: #414141;--color-text-primary: #ffffff;--color-text-secondary: #cdcdcd;--color-text-tertiary: #afafaf;--color-text-inverted: #0d0d0d;--color-primary: #ff71ce;--color-primary-hover: #ff8dd8;--color-primary-active: #ffa9e2;--color-accent-cyan: #01cdfe;--color-accent-green: #05ffa1;--color-accent-pink: #ff71ce;--color-accent-yellow: #fffb96;--color-success: #05ffa1;--color-success-hover: #1affb0;--color-error: #ff4677;--color-error-hover: #ff6b91;--color-warning: #fffb96;--color-warning-hover: #fffcb0;--color-border: rgba(255, 255, 255, .12);--color-border-hover: rgba(255, 255, 255, .2);--color-wordle-correct: var(--color-accent-green);--color-wordle-present: var(--color-accent-yellow);--color-wordle-absent: var(--color-text-tertiary);--color-wordle-empty: var(--color-background-secondary);--color-wordle-text-correct: #0d0d0d;--color-wordle-text-present: #0d0d0d;--color-wordle-text-absent: #ffffff}}.wordlove-game.chatgpt-widget,body.chatgpt-widget,html.chatgpt-widget,.chatgpt-widget{--widget-background: var(--color-background);--widget-text: var(--color-text-primary);--color-background: #ffffff;--color-background-secondary: #e8e8e8;--color-background-tertiary: #f3f3f3;--color-text-primary: #0d0d0d;--color-text-secondary: #5d5d5d;--color-text-tertiary: #909090;--color-text-inverted: #ffffff;--color-primary: #0285ff;--color-primary-hover: #0270cc;--color-primary-active: #015a99;--color-error: #c82925;--color-warning: #e25605;--color-success: #008635;--color-success-hover: #006a2a;--color-border: rgba(13, 13, 13, .12);--color-border-hover: rgba(13, 13, 13, .2);--color-wordle-correct: #008635;--color-wordle-present: #e25605;--color-wordle-absent: #909090;--color-wordle-empty: #e8e8e8;--color-wordle-text-correct: #ffffff;--color-wordle-text-present: #ffffff;--color-wordle-text-absent: #ffffff}@media(prefers-color-scheme:dark){.wordlove-game.chatgpt-widget,body.chatgpt-widget,html.chatgpt-widget,.chatgpt-widget{--color-background: #212121;--color-background-secondary: #303030;--color-background-tertiary: #414141;--color-text-primary: #ffffff;--color-text-secondary: #cdcdcd;--color-text-tertiary: #afafaf;--color-text-inverted: #0d0d0d;--color-primary: #48aaff;--color-primary-hover: #6bb8ff;--color-primary-active: #7cc3ff;--color-error: #ff8583;--color-warning: #ff9e6c;--color-success: #41c977;--color-success-hover: #5dd18a;--color-border: rgba(255, 255, 255, .12);--color-border-hover: rgba(255, 255, 255, .2);--color-wordle-correct: #41c977;--color-wordle-present: #ff9e6c;--color-wordle-absent: #afafaf;--color-wordle-empty: #303030;--color-wordle-text-correct: #0d0d0d;--color-wordle-text-present: #0d0d0d;--color-wordle-text-absent: #ffffff}}.ds-text-primary{color:var(--color-text-primary)}.ds-text-secondary{color:var(--color-text-secondary)}.ds-text-tertiary{color:var(--color-text-tertiary)}.ds-bg-primary{background-color:var(--color-background)}.ds-bg-secondary{background-color:var(--color-background-secondary)}.ds-border{border:1px solid var(--color-border)}.ds-font-system{font-family:var(--font-family-system)}.ds-font-mono{font-family:var(--font-family-mono)}*[style*="background-color: var(--color-primary)"],*[style*="background: var(--color-primary)"],*[class*=primary][class*=button],button[class*=primary],.button-primary,.btn-primary{color:var(--color-text-inverted)!important}*[style*="background-color: var(--color-background-secondary)"],*[style*="background: var(--color-background-secondary)"],*[style*="background-color: var(--color-background-tertiary)"],*[style*="background: var(--color-background-tertiary)"]{color:var(--color-text-primary)}*[style*="background-color: var(--color-success)"],*[style*="background: var(--color-success)"],*[style*="background-color: var(--color-error)"],*[style*="background: var(--color-error)"],*[style*="background-color: var(--color-warning)"],*[style*="background: var(--color-warning)"]{color:var(--color-text-inverted)!important}body.light-system,html.light-system,body.light-gpt,html.light-gpt,body.dark-system,html.dark-system,body.dark-gpt,html.dark-gpt{color:var(--color-text-primary)}body.light-system *[style*="background-color: var(--color-primary)"],body.light-system *[style*="background: var(--color-primary)"],html.light-system *[style*="background-color: var(--color-primary)"],html.light-system *[style*="background: var(--color-primary)"],body.light-gpt *[style*="background-color: var(--color-primary)"],body.light-gpt *[style*="background: var(--color-primary)"],html.light-gpt *[style*="background-color: var(--color-primary)"],html.light-gpt *[style*="background: var(--color-primary)"],body.dark-system *[style*="background-color: var(--color-primary)"],body.dark-system *[style*="background: var(--color-primary)"],html.dark-system *[style*="background-color: var(--color-primary)"],html.dark-system *[style*="background: var(--color-primary)"],body.dark-gpt *[style*="background-color: var(--color-primary)"],body.dark-gpt *[style*="background: var(--color-primary)"],html.dark-gpt *[style*="background-color: var(--color-primary)"],html.dark-gpt *[style*="background: var(--color-primary)"]{color:var(--color-text-inverted)!important}html{background-color:var(--color-background);color:var(--color-text-primary)}html *{color:inherit}html *[style*="background-color: var(--color-primary)"],html *[style*="background: var(--color-primary)"],html button[style*="background-color: var(--color-primary)"],html button[style*="background: var(--color-primary)"]{color:var(--color-text-inverted)!important}:root{font-family:var(--font-family-system);line-height:1.5;font-weight:var(--font-weight-regular);color-scheme:light dark;color:var(--color-text-primary);background-color:var(--color-background);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{font-family:var(--font-family-system)}a{font-weight:var(--font-weight-medium);color:var(--color-primary);text-decoration:inherit}a:hover{color:var(--color-primary-hover)}body{margin:0;min-width:320px;min-height:100vh;background-color:var(--color-background);color:var(--color-text-primary);font-family:var(--font-family-system)}h1{font-size:3.2em;line-height:1.1}button{border-radius:var(--radius-md);border:1px solid transparent;padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);font-family:inherit;background-color:var(--color-background-secondary);color:var(--color-text-primary);cursor:pointer;transition:border-color var(--transition-base)}button:hover{border-color:var(--color-primary)}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:var(--color-text-primary);background-color:var(--color-background)}a:hover{color:var(--color-primary-hover)}button{background-color:var(--color-background-secondary)}}.number-guess-game{max-width:500px;margin:0 auto;padding:2rem;text-align:center}.number-guess-game h2{color:var(--color-primary);margin-bottom:var(--spacing-md)}.counter-display{background-color:var(--color-primary);color:var(--color-text-inverted);padding:var(--spacing-md);border-radius:var(--radius-lg);margin-bottom:var(--spacing-lg);display:flex;justify-content:space-between;align-items:center;box-shadow:var(--shadow-md)}.counter-label{font-size:.9rem;opacity:.9}.counter-value{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);font-family:var(--font-family-mono);background:#fff3;padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);min-width:80px;text-align:center}.instructions{margin-bottom:var(--spacing-xl);color:var(--color-text-tertiary)}.guess-form{display:flex;gap:var(--spacing-md);margin-bottom:var(--spacing-xl);justify-content:center}.guess-input{padding:var(--spacing-sm);font-size:var(--font-size-base);border:2px solid var(--color-primary);border-radius:var(--radius-md);width:200px;text-align:center;background-color:var(--color-background);color:var(--color-text-primary)}.guess-input:focus{outline:none;border-color:var(--color-primary-hover)}.guess-button{padding:var(--spacing-sm) var(--spacing-lg);font-size:var(--font-size-base);background-color:var(--color-primary);color:var(--color-text-inverted);border:none;border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--transition-base);font-weight:var(--font-weight-medium)}.guess-button:hover{background-color:var(--color-primary-hover)}.game-info{margin-bottom:2rem}.message{font-size:1.1rem;font-weight:700;margin-bottom:.5rem;min-height:1.5rem}.attempts{color:var(--color-text-tertiary);font-size:var(--font-size-sm)}.guesses{color:var(--color-text-secondary);font-size:var(--font-size-xs);margin-top:var(--spacing-sm)}.error{color:var(--color-error);font-weight:var(--font-weight-bold);margin-bottom:var(--spacing-sm)}.guess-button:disabled{opacity:.6;cursor:not-allowed}.new-game-button{padding:var(--spacing-sm) var(--spacing-lg);font-size:var(--font-size-base);background-color:var(--color-success);color:var(--color-text-inverted);border:none;border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--transition-base);font-weight:var(--font-weight-medium)}.new-game-button:hover{background-color:var(--color-success-hover)}.game-actions{display:flex;gap:var(--spacing-md);justify-content:center;margin-top:var(--spacing-md)}.fullscreen-button{padding:var(--spacing-sm) var(--spacing-lg);font-size:var(--font-size-base);background-color:var(--color-primary);color:var(--color-text-inverted);border:none;border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--transition-base);font-weight:var(--font-weight-medium)}.fullscreen-button:hover{background-color:var(--color-primary-hover)}.virtual-keyboard{display:flex;flex-direction:column;gap:var(--spacing-sm);margin-top:var(--spacing-lg);align-items:center}.keyboard-row{display:flex;gap:var(--spacing-xs);justify-content:center}.keyboard-key{min-width:32px;height:48px;padding:0 var(--spacing-sm);font-family:var(--font-family-system);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);background-color:var(--color-wordle-empty);border:none;border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-base);text-transform:uppercase;-webkit-user-select:none;user-select:none}.keyboard-key:hover:not(:disabled){background-color:var(--color-border-hover);transform:translateY(-1px)}.keyboard-key:active:not(:disabled){transform:translateY(0)}.keyboard-key:disabled{opacity:.5;cursor:not-allowed}.keyboard-key.special{min-width:64px;font-size:var(--font-size-xs)}.keyboard-key.correct{background-color:var(--color-wordle-correct);color:var(--color-wordle-text-correct)}.keyboard-key.present{background-color:var(--color-wordle-present);color:var(--color-wordle-text-present)}.keyboard-key.absent{background-color:var(--color-wordle-absent);color:var(--color-wordle-text-absent)}.keyboard-key.default{background-color:var(--color-wordle-empty);color:var(--color-text-primary)}@media(max-width:640px){.keyboard-key{min-width:28px;height:42px;font-size:var(--font-size-xs);padding:0 var(--spacing-xs)}.keyboard-key.special{min-width:56px}}.wordlove-game{max-width:500px;margin:0 auto;padding:var(--spacing-lg);font-family:var(--font-family-system);color:var(--color-text-primary);background-color:var(--color-background)}.wordlove-game.chatgpt-widget{background-color:transparent}.wordlove-title{text-align:center;font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-text-primary);margin-bottom:var(--spacing-md)}.wordlove-secret-word{text-align:center;font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);color:var(--color-text-primary);margin-bottom:var(--spacing-lg);text-transform:uppercase;letter-spacing:.2em}.wordlove-error{text-align:center;color:var(--color-error);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);margin-bottom:var(--spacing-md);padding:var(--spacing-sm);background-color:var(--color-background-secondary);border:1px solid var(--color-error);border-radius:var(--radius-md)}.wordlove-message{text-align:center;font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin-bottom:var(--spacing-sm)}.wordlove-attempts{text-align:center;font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-bottom:var(--spacing-lg)}.wordlove-grid{display:flex;flex-direction:column;gap:var(--spacing-sm);margin-bottom:var(--spacing-lg);align-items:center}.wordlove-row{display:flex;gap:var(--spacing-sm);justify-content:center}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-8px)}20%,40%,60%,80%{transform:translate(8px)}}.wordlove-row.shaking{animation:shake .6s ease-in-out}.wordlove-cell{width:62px;height:62px;display:flex;align-items:center;justify-content:center;font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);font-family:var(--font-family-system);border:2px solid var(--color-border);border-radius:var(--radius-sm);background-color:var(--color-background);color:var(--color-text-primary);text-transform:uppercase;transition:all var(--transition-base);-webkit-user-select:none;user-select:none}.wordlove-input-cell{background-color:var(--color-background);border:2px solid var(--color-border);text-align:center;font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);font-family:var(--font-family-system);color:var(--color-text-primary);text-transform:uppercase;padding:0;outline:none;cursor:text;position:relative}.wordlove-input-cell input,.wordlove-input-cell input:focus,.wordlove-input-cell input:focus-visible,.wordlove-input-cell input:focus-within{caret-color:transparent!important;-webkit-text-fill-color:var(--color-text-primary)}.wordlove-input-cell input::selection,.wordlove-input-cell input::-moz-selection{background:transparent;color:var(--color-text-primary)}.wordlove-input-cell:focus{border-color:var(--color-primary);box-shadow:0 0 0 2px var(--color-primary);opacity:.8}.wordlove-input-cell.focused{border-color:var(--color-primary)}.wordlove-input-cell input,.wordlove-input-cell input:focus{caret-color:transparent;color:var(--color-text-primary)}.wordlove-input-cell input::selection,.wordlove-input-cell input::-moz-selection{background:transparent}.wordlove-input-cell:disabled{opacity:.5;cursor:not-allowed}.wordlove-cell.correct{background-color:var(--color-wordle-correct);border-color:var(--color-wordle-correct);color:var(--color-wordle-text-correct)}.wordlove-cell.present{background-color:var(--color-wordle-present);border-color:var(--color-wordle-present);color:var(--color-wordle-text-present)}.wordlove-cell.absent{background-color:var(--color-wordle-absent);border-color:var(--color-wordle-absent);color:var(--color-wordle-text-absent)}@keyframes flip{0%{transform:rotateX(0)}50%{transform:rotateX(90deg)}to{transform:rotateX(0)}}.wordlove-cell.flipping{animation:flip .5s ease-in-out;transform-style:preserve-3d}.wordlove-actions{display:flex;justify-content:center;gap:var(--spacing-md);margin-top:var(--spacing-lg);flex-wrap:wrap}.wordlove-button{padding:var(--spacing-sm) var(--spacing-lg);font-family:var(--font-family-system);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);border:none;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-base);text-align:center}.wordlove-button-primary{background-color:var(--color-primary);color:var(--color-text-inverted)}.wordlove-button-primary:hover:not(:disabled){background-color:var(--color-primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-md)}.wordlove-button-primary:active:not(:disabled){transform:translateY(0)}.wordlove-button-primary:disabled{opacity:.5;cursor:not-allowed}.wordlove-button-secondary{background-color:var(--color-background-secondary);color:var(--color-text-primary);border:1px solid var(--color-border)}.wordlove-button-secondary:hover{background-color:var(--color-border);border-color:var(--color-border-hover)}@media(max-width:640px){.wordlove-game{padding:var(--spacing-md)}.wordlove-cell,.wordlove-input-cell{width:50px;height:50px;font-size:var(--font-size-xl)}.wordlove-title{font-size:var(--font-size-xl)}.wordlove-actions{flex-direction:column}.wordlove-button{width:100%}}.wordlove-game.pip-mode{max-width:100%;padding:var(--spacing-sm)}.wordlove-game.pip-mode .wordlove-grid{gap:var(--spacing-xs)}.wordlove-game.pip-mode .wordlove-cell,.wordlove-game.pip-mode .wordlove-input-cell{width:40px;height:40px;font-size:var(--font-size-lg)}@media(prefers-color-scheme:dark){.wordlove-cell{border-color:var(--color-border)}.wordlove-input-cell{background-color:var(--color-background);border-color:var(--color-border);color:var(--color-text-primary)}.wordlove-input-cell:focus{border-color:var(--color-primary)}}.auth-button{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-sm) var(--spacing-md);background:var(--color-background);border-radius:var(--radius-md);border:1px solid var(--color-border);box-shadow:var(--shadow-sm);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all var(--transition-base);position:relative;z-index:var(--z-base);pointer-events:auto}.auth-button.authenticated{background:var(--color-background);border-color:var(--color-primary);box-shadow:var(--shadow-md)}.auth-user{display:flex;align-items:center;gap:.75rem}.auth-user-info{display:flex;flex-direction:column;gap:.125rem}.auth-email{font-size:var(--font-size-xs);color:var(--color-text-secondary);font-weight:var(--font-weight-regular)}.auth-avatar{width:32px;height:32px;border-radius:50%;object-fit:cover}.auth-name{font-size:var(--font-size-sm);color:var(--color-text-primary);font-weight:var(--font-weight-medium)}.auth-loading{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.auth-login-btn,.auth-logout-btn{padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);border:none;border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast);position:relative;z-index:var(--z-base);pointer-events:auto}.auth-login-btn{background:var(--color-primary);color:var(--color-text-inverted);font-weight:var(--font-weight-semibold)}.auth-login-btn:hover{background:var(--color-primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-md)}.auth-logout-btn{background:var(--color-background-secondary);color:var(--color-text-primary);border:1px solid var(--color-border)}.auth-logout-btn:hover{background:var(--color-border);border-color:var(--color-border-hover)}.theme-selector{position:relative;display:inline-block}.theme-selector-button{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);background-color:var(--color-background-secondary);color:var(--color-text-primary);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);transition:all var(--transition-base);font-family:var(--font-family-system)}.theme-selector-button:hover{background-color:var(--color-border);border-color:var(--color-border-hover)}.theme-selector-button svg{flex-shrink:0}.theme-selector-label{display:none}@media(min-width:640px){.theme-selector-label{display:inline}}.theme-selector-overlay{position:fixed;inset:0;z-index:calc(var(--z-modal) - 1);background:transparent}.theme-selector-dropdown{position:absolute;top:calc(100% + var(--spacing-xs));right:0;min-width:240px;max-width:280px;background-color:var(--color-background);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);z-index:var(--z-modal);padding:var(--spacing-sm);display:flex;flex-direction:column;gap:var(--spacing-xs);max-height:80vh;overflow-y:auto}.theme-selector-title{padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.5px}.theme-selector-group{margin-bottom:var(--spacing-sm)}.theme-selector-group:last-child{margin-bottom:0}.theme-selector-group-title{padding:var(--spacing-xs) var(--spacing-md);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);color:var(--color-text-tertiary);text-transform:uppercase;letter-spacing:.5px;margin-bottom:var(--spacing-xs)}.theme-selector-option{display:flex;flex-direction:column;align-items:flex-start;padding:var(--spacing-sm) var(--spacing-md);background-color:transparent;border:none;border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast);text-align:left;width:100%;font-family:var(--font-family-system)}.theme-selector-option:hover{background-color:var(--color-background-secondary)}.theme-selector-option.active{background-color:var(--color-primary);color:var(--color-text-inverted)}.theme-selector-option.active .theme-selector-option-label,.theme-selector-option.active .theme-selector-option-desc{color:var(--color-text-inverted)}.theme-selector-option-label{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-primary);margin-bottom:2px}.theme-selector-option-desc{font-size:var(--font-size-xs);color:var(--color-text-secondary)}.locale-selector{position:relative}.locale-select{padding:var(--spacing-xs) var(--spacing-sm);border:1px solid var(--color-border);border-radius:var(--radius-md);background-color:var(--color-background);color:var(--color-text-primary);font-size:var(--font-size-sm);font-family:var(--font-family-system);cursor:pointer;transition:border-color var(--transition-base)}.locale-select:hover{border-color:var(--color-border-hover)}.locale-select:focus{outline:none;border-color:var(--color-primary)}.gamehubby{min-height:100vh;padding:2rem}.gamehubby-header{color:var(--color-text-primary);margin-bottom:3rem}.gamehubby-header-content{display:flex;justify-content:space-between;align-items:center;max-width:1200px;margin:0 auto;gap:2rem}.gamehubby-header-content>div:first-child{text-align:center;flex:1}.auth-container{flex-shrink:0;display:flex;gap:var(--spacing-md);align-items:center}.game-header-actions{display:flex;justify-content:space-between;align-items:center;max-width:1200px;margin:0 auto 2rem;gap:1rem}.gamehubby-header h1{font-family:var(--font-family-title);font-size:var(--font-size-3xl);margin-bottom:var(--spacing-sm);text-shadow:2px 2px 4px rgba(0,0,0,.3)}.gamehubby-header p{font-size:1.2rem;opacity:.9;margin-bottom:var(--spacing-sm)}.header-links{display:flex;gap:var(--spacing-sm);justify-content:center;margin-top:var(--spacing-sm);flex-wrap:wrap}.demo-link{display:inline-block;padding:var(--spacing-xs) var(--spacing-md);font-size:var(--font-size-sm);color:var(--color-primary);text-decoration:none;border:1px solid var(--color-primary);border-radius:var(--radius-md);transition:all var(--transition-base)}.demo-link:hover{background-color:var(--color-primary);color:var(--color-text-inverted)}.games-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;max-width:1200px;margin:0 auto}.game-card{background:var(--color-background);border-radius:var(--radius-lg);padding:var(--spacing-xl);cursor:pointer;transition:transform var(--transition-slow),box-shadow var(--transition-slow);box-shadow:var(--shadow-md)}.game-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}.game-card h3{color:var(--color-primary);margin-bottom:var(--spacing-md);font-size:var(--font-size-2xl)}.game-card p{color:var(--color-text-secondary);margin-bottom:var(--spacing-lg);line-height:1.6}.play-button{width:100%;padding:var(--spacing-sm) var(--spacing-md);background-color:var(--color-primary);color:var(--color-text-inverted);border:none;border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);cursor:pointer;transition:background-color var(--transition-base)}.play-button:hover{background-color:var(--color-primary-hover)}.game-container{max-width:800px;margin:0 auto;background:var(--color-background);border-radius:var(--radius-lg);padding:var(--spacing-xl);box-shadow:var(--shadow-lg)}.back-button{margin-bottom:var(--spacing-md);padding:var(--spacing-sm) var(--spacing-md);background-color:var(--color-background-secondary);color:var(--color-text-primary);border:2px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;font-size:var(--font-size-base);transition:background-color var(--transition-base)}.back-button:hover{background-color:var(--color-border);border-color:var(--color-border-hover)}.gamehubby-error{text-align:center;color:var(--color-error);padding:var(--spacing-xl);background:var(--color-background);border-radius:var(--radius-md);max-width:600px;margin:0 auto;border:1px solid var(--color-error)}.gamehubby-error button{margin-top:var(--spacing-md);padding:var(--spacing-sm) var(--spacing-md);cursor:pointer;background-color:var(--color-primary);color:var(--color-text-inverted);border:none;border-radius:var(--radius-md)}.gamehubby-error button:hover{background-color:var(--color-primary-hover)}.gamehubby-loading,.gamehubby-empty{text-align:center;color:var(--color-text-primary);padding:var(--spacing-xl)}.design-system-demo{min-height:100vh;padding:var(--spacing-xl);background-color:var(--color-background);color:var(--color-text-primary)}.demo-header{margin-bottom:var(--spacing-2xl);padding-bottom:var(--spacing-xl);border-bottom:2px solid var(--color-border)}.demo-header-content{max-width:1200px;margin:0 auto;text-align:center}.demo-header-content h1{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);color:var(--color-text-primary);margin-bottom:var(--spacing-sm)}.demo-header-content p{font-size:var(--font-size-lg);color:var(--color-text-secondary);margin-bottom:var(--spacing-lg)}.demo-header-actions{display:flex;justify-content:center;align-items:center;gap:var(--spacing-md)}.demo-back-link{padding:var(--spacing-sm) var(--spacing-md);background-color:var(--color-background-secondary);color:var(--color-text-primary);border:1px solid var(--color-border);border-radius:var(--radius-md);text-decoration:none;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);transition:all var(--transition-base)}.demo-back-link:hover{background-color:var(--color-border);border-color:var(--color-border-hover)}.demo-tabs{display:flex;justify-content:center;gap:var(--spacing-sm);margin-bottom:var(--spacing-2xl);flex-wrap:wrap}.demo-tab{padding:var(--spacing-sm) var(--spacing-lg);background-color:var(--color-background-secondary);color:var(--color-text-primary);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;font-size:var(--font-size-base);font-weight:var(--font-weight-medium);transition:all var(--transition-base);font-family:var(--font-family-system)}.demo-tab:hover{background-color:var(--color-border);border-color:var(--color-border-hover)}.demo-tab.active{background-color:var(--color-primary);color:var(--color-text-inverted);border-color:var(--color-primary)}.demo-content{max-width:1200px;margin:0 auto}.demo-section{margin-bottom:var(--spacing-2xl)}.demo-section h2{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-text-primary);margin-bottom:var(--spacing-xl);padding-bottom:var(--spacing-md);border-bottom:1px solid var(--color-border)}.demo-subsection{margin-bottom:var(--spacing-2xl)}.demo-subsection h3{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin-bottom:var(--spacing-lg)}.color-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--spacing-lg)}.color-item{display:flex;flex-direction:column;gap:var(--spacing-sm)}.color-swatch{width:100%;height:120px;border-radius:var(--radius-md);border:2px solid var(--color-border);display:flex;align-items:center;justify-content:center;font-weight:var(--font-weight-bold);font-size:var(--font-size-lg)}.color-info{display:flex;flex-direction:column;gap:var(--spacing-xs)}.color-info strong{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--color-text-primary)}.color-info code{font-size:var(--font-size-xs);font-family:var(--font-family-mono);color:var(--color-text-secondary);background-color:var(--color-background-secondary);padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-sm)}.typography-examples{display:flex;flex-direction:column;gap:var(--spacing-md)}.typography-item{padding:var(--spacing-md);background-color:var(--color-background-secondary);border-radius:var(--radius-md);border:1px solid var(--color-border)}.typography-item p{margin:0 0 var(--spacing-sm) 0;color:var(--color-text-primary)}.typography-item code{font-size:var(--font-size-xs);font-family:var(--font-family-mono);color:var(--color-text-secondary)}.typography-hierarchy{display:flex;flex-direction:column;gap:var(--spacing-md);padding:var(--spacing-lg);background-color:var(--color-background-secondary);border-radius:var(--radius-lg);border:1px solid var(--color-border)}.typography-hierarchy h1,.typography-hierarchy h2,.typography-hierarchy h3{margin:0;color:var(--color-text-primary)}.typography-hierarchy p{margin:0}.button-group{display:flex;gap:var(--spacing-md);flex-wrap:wrap;align-items:center}.demo-button-primary{padding:var(--spacing-sm) var(--spacing-lg);background-color:var(--color-primary);color:var(--color-text-inverted);border:none;border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-base);font-family:var(--font-family-system)}.demo-button-primary:hover:not(:disabled){background-color:var(--color-primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-md)}.demo-button-primary:disabled{opacity:.5;cursor:not-allowed}.demo-button-secondary{padding:var(--spacing-sm) var(--spacing-lg);background-color:var(--color-background-secondary);color:var(--color-text-primary);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-base);font-family:var(--font-family-system)}.demo-button-secondary:hover:not(:disabled){background-color:var(--color-border);border-color:var(--color-border-hover)}.demo-button-secondary:disabled{opacity:.5;cursor:not-allowed}.demo-button-success{padding:var(--spacing-sm) var(--spacing-lg);background-color:var(--color-success);color:var(--color-text-inverted);border:none;border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-base);font-family:var(--font-family-system)}.demo-button-success:hover{background-color:var(--color-success-hover)}.demo-button-error{padding:var(--spacing-sm) var(--spacing-lg);background-color:var(--color-error);color:var(--color-text-inverted);border:none;border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-base);font-family:var(--font-family-system)}.demo-button-error:hover{background-color:var(--color-error-hover)}.demo-button-warning{padding:var(--spacing-sm) var(--spacing-lg);background-color:var(--color-warning);color:var(--color-text-inverted);border:none;border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-base);font-family:var(--font-family-system)}.demo-button-warning:hover{background-color:var(--color-warning-hover)}.demo-button-small{padding:var(--spacing-xs) var(--spacing-md);font-size:var(--font-size-sm)}.demo-button-base{padding:var(--spacing-sm) var(--spacing-lg);font-size:var(--font-size-base)}.demo-button-large{padding:var(--spacing-md) var(--spacing-xl);font-size:var(--font-size-lg)}.demo-cards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--spacing-lg)}.demo-card{padding:var(--spacing-xl);background-color:var(--color-background);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);transition:all var(--transition-base)}.demo-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.demo-card h4{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin-bottom:var(--spacing-md)}.demo-card p{color:var(--color-text-secondary);margin-bottom:var(--spacing-lg);line-height:1.6}.demo-inputs{display:flex;flex-direction:column;gap:var(--spacing-md);max-width:400px}.demo-input{padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-base);font-family:var(--font-family-system);color:var(--color-text-primary);background-color:var(--color-background);border:2px solid var(--color-border);border-radius:var(--radius-md);transition:all var(--transition-base)}.demo-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 2px #d6338433}.demo-input:disabled{opacity:.5;cursor:not-allowed}.demo-badges{display:flex;gap:var(--spacing-md);flex-wrap:wrap}.demo-badge{padding:var(--spacing-xs) var(--spacing-md);border-radius:var(--radius-full);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);font-family:var(--font-family-system)}.demo-badge-primary{background-color:var(--color-primary);color:var(--color-text-inverted)}.demo-badge-success{background-color:var(--color-success);color:var(--color-text-inverted)}.demo-badge-error{background-color:var(--color-error);color:var(--color-text-inverted)}.demo-badge-warning{background-color:var(--color-warning);color:var(--color-text-inverted)}.demo-spacing{display:flex;gap:var(--spacing-lg);align-items:center;flex-wrap:wrap}.spacing-item{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-sm)}.spacing-box{background-color:var(--color-primary);border-radius:var(--radius-sm)}.spacing-item code{font-size:var(--font-size-xs);font-family:var(--font-family-mono);color:var(--color-text-secondary)}.demo-radius{display:flex;gap:var(--spacing-lg);flex-wrap:wrap}.radius-item{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-sm)}.radius-box{width:80px;height:80px;background-color:var(--color-primary);color:var(--color-text-inverted);display:flex;align-items:center;justify-content:center;font-weight:var(--font-weight-bold);font-size:var(--font-size-sm)}.radius-item code{font-size:var(--font-size-xs);font-family:var(--font-family-mono);color:var(--color-text-secondary)}@media(max-width:768px){.design-system-demo{padding:var(--spacing-md)}.color-grid,.demo-cards-grid{grid-template-columns:1fr}.demo-tabs{flex-direction:column}.demo-tab{width:100%}}.ranking-page{min-height:100vh;background-color:var(--color-background);color:var(--color-text-primary);padding:2rem}.ranking-header{margin-bottom:2rem}.ranking-header-content{display:flex;justify-content:space-between;align-items:flex-start;gap:2rem;flex-wrap:wrap}.ranking-header h1{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);margin:.5rem 0;color:var(--color-text-primary)}.ranking-header p{font-size:var(--font-size-base);color:var(--color-text-secondary);margin:.5rem 0}.back-button{background-color:var(--color-background-secondary);color:var(--color-text-primary);border:1px solid var(--color-border);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);cursor:pointer;font-size:var(--font-size-base);transition:all var(--transition-base);margin-bottom:1rem}.back-button:hover{background-color:var(--color-background-tertiary);border-color:var(--color-border-hover)}.auth-container{display:flex;gap:1rem;align-items:center}.user-rank-banner{background:linear-gradient(135deg,var(--color-primary),var(--color-accent-blue));color:var(--color-text-inverted);padding:var(--spacing-lg);border-radius:var(--radius-lg);margin-bottom:2rem;box-shadow:var(--shadow-md)}.user-rank-content{display:flex;align-items:center;gap:var(--spacing-md);flex-wrap:wrap}.user-rank-label{font-size:var(--font-size-base);opacity:.9}.user-rank-value{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold)}.user-rank-score{font-size:var(--font-size-lg);margin-left:auto}.ranking-loading,.ranking-error,.ranking-empty{text-align:center;padding:4rem 2rem;color:var(--color-text-secondary)}.ranking-error button{margin-top:1rem;padding:var(--spacing-sm) var(--spacing-md);background-color:var(--color-primary);color:var(--color-text-inverted);border:none;border-radius:var(--radius-md);cursor:pointer;font-size:var(--font-size-base);transition:all var(--transition-base)}.ranking-error button:hover{background-color:var(--color-primary-hover)}.ranking-table-container{background-color:var(--color-background);border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden;margin-bottom:2rem;box-shadow:var(--shadow-sm)}.ranking-table{width:100%;border-collapse:collapse}.ranking-table thead{background-color:var(--color-background-secondary)}.ranking-table th{padding:var(--spacing-md);text-align:left;font-weight:var(--font-weight-semibold);color:var(--color-text-primary);border-bottom:2px solid var(--color-border);font-size:var(--font-size-sm);text-transform:uppercase;letter-spacing:.5px}.ranking-table td{padding:var(--spacing-md);border-bottom:1px solid var(--color-border);color:var(--color-text-primary)}.ranking-table tbody tr{transition:background-color var(--transition-base)}.ranking-table tbody tr:hover{background-color:var(--color-background-secondary)}.ranking-table tbody tr.user-row{border-left:4px solid var(--color-primary);font-weight:var(--font-weight-semibold)}.ranking-table tbody tr.user-row:hover{background-color:var(--color-background-secondary)}.ranking-table tbody tr.user-row .user-cell,.ranking-table tbody tr.user-row .score-cell{color:var(--color-primary);font-weight:var(--font-weight-bold)}.rank-col{width:100px;text-align:center}.rank-cell{text-align:center;font-weight:var(--font-weight-bold);font-size:var(--font-size-lg)}.rank-cell.rank-first{color:gold}.rank-cell.rank-second{color:silver}.rank-cell.rank-third{color:#cd7f32}.user-col{flex:1}.user-cell{font-weight:var(--font-weight-medium)}.score-col{width:150px;text-align:right}.score-cell{text-align:right;font-weight:var(--font-weight-semibold);color:var(--color-primary);font-family:var(--font-family-mono)}.date-col{width:180px}.date-cell{color:var(--color-text-secondary);font-size:var(--font-size-sm)}.ranking-pagination{display:flex;justify-content:center;align-items:center;gap:var(--spacing-md);margin-top:2rem;flex-wrap:wrap}.pagination-button{padding:var(--spacing-sm) var(--spacing-md);background-color:var(--color-background-secondary);color:var(--color-text-primary);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;font-size:var(--font-size-base);transition:all var(--transition-base)}.pagination-button:hover:not(:disabled){background-color:var(--color-background-tertiary);border-color:var(--color-border-hover)}.pagination-button:disabled{opacity:.5;cursor:not-allowed}.pagination-info{color:var(--color-text-secondary);font-size:var(--font-size-base)}.games-rankings{margin-top:4rem;padding-top:2rem;border-top:2px solid var(--color-border)}.games-rankings h2{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);margin-bottom:1.5rem;color:var(--color-text-primary)}.games-rankings-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--spacing-lg)}.game-ranking-card{background-color:var(--color-background-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--spacing-lg);cursor:pointer;transition:all var(--transition-base)}.game-ranking-card:hover{background-color:var(--color-background-tertiary);border-color:var(--color-primary);box-shadow:var(--shadow-md);transform:translateY(-2px)}.game-ranking-card h3{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);margin:0 0 var(--spacing-sm) 0;color:var(--color-text-primary)}.game-ranking-card p{font-size:var(--font-size-base);color:var(--color-text-secondary);margin:0 0 var(--spacing-md) 0}.view-ranking-button{width:100%;padding:var(--spacing-sm) var(--spacing-md);background-color:var(--color-primary);color:var(--color-text-inverted);border:none;border-radius:var(--radius-md);cursor:pointer;font-size:var(--font-size-base);font-weight:var(--font-weight-medium);transition:all var(--transition-base)}.view-ranking-button:hover{background-color:var(--color-primary-hover)}@media(max-width:768px){.ranking-page{padding:1rem}.ranking-header-content{flex-direction:column}.ranking-table-container{overflow-x:auto}.ranking-table{min-width:600px}.user-rank-content{flex-direction:column;align-items:flex-start}.user-rank-score{margin-left:0}.games-rankings-grid{grid-template-columns:1fr}}#root{max-width:1280px;margin:0 auto;padding:var(--spacing-xl);text-align:center}.logo{height:6em;padding:var(--spacing-lg);will-change:filter;transition:filter var(--transition-slow)}.logo:hover,.logo.react:hover{filter:drop-shadow(0 0 2em var(--color-primary));opacity:.8}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media(prefers-reduced-motion:no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:var(--spacing-xl)}.read-the-docs{color:var(--color-text-tertiary)}