:root{--bg:#0a0a0a;--surface:#ffffff0a;--border:#ffffff14;--text:#e8e8e8;--text-dim:#666;--accent:#c8ff00;--font:"Courier New", Courier, monospace}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:var(--font);width:100vw;height:100vh;overflow:hidden}.app{width:100vw;height:100vh;position:relative}.sketch-pane{position:absolute;inset:0}.overlay{pointer-events:none;flex-direction:column;justify-content:space-between;padding:24px;display:flex;position:absolute;inset:0}.brand{letter-spacing:.2em;color:var(--accent);text-transform:uppercase;pointer-events:none;font-size:13px}.generating{color:var(--text-dim);letter-spacing:.1em;font-size:11px;animation:1.2s ease-in-out infinite pulse}@keyframes pulse{0%,to{opacity:1}50%{opacity:.3}}.error-banner{color:#ff6b6b;pointer-events:none;background:#ff3c3c26;border:1px solid #ff3c3c4d;border-radius:4px;padding:8px 12px;font-size:12px}.controls{pointer-events:all;flex-direction:column;gap:12px;display:flex}.current-mood{color:var(--text-dim);letter-spacing:.1em;font-size:11px}.current-mood span{color:var(--accent)}.reaction-bar{border:1px solid var(--border);background:var(--surface);border-radius:2px;flex-direction:column;gap:8px;padding:10px 12px;display:flex}.reaction-label{letter-spacing:.15em;color:var(--text-dim);text-transform:uppercase;font-size:10px}.reaction-presets{flex-wrap:wrap;gap:6px;display:flex}.reaction-btn{border:1px solid var(--border);color:var(--text-dim);font-family:var(--font);letter-spacing:.08em;cursor:pointer;background:0 0;border-radius:2px;padding:4px 10px;font-size:11px;transition:color .15s,border-color .15s}.reaction-btn:hover:not(:disabled){color:var(--accent);border-color:var(--accent)}.reaction-btn--different{color:#ff646499;border-color:#ff64644d}.reaction-btn--different:hover:not(:disabled){color:#ff6464;border-color:#ff6464}.reaction-btn:disabled{opacity:.3;cursor:not-allowed}.reaction-free{gap:8px;display:flex}.reaction-free input{border:1px solid var(--border);color:var(--text);font-family:var(--font);background:0 0;border-radius:2px;outline:none;flex:1;padding:6px 10px;font-size:12px;transition:border-color .15s}.reaction-free input::placeholder{color:var(--text-dim)}.reaction-free input:focus{border-color:#c8ff004d}.reaction-free button{border:1px solid var(--border);color:var(--text-dim);font-family:var(--font);letter-spacing:.08em;cursor:pointer;background:0 0;border-radius:2px;padding:6px 12px;font-size:11px;transition:color .15s,border-color .15s}.reaction-free button:hover:not(:disabled){color:var(--accent);border-color:var(--accent)}.reaction-free button:disabled{opacity:.3;cursor:not-allowed}.mood-input{flex-direction:column;gap:10px;display:flex}.mood-chips{flex-wrap:wrap;gap:6px;display:flex}.chip{background:var(--surface);border:1px solid var(--border);color:var(--text-dim);font-family:var(--font);letter-spacing:.08em;cursor:pointer;border-radius:2px;padding:4px 10px;font-size:11px;transition:color .15s,border-color .15s}.chip:hover:not(:disabled){color:var(--accent);border-color:var(--accent)}.chip:disabled{opacity:.3;cursor:not-allowed}.mood-field{gap:8px;display:flex}.mood-field input{background:var(--surface);border:1px solid var(--border);color:var(--text);font-family:var(--font);border-radius:2px;outline:none;flex:1;padding:8px 12px;font-size:13px;transition:border-color .15s}.mood-field input::placeholder{color:var(--text-dim)}.mood-field input:focus{border-color:#c8ff0066}.mood-field button{border:1px solid var(--accent);color:var(--accent);font-family:var(--font);letter-spacing:.1em;cursor:pointer;background:0 0;border-radius:2px;padding:8px 16px;font-size:12px;transition:background .15s}.mood-field button:hover:not(:disabled){background:#c8ff0014}.mood-field button:disabled{opacity:.3;cursor:not-allowed}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{background:#0a0a0a;width:100%;height:100%;overflow:hidden}