.forum-page{max-width:1200px;margin:0 auto;padding:2rem}.forum-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;padding-bottom:1.5rem;border-bottom:2px solid #2d2d2d}.forum-title-section h1{margin:0 0 .5rem;font-size:2.5rem;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.forum-title-section p{margin:0;color:#888;font-size:1rem}.new-thread-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:.75rem 1.5rem;font-size:1rem;font-weight:600;border-radius:8px;cursor:pointer;transition:transform .2s,box-shadow .2s}.new-thread-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.new-thread-form{background:#1e1e1e;border:1px solid #2d2d2d;border-radius:12px;padding:1.5rem;margin-bottom:2rem}.new-thread-form h2{margin:0 0 1rem;font-size:1.5rem}.new-thread-form form{display:flex;flex-direction:column;gap:1rem}.new-thread-form input,.new-thread-form select{background:#2d2d2d;border:1px solid #3d3d3d;border-radius:8px;padding:.75rem;color:#fff;font-size:1rem}.new-thread-form input:focus,.new-thread-form select:focus{outline:none;border-color:#667eea}.new-thread-form select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23999' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .75rem center;padding-right:2.5rem}.new-thread-form select option{background:#2d2d2d;color:#fff}.new-thread-form textarea{background:#2d2d2d;border:1px solid #3d3d3d;border-radius:8px;padding:.75rem;color:#fff;font-size:1rem;font-family:inherit;resize:vertical}.new-thread-form textarea:focus{outline:none;border-color:#667eea}.new-thread-form button{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:.75rem 1.5rem;font-size:1rem;font-weight:600;border-radius:8px;cursor:pointer;transition:transform .2s}.new-thread-form button:hover{transform:translateY(-2px)}.forum-loading{text-align:center;padding:3rem;color:#888;font-size:1.2rem}.no-threads{text-align:center;padding:4rem 2rem;background:var(--surface);border:2px dashed var(--border);border-radius:var(--radius);color:var(--muted)}.no-threads .empty-state-icon{font-size:4rem;margin-bottom:1rem;opacity:.5}.no-threads h3{margin:0 0 .5rem;color:var(--text);font-size:1.5rem}.no-threads p{margin:0;color:var(--muted)}.forum-filters{display:flex;gap:.75rem;margin-bottom:1.5rem;flex-wrap:wrap}.filter-btn{padding:.6rem 1.2rem;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);color:var(--muted);font-size:.9rem;cursor:pointer;transition:all .2s}.filter-btn:hover{background:var(--surface);border-color:var(--primary);color:var(--text)}.filter-btn.active{background:var(--primary);border-color:var(--primary);color:#fff}.thread-header-row{display:flex;align-items:center;gap:.75rem}.demo-badge{padding:.25rem .6rem;background:var(--accent);color:#fff;font-size:.7rem;font-weight:600;border-radius:4px;text-transform:uppercase}.stat-item{display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:.75rem 1rem;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius)}.stat-label{font-size:.75rem;color:var(--muted)}.threads-list{display:flex;flex-direction:column;gap:1rem}.thread-card{background:#1e1e1e;border:1px solid #2d2d2d;border-radius:12px;padding:1.5rem;display:flex;justify-content:space-between;align-items:center;transition:all .2s;text-decoration:none;color:inherit}.thread-card:hover{border-color:#667eea;transform:translateY(-2px);box-shadow:0 4px 12px #667eea33}.thread-content{flex:1}.thread-content h3{margin:0 0 .5rem;font-size:1.3rem;color:#fff}.thread-meta{display:flex;align-items:center;gap:.5rem;font-size:.9rem;color:#888;margin-bottom:.5rem}.thread-excerpt{color:#aaa;margin:.5rem 0 0;line-height:1.5}.thread-stats{display:flex;gap:1rem;margin-left:1rem}.stat-item{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:#2d2d2d;border-radius:8px}.stat-icon{font-size:1.2rem}.stat-count{font-size:1rem;font-weight:600;color:#fff}@media(max-width:768px){.forum-page{padding:1rem}.forum-header{flex-direction:column;align-items:stretch;gap:1rem}.new-thread-btn{width:100%}.thread-card{flex-direction:column;align-items:flex-start}.thread-stats{margin-left:0;margin-top:1rem}}.thread-details-page{max-width:900px;margin:0 auto;padding:2rem}.back-link{display:inline-flex;align-items:center;color:#667eea;text-decoration:none;font-size:1rem;margin-bottom:1.5rem;transition:color .2s}.back-link:hover{color:#764ba2}.thread-loading,.thread-error{text-align:center;padding:3rem;color:#888;font-size:1.2rem}.thread-main{background:#1e1e1e;border:1px solid #2d2d2d;border-radius:12px;padding:2rem;margin-bottom:2rem}.thread-header-section{margin-bottom:1.5rem;position:relative}.thread-header-section h1{margin:0 0 .75rem;font-size:2rem;line-height:1.3}.thread-meta{display:flex;align-items:center;gap:.5rem;font-size:.9rem;color:#888}.thread-author{color:#667eea;font-weight:500}.meta-separator{color:#555}.thread-game{color:#888;font-style:italic}.thread-date{color:#666}.thread-actions{display:flex;gap:.5rem;margin-top:1rem}.edit-btn,.delete-btn{padding:.5rem 1rem;border:none;border-radius:6px;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .2s}.edit-btn{background:#667eea;color:#fff}.edit-btn:hover{background:#5568d3}.delete-btn{background:#dc3545;color:#fff}.delete-btn:hover{background:#c82333}.thread-body{padding:1rem 0;line-height:1.6;color:#ddd;font-size:1.05rem;border-top:1px solid #2d2d2d}.thread-body p{margin:0;white-space:pre-wrap}.edit-thread-form h2{margin:0 0 1rem;font-size:1.5rem}.edit-thread-form form{display:flex;flex-direction:column;gap:1rem}.edit-thread-form input,.edit-thread-form textarea{background:#2d2d2d;border:1px solid #3d3d3d;border-radius:8px;padding:.75rem;color:#fff;font-size:1rem;font-family:inherit}.edit-thread-form input:focus,.edit-thread-form textarea:focus{outline:none;border-color:#667eea}.edit-thread-form textarea{resize:vertical}.form-actions{display:flex;gap:.5rem}.form-actions button{padding:.75rem 1.5rem;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s}.form-actions button[type=submit]{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.form-actions button[type=submit]:hover{transform:translateY(-2px)}.form-actions button[type=button]{background:#2d2d2d;color:#fff}.form-actions button[type=button]:hover{background:#3d3d3d}.posts-section{margin-bottom:2rem}.posts-section h2{margin:0 0 1.5rem;font-size:1.5rem}.post-card{background:#1e1e1e;border:1px solid #2d2d2d;border-radius:12px;padding:1.5rem;margin-bottom:1rem}.post-header{display:flex;align-items:center;gap:.5rem;margin-bottom:1rem;padding-bottom:.75rem;border-bottom:1px solid #2d2d2d}.post-author{color:#667eea;font-weight:600;font-size:1rem}.post-date{color:#666;font-size:.85rem;margin-left:auto}.post-actions{display:flex;gap:.5rem;margin-left:1rem}.edit-btn-small,.delete-btn-small{padding:.25rem .75rem;border:none;border-radius:4px;font-size:.85rem;font-weight:500;cursor:pointer;transition:all .2s}.edit-btn-small{background:#667eea;color:#fff}.edit-btn-small:hover{background:#5568d3}.delete-btn-small{background:#dc3545;color:#fff}.delete-btn-small:hover{background:#c82333}.post-content p{margin:0;line-height:1.6;color:#ddd;white-space:pre-wrap}.edit-post-form{margin-top:.5rem}.edit-post-form textarea{width:100%;background:#2d2d2d;border:1px solid #3d3d3d;border-radius:8px;padding:.75rem;color:#fff;font-size:1rem;font-family:inherit;resize:vertical;margin-bottom:.5rem}.edit-post-form textarea:focus{outline:none;border-color:#667eea}.edit-post-form .form-actions button{padding:.5rem 1rem;font-size:.9rem}.no-posts{text-align:center;padding:2rem;color:#888;background:#1e1e1e;border:1px solid #2d2d2d;border-radius:12px}.reply-section{background:#1e1e1e;border:1px solid #2d2d2d;border-radius:12px;padding:2rem}.reply-section h3{margin:0 0 1rem;font-size:1.3rem}.reply-section form{display:flex;flex-direction:column;gap:1rem}.reply-section textarea{background:#2d2d2d;border:1px solid #3d3d3d;border-radius:8px;padding:.75rem;color:#fff;font-size:1rem;font-family:inherit;resize:vertical}.reply-section textarea:focus{outline:none;border-color:#667eea}.reply-section button{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:.75rem 1.5rem;font-size:1rem;font-weight:600;border-radius:8px;cursor:pointer;transition:transform .2s;align-self:flex-start}.reply-section button:hover{transform:translateY(-2px)}.login-prompt{padding:1.5rem;background:#2d2d2d;border-radius:8px;text-align:center}.login-prompt p{margin:0;color:#888}.login-prompt a{color:#667eea;text-decoration:none;font-weight:600}.login-prompt a:hover{color:#764ba2}@media(max-width:768px){.thread-details-page{padding:1rem}.thread-main,.reply-section{padding:1.5rem}.thread-header-section h1{font-size:1.5rem}.post-header{flex-wrap:wrap}.post-actions{margin-left:0;width:100%}}.recommendations-page{max-width:1400px;margin:0 auto;padding:2rem;min-height:calc(100vh - 80px)}.recommendations-header{text-align:center;margin-bottom:2rem}.recommendations-header h1{margin:0 0 .5rem;font-size:2.5rem;color:var(--text)}.recommendations-header p{margin:0;color:var(--muted);font-size:1.1rem}.loading{text-align:center;padding:3rem;color:var(--muted);font-size:1.2rem}.based-on-section{background:linear-gradient(135deg,#667eea1a,#764ba21a);border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem;margin-bottom:2rem}.based-on-section h3{margin:0 0 1rem;font-size:1.2rem;color:var(--primary)}.genre-filters{display:flex;gap:.75rem;margin-bottom:1.5rem;flex-wrap:wrap;padding:1rem;background:var(--panel);border-radius:var(--radius);border:1px solid var(--border)}.genre-filter-btn{padding:.6rem 1.2rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);color:var(--muted);font-size:.9rem;cursor:pointer;transition:all .2s}.genre-filter-btn:hover{background:var(--panel);border-color:var(--primary);color:var(--text)}.genre-filter-btn.active{background:var(--primary);border-color:var(--primary);color:#fff}.recommendations-count{text-align:center;color:var(--muted);font-size:.95rem;margin-bottom:1.5rem}.demo-ribbon{position:absolute;top:15px;left:-35px;background:var(--accent);color:#fff;padding:.4rem 3rem;font-size:.75rem;font-weight:600;text-transform:uppercase;transform:rotate(-45deg);z-index:10;box-shadow:0 2px 8px #0000004d}.game-genres{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:.5rem}.genre-tag{padding:.3rem .7rem;background:var(--surface);border:1px solid var(--border);border-radius:4px;font-size:.75rem;color:var(--muted)}.based-on-content{display:flex;flex-direction:column;gap:1rem}.based-on-item{display:flex;flex-direction:column;gap:.5rem}.based-on-item .label{font-size:.9rem;color:#aaa;font-weight:500}.tags{display:flex;flex-wrap:wrap;gap:.5rem}.tag{background:#667eea;color:#fff;padding:.4rem .8rem;border-radius:20px;font-size:.9rem;font-weight:500}.games-list{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}.game-name{color:#ddd;font-size:.95rem}.game-name:not(:last-child):after{content:"•";margin-left:.5rem;color:#555}.more{color:#888;font-size:.9rem;font-style:italic}.no-recommendations{display:flex;justify-content:center;align-items:center;min-height:400px}.empty-state{text-align:center;max-width:400px}.empty-state .icon{font-size:4rem;display:block;margin-bottom:1rem}.empty-state h3{margin:0 0 .5rem;font-size:1.5rem;color:#ddd}.empty-state p{margin:0 0 1.5rem;color:#888;line-height:1.6}.browse-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:.75rem 1.5rem;font-size:1rem;font-weight:600;border-radius:8px;cursor:pointer;transition:transform .2s}.browse-btn:hover{transform:translateY(-2px)}.recommendations-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1.5rem}.recommendation-card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;transition:all .3s;position:relative}.recommendation-card:hover{transform:translateY(-4px);box-shadow:0 8px 24px #667eea33;border-color:var(--primary)}.game-cover{width:100%;height:320px;background-size:cover;background-position:center;position:relative;cursor:pointer;transition:transform .3s}.recommendation-card:hover .game-cover{transform:scale(1.05)}.no-cover{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#2d2d2d,#1e1e1e)}.no-cover span{font-size:4rem;opacity:.3}.rating-badge{position:absolute;top:10px;right:10px;background:#000c;padding:.4rem .7rem;border-radius:20px;font-size:.9rem;font-weight:600;color:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.game-info{padding:1rem;display:flex;flex-direction:column;gap:.75rem}.game-title{margin:0;font-size:1.1rem;color:#fff;cursor:pointer;transition:color .2s;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.game-title:hover{color:#667eea}.add-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:.6rem 1rem;font-size:.9rem;font-weight:600;border-radius:8px;cursor:pointer;transition:all .2s;width:100%}.add-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.add-btn.adding{background:#28a745;cursor:default}.add-btn:disabled{opacity:.7;cursor:not-allowed}@media(max-width:768px){.recommendations-page{padding:1rem}.recommendations-header h1{font-size:2rem}.recommendations-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1rem}.game-cover{height:240px}.based-on-content{gap:.75rem}.games-list{flex-direction:column;align-items:flex-start}.game-name:after{content:none!important}}:root{--bg:#0f0f12;--surface:#16161a;--muted:#a8a8b3;--text:#f7f7fb;--primary:#9d41ef;--accent:#f24049;--radius:12px;--gutter:24px;--max:1200px;--card-w:180px;--hero-ratio:16 / 5;--panel: #16161a;--border: #242433}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,Arial,sans-serif;max-width:100%}body{display:flex;flex-direction:column;align-items:center;min-width:320px;min-height:100vh}#root{width:100%}a{color:inherit;text-decoration:none}.brand{font-weight:700}.nav{display:flex;gap:12px;margin-left:8px}.search-bar-container{flex:1;max-width:500px;position:relative}.search-bar-btn{width:100%;padding:10px 16px;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);color:var(--muted);font-size:.95rem;cursor:pointer;display:flex;align-items:center;gap:12px;transition:all .2s}.search-bar-btn:hover{border-color:var(--primary);background:var(--surface)}.search-bar-icon{font-size:1.1rem}.search-bar-shortcut{margin-left:auto;padding:2px 8px;background:var(--surface);border:1px solid var(--border);border-radius:4px;font-size:.75rem;color:var(--muted)}.theme-toggle{padding:8px 12px;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);font-size:1.2rem;cursor:pointer;transition:all .2s}.theme-toggle:hover{background:var(--surface);border-color:var(--primary);transform:rotate(20deg)}.mt-1{margin-top:1rem}.mt-2{margin-top:2rem}.hdr-actions{margin-left:auto;display:flex;gap:8px}.btn{border:1px solid #2f2f3a;background:#222230;color:var(--text);padding:.6rem 1rem;border-radius:999px;cursor:pointer}.btn.ghost{background:transparent}.btn.primary{background:var(--primary);border-color:transparent}.hdr{position:sticky;top:0;z-index:50;background:#0f0f12e6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid #1f1f25}.hdr-row{display:flex;align-items:center;gap:16px;height:64px}.container{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:clamp(12px,3vw,var(--gutter))}.page{width:100%}.grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;column-gap:28px;row-gap:18px;margin-top:25px}.hero{position:relative;overflow:hidden;border-radius:16px;margin-block:8px 2px;aspect-ratio:var(--hero-ratio);background:#1b1b22;box-shadow:0 8px 24px #00000038}.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:.65}.hero-grad{position:absolute;inset:0;background:linear-gradient(180deg,#0000002e,#000000b8)}.hero-content{position:relative;z-index:1;max-width:660px;padding:clamp(16px,3vw,36px)}.eyebrow{font-size:.9rem;color:var(--muted);margin:0 0 4px}.hero-content h1{margin:0 0 8px;font-size:2.6rem}.hero-content .muted{margin:0 0 16px;color:var(--muted)}.section{margin:12px 0 8px}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.section-header h2{margin:0;font-size:1.1rem}.section-header a{font-size:.9rem;color:var(--muted)}.scroller{position:relative;min-width:0;padding-bottom:6px}.track{display:flex;gap:12px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-color:#2a2a36 transparent}.track::-webkit-scrollbar{height:8px}.track::-webkit-scrollbar-thumb{background:#2a2a36;border-radius:999px}.track::-webkit-scrollbar-track{background:transparent}@keyframes spin{to{transform:rotate(360deg)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.card{flex:0 0 var(--card-w);min-width:0;background:var(--surface);border:1px solid #242433;border-radius:var(--radius);overflow:hidden;scroll-snap-align:start;transition:transform .15s ease,box-shadow .15s ease}.card:hover{transform:translateY(-2px);box-shadow:0 10px 24px #00000040}.thumb{aspect-ratio:3/4;background:#222}.thumb img{width:100%;height:100%;object-fit:cover;display:block}.meta{padding:10px 12px}.meta .title{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.meta .sub{color:var(--muted);font-size:.9rem}.arrow{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:999px;border:1px solid #2f2f3a;background:#16161ae6;display:grid;place-items:center;cursor:pointer;opacity:0;transition:opacity .15s ease}.scroller:hover .arrow{opacity:1}.arrow.left{left:8px}.arrow.right{right:8px}.sidebar{position:sticky;top:76px;height:fit-content;min-width:0}button:hover{background:var(--panel);border-color:var(--primary);color:var(--text)}.panel{background:var(--surface);border:1px solid #242433;border-radius:12px;padding:16px}.panel h3{margin:0 0 12px}.thread:hover{color:var(--primary)}.list{display:grid;gap:12px}.thread{display:block;padding:12px;border-radius:10px;background:#1b1b25;border:1px solid #272736}.thread .user{color:#cfcff5;font-size:.85rem}.thread .title.strong{font-weight:800;margin-top:4px}.thread .excerpt{margin:.3rem 0 0;color:var(--muted)}@media(max-width:900px){.hero{aspect-ratio:16 / 7}}@media(max-width:1200px){.grid{display:block}.sidebar{position:static;top:auto;margin-top:16px}}@media(max-width:768px){:root{--gutter:16px;--card-w:150px;--hero-ratio:16 / 9}.hdr-row{flex-wrap:wrap;height:auto;padding-block:8px;gap:10px}.brand{font-size:1.1rem}.nav{order:3;width:100%;margin-left:0;overflow-x:auto;padding-bottom:4px;gap:10px;font-size:.9rem}.nav a{white-space:nowrap}.hdr-actions{margin-left:0;gap:6px}.hdr-actions .btn{padding:.4rem .7rem;font-size:.8rem}.hero-content{padding:16px}.hero-content h1{font-size:1.9rem}.hero-content .muted{font-size:.95rem}.section-header{padding-inline:2px}.meta .title{white-space:normal}.panel{padding:12px}}@media(max-width:480px){:root{--card-w:135px}.hero{border-radius:12px}.btn{padding:.45rem .8rem;font-size:.85rem}.actions{display:flex;flex-wrap:wrap;gap:8px}}