*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app{display:flex;height:100vh;background:#0f0f0f;color:#e0e0e0}.sidebar{min-width:350px;max-width:350px;flex-shrink:0;background:#1a1a1a;border-right:1px solid #333;overflow-y:auto;padding:20px}.viewer{flex:1;position:relative;display:flex;flex-direction:column}.viewer-tabs{display:flex;gap:0;background:#0f0f0f;border-bottom:1px solid #333;padding:0 20px}.viewer-tab{padding:12px 24px;background:transparent;border:none;color:#888;font-size:14px;font-weight:600;cursor:pointer;border-bottom:2px solid transparent;transition:all .2s}.viewer-tab:hover{color:#aaa}.viewer-tab.active{color:#e0e0e0;border-bottom-color:#6b8cce}.viewer-tab:disabled{color:#444;cursor:not-allowed}.viewer-content{flex:1;position:relative}.controls h2{margin-bottom:20px;color:#fff;font-size:24px}.controls section{margin-bottom:24px;padding-bottom:24px;border-bottom:1px solid #333}.controls section:last-of-type{border-bottom:none}.controls h3{margin-bottom:12px;color:#aaa;font-size:14px;text-transform:uppercase;letter-spacing:1px}.controls label{display:block;margin-bottom:12px;font-size:14px}.controls input[type=number],.controls input[type=range],.controls select,.controls input[type=file]{display:block;width:100%;margin-top:6px;padding:8px;background:#2a2a2a;border:1px solid #444;border-radius:4px;color:#e0e0e0;font-size:14px}.controls input[type=file]{padding:6px}.controls input[type=number]:focus,.controls select:focus{outline:none;border-color:#6b8cce}.controls input[type=range]{padding:0;cursor:pointer}.controls label span{display:inline-block;margin-left:8px;color:#888;font-size:12px}.controls input[type=checkbox],.controls input[type=radio]{width:auto;margin-right:8px;cursor:pointer}.convert-btn{width:100%;padding:14px;margin-top:20px;background:#9e7a5a;border:none;border-radius:6px;color:#fff;font-size:16px;font-weight:600;cursor:pointer;transition:background .2s}.convert-btn:hover:not(:disabled){background:#8e6a4a}.convert-btn:disabled{background:#3a3a3a;color:#666;cursor:not-allowed}.convert-btn:active:not(:disabled){transform:translateY(1px)}.export-btn{width:100%;padding:14px;margin-top:12px;background:#6b8cce;border:none;border-radius:6px;color:#fff;font-size:16px;font-weight:600;cursor:pointer;transition:background .2s}.export-btn:hover:not(:disabled){background:#5a7ab8}.export-btn:disabled{background:#3a3a3a;color:#666;cursor:not-allowed}.export-btn:active:not(:disabled){transform:translateY(1px)}.sidebar::-webkit-scrollbar{width:8px}.sidebar::-webkit-scrollbar-track{background:#1a1a1a}.sidebar::-webkit-scrollbar-thumb{background:#444;border-radius:4px}.sidebar::-webkit-scrollbar-thumb:hover{background:#555}.ai-auth-btn{width:100%;padding:12px;background:#6b8cce;border:none;border-radius:6px;color:#fff;font-size:14px;font-weight:600;cursor:pointer;transition:background .2s}.ai-auth-btn:hover{background:#5a7ab8}.ai-auth-btn:active{transform:translateY(1px)}.ai-generate-btn{width:100%;padding:12px;margin-top:12px;background:#5a9e6f;border:none;border-radius:6px;color:#fff;font-size:14px;font-weight:600;cursor:pointer;transition:background .2s}.ai-generate-btn:hover:not(:disabled){background:#4a8e5f}.ai-generate-btn:disabled{background:#3a3a3a;color:#666;cursor:not-allowed}.ai-generate-btn:active:not(:disabled){transform:translateY(1px)}.error-message{margin-top:8px;padding:8px;background:#4a2a2a;border:1px solid #8a4a4a;border-radius:4px;color:#f88;font-size:12px}