:root{--bg-deep:#120722;--bg-mid:#241040;--bg-glow:#3d1868;--bg-accent:#4a1c73;--accent:#8b3dff;--accent-2:#b98bff;--accent-grad-light:#9e51ff;--accent-grad-dark:#6c1fca;--button-border:#d8c2ff;--panel:#180c28b8;--panel-border:#a078ff73;--divider:#a078ff29;--field-bg:#f4eeff0d;--field-border:#a078ff4d;--text-main:#f4eeff;--text-dim:#b7a4dc;--text-faint:#8672ab;--danger:#ff5c7a;--success:#52e08a;--warning:#ffbf5c;--navbar-h:64px;--shadow:#12072280 0 20px 60px;--sans:system-ui, "Segoe UI", Roboto, sans-serif;--mono:"Cascadia Code", "Fira Code", ui-monospace, monospace;font:16px/145% var(--sans);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:var(--text-dim)}*{box-sizing:border-box}body{background:radial-gradient(circle at 50% 0%, var(--bg-glow) 0%, transparent 55%), linear-gradient(160deg, var(--bg-deep) 0%, var(--bg-mid) 55%, var(--bg-accent) 100%);min-height:100svh;margin:0}#root{flex-direction:column;min-height:100svh;display:flex}h1,h2,h3{font-family:var(--sans);color:var(--text-main);margin:0;font-weight:600}p{margin:0}a{color:var(--accent-2)}code{font-family:var(--mono);background:var(--field-bg);border-radius:4px;padding:2px 6px;font-size:.85em}.user-avatar{object-fit:cover;border-radius:50%;flex-shrink:0}.user-avatar-fallback{background:linear-gradient(160deg, var(--bg-glow), var(--bg-accent));color:var(--text-main);justify-content:center;align-items:center;font-weight:700;display:flex}.navbar{z-index:30;height:var(--navbar-h);border-bottom:1px solid var(--divider);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#120722b8;justify-content:space-between;align-items:center;gap:20px;padding:0 28px;display:flex;position:sticky;top:0}.navbar-brand{align-items:center;gap:10px;text-decoration:none;display:flex}.navbar-brand-name{letter-spacing:.06em;color:var(--text-main);font-size:18px;font-weight:800}.navbar-links{flex:1;justify-content:center;gap:24px;display:flex}.navbar-links a{color:var(--text-dim);font-size:14px;font-weight:600;text-decoration:none}.navbar-links a:hover{color:var(--text-main)}.navbar-actions{align-items:center;gap:10px;display:flex}.navbar-account{background:var(--field-bg);border:1px solid var(--panel-border);color:var(--text-main);border-radius:999px;align-items:center;gap:8px;padding:6px 10px 6px 6px;font-size:13px;font-weight:600;text-decoration:none;display:flex}.navbar-logout{border:1px solid var(--panel-border);color:var(--text-dim);cursor:pointer;background:0 0;border-radius:8px;padding:8px 14px;font-size:13px}.navbar-logout:hover{color:var(--text-main);background:var(--field-bg)}.navbar-login-button{background:linear-gradient(135deg, var(--accent-grad-light), var(--accent-grad-dark));color:#fff;border-radius:8px;padding:9px 20px;font-size:13px;font-weight:700;text-decoration:none}@media (width<=640px){.navbar-links{display:none}}.site-footer{border-top:1px solid var(--divider);margin-top:auto;padding:24px 28px}.site-footer-inner{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;max-width:1080px;margin:0 auto;display:flex}.site-footer-brand{letter-spacing:.06em;color:var(--text-dim);font-size:13px;font-weight:800}.site-footer-links{gap:18px;display:flex}.site-footer-links a{color:var(--text-faint);font-size:13px;text-decoration:none}.site-footer-links a:hover{color:var(--text-dim)}.site-footer-copy{color:var(--text-faint);font-size:12px}.hero{text-align:center;justify-content:center;align-items:center;min-height:68vh;padding:60px 24px;display:flex;position:relative;overflow:hidden}.hero-glow{background:radial-gradient(circle at 50% 30%, var(--bg-glow) 0%, transparent 60%);pointer-events:none;position:absolute;inset:0}.hero-content{flex-direction:column;align-items:center;gap:20px;max-width:720px;display:flex;position:relative}.hero-content h1{font-size:42px;line-height:1.15}.hero-subtitle{color:var(--text-dim);max-width:560px;font-size:16px}.hero-actions{flex-direction:column;align-items:center;gap:8px;margin-top:8px;display:flex}.hero-download-button{background:linear-gradient(135deg, var(--accent-grad-light), var(--accent-grad-dark));color:#fff;border-radius:12px;padding:16px 32px;font-size:17px;font-weight:700;text-decoration:none;box-shadow:0 14px 40px #8b3dff59}.hero-download-button:hover{filter:brightness(1.08)}.hero-download-note{color:var(--text-faint);font-size:12px}.section-inner{max-width:1080px;margin:0 auto;padding:0 24px}.section-games{padding:40px 0 60px}.section-games h2{margin-bottom:20px;font-size:24px}.games-empty{color:var(--text-faint);font-size:14px}.games-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:18px;display:grid}.game-card{border:1px solid var(--panel-border);background:var(--panel);border-radius:12px;flex-direction:column;display:flex;overflow:hidden}.game-card-cover{aspect-ratio:3/4;background:var(--field-bg)}.game-card-cover img{object-fit:cover;width:100%;height:100%;display:block}.game-card-cover-placeholder{background:linear-gradient(160deg, var(--bg-glow), var(--bg-accent));width:100%;height:100%}.game-card-body{flex-direction:column;gap:6px;padding:14px 16px 16px;display:flex}.game-card-body h3{font-size:15px}.game-card-description{color:var(--text-faint);text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:12px;display:-webkit-box;overflow:hidden}.game-card-price{color:var(--accent-2);margin-top:4px;font-size:13px;font-weight:700}.section-features{padding:20px 0 70px}.features-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;display:grid}.feature-card{border:1px solid var(--panel-border);background:var(--panel);border-radius:12px;padding:22px}.feature-card h3{margin-bottom:8px;font-size:15px}.feature-card p{color:var(--text-dim);font-size:13px}@media (width<=560px){.hero-content h1{font-size:30px}}.auth-screen{flex:1;justify-content:center;align-items:center;padding:40px 20px;display:flex}.auth-card{background:var(--panel);border:1px solid var(--panel-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:14px;flex-direction:column;width:100%;max-width:380px;padding:32px 28px;display:flex}.auth-card h1{margin-bottom:20px;font-size:20px}.auth-card label{color:var(--text-faint);margin-bottom:6px;font-size:12px;display:block}.auth-card input,.auth-card select{border:1px solid var(--field-border);background:var(--field-bg);width:100%;color:var(--text-main);border-radius:8px;margin-bottom:16px;padding:10px 12px;font-size:14px}.auth-card input:focus,.auth-card select:focus{border-color:var(--accent);outline:none}.auth-card button[type=submit]{background:linear-gradient(135deg, var(--accent), #5b1fc4);color:#fff;cursor:pointer;border:none;border-radius:8px;padding:11px;font-size:14px;font-weight:600}.auth-card button:disabled{opacity:.6;cursor:default}.auth-error{color:var(--danger);background:#ff5c7a1a;border:1px solid #ff5c7a4d;border-radius:8px;margin-top:14px;padding:8px 10px;font-size:13px}.auth-success{color:var(--success);background:#52e08a1a;border:1px solid #52e08a4d;border-radius:8px;margin-top:14px;padding:8px 10px;font-size:13px}.auth-hint{color:var(--text-dim);margin-bottom:16px;font-size:13px;line-height:150%}.checkbox-row{color:var(--text-dim);cursor:pointer;align-items:center;gap:8px;margin-bottom:16px;font-size:13px;display:flex}.checkbox-row input[type=checkbox]{width:auto;margin:0}.checkbox-row-terms{cursor:default;align-items:flex-start}.checkbox-row-terms input[type=checkbox]{cursor:pointer;margin-top:2px}.checkbox-row-terms a{color:var(--accent-2)}.auth-links{justify-content:space-between;margin-top:14px;display:flex}.link-button{color:var(--text-faint);cursor:pointer;background:0 0;border:none;padding:0;font-size:12px;font-weight:400;text-decoration:underline}.link-button:hover{color:var(--accent-2)}.avatar-picker-backdrop{z-index:100;background:#08031099;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.avatar-picker{border:1px solid var(--panel-border);background:var(--bg-mid);border-radius:12px;flex-direction:column;gap:12px;width:380px;max-height:70vh;padding:20px;display:flex;box-shadow:0 16px 40px #00000080}.avatar-picker-title{color:var(--text-main);margin:0;font-size:15px;font-weight:700}.avatar-picker-empty{color:var(--text-faint);margin:0;font-size:13px}.avatar-picker-error{color:var(--danger);margin:-6px 0 0;font-size:12px}.avatar-picker-grid{grid-template-columns:repeat(4,1fr);gap:10px;display:grid;overflow-y:auto}.avatar-picker-option{aspect-ratio:1;background:var(--field-bg);cursor:pointer;border:2px solid #0000;border-radius:50%;padding:0;overflow:hidden}.avatar-picker-option:hover:not(:disabled){border-color:var(--accent)}.avatar-picker-option:disabled{opacity:.6;cursor:default}.avatar-picker-option img{object-fit:cover;width:100%;height:100%;display:block}.avatar-picker-close{border:1px solid var(--panel-border);color:var(--text-dim);cursor:pointer;background:0 0;border-radius:8px;align-self:flex-end;padding:8px 14px;font-size:12px;font-weight:600}.avatar-picker-close:disabled{opacity:.6;cursor:default}.account-page{flex:1;padding:50px 20px 80px}.account-page-inner{flex-direction:column;gap:20px;max-width:460px;margin:0 auto;display:flex}.account-avatar{align-items:center;gap:16px;display:flex}.account-avatar button{border:1px solid var(--panel-border);color:var(--text-dim);cursor:pointer;background:0 0;border-radius:8px;padding:8px 14px;font-size:12px}.account-avatar button:disabled{opacity:.6;cursor:default}.account-message{font-size:13px}.account-error{color:var(--danger)}.account-success{color:var(--success)}.account-row{border-bottom:1px solid var(--divider);flex-direction:column;gap:6px;padding-bottom:16px;display:flex}.account-row-label{color:var(--text-faint);font-size:12px}.account-row-display{align-items:center;gap:10px;display:flex}.account-row-value{text-overflow:ellipsis;white-space:nowrap;min-width:0;color:var(--text-main);flex:1;font-size:13px;overflow:hidden}.account-pencil{color:var(--text-faint);cursor:pointer;background:0 0;border:none;padding:4px;font-size:13px}.account-pencil:hover{color:var(--text-main)}.account-edit-form{gap:8px;display:flex}.account-edit-form-password{flex-direction:column}.account-edit-form input{border:1px solid var(--panel-border);background:var(--panel);height:40px;color:var(--text-main);box-sizing:border-box;border-radius:8px;flex:1;min-width:0;padding:0 12px;font-size:13px}.account-field-row{gap:8px;display:flex}.account-edit-form button[type=submit],.account-cancel{cursor:pointer;box-sizing:border-box;border-radius:8px;flex-shrink:0;min-width:90px;height:40px;padding:0 14px;font-size:12px;font-weight:600}.account-edit-form button[type=submit]{background:var(--accent);color:#fff;border:none}.account-edit-form button[type=submit]:disabled{opacity:.5;cursor:default}.account-cancel{border:1px solid var(--panel-border);color:var(--text-dim);background:0 0}.account-row-hint{color:var(--text-faint);font-size:11px}.account-danger{flex-direction:column;gap:10px;padding-top:4px;display:flex}.account-danger h2{color:var(--danger);font-size:14px}.account-danger-text{color:var(--text-dim);font-size:12px;line-height:150%}.account-delete-form{flex-direction:column;gap:10px;display:flex}.account-delete-form input{border:1px solid var(--panel-border);background:var(--panel);height:40px;color:var(--text-main);border-radius:8px;padding:0 12px;font-size:13px}.account-delete-button{border:1px solid var(--danger);color:var(--danger);cursor:pointer;background:0 0;border-radius:8px;align-self:flex-start;padding:9px 16px;font-size:12px;font-weight:600}.account-delete-button:disabled{opacity:.6;cursor:default}.account-danger button:not(.account-delete-button):not(.account-cancel){border:1px solid var(--panel-border);color:var(--text-main);cursor:pointer;background:0 0;border-radius:8px;align-self:flex-start;padding:9px 16px;font-size:12px;font-weight:600}.account-logout{border:1px solid var(--panel-border);color:var(--text-dim);cursor:pointer;background:0 0;border-radius:8px;align-self:flex-start;padding:8px 14px;font-size:12px;font-weight:600}.account-logout:hover{color:var(--text-main)}.terms-page{flex:1;padding:50px 20px 80px}.terms-page-inner{flex-direction:column;gap:24px;max-width:640px;margin:0 auto;display:flex}.terms-pending{border:1px solid var(--warning);color:var(--text-dim);background:#ffbf5c1a;border-radius:10px;padding:12px 16px;font-size:13px}.terms-page-inner section{flex-direction:column;gap:8px;display:flex}.terms-page-inner h2{font-size:16px}.terms-page-inner p{color:var(--text-dim);font-size:13px}.site-main{flex-direction:column;flex:1;display:flex}
