:root{--color-primary: #3730A3;--color-secondary: #047857;--color-danger: #B91C1C;--color-bg: #FFFFFF;--color-fg: #1F2937;--color-border: #D1D5DB;--color-muted: #4B5563;--radius: .5rem;--spacing: 1rem;--transition: .2s ease;font-family:Arial,Helvetica,sans-serif;line-height:1.5}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:var(--color-bg);color:var(--color-fg)}body.dark{--color-bg: #111827;--color-fg: #F9FAFB;--color-border: #374151;--color-muted: #9CA3AF}h1,h2,h3,p{margin:0 0 var(--spacing);text-align:center}h1{font-size:2.5rem}h2{font-size:2rem}h3{font-size:1.5rem}p{max-width:60ch;margin-left:auto;margin-right:auto}.text-muted{color:var(--color-muted)}a{color:inherit;text-decoration:none}button.btn-unstyled{all:unset;display:inline-flex;align-items:center;justify-content:center}.btn{padding:calc(var(--spacing)/2) var(--spacing);border-radius:var(--radius);border:1px solid transparent;font:inherit;cursor:pointer;transition:transform var(--transition),background var(--transition)}.btn:hover{transform:scale(1.02)}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-primary{background:var(--color-primary);color:#fff}.btn-primary:hover{background:#2f2b8f}.btn-secondary{background:var(--color-secondary);color:#fff}.btn-secondary:hover{background:#036749}.btn-danger{background:var(--color-danger);color:#fff}.btn-danger:hover{background:#991b1b}.form-group{display:flex;flex-direction:column;margin-bottom:var(--spacing)}.form-group label{margin-bottom:.25rem;font-weight:600}.form-group input,.form-group select,.form-group textarea{padding:.5rem;border:1px solid var(--color-border);border-radius:var(--radius);background:var(--color-bg);color:var(--color-fg);transition:border-color var(--transition)}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--color-primary)}.auth-form{max-width:400px;width:90%;margin:2rem auto;display:grid;gap:var(--spacing);background:var(--color-bg);padding:var(--spacing);border:1px solid var(--color-border);border-radius:var(--radius);box-shadow:0 2px 8px #0000000d}.auth-form>h2{text-align:center;margin:0 0 var(--spacing)}.auth-submit{width:100%;justify-content:center;margin-top:var(--spacing)}.search-input{max-width:400px;width:100%;padding:.75rem 1rem;font-size:1rem;border:1px solid var(--color-border);border-radius:var(--radius);margin:var(--spacing) auto;display:block;background:var(--color-bg);color:var(--color-fg)}.game-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--spacing)}.game-detail-header{display:flex;justify-content:center;margin:2rem 0}.game-detail-header .game-card{width:60%;max-width:500px}.game-description,.auth-form{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius);padding:var(--spacing);margin-bottom:var(--spacing);box-shadow:0 2px 4px #0000000d}.review-form{max-width:500px;width:90%;margin:1.5rem auto;display:grid;gap:var(--spacing);background:var(--color-bg);padding:var(--spacing);border:1px solid var(--color-border);border-radius:var(--radius);box-shadow:0 2px 6px #0000000d}.review-form label{font-weight:600;color:var(--color-fg)}.review-form input,.review-form textarea,.review-form select{width:100%;font:inherit;padding:.5rem;border:1px solid var(--color-border);border-radius:var(--radius);background:var(--color-bg);color:var(--color-fg);transition:border-color var(--transition)}.review-form input:focus,.review-form textarea:focus,.review-form select:focus{outline:none;border-color:var(--color-primary)}.review-form button{justify-self:start;padding:.5rem 1rem}.review-form textarea{min-height:100px;resize:vertical}.review-card{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius);padding:var(--spacing);margin-bottom:var(--spacing);box-shadow:0 2px 4px #0000000d;display:flex;flex-direction:column;gap:.75rem}.review-card>div{display:flex;gap:.5rem;margin-top:var(--spacing)}.review-card button{font-size:.9rem;padding:.4rem .75rem}.detail-toolbar{display:flex;flex-wrap:wrap;gap:var(--spacing);justify-content:center;margin-bottom:var(--spacing)}.review-section{display:flex;flex-direction:column;align-items:center;gap:var(--spacing);width:100%;max-width:600px;margin:0 auto var(--spacing)}.review-list{width:100%;display:flex;flex-direction:column;gap:var(--spacing)}.react-toggle-track{display:flex!important;align-items:center!important;justify-content:space-between!important;padding:0 .25em!important}.react-toggle-track-check{transform:translate(-5px,5px)!important}.react-toggle-track-x{transform:translate(-5px,6px)!important}.react-toggle-thumb{top:1px!important}.react-toggle{vertical-align:middle}.react-toggle{touch-action:pan-x;display:inline-block;position:relative;cursor:pointer;background-color:transparent;border:0;padding:0;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent}.react-toggle-screenreader-only{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.react-toggle--disabled{cursor:not-allowed;opacity:.5;-webkit-transition:opacity .25s;transition:opacity .25s}.react-toggle-track{width:50px;height:24px;padding:0;border-radius:30px;background-color:#4d4d4d;-webkit-transition:all .2s ease;-moz-transition:all .2s ease;transition:all .2s ease}.react-toggle:hover:not(.react-toggle--disabled) .react-toggle-track{background-color:#000}.react-toggle--checked .react-toggle-track{background-color:#19ab27}.react-toggle--checked:hover:not(.react-toggle--disabled) .react-toggle-track{background-color:#128d15}.react-toggle-track-check{position:absolute;width:14px;height:10px;top:0;bottom:0;margin-top:auto;margin-bottom:auto;line-height:0;left:8px;opacity:0;-webkit-transition:opacity .25s ease;-moz-transition:opacity .25s ease;transition:opacity .25s ease}.react-toggle--checked .react-toggle-track-check{opacity:1;-webkit-transition:opacity .25s ease;-moz-transition:opacity .25s ease;transition:opacity .25s ease}.react-toggle-track-x{position:absolute;width:10px;height:10px;top:0;bottom:0;margin-top:auto;margin-bottom:auto;line-height:0;right:10px;opacity:1;-webkit-transition:opacity .25s ease;-moz-transition:opacity .25s ease;transition:opacity .25s ease}.react-toggle--checked .react-toggle-track-x{opacity:0}.react-toggle-thumb{transition:all .5s cubic-bezier(.23,1,.32,1) 0ms;position:absolute;top:1px;left:1px;width:22px;height:22px;border:1px solid #4D4D4D;border-radius:50%;background-color:#fafafa;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-transition:all .25s ease;-moz-transition:all .25s ease;transition:all .25s ease}.react-toggle--checked .react-toggle-thumb{left:27px;border-color:#19ab27}.react-toggle--focus .react-toggle-thumb{-webkit-box-shadow:0px 0px 3px 2px #0099E0;-moz-box-shadow:0px 0px 3px 2px #0099E0;box-shadow:0 0 2px 3px #0099e0}.react-toggle:active:not(.react-toggle--disabled) .react-toggle-thumb{-webkit-box-shadow:0px 0px 5px 5px #0099E0;-moz-box-shadow:0px 0px 5px 5px #0099E0;box-shadow:0 0 5px 5px #0099e0}.game-card{width:200px;border:1px solid #ddd;border-radius:8px;overflow:hidden;margin:.5rem;box-shadow:0 2px 4px #0000001a;transition:transform .1s ease-in-out}.game-card:hover{transform:translateY(-4px)}.game-card__link{color:inherit;text-decoration:none;display:block}.game-card__image{width:100%;height:120px;object-fit:cover}.game-card__info{padding:.5rem}.game-card__title{margin:0;font-size:1rem;line-height:1.2}.game-card__meta{margin:.25rem 0 0;font-size:.85rem;color:#555}.NavBar{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing) 2rem;background:var(--color-bg);color:var(--color-fg);border-bottom:1px solid var(--color-border)}.nav-left,.nav-right{display:flex;align-items:center;gap:var(--spacing)}.nav-left a,.nav-right a,.nav-right button{font-weight:600;color:var(--color-fg);text-decoration:none}.nav-right{position:relative;margin-left:auto}.user-button{all:unset;display:inline-flex;align-items:center;cursor:pointer}.user-button svg{margin:0 .25rem}.dropdown-menu{position:absolute;top:calc(100% + .25rem);right:0;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius);box-shadow:0 4px 12px #0000001a;list-style:none;padding:.5rem 0;min-width:160px;z-index:1000}.dropdown-menu li+li{border-top:1px solid var(--color-border)}.dropdown-menu a,.dropdown-menu button{all:unset;display:block;width:100%;padding:.5rem 1rem;font:inherit;color:var(--color-fg);cursor:pointer}.App{display:grid;grid-template-rows:auto auto}#main-section{display:flex;flex-direction:column;justify-content:center;align-items:center}
