@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";:root{--gold:#d4b056;--gold-2:#d6af62;--gold-dark:#a68b4a;--dark-1:#201e1e;--dark-2:#22201c;--dark-3:#2e2b27;--dark-4:#3a3630;--blue:#0f32d4;--cream:#f5f0e8;--cream-2:#ede8df;--text-muted:#a09880;--sidebar-w:260px}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--dark-1);color:var(--cream);min-height:100vh;font-family:Inter,system-ui,sans-serif;overflow:hidden}.app{height:100vh;display:flex;overflow:hidden}.sidebar{width:var(--sidebar-w);min-width:var(--sidebar-w);background:var(--dark-2);border-right:1px solid #2e2b27;flex-direction:column;display:flex;overflow:hidden}.sidebar-brand{border-bottom:1px solid #2e2b27;padding:22px 20px 16px}.sidebar-brand-name{letter-spacing:.08em;text-transform:uppercase;color:var(--gold);font-size:13px;font-weight:700}.sidebar-brand-sub{color:var(--text-muted);letter-spacing:.04em;margin-top:2px;font-size:11px}.sidebar-section-label{letter-spacing:.12em;text-transform:uppercase;color:var(--text-muted);padding:16px 20px 6px;font-size:10px;font-weight:700}.sidebar-nav{scrollbar-width:thin;scrollbar-color:#3a3630 transparent;flex:1;padding:4px 10px 16px;overflow-y:auto}.sidebar-nav::-webkit-scrollbar{width:4px}.sidebar-nav::-webkit-scrollbar-thumb{background:#3a3630;border-radius:2px}.sidebar-item{cursor:pointer;color:#a09880;text-align:left;background:0 0;border:none;border-radius:8px;align-items:center;gap:10px;width:100%;padding:9px 10px;font-size:13.5px;transition:background .15s,color .15s;display:flex}.sidebar-item:hover{background:var(--dark-3);color:var(--cream)}.sidebar-item.active{color:var(--gold);background:#d4b0561f}.sidebar-icon{text-align:center;flex-shrink:0;width:20px;font-size:15px}.main{background:var(--dark-1);flex-direction:column;flex:1;display:flex;overflow:hidden}.main-header{border-bottom:1px solid #2e2b27;padding:20px 32px 16px}.main-title{color:var(--cream);font-size:18px;font-weight:600}.main-subtitle{color:var(--text-muted);margin-top:3px;font-size:13px}.main-body{flex:1;display:flex;overflow:hidden}.form-panel{scrollbar-width:thin;scrollbar-color:#3a3630 transparent;border-right:1px solid #2e2b27;width:340px;min-width:340px;padding:24px;overflow-y:auto}.form-panel::-webkit-scrollbar{width:4px}.form-panel::-webkit-scrollbar-thumb{background:#3a3630;border-radius:2px}.form-group{margin-bottom:18px}.form-label{letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);margin-bottom:7px;font-size:11px;font-weight:600;display:block}.form-input,.form-select,.form-textarea{background:var(--dark-3);width:100%;color:var(--cream);resize:none;border:1px solid #3a3630;border-radius:8px;outline:none;padding:10px 12px;font-family:inherit;font-size:13.5px;transition:border-color .15s}.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:var(--gold-dark)}.form-input::placeholder,.form-textarea::placeholder{color:#5a554c}.form-select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23a09880' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat;background-color:var(--dark-3);padding-right:32px}.form-select option{background:var(--dark-2);color:var(--cream)}.form-textarea{min-height:88px}.btn-generate{background:var(--gold);width:100%;color:var(--dark-1);cursor:pointer;letter-spacing:.02em;border:none;border-radius:8px;margin-top:6px;padding:13px;font-family:inherit;font-size:14px;font-weight:700;transition:background .15s,transform .1s}.btn-generate:hover:not(:disabled){background:var(--gold-2)}.btn-generate:active:not(:disabled){transform:scale(.99)}.btn-generate:disabled{background:var(--dark-4);color:var(--text-muted);cursor:not-allowed}.output-panel{flex-direction:column;flex:1;display:flex;overflow:hidden}.output-toolbar{border-bottom:1px solid #2e2b27;justify-content:space-between;align-items:center;min-height:50px;padding:12px 28px;display:flex}.output-status{color:var(--text-muted);align-items:center;font-size:12px;display:flex}.output-status.streaming{color:var(--gold)}.streaming-dot{background:var(--gold);border-radius:50%;width:7px;height:7px;margin-right:7px;animation:1s ease-in-out infinite pulse;display:inline-block}@keyframes pulse{0%,to{opacity:1}50%{opacity:.3}}.btn-copy{background:var(--dark-3);color:var(--cream-2);cursor:pointer;border:1px solid #3a3630;border-radius:6px;align-items:center;gap:6px;padding:7px 14px;font-family:inherit;font-size:13px;transition:border-color .15s,background .15s,color .15s;display:flex}.btn-copy:hover{border-color:var(--gold-dark);background:var(--dark-4)}.btn-copy.copied{border-color:var(--gold);color:var(--gold)}.output-content{scrollbar-width:thin;scrollbar-color:#3a3630 transparent;flex:1;padding:28px 32px;overflow-y:auto}.output-content::-webkit-scrollbar{width:5px}.output-content::-webkit-scrollbar-thumb{background:#3a3630;border-radius:3px}.output-text{color:var(--cream);white-space:pre-wrap;word-break:break-word;max-width:720px;font-size:15px;line-height:1.8}.output-cursor{background:var(--gold);vertical-align:text-bottom;width:2px;height:1em;margin-left:2px;animation:.8s step-end infinite blink;display:inline-block}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.output-empty{text-align:center;height:100%;color:var(--text-muted);flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:40px;display:flex}.output-empty-icon{opacity:.35;font-size:38px}.output-empty-title{color:#6b6455;font-size:15px;font-weight:500}.output-empty-sub{color:#504b44;max-width:300px;font-size:13px;line-height:1.65}