:root{--radius-sm:10px;--radius-md:16px;--radius-lg:24px;--focus:0 0 0 4px rgba(22,199,132,.16)}body{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}.nav{position:sticky;top:0;max-width:none;padding-inline:max(24px,calc((100vw - 1152px)/2));background:rgba(255,255,255,.86);backdrop-filter:blur(18px);border-bottom:1px solid rgba(230,233,239,.75)}.hero,.section{content-visibility:auto;contain-intrinsic-size:700px}.primary,.secondary,.ghost,.light-btn{min-height:42px}.primary:disabled,.secondary:disabled,button:disabled{opacity:.58;cursor:not-allowed;transform:none!important}.product,.model-card,.stat-cards article,.panel{transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}.product:hover,.model-card:hover{transform:translateY(-3px);border-color:#cbded6;box-shadow:0 18px 45px rgba(18,38,32,.08)}.panel{box-shadow:0 4px 18px rgba(22,35,30,.025)}.is-loading{position:relative;color:transparent!important;pointer-events:none}.is-loading:after{content:"";position:absolute;width:16px;height:16px;border:2px solid #0b4b38;border-right-color:transparent;border-radius:50%;left:calc(50% - 8px);top:calc(50% - 8px);animation:spin .65s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.skeleton{position:relative;overflow:hidden;background:#edf1ef!important;color:transparent!important;min-height:18px;border-radius:7px}.skeleton:after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.8),transparent);animation:shimmer 1.15s infinite}@keyframes shimmer{to{transform:translateX(100%)}}input,textarea,select{transition:border-color .18s,box-shadow .18s}input:focus,textarea:focus,select:focus{outline:0;border-color:var(--green)!important;box-shadow:var(--focus)}button:focus-visible,a:focus-visible{outline:3px solid rgba(22,199,132,.3);outline-offset:3px}.offline-bar{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);background:#8a3d16;color:white;padding:9px 15px;border-radius:30px;font-size:12px;z-index:30;box-shadow:var(--shadow)}.form-status:not(:empty){padding:10px 12px;border-radius:8px;background:#f7faf9}.dashboard>header{position:sticky;top:0;z-index:4}.activity-list>div:last-child{border-bottom:0}.key-list code{user-select:all}
@media(max-width:800px){body.nav-open{overflow:hidden}.nav .menu{position:relative;z-index:12}.nav.nav-open nav{display:flex!important;position:fixed;inset:76px 14px auto;background:white;border:1px solid var(--line);border-radius:16px;padding:18px;flex-direction:column;gap:4px;box-shadow:var(--shadow)}.nav.nav-open nav a{padding:12px;border-radius:9px}.nav.nav-open nav a:hover{background:#edf9f4}.call-card{transform:none}.hero{min-height:auto}.numbers div{padding:23px}.dashboard>header{padding-inline:16px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* 2026 visual system */
:root{--green:#20d89a;--deep:#071c18;--ink:#10201c;--muted:#6c7c77;--line:#dfe8e4;--bg:#f3f7f5;--shadow:0 24px 70px rgba(7,28,24,.11)}
body{background:linear-gradient(180deg,#fff 0,#fbfdfc 50%,#f4f8f6 100%)}
.brand{font-weight:900;letter-spacing:-2.5px}
.primary{color:#06251b;background:linear-gradient(135deg,#2ce2a5,#16c98c);box-shadow:0 10px 28px rgba(22,201,140,.24)}
.primary:hover{background:linear-gradient(135deg,#38e8ae,#19d394);box-shadow:0 14px 34px rgba(22,201,140,.3)}
.hero{min-height:720px}
.hero:after{content:"";position:absolute;width:260px;height:260px;left:-170px;bottom:20px;border:1px solid rgba(22,199,132,.18);border-radius:50%;box-shadow:0 0 0 45px rgba(22,199,132,.035),0 0 0 90px rgba(22,199,132,.025);z-index:-1}
.call-card{background:linear-gradient(145deg,#102f27,#071d18);border:1px solid rgba(255,255,255,.08);box-shadow:0 35px 90px rgba(4,25,20,.3)}
.product,.model-card{border-color:#e2ebe7;box-shadow:0 10px 35px rgba(10,42,33,.035)}

.dash-body{background:radial-gradient(circle at 90% 0,rgba(32,216,154,.1),transparent 30%),#f3f7f5}
.sidebar{width:264px;padding:30px 22px;background:linear-gradient(180deg,#0b2922 0%,#061b17 100%);border-right:1px solid rgba(255,255,255,.06);box-shadow:16px 0 50px rgba(5,30,23,.08)}
.sidebar:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 10%,rgba(46,226,166,.13),transparent 27%);pointer-events:none}
.sidebar>*{position:relative}
.sidebar .brand{font-size:32px}
.sidebar>small{margin-top:5px;color:#65e4b7;font-weight:800}
.sidebar nav{gap:7px;margin-top:38px}
.sidebar button{min-height:46px;padding:13px 15px;border-radius:13px;font-weight:650}
.sidebar button:hover{background:rgba(255,255,255,.07)}
.sidebar button.active{color:#fff;background:linear-gradient(135deg,rgba(44,226,165,.2),rgba(44,226,165,.09));box-shadow:inset 3px 0 #2ce2a5}
.dashboard{margin-left:264px}
.dashboard>header{height:88px;padding:0 42px;background:rgba(255,255,255,.82);backdrop-filter:blur(22px);border-color:rgba(212,226,220,.8)}
.engine-chip{margin-left:auto;margin-right:22px;display:flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid #dcebe5;border-radius:99px;background:#f5fcf9;color:#397163;font-size:12px;font-weight:750}
.engine-chip i{width:8px;height:8px;background:#1fd398;border-radius:50%;box-shadow:0 0 0 4px rgba(31,211,152,.13)}
.user-chip{padding:7px 10px 7px 7px;border:1px solid #e1ebe7;border-radius:14px;background:#fff}
.user-chip>span{background:linear-gradient(145deg,#d9faee,#bff2df)}
.dash-page{padding:44px;max-width:1450px}
.dash-title{margin-bottom:30px}
.dash-title h1{font-size:34px;letter-spacing:-1.2px}
.dash-title p{font-size:14px}
.stat-cards{grid-template-columns:repeat(4,1fr);gap:16px}
.stat-cards article,.panel{border-color:#e0eae6;border-radius:20px;box-shadow:0 12px 36px rgba(8,39,30,.045)}
.stat-cards article{min-height:112px;padding:22px;background:linear-gradient(145deg,#fff,#fbfdfc)}
.stat-cards article>span{width:50px;height:50px;border-radius:15px;background:linear-gradient(145deg,#e2fbf2,#ccf5e6)}
.stat-cards b{font-size:28px;letter-spacing:-1px}
.panel{padding:26px}
.tool-layout{grid-template-columns:minmax(0,1.8fr) minmax(260px,.7fr);gap:24px}
.tool label,.stt-tool label{color:#314b43;font-weight:750}
.tool textarea,.stt-tool textarea,.tool input,.tool select,.stt-tool input{border:1px solid #dce7e2;background:#fbfdfc;border-radius:13px;padding:13px}
.tool textarea,.stt-tool textarea{line-height:1.65}
.tool .primary,.stt-tool .primary{min-height:50px}
#ttsPlayer{display:block;width:100%;height:48px;margin:18px 0 10px;border-radius:14px}
#ttsDownload{display:inline-flex;align-items:center;justify-content:center;margin-bottom:8px}
.mic{background:linear-gradient(145deg,#fbfefd,#f3faf7);border-color:#c9ddd5;min-height:190px;justify-content:center;margin-top:14px}
.mic:hover{border-color:#24cf96;background:#f1fcf8}
.mic span{box-shadow:0 12px 30px rgba(11,178,118,.15)}
#aiResult{background:#f4faf7;min-height:230px}
.activity-list>div{padding:17px 4px}
.activity-list .type{border-radius:12px}
.form-status:not(:empty){border:1px solid #dcebe5;color:#397163;background:#f3fbf8}

@media(max-width:1100px){.stat-cards{grid-template-columns:repeat(2,1fr)}.tool-layout{grid-template-columns:1fr}.tips{order:2}}
@media(max-width:800px){.sidebar{width:264px}.dashboard{margin-left:0}.dashboard>header{height:74px;padding-inline:16px}.engine-chip{margin-left:auto;margin-right:8px}.engine-chip span{display:none}.dash-page{padding:26px 16px}.dash-title h1{font-size:28px}.stat-cards{grid-template-columns:1fr 1fr;gap:10px}.stat-cards article{min-height:92px;padding:14px}.stat-cards article>span{width:40px;height:40px}.stat-cards b{font-size:22px}.panel{padding:18px}.activity-list>div{grid-template-columns:40px 1fr}.activity-list>div>small{display:none}}
@media(max-width:460px){.stat-cards{grid-template-columns:1fr}.dash-title{flex-direction:column}.user-chip{border:0;background:transparent;padding:0}.engine-chip{display:none}}

/* Dashboard layout refinement */
.dashboard>header{display:grid;grid-template-columns:auto 1fr auto auto;gap:22px;align-items:center}
.dashboard>header>.engine-chip{margin:0;grid-column:3}
.dashboard>header>.user-chip{margin:0;grid-column:4}
.dash-page{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.dash-title h1,.dash-title h2,.dash-title h3,.panel h3{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.page-kicker{display:block;margin-bottom:7px;color:#0aa875;font-size:11px;font-weight:850;letter-spacing:1.6px}
.locale-badge{display:flex;align-items:center;gap:8px;padding:10px 14px;border:1px solid #d9e8e2;border-radius:999px;background:#fff;color:#476c61;font-size:12px;font-weight:750;box-shadow:0 6px 20px rgba(8,39,30,.04)}
.locale-badge i{width:8px;height:8px;border-radius:50%;background:#1bd196;box-shadow:0 0 0 4px rgba(27,209,150,.12)}
.tts-workspace{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:20px;align-items:start}
.tts-editor{padding:0;overflow:hidden}
.editor-heading{display:flex;justify-content:space-between;align-items:flex-start;padding:25px 27px 20px;border-bottom:1px solid #e7eeeb}
.editor-heading h3{margin:0 0 5px;font-size:16px;color:#19372e}
.editor-heading p{margin:0;color:#7b8d87;font-size:13px}
.editor-heading>span{padding:6px 9px;border-radius:8px;background:#f1f7f4;color:#56736a;font-size:11px;font-weight:750}
.tts-editor>textarea{display:block;width:calc(100% - 54px);min-height:310px;margin:22px 27px 16px;padding:20px;border:1px solid #dce7e2;border-radius:15px;background:#fcfefd;color:#18342c;font-size:16px;line-height:1.75;resize:vertical}
.tts-editor>textarea::placeholder{color:#a1afaa}
.tts-controls{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:20px 27px;border-top:1px solid #e7eeeb;background:#fbfdfc}
.tts-controls label{display:flex;flex-direction:column;gap:8px;margin:0;color:#38564d;font-size:12px;font-weight:750}
.tts-controls label>span{display:flex;justify-content:space-between}
.tts-controls select{width:100%;height:46px;padding:0 13px;border:1px solid #d8e5df;border-radius:12px;background:#fff;color:#18342c;font-weight:650}
.tts-controls .speed-control{grid-column:1/-1}
.speed-control b{color:#0aa875;font-size:12px}
.speed-control input{width:100%;height:6px;padding:0;accent-color:#12c98b}
.tts-footer{display:flex;align-items:center;gap:16px;padding:20px 27px 25px;background:#fbfdfc}
.tts-footer .primary{min-width:180px;min-height:50px;border-radius:13px}
.tts-footer .form-status{margin:0;flex:1}
.tts-side{align-self:start;padding:26px}
.tts-side .side-icon{display:grid;place-items:center;width:44px;height:44px;margin-bottom:20px;border-radius:14px;background:linear-gradient(145deg,#dcfaef,#c5f2e1);color:#0aaa76;font-size:18px}
.tts-side h3{margin:0 0 9px;font-size:18px}
.tts-side>p{margin:0;color:#71837d;font-size:13px;line-height:1.6}
.tts-side ul{display:flex;flex-direction:column;gap:18px;margin:25px 0 0;padding:23px 0 0;border-top:1px solid #e6eeeb;list-style:none}
.tts-side li{display:grid;grid-template-columns:31px 1fr;gap:12px;align-items:start}
.tts-side li>span{display:grid;place-items:center;width:31px;height:31px;border-radius:9px;background:#eff8f4;color:#15976c;font-size:10px;font-weight:850}
.tts-side li div{display:flex;flex-direction:column;gap:3px}
.tts-side li b{color:#29483f;font-size:12px}
.tts-side li small{color:#80908b;font-size:11px;line-height:1.45}
.audio-result{grid-column:1;padding:22px 25px}
.audio-result-head{display:flex;align-items:center;gap:12px;margin-bottom:17px}
.audio-wave-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:#e1faf0;color:#0dac77;font-size:18px}
.audio-result-head>div:nth-child(2){display:flex;flex-direction:column;gap:2px}
.audio-result-head small{color:#7b8d87;font-size:11px}
.ready-dot{margin-left:auto;padding:5px 8px;border-radius:99px;background:#e4f9f0;color:#0b9a6a;font-size:9px;font-weight:850;letter-spacing:.8px}
.audio-result audio{width:100%;height:48px;margin:0 0 14px}
.audio-result .secondary{display:inline-flex;min-height:42px;align-items:center;justify-content:center}

@media(max-width:1050px){.tts-workspace{grid-template-columns:1fr}.tts-side{grid-row:2}.audio-result{grid-column:1;grid-row:3}}
@media(max-width:800px){.dashboard>header{grid-template-columns:auto 1fr auto;gap:10px}.dashboard>header>.engine-chip{grid-column:2;justify-self:end}.dashboard>header>.user-chip{grid-column:3}.locale-badge{display:none}.tts-editor>textarea{width:calc(100% - 32px);margin:16px;min-height:260px}.editor-heading,.tts-controls,.tts-footer{padding-left:18px;padding-right:18px}}
@media(max-width:520px){.tts-controls{grid-template-columns:1fr}.tts-controls .speed-control{grid-column:1}.tts-footer{align-items:stretch;flex-direction:column}.tts-footer .primary{width:100%}.editor-heading p{display:none}.tts-side{display:none}}

/* Voice studio — focused single-column workspace */
.voice-page{max-width:1180px;padding-top:42px}
.voice-page-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:26px}
.voice-page-head h1{margin:3px 0 7px;color:#102a23;font:800 34px/1.15 Inter,ui-sans-serif,sans-serif;letter-spacing:-1.2px}
.voice-page-head p{margin:0;color:#74857f;font-size:14px}
.voice-studio{overflow:hidden;border:1px solid #dce7e2;border-radius:22px;background:#fff;box-shadow:0 18px 55px rgba(7,38,29,.07)}
.studio-toolbar{display:grid;grid-template-columns:190px 190px minmax(240px,1fr);gap:18px;align-items:end;padding:20px 24px;border-bottom:1px solid #e7eeeb;background:#f8fbfa}
.voice-picker,.studio-speed{display:flex;flex-direction:column;gap:7px}
.voice-picker label,.studio-speed label{color:#526b63;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.7px}
.voice-picker select{height:44px;padding:0 12px;border:1px solid #d5e2dc;border-radius:11px;background:#fff;color:#19372e;font-weight:700}
.studio-speed>div{display:flex;justify-content:space-between;align-items:center}
.studio-speed b{color:#0aa875;font-size:12px}
.studio-speed input{width:100%;height:6px;margin:12px 0 10px;padding:0;accent-color:#12c98b}
.studio-editor{padding:24px}
.editor-top{display:flex;justify-content:space-between;margin-bottom:10px}
.editor-top label{color:#29483f;font-size:13px;font-weight:800}
.editor-top span{color:#81918c;font-size:11px;font-weight:700}
.studio-editor textarea{display:block;width:100%;min-height:330px;padding:20px;border:1px solid #d9e5e0;border-radius:15px;outline:0;background:#fcfefd;color:#142f27;font:500 16px/1.75 Inter,ui-sans-serif,sans-serif;resize:vertical}
.studio-editor textarea:focus{border-color:#22c991;box-shadow:0 0 0 4px rgba(34,201,145,.11)}
.studio-editor textarea::placeholder{color:#a4b1ad}
.studio-action{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;padding:18px 24px;border-top:1px solid #e7eeeb;background:#f8fbfa}
.quality-note{display:flex;align-items:center;gap:10px}
.quality-note>i{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#dcf8ed;color:#08a570;font-style:normal;font-weight:900}
.quality-note>span{display:flex;flex-direction:column}
.quality-note b{color:#2c4a41;font-size:12px}
.quality-note small{color:#82928c;font-size:10px}
.studio-action .form-status{margin:0;text-align:right}
.studio-action .primary{min-width:180px;min-height:48px;border-radius:12px}
.voice-page>.audio-result{margin-top:18px;padding:20px 23px;border:1px solid #dce7e2;border-radius:18px;background:#fff;box-shadow:0 10px 35px rgba(8,39,30,.05)}
.studio-tips{display:flex;align-items:center;justify-content:center;gap:26px;margin-top:18px;padding:14px 18px;color:#71837d;font-size:11px}
.studio-tips>span{color:#314f46;font-weight:800}
.studio-tips p{margin:0}
.studio-tips b{margin-right:6px;color:#0aaa76}
@media(max-width:800px){.voice-page{padding-top:26px}.voice-page-head{align-items:flex-start}.studio-toolbar{grid-template-columns:1fr 1fr}.studio-speed{grid-column:1/-1}.studio-editor{padding:18px}.studio-editor textarea{min-height:280px}.studio-action{grid-template-columns:1fr auto}.studio-action .form-status{grid-column:1/-1;grid-row:2;text-align:left}.studio-tips{align-items:flex-start;flex-direction:column;gap:8px;padding-inline:4px}}
@media(max-width:520px){.studio-toolbar{grid-template-columns:1fr}.studio-speed{grid-column:1}.studio-action{display:flex;align-items:stretch;flex-direction:column}.studio-action .primary{width:100%}.quality-note{display:none}.voice-page-head .locale-badge{display:none}.studio-editor textarea{min-height:240px}}

/* Bonu AI unified spacious layout */
.nav,.hero,.section,footer{max-width:1320px}
.nav{height:82px}
.brand{display:inline-flex;align-items:center;color:#142d25;font-size:28px;letter-spacing:-1.8px}
.brand span{margin-right:3px;color:#15c98b}
.sidebar .brand{color:#fff;font-size:29px}
.dashboard{min-width:0}
.dash-page{width:100%;max-width:1240px;padding:42px 38px 60px}
.dash-title{align-items:flex-end;padding-bottom:5px}
.dash-title h1{font-size:32px}
.dash-title p{max-width:620px}
.stat-cards{gap:14px}
.panel{border-radius:18px}

/* STT uses the full canvas without empty dead space */
#page-stt .stt-tool{display:grid;grid-template-columns:minmax(280px,.85fr) minmax(380px,1.15fr);gap:18px 24px;max-width:none;padding:25px}
#page-stt .stt-tool>label:first-child{grid-column:1;align-self:start;margin:0;padding:18px;border:1px solid #dce7e2;border-radius:14px;background:#f8fbfa}
#page-stt .stt-tool>label:nth-child(2){grid-column:1;margin:0;padding:13px 15px;border-radius:12px;background:#eef8f4;color:#34594e}
#page-stt .mic{grid-column:1;min-height:240px;margin:0}
#page-stt textarea{grid-column:2;grid-row:1/4;min-height:360px;margin:0}
#page-stt #saveTranscript{grid-column:2;justify-self:end;min-width:190px;min-height:48px}
#page-stt .form-status{grid-column:1/-1;margin:0}

/* Text AI: balanced editor workspace */
.ai-page{max-width:1240px}
.ai-workspace{overflow:hidden;border:1px solid #dce7e2;border-radius:22px;background:#fff;box-shadow:0 18px 55px rgba(7,38,29,.07)}
.ai-toolbar{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:20px 24px;border-bottom:1px solid #e5ede9;background:#f8fbfa}
.ai-toolbar>label{display:flex;width:300px;flex-direction:column;gap:7px;margin:0}
.ai-toolbar>label>span{color:#526b63;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.7px}
.ai-toolbar select{width:100%;height:44px;padding:0 13px;border:1px solid #d5e2dc;border-radius:11px;background:#fff;color:#19372e;font-weight:700}
.ai-engine{display:flex;align-items:center;gap:10px;padding:8px 12px;border:1px solid #dce9e4;border-radius:12px;background:#fff}
.ai-engine>i{width:9px;height:9px;border-radius:50%;background:#1bd196;box-shadow:0 0 0 4px rgba(27,209,150,.12)}
.ai-engine>span{display:flex;flex-direction:column;gap:2px}.ai-engine b{color:#315047;font-size:11px}.ai-engine small{color:#81918c;font-size:9px}
.ai-editors{display:grid;grid-template-columns:1fr 1fr;gap:0}
.ai-editor{display:block;margin:0;padding:24px}.ai-editor+.ai-editor{border-left:1px solid #e5ede9}
.ai-editor>span{display:flex;align-items:center;justify-content:space-between;margin-bottom:11px}
.ai-editor>span b{color:#29483f;font-size:13px}.ai-editor>span small{color:#81918c;font-size:10px;font-weight:700}
.ai-editor textarea{display:block;width:100%;min-height:390px;margin:0;padding:19px;border:1px solid #d9e5e0;border-radius:15px;background:#fcfefd;color:#142f27;font:500 15px/1.75 Inter,ui-sans-serif,sans-serif;resize:vertical}
.ai-editor textarea::placeholder{color:#a1afaa}.ai-output textarea{background:#f6fbf8}
.ai-actions{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:12px;padding:17px 24px;border-top:1px solid #e5ede9;background:#f8fbfa}
.ai-actions .form-status{margin:0}.ai-actions button{min-height:46px}.ai-actions #runAi{min-width:180px}.ai-actions #copyAiResult{min-width:170px}

/* API and admin tables use available width cleanly */
#page-keys>.panel,#page-admin>.panel{padding:28px}
.key-list>div{min-height:72px;padding-inline:8px}
.table-wrap{border:1px solid #e3ebe7;border-radius:14px}
table{margin:0}
th{background:#f6faf8;font-size:11px;text-transform:uppercase;letter-spacing:.5px}
th,td{padding:15px 16px}

@media(max-width:980px){#page-stt .stt-tool{grid-template-columns:1fr}#page-stt .stt-tool>*{grid-column:1!important;grid-row:auto!important}#page-stt textarea{min-height:280px}.ai-editors{grid-template-columns:1fr}.ai-editor+.ai-editor{border-top:1px solid #e5ede9;border-left:0}.ai-editor textarea{min-height:280px}}
@media(max-width:800px){.dash-page{padding:28px 16px 50px}.dash-title{align-items:flex-start}.dashboard>header{padding-inline:14px}.nav{height:72px}.brand{font-size:25px}}
@media(max-width:620px){.ai-toolbar{align-items:stretch;flex-direction:column}.ai-toolbar>label{width:100%}.ai-engine{align-self:flex-start}.ai-editor{padding:17px}.ai-actions{grid-template-columns:1fr}.ai-actions button{width:100%}.ai-actions .form-status{min-height:0}.ai-editor textarea{min-height:240px}}

/* Production API key manager */
#keysList{display:flex;flex-direction:column;gap:13px}
.key-card{display:grid;grid-template-columns:minmax(280px,1.3fr) minmax(320px,1fr) auto;gap:24px;align-items:center;padding:20px;border:1px solid #dfe9e5;border-radius:16px;background:#fff}
.key-card.revoked,.key-card.expired{opacity:.68;background:#fafbfb}
.key-main{min-width:0}
.key-title{display:flex;align-items:center;gap:10px;margin-bottom:9px}
.key-title b{font-size:14px}
.key-status{padding:4px 7px;border-radius:99px;background:#e1f8ef;color:#079767;font-size:9px;font-weight:850;text-transform:uppercase;letter-spacing:.5px}
.revoked .key-status,.expired .key-status{background:#f1f2f3;color:#737d79}
.key-main>code{display:block;overflow:hidden;margin-bottom:10px;color:#415e55;font-size:12px;text-overflow:ellipsis;white-space:nowrap}
.visible-key{display:flex;align-items:center;gap:7px;margin-bottom:10px;padding:8px 9px;border:1px solid #dce8e3;border-radius:10px;background:#f7faf9}
.visible-key code{min-width:0;flex:1;overflow:auto;color:#284c40;font-size:10px;white-space:nowrap;user-select:all}
.visible-key button{border:0;border-radius:7px;background:#173f33;color:#fff;padding:7px 9px;font-size:9px;font-weight:800;cursor:pointer}
.scope-list{display:flex;flex-wrap:wrap;gap:5px}
.scope-list span{padding:4px 7px;border:1px solid #dce8e3;border-radius:7px;color:#587168;background:#f8fbfa;font-size:9px;font-weight:700}
.key-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.key-metrics span{display:flex;min-width:85px;flex-direction:column;gap:3px}
.key-metrics small{color:#879690;font-size:9px;text-transform:uppercase;letter-spacing:.4px}
.key-metrics b{color:#355248;font-size:11px;font-weight:750}
.key-actions{display:flex;gap:7px}
.key-actions button{min-height:38px;padding:8px 10px;font-size:10px;white-space:nowrap}
.danger-btn{border:0;border-radius:9px;background:#fff0f0;color:#ca4646;font-weight:750;cursor:pointer}
.reveal-btn{min-height:38px;padding:8px 11px;border:1px solid #cce7dc;border-radius:9px;background:#e9f9f2;color:#078a5f;font-size:10px;font-weight:800;cursor:pointer;white-space:nowrap}
.keys-empty{padding:58px 20px;text-align:center}
.keys-empty>span{display:grid;width:52px;height:52px;margin:0 auto 14px;place-items:center;border-radius:15px;background:#e4f9f0;color:#0aa875;font-size:22px}
.keys-empty h3{margin:0 0 7px}.keys-empty p{margin:0;color:#7b8d87;font-size:12px}
.key-dialog{width:min(540px,calc(100% - 28px));padding:30px;border-radius:22px}
.key-dialog h2{margin:5px 0 7px;font:800 25px Inter,sans-serif;letter-spacing:-.7px}
.modal-kicker{color:#09a873;font-size:9px;font-weight:900;letter-spacing:1.3px}
.modal-help{margin:0 0 22px;color:#758680;font-size:12px;line-height:1.55}
.key-dialog form>label{display:flex;flex-direction:column;gap:7px;margin:14px 0;color:#355248;font-size:11px;font-weight:800}
.key-dialog input[type=text],.key-dialog input:not([type]),.key-dialog select{height:44px;padding:0 12px;border:1px solid #d8e4df;border-radius:11px;background:#fff}
.key-dialog fieldset{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:17px 0;padding:16px;border:1px solid #dfe9e5;border-radius:13px}
.key-dialog legend{padding:0 5px;color:#355248;font-size:11px;font-weight:800}
.key-dialog fieldset label{font-size:11px;color:#526c63}
.key-dialog form>.primary,.key-dialog>[data-key-done]{width:100%;margin-top:8px}
.key-success{display:grid;width:52px;height:52px;margin-bottom:14px;place-items:center;border-radius:50%;background:#dcf8ed;color:#08a570;font-size:23px;font-weight:900}
.raw-key{display:flex;gap:8px;margin:18px 0;padding:10px;border:1px solid #d8e5df;border-radius:12px;background:#f7faf9}
.raw-key code{min-width:0;flex:1;overflow:auto;padding:8px;color:#183a30;font-size:11px;white-space:nowrap}
.raw-key button{border:0;border-radius:8px;background:#163d32;color:#fff;padding:0 13px;font-size:10px;font-weight:800;cursor:pointer}
@media(max-width:1050px){.key-card{grid-template-columns:1fr auto}.key-metrics{grid-column:1}.key-actions{grid-column:2;grid-row:1/3}}
@media(max-width:700px){.key-card{grid-template-columns:1fr}.key-metrics{grid-column:1;grid-template-columns:1fr 1fr}.key-actions{grid-column:1;grid-row:auto}.key-dialog fieldset{grid-template-columns:1fr}}

/* Bonu AI home — premium landing experience */
.home-body{overflow-x:hidden;background:#fff;color:#10231d}
.home-body .nav{position:sticky;top:0;z-index:20;width:100%;max-width:none;height:78px;padding-inline:max(24px,calc((100vw - 1180px)/2));border-bottom:1px solid rgba(218,230,225,.75);background:rgba(255,255,255,.88);backdrop-filter:blur(20px)}
.home-body .nav .brand{font-size:28px}.home-body .nav nav{justify-content:center;gap:36px}.home-body .nav nav a{position:relative;color:#50645d;font-size:13px;font-weight:650}
.home-body .nav nav a:after{content:"";position:absolute;right:0;bottom:-9px;left:0;height:2px;transform:scaleX(0);border-radius:3px;background:#16c98b;transition:transform .2s}.home-body .nav nav a:hover:after{transform:scaleX(1)}
.home-body .nav-actions .ghost{color:#27483e}.home-body .nav-actions .primary{padding-inline:19px;border-radius:11px}
.home-body .hero{isolation:isolate;width:100%;max-width:1280px;min-height:730px;padding:82px 50px 96px;grid-template-columns:minmax(0,1.05fr) minmax(450px,.95fr);gap:78px}
.home-body .hero:before{width:650px;height:650px;right:-240px;top:-80px;background:radial-gradient(circle,rgba(48,224,165,.2),rgba(48,224,165,.04) 55%,transparent 70%);filter:none}
.home-body .hero:after{left:-210px;bottom:0;width:330px;height:330px;border-color:rgba(22,201,139,.12);box-shadow:0 0 0 55px rgba(22,201,139,.025),0 0 0 110px rgba(22,201,139,.018)}
.home-body .hero-copy{position:relative;z-index:2}.home-body .eyebrow{display:inline-flex;align-items:center;padding:8px 12px;border:1px solid #d9ebe4;border-radius:999px;background:#f6fcf9;color:#1b7659;font-size:10px;letter-spacing:1.15px}
.home-body .hero h1{max-width:690px;margin:24px 0 22px;color:#0b241c;font-size:clamp(48px,5.3vw,72px);line-height:1.01;letter-spacing:-4.7px}.home-body .hero h1 em{position:relative;color:#10b87d}.home-body .hero h1 em:after{content:"";position:absolute;right:2px;bottom:-4px;left:2px;height:8px;border-radius:50%;background:rgba(22,201,139,.16);transform:rotate(-1deg);z-index:-1}
.home-body .hero-copy>p{max-width:620px;margin:0;color:#63756f;font-size:18px;line-height:1.7}.home-body .actions{margin:31px 0 20px}.home-body .actions .large{min-height:52px;padding:14px 22px;border-radius:12px}.home-body .actions .secondary{border-color:#d9e5e0;color:#29483f;box-shadow:0 7px 24px rgba(8,39,30,.04)}
.home-body .trust{flex-wrap:wrap;gap:8px 18px;color:#61756e;font-size:11px}.home-body .trust span{display:flex;align-items:center;gap:5px}.home-body .trust span::first-letter{color:#0ead77}
.hero-proof{display:flex;align-items:center;gap:22px;margin-top:33px;padding-top:24px;border-top:1px solid #e6eeeb}.hero-proof>div{display:flex;flex-direction:column;gap:3px}.hero-proof b{color:#19372e;font-size:14px}.hero-proof small{color:#82918c;font-size:10px}.hero-proof>i{width:1px;height:31px;background:#dde8e3}
.hero-visual{position:relative;z-index:2;padding:32px 15px}.visual-glow{position:absolute;inset:12% 5%;border-radius:50%;background:rgba(28,211,148,.18);filter:blur(55px)}
.home-body .call-card{position:relative;z-index:2;padding:24px;border:1px solid rgba(255,255,255,.1);border-radius:28px;background:linear-gradient(150deg,#123b30 0%,#071e18 78%);box-shadow:0 42px 100px rgba(5,31,23,.3);transform:none}
.call-label{display:flex;align-items:center;justify-content:space-between;margin:-4px 0 20px;padding-bottom:15px;border-bottom:1px solid rgba(255,255,255,.08)}.call-label span{color:#50ddb0;font-size:9px;font-weight:900;letter-spacing:1.4px}.call-label small{color:rgba(255,255,255,.4);font-size:9px}
.home-body .call-top .avatar{width:45px;height:45px;background:linear-gradient(145deg,#35e3a8,#13bf82);box-shadow:0 8px 25px rgba(30,216,153,.25)}.home-body .call-top b{font-size:13px}.home-body .call-top small{margin-top:3px;font-size:10px}.home-body .live{padding:6px 9px;border:1px solid rgba(87,224,177,.18);border-radius:99px;background:rgba(72,211,164,.08);font-size:9px}
.home-body .wave{height:62px;gap:6px;margin:12px 0}.home-body .wave i{width:3px;background:linear-gradient(#49e0ae,#139b6f);animation:home-wave 1.35s ease-in-out infinite}.home-body .wave i:nth-child(2n){animation-delay:-.3s}.home-body .wave i:nth-child(3n){animation-delay:-.6s}@keyframes home-wave{0%,100%{transform:scaleY(.55);opacity:.65}50%{transform:scaleY(1.15);opacity:1}}
.home-body .bubble{padding:12px 14px;font-size:12px;line-height:1.55}.home-body .bubble.customer{background:rgba(255,255,255,.08);color:#dae8e3}.home-body .bubble.ai{background:rgba(34,203,145,.16);color:#e6f8f1;border:1px solid rgba(50,218,161,.1)}
.home-body .result{padding:14px;margin-top:16px;border-radius:14px}.home-body .result>span{display:grid;width:31px;height:31px;padding:0;place-items:center}.home-body .result b{font-size:11px}.home-body .result small{margin-top:3px;font-size:9px}
.floating-note{position:absolute;z-index:3;display:flex;align-items:center;gap:9px;border:1px solid #dce9e4;background:rgba(255,255,255,.95);box-shadow:0 16px 42px rgba(8,39,30,.13);backdrop-filter:blur(12px)}.note-one{right:-30px;bottom:5px;padding:11px 14px;border-radius:13px}.note-one>span{display:grid;width:31px;height:31px;place-items:center;border-radius:9px;background:#def8ee;color:#09a471}.note-one>div{display:flex;flex-direction:column}.note-one b{font-size:10px}.note-one small{margin-top:2px;color:#7b8d87;font-size:8px}.note-two{top:12px;left:-30px;padding:9px 12px;border-radius:999px}.note-two b{padding:5px 7px;border-radius:99px;background:#e1f8ef;color:#09986a;font-size:9px}.note-two span{padding-right:3px;color:#587168;font-size:9px;font-weight:750}
.home-body .logos{padding:29px 24px;border-color:#e6edea;background:#fbfdfc}.home-body .logos p{margin:0 0 17px;font-size:9px;font-weight:800;letter-spacing:1.5px}.home-body .logos div{gap:64px;color:#87958f;font-size:15px}
.home-body .section{padding-top:105px;padding-bottom:105px}.home-body .section-head>span{font-size:10px;letter-spacing:1.7px}.home-body .section-head h2,.home-body .contact h2{color:#102a22;letter-spacing:-2.6px}.home-body .section-head p{line-height:1.7}
.home-body .product-grid{gap:18px}.home-body .product{border-color:#dfe9e5;border-radius:24px;box-shadow:0 14px 45px rgba(8,39,30,.045)}.home-body .product.featured{padding:44px;background:linear-gradient(145deg,#f7fcfa,#eef9f5)}.home-body .product h3{color:#17362d}.home-body .mini-phone{background:linear-gradient(150deg,#173c32,#0c2720);box-shadow:0 20px 45px rgba(7,35,27,.16)}
.home-body .models{background:linear-gradient(180deg,#f6faf8,#eff6f3)}.home-body .model-card{border-color:#dfe8e4;border-radius:24px;box-shadow:0 15px 50px rgba(8,39,30,.05)}.home-body .model-card.dark{background:linear-gradient(145deg,#143c31,#09231c)}
.home-body .numbers{overflow:hidden;border-color:#dce7e2;border-radius:24px;background:linear-gradient(145deg,#fff,#f8fcfa);box-shadow:0 16px 50px rgba(8,39,30,.05)}.home-body .numbers div{padding:36px}.home-body .numbers b{color:#0aaf78;font-size:42px}
.home-body .contact{position:relative;overflow:hidden;border-radius:30px;background:linear-gradient(145deg,#113b30,#071f19);box-shadow:0 30px 80px rgba(6,34,26,.2)}.home-body .contact:before{content:"";position:absolute;width:360px;height:360px;left:-210px;bottom:-250px;border:1px solid rgba(58,225,169,.17);border-radius:50%;box-shadow:0 0 0 50px rgba(58,225,169,.035),0 0 0 100px rgba(58,225,169,.02)}.home-body .contact>*{position:relative}.home-body .contact form{border:1px solid rgba(255,255,255,.3);border-radius:20px;box-shadow:0 24px 60px rgba(3,22,16,.18)}
.home-body footer{padding-top:38px;padding-bottom:38px}.home-body footer p{font-size:12px}.home-body footer a{font-size:12px}
@media(max-width:1050px){.home-body .hero{grid-template-columns:1fr 430px;gap:38px;padding-inline:34px}.home-body .hero h1{font-size:55px}.note-one{right:-10px}.note-two{left:-10px}}
@media(max-width:800px){.home-body .nav{height:70px;padding-inline:18px}.home-body .hero{min-height:auto;padding:58px 20px 80px;grid-template-columns:1fr;gap:42px}.home-body .hero h1{font-size:clamp(43px,13vw,58px);letter-spacing:-3px}.home-body .hero-copy>p{font-size:16px}.hero-proof{margin-top:27px}.hero-visual{width:min(100%,520px);margin:auto;padding:25px 10px}.floating-note{display:none}.home-body .logos div{gap:25px 38px}.home-body .section{padding-top:78px;padding-bottom:78px}.home-body .product.featured{padding:27px}.home-body .contact{border-radius:24px}}
@media(max-width:480px){.home-body .actions{align-items:stretch;flex-direction:column}.home-body .actions>*{width:100%;text-align:center}.home-body .trust{align-items:flex-start;flex-direction:column}.hero-proof{gap:14px}.home-body .call-card{padding:18px;border-radius:22px}.home-body .bubble{max-width:92%}.home-body .logos div{gap:18px 26px;font-size:12px}.home-body .numbers div{padding:24px 18px}.home-body .numbers b{font-size:31px}}

/* Dashboard overview — live platform metrics */
.overview-title{align-items:flex-end}.overview-title .page-kicker{margin-bottom:8px}.quick-actions{display:flex;gap:9px}.quick-actions button{min-height:43px;padding-inline:14px;font-size:11px}
.overview-stats article{position:relative;overflow:hidden;align-items:flex-start;min-height:128px}.overview-stats article:after{content:"";position:absolute;width:85px;height:85px;right:-35px;bottom:-42px;border:1px solid rgba(22,201,139,.12);border-radius:50%;box-shadow:0 0 0 17px rgba(22,201,139,.025)}
.overview-stats article>span{flex:0 0 auto}.overview-stats article>div{min-width:0}.overview-stats article small{color:#70827c;font-size:10px;font-weight:750;text-transform:uppercase;letter-spacing:.5px}.overview-stats article b{margin:4px 0 2px;color:#15372d;font-size:27px}.overview-stats article em{color:#91a09b;font-size:9px;font-style:normal}
.activity-panel{padding-bottom:12px}.activity-panel .panel-head{display:flex;align-items:center;justify-content:space-between;margin:-4px -4px 0;padding:0 4px 17px}.activity-panel .panel-head>div{display:flex;flex-direction:column;gap:4px}.activity-panel .panel-head h3{margin:0;color:#203e35;font-size:15px}.activity-panel .panel-head small{color:#8a9994;font-size:9px}.activity-refresh{min-height:34px;padding:7px 10px;border:1px solid #dce7e2;border-radius:9px;background:#f8fbfa;color:#48675e;font-size:9px;font-weight:800;cursor:pointer}
.overview-empty{padding:55px 20px;text-align:center}.overview-empty>span{display:grid;width:50px;height:50px;margin:0 auto 14px;place-items:center;border-radius:15px;background:#e1f9f0;color:#0aa875;font-size:19px}.overview-empty h3{margin:0 0 6px;color:#29483f;font-size:15px}.overview-empty p{margin:0 auto 16px;color:#7b8d87;font-size:11px}.overview-empty button{min-height:40px;font-size:10px}
@media(max-width:900px){.overview-title{align-items:flex-start;flex-direction:column}.quick-actions{width:100%}.quick-actions button{flex:1}}
@media(max-width:580px){.quick-actions{display:grid;grid-template-columns:1fr 1fr}.quick-actions .primary{grid-column:1/-1}.overview-stats article em{display:none}}