:root{--bg: #141414;--surface: #1f1f1f;--surface-2: #2a2a2a;--text: #e5e5e5;--text-dim: #a3a3a3;--accent: #e50914;--accent-hover: #ff1f2c;--ok: #2e7d32;--ok-bg: rgba(46, 125, 50, .15);--fail: #c62828;--fail-bg: rgba(198, 40, 40, .15);--radius: 8px}*{box-sizing:border-box;margin:0;padding:0}html,body{min-height:100vh;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif}#app{min-height:100vh;display:flex;flex-direction:column}header{display:flex;align-items:center;justify-content:space-between;padding:18px 28px;background:#0a0a0a;border-bottom:1px solid #292929}header h1{font-size:20px;letter-spacing:1px;color:var(--accent)}.auth{display:flex;align-items:center;gap:14px}.auth button{background:var(--surface-2);color:var(--text);border:1px solid #3a3a3a;padding:8px 16px;border-radius:var(--radius);cursor:pointer;font-size:14px}.auth button:hover{background:#343434}main{flex:1;width:100%;max-width:980px;margin:0 auto;padding:32px 24px}.welcome{text-align:center;padding:80px 20px;color:var(--text-dim)}.toast{padding:12px 18px;background:var(--surface-2);border-left:3px solid var(--accent);border-radius:0 var(--radius) var(--radius) 0;margin-bottom:16px;font-size:14px;color:var(--text)}.game-panel{display:grid;grid-template-columns:1fr 320px;gap:24px}@media(max-width:860px){.game-panel{grid-template-columns:1fr}}.card{background:var(--surface);border:1px solid #292929;border-radius:var(--radius);padding:22px}.card h2{font-size:16px;margin-bottom:14px;color:var(--text)}.meta-row{display:flex;gap:20px;padding:12px 0}.stat{font-size:14px;color:var(--text-dim)}.stat strong{color:var(--text);font-size:18px;display:block;margin-top:2px}.pattern{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:18px;letter-spacing:4px;padding:8px 0;color:#d4d4d4;word-break:break-all}.guess-input{width:100%;background:#111;color:var(--text);border:1px solid #383838;padding:10px 12px;border-radius:var(--radius);font-size:15px;margin:12px 0}.btns{display:flex;gap:10px;flex-wrap:wrap}.btns button{background:var(--accent);color:#fff;border:none;padding:9px 16px;border-radius:var(--radius);cursor:pointer;font-size:14px}.btns button:hover{background:var(--accent-hover)}.btns .ghost{background:transparent;border:1px solid #4a4a4a;color:var(--text-dim)}.btns .ghost:hover{border-color:var(--text-dim);background:#222}.sidebar{background:var(--surface);border:1px solid #292929;border-radius:var(--radius);padding:18px;max-height:70vh;overflow-y:auto}.sidebar h3{font-size:14px;color:var(--text-dim);text-transform:uppercase;letter-spacing:1px;margin-bottom:12px;cursor:pointer;-webkit-user-select:none;user-select:none}.pattern-list{list-style:none}.pattern-list li{padding:7px 0;border-bottom:1px solid #292929;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:13px;color:#cfcfcf;letter-spacing:2px;cursor:pointer}.pattern-list li:last-child{border-bottom:none}.pattern-list li:hover{color:#fff}.banner{padding:14px 16px;border-radius:var(--radius);margin-bottom:14px;font-size:14px}.banner.ok{background:var(--ok-bg);border:1px solid var(--ok);color:#81c784}.banner.fail{background:var(--fail-bg);border:1px solid var(--fail);color:#ef9a9a}.error{color:#ef9a9a;font-size:13px;margin-top:6px}.loading{text-align:center;padding:30px;color:var(--text-dim)}