:root{--bg:#f8fafc;--text:#0f172a;--card-bg:#fff;--hover-bg:#f1f5f9}html,body,#root{height:100%;margin:0}body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;background:var(--bg);color:var(--text)}.app-header{height:56px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;background:var(--card-bg);color:var(--text);box-shadow:0 1px #0000000f;position:fixed;left:0;right:0;top:0;z-index:20}.container{display:flex;padding-top:56px;height:calc(100vh - 56px)}.sidebar{width:260px;background:var(--card-bg);border-right:1px solid #e6eef6;transition:transform .22s ease;transform:translate(0);position:relative;z-index:30}.sidebar.closed{transform:translate(-100%)}.main{flex:1;padding:20px;transition:transform .22s ease;transform:translate(0)}.sidebar.closed+.main{transform:translate(-260px)}.menu-button{background:none;border:0;padding:10px 12px;cursor:pointer;font-size:18px;font-weight:700;min-width:40px;min-height:40px;line-height:1;border-radius:6px}.nav-link{display:block;padding:10px 16px;color:var(--text);text-decoration:none}.nav-link:hover{background:var(--hover-bg)}.login-center{height:calc(100vh - 56px);display:flex;align-items:center;justify-content:center}.login-card{background:#fff;padding:32px;border-radius:8px;box-shadow:0 8px 20px #02061714;text-align:center}.google-btn{background:#4285f4;color:#fff;padding:10px 18px;border-radius:8px;border:0;cursor:pointer}.settings-item{position:relative}.settings-label{padding:10px 16px;cursor:pointer;color:var(--text);font-weight:500}.settings-label:hover{background:var(--hover-bg)}.settings-submenu{display:none;position:static;margin-left:16px;padding-left:8px;min-width:150px;background:transparent;border-radius:6px;overflow:visible;z-index:50}.settings-submenu .nav-link{padding:8px 12px;display:block;color:var(--text)}.settings-item.open .settings-submenu{display:block}.dark{--bg:#0f172a;--text:#f8fafc;--card-bg:#0b1220;--hover-bg:rgba(255,255,255,.04)}.dark .menu-button{color:var(--text)}.btn{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:8px;border:1px solid transparent;background:transparent;color:var(--text);cursor:pointer;font-weight:600}.btn:focus{outline:2px solid rgba(59,130,246,.25);outline-offset:2px}.btn-ghost{background:transparent;border:1px solid transparent}.btn-ghost:hover{background:#0f172a0a}.btn-icon{width:36px;height:36px;padding:6px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center}.btn-icon svg{width:18px;height:18px}.settings-submenu .btn{width:100%;justify-content:flex-start;padding:10px 12px}.danger{color:#b22222}.danger:hover{background:#b222220f}.flex{display:flex}.w-full{width:100%}.items-center{align-items:center}.justify-between{justify-content:space-between}.rounded-md{border-radius:6px}.px-3{padding-left:12px;padding-right:12px}.py-2{padding-top:8px;padding-bottom:8px}.text-sm{font-size:.875rem}.text-red-600{color:#dc2626}.hover\:bg-red-50:hover{background:#fff1f2}.hover\:text-red-700:hover{color:#b91c1c}button.flex.w-full.items-center.justify-between.rounded-md{border:0!important;box-shadow:none!important;background:transparent}button.flex.w-full.items-center.justify-between.rounded-md:hover,.flex.w-full.items-center.justify-between.rounded-md:hover{background:#fff1f2;color:#b91c1c}.api-key-page{color:var(--text)}.api-key-page .field-label{margin-bottom:6px;color:#0f172a99}.api-key-page .field-input{width:100%;padding:8px;border:1px solid #ddd;background:#fff;color:var(--text);border-radius:6px}.save-btn{padding:10px 16px;background:#2d8aef;color:#fff;border:none;border-radius:6px;cursor:pointer;font-weight:600}.save-btn:disabled{opacity:.6;cursor:not-allowed;background:#9bb4e8}.dark .save-btn{background:#1f6fd6}.dark .save-btn:disabled{background:#4b6f9f}.api-key-page .field-input[readonly]{background:#f3f3f3}.dark .api-key-page .field-label{color:#f8f8fccc}.dark .api-key-page .field-input{background:var(--hover-bg);border-color:#ffffff14;color:var(--text)}.dark .api-key-page .field-input[readonly]{background:#ffffff05}.sidebar-footer{position:absolute;left:0;right:0;bottom:12px;padding:0 12px}.sidebar-footer .flex.w-full{background:transparent}.prompt-page{width:90vw;max-width:none;margin:0 auto;padding:24px}.prompt-name-input{background:#fff;border:1px solid #e5e7eb;color:var(--text);border-radius:6px}.prompt-name-input:focus{outline:2px solid rgba(59,130,246,.18)}.dark .prompt-name-input{background:#ffffff1a;border-color:#ffffff1f;color:var(--text)}.prompt-textarea{background:#fff}.dark .prompt-textarea{background:#ffffff0f;border-color:#ffffff14}.prompt-textarea,.dark .prompt-textarea{color:var(--text)}.prompt-system-textarea{width:70%;min-height:420px;display:block;margin:0}.prompt-name-input option{background:#fff;color:var(--text)}.dark .prompt-name-input option{background:#1e293b;color:var(--text)}.audio-setting-page{width:60%;margin:24px 0;padding:16px}.audio-setting-title{font-size:24px;font-weight:600;margin-bottom:16px}.audio-setting-card{background:var(--card-bg);padding:16px;border-radius:8px;box-shadow:0 1px 3px #0f172a14;margin-bottom:24px}.audio-setting-grid{display:grid;grid-template-columns:1.5fr 1.5fr 2fr auto;gap:12px;align-items:flex-end}.audio-setting-label{margin-bottom:6px;font-size:12px;color:#0f172ab3}.audio-setting-actions{display:flex;justify-content:flex-end}.audio-setting-error{margin-top:12px;font-size:12px;color:#b91c1c}.audio-setting-message{padding:12px;font-size:14px}.audio-setting-message-empty{color:#94a3b8}.audio-input{width:100%;padding:8px 10px;border-radius:6px;border:1px solid #e5e7eb;background:#fff;color:var(--text);font-size:13px}.audio-input:focus{outline:2px solid rgba(59,130,246,.35);outline-offset:1px}.dark .audio-input{background:#0f172ae6;border-color:#94a3b880;color:var(--text)}.audio-table-wrapper{width:100%;overflow-x:auto}.audio-table{width:100%;border-collapse:collapse;font-size:13px;color:var(--text)}.audio-table thead tr{background:#e5e7eb;color:#0f172a}.dark .audio-table thead tr{background:#020617;color:#e5e7eb}.audio-table th,.audio-table td{border:1px solid rgba(148,163,184,.5);padding:6px 8px;text-align:left}.audio-table tbody tr:nth-child(2n){background:#f8fafc}.dark .audio-table tbody tr:nth-child(2n){background:#020617}.audio-table tbody tr:hover{background:#e0f2fe}.dark .audio-table tbody tr:hover{background:#0b1120}.icon-btn{width:28px;height:28px;border-radius:999px;border:1px solid transparent;background:transparent;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}.icon-btn:hover{background:#0f172a0f}.dark .icon-btn:hover{background:#94a3b82e}.icon-btn-danger{color:#dc2626}.icon-btn-danger:hover{background:#f8717138}.icon-btn-ghost{color:#0f172ab3}.dark .icon-btn-ghost{color:#e2e8f0e6}.icon-edit:before{content:"✎";font-size:13px}.dark .icon-edit:before{color:#fff}.icon-trash:before{content:"🗑️";font-size:15px}.icon-save:before{content:"💾";font-size:13px}.icon-cancel:before{content:"✕";font-size:13px}.audio-col-id{width:10%}.audio-col-name{width:20%}.audio-col-voice{width:25%}.audio-col-explain{width:35%}.audio-col-action{width:10%}.audio-row-actions{display:flex;gap:8px;justify-content:center}