文件操作 - ai_theme.php

文件: /usr/local/softaculous/lib/ai/theme/ai_theme.php

编辑文件内容

<?php

if(!defined('SOFTACULOUS')){
	die('Hacking Attempt');
}

$api_base = $globals['index'].'act=ai';
	if(!empty($insid)) $api_base .= '&insid='.$insid;
	if(!empty($custom_path)) $api_base .= '&path='.urlencode($custom_path);
	if(!empty($project_id)) $api_base .= '&project_id='.urlencode($project_id);

ob_start();
	softheader(__('$0 - Code with AI', array($sw_name)));
	ob_end_clean();

$installations = array();
	if(!empty($user['ins'])){
		foreach($user['ins'] as $iid => $idata){
			$isoft = get_sid_by_version($idata['ver'], $idata['sid']);
			$isoftware = !empty($iscripts[$isoft]) ? $iscripts[$isoft] : array('name' => 'Software');
			$installations[] = array('insid' => $iid, 'name' => $isoftware['name'], 'path' => $idata['softpath']);
		}
	}

ai_render_ui($api_base, $csrf, $softpath, $sw_name, $username, $back_url, $insid, $installations, $homedir, $project_id);
	die();
}

function ai_render_ui($api_base, $csrf, $softpath, $sw_name, $username, $back_url, $insid, $installations = array(), $homedir = '', $project_id = ''){
	
global $globals, $theme;
	
$custom_favicon = (!empty($globals['favicon_logo']) ? $globals['favicon_logo'] : $theme['images'].'/'.(asperapp('', 'webuzo/', 'ampps/')).'favicon.ico');

?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title><?php echo htmlspecialchars($sw_name); ?> - Code with AI</title>
<link rel="shortcut icon" href=<?php echo $custom_favicon; ?> />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/github.min.css" id="hljs-theme">
<script src="https://cdnjs.cloudflare.com/ajax/libs/marked/12.0.2/marked.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/dompurify/3.1.6/purify.min.js"></script>
<style>
:root{
  --bg:#F9FAFB;--bgW:#F3F4F6;--bgS:#FFFFFF;--bgSs:#F9FAFB;
  --t1:#111827;--t2:#6B7280;--t3:#9CA3AF;--t4:#D1D5DB;
  --p:#3B82F6;--pH:#2563EB;--pT:#3B82F6;--s:#8B5CF6;
  --bd:#E5E7EB;--bd2:#EAEBEE;--bd3:#F3F4F6;
  --in:#FFFFFF;--ok:#22C55E;--err:#EF4444;--wr:#F59E0B;
  --sb:280px;--hh:56px;--r:12px;--rS:8px;--rP:9999px;
--sans:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
--mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace
 }
 @keyframes ocFadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
 @keyframes ocSlideIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
 @keyframes ocPulse{0%,100%{opacity:1}50%{opacity:.4}}
 [data-cs="dark"]{
  --bg:#09090B;--bgW:#121315;--bgS:#0C0C0E;--bgSs:#111114;
  --t1:#F3F4F6;--t2:#A1A1AA;--t3:#71717A;--t4:#52525B;
  --p:#60A5FA;--pH:#93C5FD;--pT:#60A5FA;--s:#A78BFA;
  --bd:#52525B;--bd2:#3F3F46;--bd3:#27272A;
  --in:#131316;--ok:#4ADE80;--err:#F87171;--wr:#FBBF24
}
*{box-sizing:border-box;margin:0;padding:0}
html{height:100%}
body{font-family:var(--sans);font-size:14px;background:var(--bg);color:var(--t1)}
::-webkit-scrollbar{width:5px;height:5px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--bd);border-radius:99px}

#oc{display:flex;flex-direction:column;height:100vh}

/* Header */
.ocH{display:flex;align-items:center;height:var(--hh);padding:0 20px;background:var(--bgS);border-bottom:1px solid var(--bd2);flex-shrink:0;gap:4px}
.ocHl,.ocHr{display:flex;align-items:center;gap:6px;flex-shrink:0}
.ocHc{flex:1;display:flex;justify-content:center;align-items:center;gap:10px;overflow:hidden}
.ocIb{width:36px;height:36px;border:none;border-radius:var(--rS);background:transparent;color:var(--t1);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-size:17px;transition:background .2s,color .2s}
.ocIb:hover{background:var(--bgW);color:var(--t1)}
.ocB{height:36px;padding:0 16px;border:1px solid var(--bd);border-radius:var(--rP);background:var(--bgS);color:var(--t1);cursor:pointer;font-weight:500;font-size:13px;font-family:var(--ff);display:inline-flex;align-items:center;gap:6px;white-space:nowrap;transition:background .2s cubic-bezier(.4,0,.2,1),border-color .2s cubic-bezier(.4,0,.2,1),color .2s cubic-bezier(.4,0,.2,1),box-shadow .2s cubic-bezier(.4,0,.2,1);text-decoration:none}
.ocB:hover{background:var(--bgW);border-color:var(--t4);transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.08)}
.ocBP{background:var(--p);border-color:var(--p);color:#fff}
.ocBP:hover{background:var(--pH);border-color:var(--pH);box-shadow:0 6px 20px rgba(59,130,246,.25)}
.ocBs{height:32px;padding:0 12px;font-size:12px}
.ocSel{line-height:1.3 !important;height:36px;padding:0 28px 0 12px;border:1px solid var(--bd);border-radius:var(--rP);background:var(--bgS);color:var(--t1);font:400 13px/1 var(--ff);cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' fill='none'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%239CA3AF' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;transition:border-color .2s}
[data-cs="dark"] .ocSel{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' fill='none'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23A1A1AA' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E")}
.ocSel:hover{border-color:var(--t4)}.ocSel:focus{outline:none;border-color:var(--p)}
.ocSel option{background:var(--bgS);color:var(--t1)}

/* Custom model dropdown */
.ocModelBtn{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 30px 0 12px;border:1px solid var(--bd);border-radius:var(--rP);background:var(--bgS);color:var(--t1);font:400 13px/1 var(--ff);cursor:pointer;transition:border-color .2s;position:relative;max-width:240px}
.ocModelBtn:hover{border-color:var(--t4)}
.ocModelBtn:focus{outline:none;border-color:var(--p)}
.ocModelBtnT{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ocModelBtnA{position:absolute;right:10px;top:50%;transform:translateY(-50%);color:var(--t3);pointer-events:none}
.ocModelDrop{position:fixed;background:var(--bgS);border:1px solid var(--bd);border-radius:var(--r);box-shadow:0 8px 24px rgba(0,0,0,.14);z-index:9999;display:none;min-width:260px;max-width:360px;max-height:380px;overflow-y:auto;overflow-x:hidden;padding:4px;-webkit-overflow-scrolling:touch}
.ocModelDrop.open{display:block}
.ocModelGrp{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--t3);padding:8px 10px 4px;position:sticky;top:0;background:var(--bgS)}
.ocModelOpt{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:7px 10px;border-radius:var(--rS);cursor:pointer;font-size:13px;color:var(--t1);transition:background .12s}
.ocModelOpt:hover{background:var(--bgW)}
.ocModelOpt.selected{background:var(--bgSs);color:var(--p);font-weight:500}
.ocModelOptT{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}
.ocModelFav{flex-shrink:0;width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;color:var(--t4);opacity:.5;border:none;background:none;cursor:pointer;border-radius:4px;transition:opacity .15s,color .15s}
.ocModelFav:hover{opacity:1;color:var(--p)}
.ocModelFav.isFav{opacity:1;color:#EF4444}
[data-cs="dark"] .ocModelFav{color:var(--t4);opacity:.4}
[data-cs="dark"] .ocModelFav.isFav{color:#F87171;opacity:1}
.ocModelFav svg{width:15px;height:15px;display:block}
.ocModelBtnT svg{width:13px;height:13px;display:block}

/* Body */
.ocBd{display:flex;flex:1;overflow:hidden}

/* Sidebar */
.ocSb{width:var(--sb);background:var(--bgS);border-right:1px solid var(--bd2);display:flex;flex-direction:column;flex-shrink:0;overflow:hidden}
.ocSb.hid{width:0;border-right:none}
.ocSb.resp{position:fixed;left:0;top:var(--hh);height:calc(100vh - var(--hh));z-index:200;box-shadow:4px 0 24px rgba(0,0,0,.1)}
.ocSbH{padding:14px 20px;font-weight:500;font-size:11px;font-family:var(--ff);letter-spacing:.08em;text-transform:uppercase;color:var(--t3);border-bottom:1px solid var(--bd3);display:flex;justify-content:space-between;align-items:center}
.ocSbL{flex:1;overflow-y:auto;padding:8px 0}
.ocSi{display:flex;align-items:center;padding:8px 20px;cursor:pointer;color:var(--t2);gap:8px;transition:background .15s,color .15s;position:relative;border-radius:0}
.ocSi:hover{background:var(--bgW);color:var(--t1)}
.ocSi.act{background:var(--bgW);color:var(--t1)}
.ocSi.act::before{content:'';position:absolute;left:0;top:8px;bottom:8px;width:3px;border-radius:0 3px 3px 0;background:var(--p)}
.ocSiI{flex-shrink:0;width:16px;text-align:center;font-size:13px;color:var(--t3);opacity:.7}
.ocSiT{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}
.ocSiB{font-size:10px;background:var(--bd3);color:var(--t3);padding:2px 8px;border-radius:var(--rP);flex-shrink:0;font-weight:500}
.ocSiD{opacity:0;border:none;background:none;color:var(--t3);cursor:pointer;font-size:14px;padding:0 2px;flex-shrink:0;line-height:1;transition:opacity .15s}
.ocSi:hover .ocSiD{opacity:.6}.ocSiD:hover{color:var(--er)!important;opacity:1}
.ocSiN{font-size:10px;color:var(--t3);opacity:.5;font-family:var(--fm);min-width:10px;text-align:right;flex-shrink:0}
.ocSbSearch{padding:6px 12px 10px;position:relative}
.ocSbSearchIc{position:absolute;left:22px;top:45%;transform:translateY(-50%);color:var(--t3);pointer-events:none;transition:color .18s ease;display:flex;align-items:center}
.ocSbSearchIn{width:100%;border:1px solid var(--bd);border-radius:var(--r);padding:7px 10px 7px 30px;font-size:12px;background:var(--in);color:var(--t1);outline:none;font-family:var(--ff);transition:border-color .18s ease,box-shadow .18s ease,background .18s ease}
.ocSbSearchIn:hover{border-color:var(--t4)}
.ocSbSearchIn:focus{border-color:var(--p);box-shadow:0 0 0 3px color-mix(in srgb,var(--p) 18%,transparent)}
.ocSbSearch:focus-within .ocSbSearchIc{color:var(--p)}
.ocSbSearchIn::placeholder{color:var(--t3)}

/* Responsive */
@media(max-width:1000px){
.ocH{padding:0 12px;gap:2px}
.ocHl{gap:2px}
.ocHr{gap:2px;flex-wrap:wrap;justify-content:flex-end}
.ocB.ocBs{padding:0 8px;font-size:11px}
.ocHb{display:none}
.ocBtnTxt{display:none}
.ocB.ocBs:hover .ocBtnTxt{
  display:inline-block;position:absolute;left:50%;transform:translateX(-50%);
  background:#1a1a1a;color:#fff;padding:4px 8px;border-radius:6px;font-size:11px;white-space:nowrap;z-index:1000;margin-top:28px
}
.ocB.ocBs{position:relative}
}
@media(max-width:768px){
.ocSb{position:fixed;left:0;top:0;height:100vh;z-index:200;width:280px;transform:translateX(-100%);transition:transform .25s ease}
.ocSb.resp,.ocSb:not(.hid){transform:translateX(0)}
.ocMn{width:100%}
.ocCi{padding:12px}
.ocIA{padding:10px 12px}
.ocIn{font-size:16px;padding:10px 14px}
.ocHc{display:none}
.ocCtx{padding:12px}
.ocFv.open{width:100%;max-width:100%;left:0;right:0}
.ocMoB{width:95vw;max-width:95vw}
.ocCmdB{width:95vw;max-width:95vw}
.ocVariantDrop{left:0;right:auto}
}

/* Main */
.ocMn{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0;background:var(--bg)}
.ocC{flex:1;overflow-y:auto}
.ocCi{max-width:720px;margin:0 auto;padding:24px}

/* Context bar */
.ocCtx{padding:16px 24px 0;max-width:720px;margin:0 auto}
.ocCtxI{padding:10px 16px;background:var(--bgW);border:1px solid var(--bd2);border-radius:var(--r);font-size:12px;color:var(--t2);line-height:1.6}
.ocCtxI b{color:var(--t1);font-weight:500}
.ocCtxI code{background:var(--bgS);padding:1px 4px;border-radius:4px;font-family:var(--fm);font-size:11px}

/* Empty state */
.ocE{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:var(--t3);gap:16px;padding:48px 32px;text-align:center}
.ocEi{font-size:44px;opacity:.3}.ocEt{font-size:20px;color:var(--t2);font-weight:500}.ocEs{font-size:14px;line-height:1.6;max-width:400px;color:var(--t3)}

/* Messages */
.ocMsg{padding:16px 0;display:flex;gap:12px;animation:ocFadeIn .25s ease-out}
.ocMsg.u{flex-direction:row-reverse}
.ocAv{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden}
.ocAv svg{width:18px;height:18px}
.ocMsg.u .ocAv{background:var(--p);color:#fff}
.ocMsg.a .ocAv{background:var(--bgW);color:var(--t3);border:1px solid var(--bd)}
.ocMb{max-width:90%;min-width:0}
.ocMbb{padding:0;line-height:1.65;font-size:14.5px}
.ocMsg.u .ocMbb{padding:4px 12px;background:var(--p);color:#fff;border-radius:var(--r);border-bottom-right-radius:4px;font-size:14.5px;box-shadow:0 2px 8px rgba(59,130,246,.2)}
[data-cs="dark"] .ocMsg.u .ocMbb{background:var(--p)}
.ocMsg.u .ocMd,.ocMsg.u .ocMd strong{color:rgba(255,255,255,.95)}
.ocMsg.u .ocMd code{background:rgba(255,255,255,.18);border:none;color:rgba(255,255,255,.9)}

/* Markdown */
.ocMd{line-height:1.75}
.ocMd p{margin:8px 0}.ocMd p:first-child{margin-top:0}.ocMd p:last-child{margin-bottom:0}
.ocMd h1,.ocMd h2,.ocMd h3{margin:20px 0 8px;color:var(--t1);font-weight:500}
.ocMd h1{font-size:22px}.ocMd h2{font-size:18px}.ocMd h3{font-size:15px}
.ocMd ul,.ocMd ol{margin:6px 0;padding-left:24px}.ocMd li{margin:3px 0}
.ocMd strong{color:var(--t1);font-weight:600}
.ocMd a{color:var(--pT);text-decoration:none}.ocMd a:hover{text-decoration:underline}
.ocMd code{background:var(--bgW);border:1px solid var(--bd);border-radius:6px;padding:2px 6px;font-family:var(--fm);font-size:12.5px;color:var(--pT)}
.ocMd pre{margin:10px 0;border-radius:var(--r);overflow:hidden;border:1px solid var(--bd)}
.ocMd pre code{display:block;padding:14px 18px;background:var(--bgS);border:none;font-size:12.5px;line-height:1.6;overflow-x:auto;color:var(--t1)}
.ocMd blockquote{border-left:2px solid var(--bd);padding-left:14px;color:var(--t2);margin:8px 0}
.ocMd hr{border:none;border-top:1px solid var(--bd);margin:12px 0}
.ocMd table{border-collapse:collapse;margin:10px 0;width:100%}.ocMd th,.ocMd td{border:1px solid var(--bd);padding:6px 10px;text-align:left;font-size:13px}.ocMd th{background:var(--bgW);font-weight:500}
.ocCH{display:flex;justify-content:space-between;align-items:center;padding:6px 14px;background:var(--bgW);font-size:11px;color:var(--t3);border-bottom:1px solid var(--bd2)}
.ocCC{cursor:pointer;color:var(--t3);font-size:11px;padding:3px 8px;border-radius:6px;background:none;border:none;font-family:var(--ff)}.ocCC:hover{color:var(--t1);background:var(--bgW)}

/* Tool calls */
.ocTk{margin:8px 0;border:1px solid var(--bd);border-radius:var(--r);background:var(--bgS);overflow:hidden;font-size:13px;border-left:3px solid var(--p)}
.ocTk.err{border-left-color:var(--er)}
.ocTkH{display:flex;align-items:center;padding:8px 12px;cursor:pointer;gap:8px;font-size:12px}.ocTkH:hover{background:var(--bgW)}
.ocTkN{font:500 12px/1 var(--fm);color:var(--pT)}
.ocTkDt{color:var(--t3);font-size:12px;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ocTkB{padding:10px 14px;border-top:1px solid var(--bd2);max-height:200px;overflow-y:auto;font:12px/1.6 var(--fm);white-space:pre-wrap;word-break:break-all;color:var(--t2);display:none}
.ocTk.open .ocTkB{display:block}

/* Input */
.ocIA{border-top:1px solid var(--bd2);padding:16px 24px;background:var(--bgS);flex-shrink:0}
.ocIW{max-width:720px;margin:0 auto;display:flex;gap:10px;align-items:flex-end}
.ocIn{flex:1;resize:none;border:1px solid var(--bd);border-radius:var(--r);padding:12px 18px;background:var(--in);color:var(--t1);font:14.5px/1.5 var(--ff);min-height:48px;max-height:160px;outline:none;transition:border-color .2s,box-shadow .2s;box-shadow:none}
.ocIn:focus{border-color:var(--p);box-shadow:0 0 0 4px rgba(59,130,246,.1)}.ocIn::placeholder{color:var(--t3)}
.ocSn{width:40px;height:40px;border-radius:var(--r);background:var(--p);color:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;transition:background .2s,box-shadow .2s,opacity .2s;box-shadow:0 2px 10px rgba(59,130,246,.25)}
.ocSn:hover{background:var(--pH);transform:translateY(-2px);box-shadow:0 6px 20px rgba(59,130,246,.35)}.ocSn:disabled{opacity:.4;cursor:not-allowed;transform:none;box-shadow:none}

/* Status */
.ocSt{display:flex;align-items:center;padding:2px 20px;background:var(--bgS);border-top:1px solid var(--bd3);font-size:11px;color:var(--t3);gap:14px;flex-shrink:0;min-height:24px}
.ocSd{width:5px;height:5px;border-radius:50%;display:inline-block;margin-right:3px}.ocSd.on{background:var(--ok)}.ocSd.off{background:var(--err)}
#ocStat{display:inline-flex;gap:10px;margin-left:10px;font-size:11px;color:var(--t3)}
#ocStat>span{display:inline-flex;align-items:center;gap:2px;cursor:default}
#ocStat span[id$="V"]{font-weight:500;color:var(--t2)}
#ocStat:hover{opacity:.8}
#ocStatCache{color:var(--ac);font-weight:500}

.ocCtxR{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px solid var(--bd3);font-size:13px}
.ocCtxR:last-child{border-bottom:none}
.ocCtxL{color:var(--t2)}
.ocCtxV{font-weight:600;color:var(--t1);font-family:var(--mono)}
.ocCtxS{margin-top:10px;padding-top:10px;border-top:1px solid var(--bd3)}
.ocCtxSt{font:500 11px/1 var(--sans);letter-spacing:.04em;text-transform:uppercase;color:var(--t3);margin-bottom:6px}
.ocCtxBr{display:flex;justify-content:space-between;padding:3px 0;font-size:12px}
.ocCtxBr span:first-child{color:var(--t3)}
.ocCtxBr span:last-child{color:var(--t1);font-weight:500}

.ocSetSrch{margin-bottom:10px}
.ocPl{display:flex;flex-direction:column;gap:4px;max-height:50vh;overflow-y:auto}
.ocPi{display:flex;align-items:center;padding:8px 10px;border:1px solid var(--bd3);border-radius:var(--r);gap:8px;transition:background .1s,border-color .1s}
.ocPi:hover{border-color:var(--bd2);background:var(--bgW)}
.ocPiN{flex:1;font-size:13px;font-weight:500}
.ocPiSub{font-size:10px;color:var(--t3);display:block;margin-top:1px}
.ocPiB{font-size:10px;padding:1px 7px;border-radius:9px;background:var(--ac);color:#fff}
	.ocPiBo{background:var(--bgW);color:var(--t3)}
	.ocPi.ocPiHide{display:none}
	.ocCu{display:inline-block;width:2px;height:1em;background:var(--ac);animation:ocbl 1s infinite;vertical-align:text-bottom;margin-left:1px}
@keyframes ocbl{0%,50%{opacity:1}51%,100%{opacity:0}}

/* Modal */
.ocMo{display:none;position:fixed;inset:0;background:rgba(0,0,0,.3);z-index:10000;align-items:center;justify-content:center}
.ocMo.open{display:flex}
.ocMoB{background:var(--bgS);border:1px solid var(--bd2);border-radius:12px;width:680px;max-height:85vh;overflow-y:auto;box-shadow:0 8px 32px rgba(0,0,0,.12)}
.ocMoH{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--bd3)}
.ocMoH h3{font-size:14px;font-weight:600}
.ocMoC{background:none;border:none;color:var(--t3);cursor:pointer;font-size:20px;padding:4px;line-height:1}.ocMoC:hover{color:var(--t1)}
.ocMoBd{padding:18px}
.ocFg{margin-bottom:12px}.ocFg label{display:block;font-size:12px;font-weight:500;margin-bottom:4px;color:var(--t2)}
.ocFi{width:100%;padding:7px 10px;border:1px solid var(--bd2);border-radius:var(--rS);background:var(--input);color:var(--t1);font:13px/1.5 var(--sans);outline:none}.ocFi:focus{border-color:var(--ac)}
.ocPl{display:grid;grid-template-columns:1fr 1fr;gap:4px}
.ocPi{display:flex;align-items:center;padding:8px 10px;border:1px solid var(--bd3);border-radius:var(--r);gap:8px;transition:background .1s,border-color .1s}
.ocPi:hover{border-color:var(--bd2);background:var(--bgW)}
.ocPiN{flex:1;font-size:13px;font-weight:500}
.ocPiB{font-size:10px;padding:1px 7px;border-radius:9px;background:var(--ac);color:#fff}
.ocPiBo{background:var(--bgW);color:var(--t3)}

/* File tree panel */
.ocFt{position:fixed;right:0;top:var(--hh);height:calc(100vh - var(--hh));width:240px;border-left:1px solid var(--bd2);background:var(--bgW);display:flex;flex-direction:column;flex-shrink:0;overflow:hidden;transform:translateX(100%);transition:transform .15s ease;z-index:100}
.ocFt.open{transform:translateX(0)}
.ocFtH{padding:8px 12px;font:500 11px/1 var(--sans);color:var(--t3);border-bottom:1px solid var(--bd3);display:flex;justify-content:space-between;align-items:center;flex-shrink:0}
.ocFtL{flex:1;overflow-y:auto;padding:2px 0;font-size:12px}
.ocFtI{display:flex;align-items:center;padding:3px 8px;cursor:pointer;color:var(--t2);gap:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ocFtI:hover{background:var(--bd3);color:var(--t1)}
.ocFtI.act{background:var(--bd3);color:var(--t1)}
.ocFtIc{width:14px;text-align:center;flex-shrink:0;font-size:11px;opacity:.6}
.ocFtIn{flex:1;overflow:hidden;text-overflow:ellipsis}
.ocFtS{font-size:10px;color:var(--t3);flex-shrink:0;margin-left:auto;padding-left:4px}

/* File viewer modal */
.ocFv{display:none;position:fixed;inset:0;background:rgba(0,0,0,.3);z-index:10001;align-items:center;justify-content:center}
.ocFv.open{display:flex}
.ocFvB{background:var(--bgS);border:1px solid var(--bd2);border-radius:12px;width:80vw;max-width:900px;max-height:80vh;display:flex;flex-direction:column;box-shadow:0 8px 32px rgba(0,0,0,.12)}
.ocFvH{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;border-bottom:1px solid var(--bd3);font-size:13px;font-weight:500}
.ocFvC{flex:1;overflow:auto;padding:0}
.ocFvC pre{margin:0;padding:14px;font:12.5px/1.5 var(--mono);white-space:pre-wrap;word-break:break-all;color:var(--t1)}

.ocThink{display:flex;align-items:center;gap:6px;padding:4px 0}
.ocThinkD{width:6px;height:6px;border-radius:50%;background:var(--ac);animation:ocBlink 1.4s infinite both}
.ocThinkD:nth-child(2){animation-delay:.2s}
.ocThinkD:nth-child(3){animation-delay:.4s}
@keyframes ocBlink{0%,80%,100%{opacity:.2}40%{opacity:1}}
.ocThinkT{color:var(--t3);font-size:12px;font-style:italic}

.ocStop{width:36px;height:36px;border-radius:var(--r);background:var(--err);color:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0;transition:background .12s}.ocStop:hover{opacity:.85}
.ocTerm{background:#1a1a1a;color:#e0e0e0;font:12px/1.55 var(--mono);padding:10px 14px;border-radius:var(--r);max-height:250px;overflow-y:auto;white-space:pre-wrap;word-break:break-all;margin:0}
.ocReason{border-left:2px solid var(--ac);padding:4px 10px;margin:4px 0;color:var(--t3);font-size:12.5px;font-style:italic;cursor:pointer;user-select:none}.ocReason:hover{background:var(--bgW)}
.ocReasonB{display:none;padding:6px 10px;font-size:12px;font-style:italic;color:var(--t3);white-space:pre-wrap;line-height:1.5}
.ocReason.open .ocReasonB{display:block}
.ocDiff{font:13px/1.6 var(--fm);border-radius:var(--r);overflow:hidden;border:1px solid var(--bd);max-height:320px;overflow-y:auto}
.ocDiffH{background:var(--bgW);padding:6px 14px;font-size:11px;color:var(--t3);border-bottom:1px solid var(--bd2);display:flex;justify-content:space-between;align-items:center;gap:8px}
.ocDiffL{padding:0 14px;white-space:pre;font-size:12px}
.ocDiffL.add{background:rgba(34,197,94,.1);color:#15803d}[data-cs="dark"] .ocDiffL.add{background:rgba(74,222,128,.12);color:#86efac}
.ocDiffL.del{background:rgba(239,68,68,.08);color:#b91c1c}[data-cs="dark"] .ocDiffL.del{background:rgba(248,113,113,.1);color:#fca5a5}
.ocDiffL.ctx{color:var(--t3)}
.ocDiffTB{display:flex;gap:4px}
.ocDiffTB button{font-size:10px;padding:2px 8px;border:1px solid var(--bd);border-radius:var(--rP);background:var(--bgS);color:var(--t3);cursor:pointer;transition:background .15s,color .15s}
.ocDiffTB button:hover{background:var(--bgW);border-color:var(--p);color:var(--p)}
.ocDiffTB button.act{background:var(--p);color:#fff;border-color:var(--p)}
.ocDiff.split{display:flex;overflow-x:auto}
.ocDiff.split .ocDiffSide{flex:1;min-width:0;overflow:hidden}
.ocDiff.split .ocDiffSide+.ocDiffSide{border-left:2px solid var(--bd)}
.ocDiff.split .ocDiffLNum{display:inline-block;width:36px;text-align:right;color:var(--t3);opacity:.5;padding-right:8px;user-select:none;font-size:11px}
.ocDiffGrep{font:12px/1.6 var(--fm);border:1px solid var(--bd);border-radius:var(--r);overflow:hidden;margin:8px 0}
.ocDiffGrepH{background:var(--bgW);padding:6px 14px;font-size:11px;color:var(--t3);border-bottom:1px solid var(--bd2);display:flex;align-items:center;gap:8px}
.ocDiffGrepH .ocGrepPath{color:var(--pT);font-family:var(--fm);cursor:pointer;text-decoration:none;font-weight:500}
.ocDiffGrepH .ocGrepPath:hover{text-decoration:underline}
.ocDiffGrepL{padding:2px 14px 2px 50px;white-space:pre;font-size:12px;position:relative}
.ocDiffGrepLN{position:absolute;left:0;width:44px;text-align:right;color:var(--t3);opacity:.5;font-size:11px;user-select:none}
.ocCodeColl{position:relative}
.ocCodeColl .ocCodeToggle{position:absolute;top:36px;right:8px;font-size:10px;padding:2px 8px;border:1px solid var(--bd);border-radius:var(--rP);background:var(--bgS);color:var(--t3);cursor:pointer;z-index:2;transition:background .15s,color .15s}
.ocCodeColl .ocCodeToggle:hover{background:var(--bgW);color:var(--t1)}
.ocCodeColl.collapsed pre code{max-height:120px;overflow:hidden}
.ocCodeColl.collapsed .ocCodeToggle{top:auto;bottom:8px}
.ocPatchNav{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--t3);padding:4px 8px}
.ocPatchNav button{font-size:11px;padding:2px 6px;border:1px solid var(--bd);border-radius:var(--rP);background:var(--bgS);color:var(--t3);cursor:pointer}
.ocPatchNav button:hover{background:var(--bgW);color:var(--t1)}
.ocPatchNav button:disabled{opacity:.4;cursor:default}
.ocFileLink{color:var(--pT);text-decoration:none;font-family:var(--fm);cursor:pointer}
.ocFileLink:hover{text-decoration:underline}
.ocTokenW{font-size:10px;padding:2px 6px;border-radius:var(--rP);font-weight:500;margin-left:6px}
.ocTokenW.amber{background:rgba(245,158,11,.12);color:var(--wr)}
.ocTokenW.red{background:rgba(239,68,68,.1);color:var(--er)}
.ocSlashHint{position:absolute;bottom:100%;left:0;right:0;background:var(--bgS);border:1px solid var(--bd);border-radius:var(--r);box-shadow:0 8px 24px rgba(0,0,0,.08);max-height:220px;overflow-y:auto;display:none;font-size:13px;z-index:100;margin-bottom:8px}
.ocSlashHint.open{display:block}
.ocSHItem{padding:8px 14px;cursor:pointer;display:flex;gap:10px;align-items:center}.ocSHItem:hover,.ocSHItem.act{background:var(--bgW)}
.ocSHCmd{font-weight:600;color:var(--p);font-family:var(--fm);white-space:nowrap;font-size:12px}
.ocSHDesc{color:var(--t3);font-size:12px}
.ocToast{position:fixed;top:20px;right:20px;z-index:20000;display:flex;flex-direction:column;gap:8px;pointer-events:none}
.ocToastI{padding:12px 18px;border-radius:var(--r);font-size:13px;color:#fff;pointer-events:auto;animation:ocToastIn .3s cubic-bezier(.16,1,.3,1);box-shadow:0 10px 32px rgba(0,0,0,.12);max-width:380px;display:flex;align-items:center;gap:10px}
.ocToastI.ok{background:var(--ok)}.ocToastI.err{background:var(--err)}.ocToastI.warn{background:var(--wr)}.ocToastI.info{background:var(--p)}
.ocToastI.hide{animation:ocToastOut .25s ease forwards}
@keyframes ocToastIn{from{opacity:0;transform:translateY(-8px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes ocToastOut{to{opacity:0;transform:translateX(12px)}}
.ocMsgAct{opacity:0;display:flex;gap:6px;position:absolute;top:-6px;right:0;transition:opacity .2s}
.ocMsg:hover .ocMsgAct{opacity:1}
.ocMsgActB{width:28px;height:28px;border:1px solid var(--bd);border-radius:var(--rS);background:var(--bgS);color:var(--t3);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:12px;transition:background .15s,color .15s,border-color .15s}
.ocMsgActB:hover{background:var(--bgW);color:var(--t1)}
.ocMsg{position:relative}
.ocMsgTs{font-size:11px;color:var(--t4);display:none;position:absolute;bottom:-4px;left:40px}
.ocMsg:hover .ocMsgTs{display:block}
.ocLoad{display:flex;align-items:center;justify-content:center;padding:48px;gap:8px;color:var(--t3);font-size:13px}
.ocLoadD{width:6px;height:6px;border-radius:50%;background:var(--p);animation:ocBlink 1.4s infinite both}
.ocLoadD:nth-child(2){animation-delay:.2s}.ocLoadD:nth-child(3){animation-delay:.4s}
.ocFtSrch{padding:6px 12px;border-bottom:1px solid var(--bd2)}
.ocFtSrch input{width:100%;border:1px solid var(--bd);border-radius:var(--rP);padding:5px 12px;font-size:12px;background:var(--in);color:var(--t1);outline:none;transition:border-color .2s}
.ocFtSrch input:focus{border-color:var(--p);box-shadow:0 0 0 3px rgba(59,130,246,.1)}
.ocChg{position:fixed;bottom:0;right:0;width:380px;max-height:50vh;background:var(--bgS);border:1px solid var(--bd);border-radius:var(--r) var(--r) 0 0;box-shadow:0 -8px 32px rgba(0,0,0,.08);z-index:9999;display:none;flex-direction:column}
.ocChg.open{display:flex}
.ocChgH{padding:14px 18px;border-bottom:1px solid var(--bd2);display:flex;justify-content:space-between;align-items:center;font-weight:500;font-size:14px}
.ocChgL{flex:1;overflow-y:auto;padding:6px 0}
.ocChgI{padding:8px 16px;display:flex;justify-content:space-between;align-items:center;font-size:13px;border-bottom:1px solid var(--bd2)}
.ocChgI:hover{background:var(--bgW)}
.ocChgBtn{font-size:11px;padding:4px 10px;border:1px solid var(--bd);border-radius:var(--rP);background:var(--bgS);color:var(--t1);cursor:pointer;transition:background .15s,color .15s}
.ocChgBtn:hover{background:var(--bgW);border-color:var(--t4)}
.ocAtMention{background:var(--bgS);border:1px solid var(--bd);border-radius:var(--r);box-shadow:0 8px 24px rgba(0,0,0,.12);max-height:260px;overflow-y:auto;display:none;font-size:13px;z-index:10001;position:absolute;bottom:100%;left:0;right:0;margin-bottom:8px}
.ocAtMention.open{display:block}
.ocAtItem{padding:8px 14px;cursor:pointer;display:flex;gap:8px;align-items:center;border-radius:0;transition:background .1s}.ocAtItem:hover,.ocAtItem.active{background:var(--bgW)}
.ocAtItem span:first-child{color:var(--p);font-family:var(--fm);font-weight:500}
.ocAtItem small{color:var(--t3);font-size:11px;margin-left:auto;white-space:nowrap}
.ocAtItemIcon{width:20px;text-align:center;font-size:14px;flex-shrink:0}
.ocVariantBadge{display:inline-flex;align-items:center;gap:3px;padding:2px 8px;border-radius:var(--rP);font-size:11px;font-weight:500;margin-left:6px;cursor:pointer;transition:background .15s,color .15s,border-color .15s;border:1px solid var(--bd);color:var(--t2);background:var(--bgS)}
.ocVariantBadge:hover{border-color:var(--p);color:var(--p)}
.ocVariantBadge.active{background:var(--p);color:#fff;border-color:var(--p)}
.ocVariantDrop{position:absolute;top:100%;right:0;background:var(--bgS);border:1px solid var(--bd);border-radius:var(--r);box-shadow:0 8px 24px rgba(0,0,0,.12);min-width:120px;z-index:200;display:none;margin-top:4px}
.ocVariantDrop.open{display:block}
.ocVariantOpt{padding:8px 14px;cursor:pointer;font-size:13px;display:flex;align-items:center;gap:6px}.ocVariantOpt:hover{background:var(--bgW)}
.ocVariantOpt.active{color:var(--p);font-weight:500}
.ocAtItem small{color:var(--t3);font-size:11px;margin-left:auto;white-space:nowrap}
.ocAtItemIcon{width:20px;text-align:center;font-size:14px;flex-shrink:0}
.ocFaqI{border:1px solid var(--bd2);border-radius:var(--r);margin-bottom:8px;overflow:hidden}
.ocFaqQ{padding:12px 16px;cursor:pointer;font-weight:400;font-size:14px;display:flex;justify-content:space-between;align-items:center;gap:10px;background:var(--bgW);user-select:none}
.ocFaqQ:hover{background:var(--bgW)}
.ocFaqQ::after{content:'\25BC';font-size:10px;color:var(--t4);transition:transform .2s}
.ocFaqI.open .ocFaqQ::after{transform:rotate(180deg)}
.ocFaqA{padding:0 16px;max-height:0;overflow:hidden;transition:max-height .25s ease,padding .25s ease;font-size:13.5px;color:var(--t2);line-height:1.75}
.ocFaqI.open .ocFaqA{max-height:500px;padding:12px 16px}
.ocSCT{width:100%;border-collapse:collapse;font-size:13px;margin-bottom:4px}
.ocSCT th{text-align:left;padding:6px 8px;font-size:11px;color:var(--t3);border-bottom:1px solid var(--bd2);text-transform:uppercase;letter-spacing:.05em}
.ocSCT td{padding:5px 8px;border-bottom:1px solid var(--bd3)}
.ocSCT kbd{background:var(--bgS);border:1px solid var(--bd);border-radius:4px;padding:2px 6px;font-family:var(--fm);font-size:11px;color:var(--t1);white-space:nowrap}

/* ===== STATUS BAR ===== */
.ocSt{display:flex;align-items:center;padding:4px 24px;background:var(--bgS);border-top:1px solid var(--bd2);font-size:11px;color:var(--t3);gap:16px;flex-shrink:0;min-height:28px}
.ocSd{width:6px;height:6px;border-radius:50%;display:inline-block;margin-right:4px}.ocSd.on{background:var(--ok)}.ocSd.off{background:var(--er)}
#ocStat{display:inline-flex;gap:12px;margin-left:12px;font-size:11px;color:var(--t3)}
#ocStat>span{display:inline-flex;align-items:center;gap:3px;cursor:default;font-weight:500}
#ocStat span[id$="V"]{font-weight:500;color:var(--t2)}
#ocStat:hover{opacity:.8}
#ocStatCache{color:var(--p);font-weight:500}

/* ===== THINKING ===== */
.ocThink{display:flex;align-items:center;gap:8px;padding:6px 0}
.ocThinkD{width:7px;height:7px;border-radius:50%;background:var(--p);animation:ocBlink 1.4s infinite both}
.ocThinkD:nth-child(2){animation-delay:.2s}
.ocThinkD:nth-child(3){animation-delay:.4s}
@keyframes ocBlink{0%,80%,100%{opacity:.2}40%{opacity:1}}
.ocThinkT{color:var(--t3);font-size:13px;font-style:italic}

/* ===== CURSOR BLINK ===== */
.ocCu{display:inline-block;width:2px;height:1.1em;background:var(--p);animation:ocbl 1s infinite;vertical-align:text-bottom;margin-left:2px;border-radius:1px}
@keyframes ocbl{0%,50%{opacity:1}51%,100%{opacity:0}}

/* ===== CONTEXT DETAILS ===== */
.ocCtxR{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--bd2);font-size:13px}
.ocCtxR:last-child{border-bottom:none}
.ocCtxL{color:var(--t2);font-weight:400}
.ocCtxV{font-weight:500;color:var(--t1);font-family:var(--fm)}
.ocCtxS{margin-top:12px;padding-top:12px;border-top:1px solid var(--bd2)}
.ocCtxSt{font:500 11px/1 var(--ff);letter-spacing:.06em;text-transform:uppercase;color:var(--t3);margin-bottom:8px}
.ocCtxBr{display:flex;justify-content:space-between;padding:4px 0;font-size:12px}
.ocCtxBr span:first-child{color:var(--t3)}
.ocCtxBr span:last-child{color:var(--t1);font-weight:500}

/* ===== MODAL ===== */
.ocMo{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:10000;align-items:center;justify-content:center}
.ocMo.open{display:flex}
.ocMoB{background:var(--bgS);border:1px solid var(--bd2);border-radius:16px;width:680px;max-height:85vh;overflow-y:auto;box-shadow:0 8px 24px rgba(0,0,0,.2)}
.ocMoH{display:flex;align-items:center;justify-content:space-between;padding:20px;border-bottom:1px solid var(--bd2)}
.ocMoH h3{font-size:18px;font-weight:500;color:var(--t1);letter-spacing:-.01em}
.ocMoC{background:none;border:none;color:var(--t3);cursor:pointer;font-size:22px;padding:4px;line-height:1;transition:color .15s}.ocMoC:hover{color:var(--t1)}
.ocMoBd{padding:20px}

/* ===== FORM ===== */
.ocFg{margin-bottom:16px}.ocFg label{display:block;font-size:13px;font-weight:500;margin-bottom:6px;color:var(--t2);letter-spacing:-.01em}
.ocFi{width:100%;padding:9px 12px;border:1px solid var(--bd);border-radius:var(--rS);background:var(--in);color:var(--t1);font:14px/1.5 var(--ff);outline:none;transition:border-color .2s,box-shadow .2s}.ocFi:focus{border-color:var(--p);box-shadow:0 0 0 4px rgba(59,130,246,.1)}

/* ===== PROVIDER LIST ===== */
.ocPl{display:grid;grid-template-columns:1fr 1fr;gap:8px;max-height:50vh;overflow-y:auto;padding-right:4px}
.ocPi{display:flex;align-items:center;padding:12px;border:1px solid var(--bd3);border-radius:var(--rS);gap:10px;transition:background .2s,border-color .2s,box-shadow .2s;cursor:pointer}
.ocPi:hover{border-color:var(--p);background:var(--bgW);box-shadow:0 2px 8px rgba(59,130,246,.08)}
.ocPiN{flex:1;font-size:13px;font-weight:500}
.ocPiSub{font-size:11px;color:var(--t3);display:block;margin-top:2px}
.ocPiB{font-size:10px;padding:3px 8px;border-radius:var(--rP);background:var(--p);color:#fff;font-weight:500}
.ocPiBo{background:var(--bgW);color:var(--t3);border:1px solid var(--bd)}
.ocPi.ocPiHide{display:none}

/* ===== FILE TREE PANEL ===== */
.ocFt{position:fixed;right:0;top:var(--hh);height:calc(100vh - var(--hh));width:260px;border-left:1px solid var(--bd2);background:var(--bgS);display:flex;flex-direction:column;flex-shrink:0;overflow:hidden;transform:translateX(100%);transition:transform .25s cubic-bezier(.4,0,.2,1);z-index:100}
.ocFt.open{transform:translateX(0)}
.ocFtH{padding:10px 16px;font:500 12px/1 var(--ff);color:var(--t3);border-bottom:1px solid var(--bd2);display:flex;justify-content:space-between;align-items:center;flex-shrink:0}
.ocFtL{flex:1;overflow-y:auto;padding:6px 0;font-size:13px}
.ocFtI{display:flex;align-items:center;padding:5px 12px;cursor:pointer;color:var(--t2);gap:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-radius:0;transition:background .1s,color .1s}.ocFtI:hover{background:var(--bgW);color:var(--t1)}
.ocFtI.act{background:var(--bgW);color:var(--p)}.ocFtI.act .ocFtIc{color:var(--p)}
.ocFtIc{width:14px;text-align:center;flex-shrink:0;font-size:12px;opacity:.6;transition:color .1s}
.ocFtIn{flex:1;overflow:hidden;text-overflow:ellipsis;font-size:13px}
.ocFtS{font-size:11px;color:var(--t3);flex-shrink:0;margin-left:auto;padding-left:6px}

/* ===== FILE VIEWER ===== */
.ocFv{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:10001;align-items:center;justify-content:center}
.ocFv.open{display:flex}
.ocFvB{background:var(--bgS);border:1px solid var(--bd2);border-radius:16px;width:80vw;max-width:900px;max-height:80vh;display:flex;flex-direction:column;box-shadow:0 8px 24px rgba(0,0,0,.2)}
.ocFvH{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid var(--bd2);font-size:14px;font-weight:500}
.ocFvC{flex:1;overflow:auto;padding:0}
.ocFvC pre{margin:0;padding:18px;font:13px/1.65 var(--fm);white-space:pre-wrap;word-break:break-all;color:var(--t1)}

/* ===== FILE TREE SUB ===== */
.ocFtSub{padding-left:16px}

/* ===== ACCESSIBILITY ===== */
.ocIb:focus-visible,.ocB:focus-visible,.ocSn:focus-visible,.ocStop:focus-visible,.ocMoC:focus-visible,.ocMsgActB:focus-visible{outline:2px solid var(--p);outline-offset:2px;border-radius:var(--rS)}
.ocFi:focus-visible,.ocIn:focus-visible{outline:none;border-color:var(--p);box-shadow:0 0 0 4px rgba(59,130,246,.1)}
.ocFtI:focus-visible,.ocSi:focus-visible,.ocSHItem:focus-visible,.ocAtItem:focus-visible,.ocPi:focus-visible{outline:2px solid var(--p);outline-offset:-2px;border-radius:var(--rS)}
 @media(prefers-reduced-motion:reduce){
 *{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
 .ocFt{transition:none}
 }

/* ===== COMMAND PALETTE ===== */
.ocCmdP{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:20000;align-items:flex-start;justify-content:center;padding-top:15vh}
.ocCmdP.open{display:flex}
.ocCmdB{background:var(--bgS);border:1px solid var(--bd);border-radius:12px;width:460px;max-height:45vh;overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,.25);display:flex;flex-direction:column}
.ocCmdI{padding:8px 16px;border-bottom:1px solid var(--bd3);display:flex;gap:10px;align-items:center}
.ocCmdI input{flex:1;border:none;background:none;color:var(--t1);font:14px/1.4 var(--sans);outline:none}
.ocCmdI input::placeholder{color:var(--t3)}
.ocCmdL{flex:1;overflow-y:auto;padding:2px 0}
.ocCmdIt{padding:6px 16px;cursor:pointer;display:flex;gap:10px;align-items:flex-start;transition:background .1s}
.ocCmdIt:hover,.ocCmdIt.act{background:var(--bgW)}
.ocCmdItK{font:600 12px/1 var(--mono);color:var(--pT);background:var(--bd3);padding:4px 8px;border-radius:4px;min-width:80px;text-align:center;flex-shrink:0;margin-top:1px}
.ocCmdItK.empty{background:transparent;min-width:0;padding:0}
.ocCmdItN{font-size:14px;color:var(--t1);font-weight:500;line-height:1.4}
.ocCmdItD{font-size:12px;color:var(--t3);margin-top:2px;line-height:1.3}

/* ===== PERMISSION PROMPT ===== */
.ocPerm{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:20001;align-items:center;justify-content:center}
.ocPerm.open{display:flex}
.ocPermB{background:var(--bgS);border:1px solid var(--bd2);border-radius:16px;width:560px;max-height:80vh;overflow-y:auto;box-shadow:0 8px 24px rgba(0,0,0,.25)}
.ocPermH{padding:18px 20px;border-bottom:1px solid var(--bd3);display:flex;align-items:center;gap:10px}
.ocPermHI{width:36px;height:36px;border-radius:var(--rS);background:var(--bgW);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0}
.ocPermHT{font-size:15px;font-weight:600;color:var(--t1)}
.ocPermHS{font-size:12px;color:var(--t3);margin-top:2px}
.ocPermD{padding:16px 20px;font-size:13px;color:var(--t2);line-height:1.6;white-space:pre-wrap;word-break:break-all;background:var(--bgW);border-radius:var(--rS);margin:12px 20px;font-family:var(--mono)}
.ocPermF{padding:16px 20px;display:flex;gap:10px;justify-content:flex-end;border-top:1px solid var(--bd3)}

/* ===== CONTEXT PROGRESS BAR ===== */
.ocCtxBar{height:8px;background:var(--bd3);border-radius:4px;overflow:hidden;width:100px;display:inline-block;vertical-align:middle;margin-left:6px}
.ocCtxPct{font-size:11px;color:var(--t2);font-weight:600;margin-left:5px;vertical-align:middle}
.ocCtxBarFill{display:block;height:100%;border-radius:4px;transition:width .3s ease,background .3s ease;min-width:4px}
.ocCtxBarFill.low{background:var(--ok)}
.ocCtxBarFill.mid{background:var(--wr)}
.ocCtxBarFill.high{background:var(--err)}

/* ===== RENAME INPUT ===== */
.ocRenIn{border:1px solid var(--p);border-radius:var(--rS);padding:2px 6px;font:13px/1 var(--sans);background:var(--in);color:var(--t1);outline:none;width:100%;box-sizing:border-box}

/* ===== MSG HOVER ACTIONS ===== */
.ocMsgAct{opacity:0;display:flex;gap:4px;position:absolute;top:-8px;right:0;transition:opacity .2s}
.ocMsg:hover .ocMsgAct{opacity:1}
.ocMsgActB{width:26px;height:26px;border:1px solid var(--bd);border-radius:var(--rS);background:var(--bgS);color:var(--t3);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:11px;transition:background .15s,color .15s,border-color .15s}
.ocMsgActB:hover{background:var(--bgW);color:var(--t1)}
.ocMsg{position:relative}

/* ===== COMPACT INDICATOR ===== */
.ocCompactBadge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:var(--rP);background:var(--bd3);color:var(--t3);font-size:11px;margin-bottom:8px}

/* ===== SHELL MODE INDICATOR ===== */
.ocShellBadge{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:var(--rP);background:rgba(59,130,246,.1);color:var(--p);font-size:12px;font-weight:600;font-family:var(--fm);margin-right:6px;border:1px solid rgba(59,130,246,.2)}

/* ===== QUESTION PROMPT ===== */
.ocQuestion{border:1px solid var(--bd);border-radius:var(--r);background:var(--bgS);margin:8px 0;overflow:hidden}
.ocQHeader{padding:10px 14px;border-bottom:1px solid var(--bd3);display:flex;align-items:center;gap:8px;font-weight:500;font-size:13px;color:var(--t1)}
.ocQHeader svg{width:16px;height:16px;color:var(--p);flex-shrink:0}
.ocQBody{padding:14px}
.ocQText{font-size:14px;color:var(--t1);margin-bottom:12px;line-height:1.5}
.ocQOptions{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}
.ocQOpt{padding:8px 14px;border:1px solid var(--bd);border-radius:var(--rS);cursor:pointer;font-size:13px;color:var(--t1);transition:background .15s,border-color .15s;display:flex;align-items:center;gap:8px}
.ocQOpt:hover{border-color:var(--p);background:rgba(59,130,246,.04);color:var(--p)}
.ocQOpt.sel{border-color:var(--p);background:rgba(59,130,246,.08);color:var(--p);font-weight:500}
.ocQCustom{display:flex;gap:8px;margin-top:8px}
.ocQCustom input{flex:1;padding:8px 12px;border:1px solid var(--bd);border-radius:var(--rS);background:var(--in);color:var(--t1);font:13px/1.4 var(--sans);outline:none}
.ocQCustom input:focus{border-color:var(--p);box-shadow:0 0 0 3px rgba(59,130,246,.1)}
.ocQActions{display:flex;gap:8px;justify-content:flex-end}

/* ===== TODO PANEL ===== */
.ocTodoP{position:fixed;right:0;top:var(--hh);height:calc(100vh - var(--hh));width:280px;border-left:1px solid var(--bd2);background:var(--bgS);display:flex;flex-direction:column;flex-shrink:0;overflow:hidden;transform:translateX(100%);transition:transform .25s cubic-bezier(.4,0,.2,1);z-index:100}
.ocTodoP.open{transform:translateX(0)}
.ocTodoPH{padding:10px 16px;font:500 12px/1 var(--ff);color:var(--t3);border-bottom:1px solid var(--bd2);display:flex;justify-content:space-between;align-items:center;flex-shrink:0}
.ocTodoPL{flex:1;overflow-y:auto;padding:6px 0}
.ocTodoI{display:flex;align-items:flex-start;padding:8px 16px;gap:8px;cursor:pointer;transition:background .1s}
.ocTodoI:hover{background:var(--bgW)}
.ocTodoChk{width:16px;height:16px;border:1.5px solid var(--bd);border-radius:4px;flex-shrink:0;margin-top:2px;display:flex;align-items:center;justify-content:center;transition:background .15s,border-color .15s;cursor:pointer}
.ocTodoChk.done{background:var(--ok);border-color:var(--ok)}
.ocTodoChk.done::after{content:'\2713';color:#fff;font-size:10px;font-weight:700}
.ocTodoTxt{flex:1;font-size:13px;color:var(--t2);line-height:1.4}
.ocTodoI.done .ocTodoTxt{text-decoration:line-through;color:var(--t3)}

/* ===== MODIFIED FILES PANEL ===== */
.ocFilesP{position:fixed;right:0;top:var(--hh);height:calc(100vh - var(--hh));width:300px;border-left:1px solid var(--bd2);background:var(--bgS);display:flex;flex-direction:column;flex-shrink:0;overflow:hidden;transform:translateX(100%);transition:transform .25s cubic-bezier(.4,0,.2,1);z-index:100}
.ocFilesP.open{transform:translateX(0)}
.ocFilesPH{padding:10px 16px;font:500 12px/1 var(--ff);color:var(--t3);border-bottom:1px solid var(--bd2);display:flex;justify-content:space-between;align-items:center;flex-shrink:0}
.ocFilesPL{flex:1;overflow-y:auto;padding:4px 0}
.ocFilesI{display:flex;align-items:center;padding:6px 16px;gap:8px;font-size:12px;color:var(--t2);cursor:pointer;transition:background .1s}
.ocFilesI:hover{background:var(--bgW)}
.ocFilesIc{font-size:13px;flex-shrink:0}
.ocFilesIc.add{color:var(--ok)}.ocFilesIc.mod{color:var(--p)}.ocFilesIc.del{color:var(--err)}
.ocFilesN{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--fm);font-size:12px;color:var(--t1)}
.ocFilesB{font-size:10px;padding:1px 6px;border-radius:var(--rP);flex-shrink:0;font-weight:500}
.ocFilesB.add{background:rgba(34,197,94,.1);color:#15803d}[data-cs="dark"] .ocFilesB.add{background:rgba(74,222,128,.12);color:#86efac}
.ocFilesB.mod{background:rgba(59,130,246,.1);color:#1d4ed8}[data-cs="dark"] .ocFilesB.mod{background:rgba(96,165,250,.12);color:#93c5fd}
.ocFilesB.del{background:rgba(239,68,68,.1);color:#b91c1c}[data-cs="dark"] .ocFilesB.del{background:rgba(248,113,113,.1);color:#fca5a5}

/* ===== KEYBINDINGS SETTINGS ===== */
.ocKbRow{display:flex;align-items:center;padding:8px 0;border-bottom:1px solid var(--bd3);gap:12px}
.ocKbLabel{flex:1;font-size:13px;color:var(--t1)}
.ocKbKey{display:flex;gap:4px}
.ocKbKey kbd{background:var(--bgW);border:1px solid var(--bd);border-radius:4px;padding:2px 8px;font:11px/1.4 var(--fm);color:var(--t2);min-width:28px;text-align:center}
.ocKbEdit{font-size:11px;color:var(--p);cursor:pointer;padding:2px 8px;border:1px solid var(--p);border-radius:var(--rP);background:none;transition:background .15s,color .15s}
.ocKbEdit:hover{background:var(--p);color:#fff}

/* ===== SUBAGENT/TASK ===== */
.ocTaskP{border:1px solid var(--bd);border-radius:var(--r);margin:8px 0;overflow:hidden;background:var(--bgS)}
.ocTaskPH{padding:8px 12px;display:flex;align-items:center;gap:8px;cursor:pointer;font-size:12px;color:var(--t2);border-bottom:1px solid var(--bd3)}
.ocTaskPH:hover{background:var(--bgW)}
.ocTaskSt{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.ocTaskSt.running{background:var(--p);animation:ocBlink 1.4s infinite both}
.ocTaskSt.done{background:var(--ok)}.ocTaskSt.err{background:var(--err)}
.ocTaskNm{flex:1;font-weight:500;color:var(--t1);font-size:12px}
.ocTaskR{padding:10px 12px;font-size:12px;color:var(--t2);max-height:200px;overflow-y:auto;display:none}
.ocTaskP.open .ocTaskR{display:block}
.ocTaskSpin{display:inline-block;width:12px;height:12px;border:2px solid var(--bd);border-top-color:var(--p);border-radius:50%;animation:ocspin .6s linear infinite;vertical-align:middle;margin-right:6px}
@keyframes ocspin{to{transform:rotate(360deg)}}

/* ===== BADGE STYLES ===== */
.ocBadge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:var(--rP);font-size:10px;font-weight:500;letter-spacing:.02em}
.ocBadge.on{background:rgba(34,197,94,.1);color:var(--ok)}
.ocBadge.off{background:var(--bd3);color:var(--t3)}

/* ===== SHELL PROMPT STYLE ===== */
.ocShellPrompt{background:#1a1a2e;color:#e0e0e0;font:13px/1.6 var(--fm);padding:10px 14px;border-radius:var(--r);border:1px solid var(--bd);margin:6px 0;white-space:pre-wrap;word-break:break-all}
.ocShellPrompt::before{content:'$ ';color:var(--p);font-weight:700}

/* ===== FORK MODAL ===== */
.ocForkItem{padding:10px 16px;cursor:pointer;border-bottom:1px solid var(--bd3);display:flex;gap:10px;align-items:flex-start;transition:background .1s}
.ocForkItem:hover{background:var(--bgW)}
.ocForkItem.act{background:var(--bgW);border-left:3px solid var(--p)}
.ocForkItemNum{font:600 11px/1 var(--mono);color:var(--p);background:var(--bd3);padding:3px 8px;border-radius:4px;min-width:24px;text-align:center;flex-shrink:0;margin-top:1px}
.ocForkItemText{flex:1;font-size:13px;color:var(--t1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.4}
.ocForkItemTime{font-size:11px;color:var(--t4);flex-shrink:0;margin-top:2px}

/* ===== SESSION DAY SEPARATOR ===== */
.ocSbSep{padding:8px 14px 4px;font:600 10px/1 var(--ff);color:var(--t4);border-top:1px solid var(--bd3);margin-top:4px;position:sticky;top:0;background:var(--bgS);z-index:1}
.ocSbSep:first-child{border-top:none;margin-top:0}

/* ===== SESSION TIMELINE ===== */
.ocTimeline{position:fixed;left:0;top:var(--hh);bottom:0;width:200px;background:var(--bgS);border-right:1px solid var(--bd2);transform:translateX(-100%);transition:transform .25s cubic-bezier(.4,0,.2,1);z-index:90;overflow-y:auto;padding:8px 0}
.ocTimeline.open{transform:translateX(0)}
.ocTimelineH{padding:8px 14px;font:500 12px/1 var(--ff);letter-spacing:.05em;color:var(--t3);border-bottom:1px solid var(--bd2);position:sticky;top:0;background:var(--bgS);z-index:1}
.ocTimelineI{padding:6px 14px;font-size:12px;color:var(--t2);cursor:pointer;border-bottom:1px solid var(--bd3);transition:background .1s;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ocTimelineI:hover{background:var(--bgW);color:var(--t1)}
.ocTimelineI .ocTimelineN{color:var(--p);font-weight:600;margin-right:4px;font-size:10px}
.ocTimelineToggle{position:fixed;left:0;top:var(--hh);width:16px;height:32px;background:var(--bgS);border:1px solid var(--bd2);border-left:none;border-radius:0 6px 6px 0;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:91;transition:left .25s cubic-bezier(.4,0,.2,1);color:var(--t3)}
.ocTimelineToggle:hover{color:var(--t1)}
.ocTimeline.open~.ocTimelineToggle{left:200px}

/* ===== DIFF VIEWER SIDE-BY-SIDE ===== */
.ocDiffToggle{display:flex;gap:4px;padding:4px 0;margin-bottom:4px}
.ocDiffToggleBtn{font-size:11px;padding:3px 10px;border:1px solid var(--bd);border-radius:var(--rP);background:var(--bgS);color:var(--t3);cursor:pointer}
.ocDiffToggleBtn.active{background:var(--p);color:#fff;border-color:var(--p)}
.ocDiffSplit{display:grid;grid-template-columns:1fr 1fr;gap:0;font-size:12px;font-family:var(--fm)}
.ocDiffSplitL,.ocDiffSplitR{overflow-x:auto}
.ocDiffSplitL{border-right:1px solid var(--bd2)}
.ocDiffSplitRow{display:flex;min-height:18px;line-height:18px}
.ocDiffSplitRow.add{background:rgba(34,197,94,.08)}
.ocDiffSplitRow.del{background:rgba(239,68,68,.08)}
.ocDiffSplitRow .ocDiffLN{width:32px;text-align:right;padding:0 6px;color:var(--t4);user-select:none;flex-shrink:0}
.ocDiffSplitRow .ocDiffLC{padding:0 8px;white-space:pre}
.ocDiffHunkNav{display:flex;gap:6px;align-items:center;padding:4px 0;font-size:11px;color:var(--t3)}
.ocDiffHunkBtn{font-size:11px;padding:2px 8px;border:1px solid var(--bd);border-radius:var(--rP);background:var(--bgS);color:var(--t1);cursor:pointer}
.ocDiffHunkBtn:hover{background:var(--bgW)}
.ocDiffHunkBtn:disabled{opacity:.4;cursor:default}

/* ===== GREP RESULTS CLICKABLE ===== */
.ocGrepFile{color:var(--p);cursor:pointer;text-decoration:underline;font-family:var(--fm);font-size:12px}
.ocGrepFile:hover{color:var(--pT)}
.ocGrepLine{color:var(--t3);font-size:11px;margin-left:4px}
.ocGrepMatch{background:rgba(250,204,21,.15);padding:1px 3px;border-radius:2px}

/* ===== FILE LINE RANGE SYNTAX HINT ===== */
.ocFileRangeHint{font-size:11px;color:var(--t3);padding:4px 14px;border-bottom:1px solid var(--bd3)}

/* ===== RESPONSIVE/MOBILE ===== */
@media(max-width:768px){
	.ocSb{position:fixed;z-index:200;width:260px;transform:translateX(-100%);transition:transform .25s}
	.ocSb.hid{transform:translateX(-100%)}
	.ocSb:not(.hid){transform:translateX(0);box-shadow:4px 0 24px rgba(0,0,0,.1)}
	.ocMn{width:100%}
	.ocHc{display:none}
	.ocHr .ocBtnTxt{display:none}
	.ocHr button{padding:6px 8px}
	.ocFilesP,.ocTodoP{width:100%}
	.ocChg{width:100%}
}
</style>
</head>
<body>

<div class="ocTimeline" id="ocTimeline">
	<div class="ocTimelineH">Timeline</div>
	<div id="ocTimelineL"></div>
</div>
<div class="ocTimelineToggle" id="ocTimelineToggle" title="Toggle message timeline">
	<svg width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="9 18 15 12 9 6"/></svg>
</div>

<div id="oc">
<div class="ocH">
	<div class="ocHl">
		<button class="ocIb" id="ocTogSb" title="Toggle sidebar"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="3" y1="12" x2="21" y2="12"/><line x1="3" y1="6" x2="21" y2="6"/><line x1="3" y1="18" x2="21" y2="18"/></svg></button>
		<select class="ocSel" id="ocProject" title="Switch project" style="margin-left:4px;max-width:200px"><option value="">Loading projects...</option></select>
	</div>
	<div class="ocHc">
		<select class="ocSel" id="ocMode" title="Mode"><option value="build">Build</option><option value="plan">Plan</option></select>
		<div style="position:relative;display:inline-flex;align-items:center" id="ocModelWrap">
			<select class="ocSel" id="ocModel" title="Model" style="display:none"><option value="">Select model</option></select>
			<div class="ocModelBtn" id="ocModelBtn" title="Model" tabindex="0">
				<span class="ocModelBtnT" id="ocModelBtnT">Select model</span>
				<svg class="ocModelBtnA" width="10" height="6" viewBox="0 0 10 6" fill="none"><path d="M1 1l4 4 4-4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>
			</div>
			<div class="ocModelDrop" id="ocModelDrop"></div>
			<span class="ocVariantBadge" id="ocVariantBadge" title="Reasoning effort" style="display:none"></span>
			<div class="ocVariantDrop" id="ocVariantDrop"></div>
		</div>
	</div>
	<div class="ocHr">
		<button class="ocB ocBs" id="ocProjBtn" title="Projects"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" style="flex-shrink:0"><path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"/></svg> <span class="ocBtnTxt">Projects</span></button>
		<button class="ocB ocBs" id="ocSetBtn" title="Settings"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" style="flex-shrink:0"><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"/></svg> <span class="ocBtnTxt">Settings</span></button>
		<button class="ocB ocBs" id="ocFtBtn" title="Files"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" style="flex-shrink:0"><path d="M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z"/><polyline points="13 2 13 9 20 9"/></svg> <span class="ocBtnTxt">Files</span></button>
		<button class="ocB ocBs" id="ocChgBtn" title="Changes"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" style="flex-shrink:0"><path d="M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8"/><path d="M3 3v5h5"/></svg> <span class="ocBtnTxt">Changes</span></button>
		<button class="ocB ocBs" id="ocTodoBtn" title="Tasks"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" style="flex-shrink:0"><path d="M9 11l3 3L22 4"/><path d="M21 12v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11"/></svg> <span class="ocBtnTxt">Tasks</span></button>
		<button class="ocB ocBs" id="ocModBtn" title="Modified Files"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" style="flex-shrink:0"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><polyline points="14 2 14 8 20 8"/><line x1="12" y1="18" x2="12" y2="12"/><line x1="9" y1="15" x2="15" y2="15"/></svg> <span class="ocBtnTxt">Modified Files</span></button>
		<?php if(!empty($back_url)): ?><a href="<?php echo $back_url; ?>" class="ocB ocBs" title="Back"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" style="flex-shrink:0"><line x1="19" y1="12" x2="5" y2="12"/><polyline points="12 19 5 12 12 5"/></svg> <span class="ocBtnTxt">Back</span></a><?php endif; ?>
		<button class="ocB ocBs" id="ocHlBtn" title="Help"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" style="flex-shrink:0"><circle cx="12" cy="12" r="10"/><path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"/><line x1="12" y1="17" x2="12.01" y2="17"/></svg> <span class="ocBtnTxt">Help</span></button>
		<button class="ocB ocBs" id="ocReasonToggle" title="Toggle reasoning blocks" style="display:none"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" style="flex-shrink:0"><path d="M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z"/><path d="M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z"/></svg> <span class="ocBtnTxt">Reasoning</span></button>
		<button class="ocIb" id="ocThBtn" title="Toggle theme">
			<svg id="ocThIcon" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
				<path d="M21.64 13a1 1 0 0 0-1.05-.14 8.05 8.05 0 0 1-3.37.73 8.15 8.15 0 0 1-8.14-8.1 8.59 8.59 0 0 1 .25-2A1 1 0 0 0 8 2.36 10.14 10.14 0 1 0 22 14.05a1 1 0 0 0-.36-1.05z"/>
			</svg>
		</button>
	</div>
</div>
<div class="ocBd">
	<div class="ocSb" id="ocSb">
		<div class="ocSbH"><span>History</span><button class="ocB ocBs" id="ocNew">+ New Session</button></div>
		<div class="ocSbSearch"><span class="ocSbSearchIc"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="7"/><line x1="21" y1="21" x2="16.65" y2="16.65"/></svg></span><input type="text" id="ocSbSearchIn" class="ocSbSearchIn" placeholder="Search sessions..." autocomplete="off"></div>
		<div class="ocSbL" id="ocSL"></div>
	</div>
	<div class="ocMn">
		<div class="ocC" id="ocChat"><div class="ocCi" id="ocCI"></div></div>
		<div class="ocIA">
			<div class="ocIW" style="position:relative">
				<div style="position:relative;flex:1;display:flex">
					<textarea class="ocIn" id="ocIn" placeholder="Ask me to code, debug, explain, or refactor..." rows="1" style="padding-right:28px"></textarea>
					<button class="ocSn" id="ocAttBtn" title="Attach files" style="position:absolute;right:4px;top:50%;transform:translateY(-50%);background:transparent;border:none;color:var(--t1);opacity:0.5;font-size:18px;width:28px;height:28px">+</button>
				</div>
				<input type="file" id="ocFile" multiple style="display:none">
				<button class="ocSn" id="ocSend"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round"><line x1="22" y1="2" x2="11" y2="13"/><polygon points="22 2 15 22 11 13 2 9" fill="none"/></svg></button>
				<button class="ocStop" id="ocStopBtn" style="display:none" title="Stop (Esc)"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round"><rect x="6" y="6" width="12" height="12" rx="2"/></svg></button>
				<div class="ocAtMention" id="ocAt"></div>
				<div class="ocSlashHint" id="ocSlash"></div>
			</div>
		</div>
		<div class="ocSt">
			<span><span class="ocSd" id="ocSD"></span><span id="ocST">Ready</span></span>
			<span id="ocStat" style="display:none;cursor:pointer">
				<span id="ocStatCtx" title="Context window"><svg width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" style="vertical-align:-1px;margin-right:2px"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><polyline points="14 2 14 8 20 8"/><line x1="16" y1="13" x2="8" y2="13"/><line x1="16" y1="17" x2="8" y2="17"/><polyline points="10 9 9 9 8 9"/></svg><span id="ocStatCtxV">0</span><span class="ocCtxBar" id="ocCtxBar"><span class="ocCtxBarFill low" style="width:0%"></span></span><span class="ocCtxPct"></span></span>
				<span id="ocStatIn" title="Input tokens"><svg width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" style="vertical-align:-1px;margin-right:2px"><line x1="12" y1="19" x2="12" y2="5"/><polyline points="5 12 12 5 19 12"/></svg><span id="ocStatInV">0</span></span>
				<span id="ocStatCache" title="Cached tokens"><svg width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" style="vertical-align:-1px;margin-right:2px"><polygon points="13 2 3 14 12 14 11 22 21 10 12 10 13 2"/></svg><span id="ocStatCacheV">0</span></span>
				<span id="ocStatOut" title="Output tokens"><svg width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" style="vertical-align:-1px;margin-right:2px"><line x1="12" y1="5" x2="12" y2="19"/><polyline points="19 12 12 19 5 12"/></svg><span id="ocStatOutV">0</span></span>
				<span id="ocStatTools" title="Tool calls"><svg width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" style="vertical-align:-1px;margin-right:2px"><path d="M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z"/></svg><span id="ocStatToolsV">0</span></span>
				<span id="ocStatIter" title="Iterations"><svg width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" style="vertical-align:-1px;margin-right:2px"><polyline points="23 4 23 10 17 10"/><polyline points="1 20 1 14 7 14"/><path d="M3.51 9a9 9 0 0 1 14.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0 0 20.49 15"/></svg><span id="ocStatIterV">0</span></span>
				<span id="ocStatCost" title="Cost"><svg width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" style="vertical-align:-1px;margin-right:2px"><line x1="12" y1="1" x2="12" y2="23"/><path d="M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6"/></svg>$<span id="ocStatCostV">0</span></span>
			</span>
			<span style="flex:1"></span>
			<span style=""><?php echo htmlspecialchars($softpath); ?></span>
		</div>
	</div>
</div>
</div>

<div class="ocChg" id="ocChg">
	<div class="ocChgH"><span>Changes</span><button class="ocMoC" id="ocChgC"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg></button></div>
	<div class="ocChgL" id="ocChgL"></div>
</div>

<div class="ocMo" id="ocSetMod">
<div class="ocMoB">
	<div class="ocMoH"><h3>Settings</h3><div style="display:flex;gap:6px;align-items:center"><button class="ocB ocBP ocBs" id="ocAddCon" style="font-size:11px">+ Add Connection</button><button class="ocMoC" id="ocSetC"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg></button></div></div>
	<div class="ocMoBd">
		<input type="text" class="ocFi" id="ocSetSearch" placeholder="Search providers..." style="margin-bottom:10px">
		<div class="ocPl" id="ocPL"></div>
	</div>
</div>
</div>

<div class="ocMo" id="ocConMod">
<div class="ocMoB" style="width:440px">
	<div class="ocMoH"><h3 id="ocConTitle">Add Connection</h3><button class="ocMoC" id="ocConC"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg></button></div>
	<div class="ocMoBd">
		<div class="ocFg"><label>Provider</label><select class="ocFi" id="ocProvSel" style="cursor:pointer"></select></div>
		<div class="ocFg" id="ocCustNameG" style="display:none"><label>Provider Name</label><input type="text" class="ocFi" id="ocCustName" placeholder="My Provider"></div>
		<div class="ocFg" id="ocBUG" style="display:none"><label>Base URL</label><input type="text" class="ocFi" id="ocBU" placeholder="https://api.example.com/v1"></div>
		<div class="ocFg" id="ocCustModelsG" style="display:none"><label>Models (comma-separated: id=name, id2=name2)</label><input type="text" class="ocFi" id="ocCustModels" placeholder="gpt-4o=GPT-4o, llama3=Llama 3"></div>
		<div class="ocFg"><label>API Key</label><input type="password" class="ocFi" id="ocAK" placeholder="Enter your API key (optional for some)"></div>
		<div style="display:flex;gap:8px;justify-content:flex-end"><button class="ocB" id="ocCan2">Cancel</button><button class="ocB" id="ocTst">Test</button><button class="ocB ocBP" id="ocSav">Connect</button></div>
	</div>
</div>
</div>

<div class="ocMo" id="ocCtxMod">
<div class="ocMoB" style="width:440px">
	<div class="ocMoH"><h3>Context Details</h3><button class="ocMoC" id="ocCtxC"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg></button></div>
	<div class="ocMoBd" id="ocCtxBd"></div>
</div>
</div>

<div class="ocMo" id="ocProjMod">
<div class="ocMoB" style="width:600px;max-height:80vh">
	<div class="ocMoH"><h3>Project Management</h3><button class="ocMoC" id="ocProjC"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg></button></div>
	<div class="ocMoBd">
		<div style="margin-bottom:16px">
			<div style="display:flex;gap:8px;margin-bottom:12px">
				<input type="text" class="ocFi" id="ocProjSearch" placeholder="Search projects..." style="flex:1">
				<button class="ocB ocBP" id="ocProjNewBtn" style="white-space:nowrap">+ New Project</button>
			</div>
		</div>
		<div id="ocProjList" style="max-height:400px;overflow-y:auto"></div>
		<div id="ocProjNewForm" style="display:none;margin-top:16px;padding-top:16px;border-top:1px solid var(--bd3)">
			<h4 style="font-size:14px;font-weight:500;margin-bottom:12px">Create New Project</h4>
			<div class="ocFg"><label>Project Name (optional)</label><input type="text" class="ocFi" id="ocProjName" placeholder="My Project"></div>
			<div class="ocFg"><label>Directory Path</label>
				<div style="display:flex;gap:0">
					<span style="background:var(--bgW);border:1px solid var(--bd2);border-right:none;border-radius:var(--rS) 0 0 var(--rS);padding:7px 10px;font-size:12px;color:var(--t3);white-space:nowrap"><?php echo htmlspecialchars($homedir); ?>/</span>
					<input type="text" class="ocFi" id="ocProjPath" placeholder="public_html/project" style="border-radius:0 var(--rS) var(--rS) 0">
				</div>
			</div>
			<div id="ocProjWpSection" style="display:none;margin-bottom:12px">
				<label style="font-size:12px;font-weight:400;color:var(--t2);display:block;margin-bottom:4px">Or select a WordPress installation:</label>
				<select class="ocFi" id="ocProjWpSel" style="cursor:pointer"><option value="">Select installation...</option></select>
			</div>
			<div style="display:flex;gap:8px;justify-content:flex-end;margin-top:12px">
				<button class="ocB" id="ocProjCan">Cancel</button>
				<button class="ocB ocBP" id="ocProjCre">Create Project</button>
			</div>
		</div>
	</div>
</div>
</div>

<div class="ocFt" id="ocFt">
	<div class="ocFtH"><span>Files</span><button class="ocB ocBs" id="ocFtRef" style="font-size:10px;padding:0 6px;height:20px"><svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" style="flex-shrink:0"><path d="M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8"/><path d="M3 3v5h5"/></svg></button></div>
	<div class="ocFtSrch"><input type="text" id="ocFtSearch" placeholder="Search files..."></div><div class="ocFtL" id="ocFtL"></div>
</div>

<div class="ocPerm" id="ocPermMod">
<div class="ocPermB">
	<div class="ocPermH"><div class="ocPermHI" id="ocPermIcon">&#128274;</div><div><div class="ocPermHT" id="ocPermTitle">Permission Required</div><div class="ocPermHS" id="ocPermSub">tool_call</div></div></div>
	<div class="ocPermD" id="ocPermDetail"></div>
	<div class="ocPermF">
		<button class="ocB" id="ocPermDeny">Deny</button>
		<button class="ocB ocBP" id="ocPermAllowOnce">Allow Once</button>
		<button class="ocB ocBP" id="ocPermAllowAlways" style="background:var(--ok);border-color:var(--ok)">Allow Always</button>
	</div>
</div>
</div>

<div class="ocTodoP" id="ocTodoP">
	<div class="ocTodoPH"><span>Tasks</span><button class="ocMoC" id="ocTodoC" style="font-size:16px;padding:0"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg></button></div>
	<div class="ocTodoPL" id="ocTodoPL"><div style="padding:20px;text-align:center;color:var(--t3);font-size:12px">No tasks yet</div></div>
</div>

<div class="ocFilesP" id="ocFilesP">
	<div class="ocFilesPH"><span>Modified Files</span><button class="ocMoC" id="ocFilesC" style="font-size:16px;padding:0"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg></button></div>
	<div class="ocFilesPL" id="ocFilesPL"><div style="padding:20px;text-align:center;color:var(--t3);font-size:12px">No modified files yet</div></div>
</div>

<div class="ocMo" id="ocKbMod">
<div class="ocMoB" style="width:560px;max-height:80vh">
	<div class="ocMoH"><h3>Keybindings</h3><button class="ocMoC" id="ocKbC"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg></button></div>
	<div class="ocMoBd" id="ocKbBd" style="max-height:calc(80vh - 60px);overflow-y:auto"></div>
</div>
</div>

<div class="ocMo" id="ocDiffMod">
<div class="ocMoB" style="width:90%;max-width:900px;max-height:85vh">
	<div class="ocMoH"><h3>Diff Viewer</h3><button class="ocMoC" id="ocDiffC"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg></button></div>
	<div class="ocMoBd" id="ocDiffBd" style="max-height:calc(85vh - 60px);overflow-y:auto"></div>
</div>
</div>

<div class="ocMo" id="ocForkMod">
<div class="ocMoB" style="width:500px;max-height:70vh">
	<div class="ocMoH"><h3>Fork Session</h3><button class="ocMoC" id="ocForkC"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg></button></div>
	<div class="ocMoBd" style="padding:0;max-height:calc(70vh - 60px);overflow:hidden;display:flex;flex-direction:column">
		<div style="padding:8px 14px;border-bottom:1px solid var(--bd3)"><input type="text" id="ocForkSearch" placeholder="Search messages..." style="width:100%;border:1px solid var(--bd);border-radius:var(--rP);padding:6px 10px;font-size:13px;background:var(--in);color:var(--t1);outline:none" onfocus="this.style.borderColor='var(--p)'" onblur="this.style.borderColor='var(--bd)'"></div>
		<div id="ocForkList" style="flex:1;overflow-y:auto;padding:4px 0"></div>
	</div>
</div>
</div>

marked.setOptions({breaks:true,gfm:true});
var R=new marked.Renderer();
R.code=function(code,lang){
	var l=lang||'',h='';
	try{h=hljs.highlightAuto(code).value}catch(e){h=code.replace(/</g,'&lt')}
	var lines=code.split('\n').length;
	var coll=lines>15;
	var wrapCls=coll?'ocCodeColl collapsed':'';
	var toggleBtn=coll?'<button class="ocCodeToggle" onclick="window._toggleCode(this)">Expand</button>':'';
	return '<div class="'+wrapCls+'"><div class="ocCH"><span>'+l+'</span><button class="ocCC" onclick="window._cp(this)">Copy</button>'+toggleBtn+'</div><pre><code class="hljs">'+h+'</code></pre></div>';
};
marked.use({renderer:R});
window._cp=function(el){
	var c=el.closest('pre').querySelector('code');
	navigator.clipboard.writeText(c.textContent);
	el.textContent='Copied!';
	setTimeout(function(){el.textContent='Copy'},1200);
};
window._toggleCode=function(btn){
	var wrap=btn.closest('.ocCodeColl');
	if(!wrap)return;
	wrap.classList.toggle('collapsed');
	btn.textContent=wrap.classList.contains('collapsed')?'Expand':'Collapse';
};

function bp(o){
	var p=[];
	for(var k in o){
		if(o.hasOwnProperty(k))p.push(encodeURIComponent(k)+'='+encodeURIComponent(o[k]));
	}
	return p.join('&');
}

function st(t,c){
	document.getElementById('ocST').textContent=t;
	document.getElementById('ocSD').className='ocSd '+(c?'on':'off');
}

var _userSvg='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/><circle cx="12" cy="7" r="4"/></svg>';

function rCtx(){
	if(!ctx)return;
	var w=document.getElementById('ocCI');
	var ex=w.querySelector('.ocCtx');
	if(ex)return;
	var d=document.createElement('div');
	d.className='ocCtx';
	d.innerHTML='<div class="ocCtxI">'+ctx+'</div>';
	w.insertBefore(d,w.firstChild);
}

function abortStream(){
	if(cS){cS.abort();cS=null}
	str=false;
	lockActive=false;
	document.getElementById('ocSend').style.display='flex';
	document.getElementById('ocStopBtn').style.display='none';
}

it.addEventListener('click',function(ev){

let btn = ev.target.closest('button');

if(btn && btn.dataset && btn.dataset.d){
					ev.stopPropagation();
					if(confirm('Delete this session?')){
						if(aC===s.id) abortStream();
						api('delete_conversation',{conversation_id:s.id},function(){
							loadSL();
							if(aC===s.id){aC=null;rMsgs([])}
						});
					}
					return;
				}
				var mv=document.getElementById('ocModel').value;
				var pp=mv.split('/');
				api('start',{provider:pp[0],model:pp.slice(1).join('/'),mode:document.getElementById('ocMode').value},function(){
					aC=s.id;
					api('switch_conversation',{conversation_id:s.id},function(){
						loadC(s.id);
					});
				});
			});
			ls.appendChild(it);
		});
	});
}

function hlS(id){
	document.querySelectorAll('.ocSi').forEach(function(el){
		el.classList.toggle('act',el.dataset.id===id);
	});
}

document.getElementById('ocSbSearchIn').addEventListener('input',function(){
	var q=this.value.toLowerCase().trim();
	var items=document.querySelectorAll('.ocSi');
	items.forEach(function(it){
		var title=it.querySelector('.ocSiT');
		if(!title)return;
		var match=!q||title.textContent.toLowerCase().indexOf(q)!==-1;
		it.style.display=match?'':'none';
	});
});

function send(){
	var inp=document.getElementById('ocIn');
	var text=inp.value.trim();
	if(!text||str)return;

if(text.charAt(0)==='!'&&text.length>1){
		var shellCmd=text.substring(1);
		inp.value='';inp.style.height='40px';
		if(text&&!str){promptHistory.push(text);if(promptHistory.length>50)promptHistory.shift();promptHistoryIdx=-1;savePromptHistory()}
		rMsg({role:'user',content:text});
		var shellEl=rMsg({role:'asst',content:'',parts:[]});
		shellEl.innerHTML='<div class="ocShellPrompt">'+esc(shellCmd)+'</div><div class="ocTerm">Running...</div>';
		str=true;lockActive=true;
		document.getElementById('ocSend').style.display='none';
		document.getElementById('ocStopBtn').style.display='flex';
		st('Running shell...',true);
		api('shell',{command:shellCmd},function(e,r){
			str=false;lockActive=false;
			document.getElementById('ocSend').style.display='flex';
			document.getElementById('ocStopBtn').style.display='none';
			if(!e&&r){
				var output=r.output||'';
				if(r.error)output+='\nError: '+r.error;
				shellEl.innerHTML='<div class="ocShellPrompt">'+esc(shellCmd)+'</div><div class="ocTerm">'+esc(output)+'</div>';
				if(r.returncode!==0)shellEl.querySelector('.ocTerm').style.borderColor='var(--wr)';
			}else{
				shellEl.innerHTML='<div class="ocShellPrompt">'+esc(shellCmd)+'</div><div class="ocTerm" style="color:var(--err)">Error: '+(e||'Unknown error')+'</div>';
			}
			st('Ready',true);
			_playSound('complete');
			_notifyOnComplete('Shell Complete','Command finished');
			loadSL();
		});
		return;
	}

if(text.charAt(0)==='/'){
		inp.value='';
		inp.style.height='40px';
		var cmd=text.replace(/\s+/g,' ').split(' ');
		var c=cmd[0].toLowerCase();
		if(c==='/clear'){api('clear',{},function(){rMsgs([]);st('Cleared',true)});return}
		if(c==='/export'){showExportDialog();return}
		if(c==='/copy'){
			var msgs=document.querySelectorAll('#ocCI .ocMsg');
			var mdText='';
			msgs.forEach(function(el){
				var isUser=el.classList.contains('u');
				mdText+=(isUser?'**User:** ':'**Assistant:** ');
				var textEl=el.querySelector('.ocMd');
				if(textEl){
					mdText+=textEl.innerText||'';
				}else if(isUser){
					var userEl=el.querySelector('.ocMbb');
					if(userEl)mdText+=userEl.innerText||'';
				}
				mdText+='\n\n';
			});
			navigator.clipboard.writeText(mdText).then(function(){toast('Copied to clipboard','ok')},function(){toast('Copy failed','err')});
			return;
		}
		if(c==='/plan'){api('set_mode',{mode:'plan'},function(){document.getElementById('ocMode').value='plan';st('Plan mode',true)});return}
		if(c==='/build'){api('set_mode',{mode:'build'},function(){document.getElementById('ocMode').value='build';st('Build mode',true)});return}
		if(c==='/compact'){
			st('Compacting...',true);
			api('compact',{keep_last_n:3},function(e2,r2){
				if(!e2&&r2&&r2.success){
					rMsgs(r2.messages||[]);
					toast('Conversation compacted','ok');
					st('Ready',true);
				}else{
					toast('Failed to compact: '+(e2||(r2&&r2.error)||'Unknown error'),'err');
					st('Ready',true);
				}
			});
			return;
		}
		if(c==='/undo'){
			if(!rMsgs._lastMsgs||!rMsgs._lastMsgs.length){toast('Nothing to undo','warn');return}
			var lastUser=null;
			for(var i=rMsgs._lastMsgs.length-1;i>=0;i--){
				if(rMsgs._lastMsgs[i].role==='user'){lastUser=rMsgs._lastMsgs[i];break}
			}
			if(!lastUser||!lastUser.id){toast('Cannot undo: no user message found','warn');return}
			api('undo',{message_id:lastUser.id},function(e,r){
				if(!e&&r&&r.success){
					rMsgs(r.messages||[]);
					toast('Message undone (use /redo to restore)','ok');
					st('Ready',true);
					loadSL();
				}else{
					toast('Failed to undo: '+(e||(r&&r.error)||'Unknown error'),'err');
					st('Ready',true);
				}
			});
			return;
		}
		if(c==='/redo'){
			st('Redoing...',true);
			api('redo',{},function(e,r){
				if(!e&&r&&r.success){
					rMsgs(r.messages||[]);
					toast('Message restored','ok');
					st('Ready',true);
					loadSL();
				}else{
					toast('Nothing to redo: '+(e||(r&&r.error)||'Unknown error'),'err');
					st('Ready',true);
				}
			});
			return;
		}
		if(c==='/fork'){
			showForkModal();
			return;
		}
		if(c==='/rename'){
			var title=prompt('Enter new session title:',curSessionTitle());
			if(title!==null&&title.trim()){
				api('rename_conversation',{conversation_id:aC,title:title.trim()},function(e,r){
					if(!e&&r&&r.success){
						toast('Session renamed','ok');
						loadSL();
					}else{
						toast('Failed to rename','err');
					}
				});
			}
			return;
		}
		if(c==='/help'){
			document.getElementById('ocHlBtn').click();
			return;
		}
		if(c==='/todo'){
			var todoText=cmd.slice(1).join(' ');
			if(!todoText){toast('Usage: /todo <task text>','warn');return}
			addTodo(todoText,'medium','pending');
			toast('Task added','ok');
			return;
		}
		if(c==='/sound'){
			_soundEnabled=!_soundEnabled;
			localStorage.setItem('oc_sound_enabled',_soundEnabled?'1':'0');
			toast('Sound notifications: '+(_soundEnabled?'ON':'OFF'),'ok');
			return;
		}
		if(c==='/notify'){
			if(typeof Notification==='undefined'){toast('Notifications not supported','warn');return}
			if(Notification.permission==='default'){
				Notification.requestPermission(function(p){
					_desktopNotifEnabled=(p==='granted');
					toast('Desktop notifications: '+(_desktopNotifEnabled?'enabled':'denied'),'ok');
				});
			}else if(Notification.permission==='granted'){
				_desktopNotifEnabled=!_desktopNotifEnabled;
				toast('Desktop notifications: '+(_desktopNotifEnabled?'ON':'OFF'),'ok');
			}else{
				toast('Notifications blocked in browser settings','warn');
			}
			return;
		}
		if(c==='/keybindings'){
			renderKeybindings();
			document.getElementById('ocKbMod').classList.add('open');
			return;
		}
		if(c==='/timeline'){
			_timelineOpen=!_timelineOpen;
			document.getElementById('ocTimeline').classList.toggle('open',_timelineOpen);
			if(_timelineOpen){renderTimeline();toast('Timeline opened','ok')}
			else{toast('Timeline closed','info')}
			return;
		}
		var bb=rMsg({role:'asst',content:'',parts:[]});
		bb.innerHTML='<div style="color:var(--err);padding:6px">Unknown command: '+esc(c)+'. Try /help</div>';
		return;
	}

inp.value='';
	inp.style.height='40px';
	if(text&&!str){promptHistory.push(text);if(promptHistory.length>50)promptHistory.shift();promptHistoryIdx=-1;savePromptHistory()}
	if(typeof Notification!=='undefined'&&Notification.permission==='default')Notification.requestPermission();
	rMsg({role:'user',content:text});
	str=true;
	lockActive=true;
	document.getElementById('ocSend').style.display='none';
	document.getElementById('ocStopBtn').style.display='flex';
	st('Thinking...',true);
	var thinkBubble=rMsg({role:'asst',content:'__thinking__',parts:[]});

// Favorites optgroup first
		if(favModels.length){
			var favGrp=document.createElement('optgroup');
			favGrp.label='Favorites';
			favModels.forEach(function(fm){
				var parts=fm.split('/');
				var provId=parts[0];
				var modelId=parts.slice(1).join('/');
				var prov=d.find(function(p){return p.id===provId});
				if(!prov||!prov.connected)return;
				var m=prov.models&&prov.models[modelId];
				if(!m)return;
				var mName=typeof m==='object'?m.name:m;
				var o=document.createElement('option');
				o.value=fm;
				o.textContent=mName;
				favGrp.appendChild(o);
			});
			if(favGrp.children.length)ms.appendChild(favGrp);
		}

if(selModel){
			ms.value=selModel;
			if(ms.value!==selModel){
				var opts=ms.querySelectorAll('option');
				for(var i=0;i<opts.length;i++){
					if(opts[i].value===selModel){ms.selectedIndex=i;break}
				}
			}
		}else{
		// 1) Prefer the default_model defined by the hosting provider (via filter.php).
		//    The first connected provider that exposes a default_model wins.
		var defaultModel=null;
		for(var i=0;i<d.length;i++){
			if(d[i].connected && d[i].default_model){
				defaultModel=d[i].id+'/'+d[i].default_model;
				break;
			}
		}
		// 2) Fall back to the legacy "free model" selection.
		if(!defaultModel){
			var freeModel=null;
			var opts=ms.querySelectorAll('option');
			for(var i=0;i<opts.length;i++){
				if(opts[i].value==='opencode_zen/minimax-m2.5-free'){
					freeModel=opts[i].value;
					break;
				}
			}
			if(!freeModel){
				for(var i=0;i<opts.length;i++){
					if(opts[i].value.indexOf('opencode_zen/')===0){
						freeModel=opts[i].value;
						break;
					}
				}
			}
			if(freeModel) defaultModel=freeModel;
		}
		if(defaultModel){
			ms.value=defaultModel;
			var pp=defaultModel.split('/');
			selModel=defaultModel;
			api('start',{provider:pp[0],model:pp.slice(1).join('/'),mode:document.getElementById('ocMode').value},function(){});
		}
		}
}
function renderProviders(d){
		pv=d;
		syncModelCtx(d);
		renderModelSelect(d);
		rPL(d);
		renderModelDropdown(d);
		syncModelBtn();
		updateVariantBadge();
}

function isCustomType(id){
	return id==='custom'||(id&&id.indexOf('custom:')===0);
}

function toggleCustFields(id){
	var show=isCustomType(id);
	document.getElementById('ocBUG').style.display=show?'block':'none';
	document.getElementById('ocCustNameG').style.display=(id==='custom')?'block':'none';
	document.getElementById('ocCustModelsG').style.display=show?'block':'none';
}

var slashCmds=[
	{cmd:'/plan',desc:'Switch to Plan mode (read-only)'},
	{cmd:'/build',desc:'Switch to Build mode (read+write)'},
	{cmd:'/clear',desc:'Clear current conversation'},
	{cmd:'/export',desc:'Download conversation as Markdown'},
	{cmd:'/copy',desc:'Copy transcript to clipboard'},
	{cmd:'/compact',desc:'Summarize conversation to reduce context'},
	{cmd:'/undo',desc:'Undo last message pair'},
	{cmd:'/redo',desc:'Redo last undone message'},
	{cmd:'/fork',desc:'Fork conversation from last message'},
	{cmd:'/rename',desc:'Rename this session'},
	{cmd:'/todo',desc:'Add a task item (e.g. /todo Fix login bug)'},
	{cmd:'/sound',desc:'Toggle sound notifications on/off'},
	{cmd:'/notify',desc:'Toggle desktop notifications'},
	{cmd:'/keybindings',desc:'Customize keyboard shortcuts'},
	{cmd:'/timeline',desc:'Toggle message timeline navigation'},
	{cmd:'/help',desc:'Show keyboard shortcuts and commands'}
];

window._openFile=function(path){
	var inp=document.getElementById('ocIn');
	inp.value='@'+path;
	inp.dispatchEvent(new Event('input',{bubbles:true}));
	inp.focus();
};

var mod=document.getElementById('ocForkMod');
	var list=document.getElementById('ocForkList');
	var search=document.getElementById('ocForkSearch');

renderForkList('');
	search.value='';
	mod.classList.add('open');
	setTimeout(function(){search.focus()},50);

// Wire up search
	search.oninput=function(){renderForkList(this.value)};

// Close handlers
	document.getElementById('ocForkC').onclick=function(){mod.classList.remove('open')};
	mod.onclick=function(e){if(e.target===mod)mod.classList.remove('open')};
}

modelCtx={
	'gpt-4o':128000,'gpt-4o-mini':128000,'gpt-4-turbo':128000,
	'claude-sonnet-4-20250514':200000,'claude-opus-4-20250514':200000,'claude-3-5-sonnet-20241022':200000,'claude-3-5-haiku-20241022':200000,
	'gemini-2.5-pro':1048576,'gemini-2.5-flash':1048576,'gemini-1.5-pro':2097152,
	'deepseek-chat':64000,'deepseek-coder':64000,
	'llama-3.3-70b-versatile':128000,'llama-3.1-8b-instant':128000,
	'MiniMax-Text-01':1000000,'MiniMax-M1':1000000,
	'big-pickle':32000,'minimax-m2.5-free':32000,'nemotron-3-super-free':32000,'trinity-large-preview-free':32000,
	'claude-sonnet-4':200000,'claude-opus-4-7':200000,'gpt-5.4':128000,'gpt-5.4-nano':128000,
	'gemini-3-flash':1048576,'gemini-3.1-pro':1048576,'glm-5':128000,'minimax-m2.7':1000000,'kimi-k2.6':128000,'qwen3.6-plus':128000
};
function syncModelCtx(providers){
	providers.forEach(function(p){
		if(!p.models)return;
		for(var mid in p.models){
			if(!modelCtx[mid]){
				var m=p.models[mid];
				modelCtx[mid]=(typeof m==='object'&&m.context_window)?m.context_window:128000;
			}
		}
	});
}

// Custom model dropdown toggle
(function(){
	var btn=document.getElementById('ocModelBtn');
	var drop=document.getElementById('ocModelDrop');
	btn.addEventListener('click',function(e){
		e.stopPropagation();
		var isOpen=drop.classList.contains('open');
		if(isOpen){
			drop.classList.remove('open');
			return;
		}
		// Position the fixed dropdown under the button, clamped to viewport
		var r=btn.getBoundingClientRect();
		var availH=window.innerHeight-(r.bottom+8);
		var maxH=Math.max(200,Math.min(420,availH));
		drop.style.left=r.left+'px';
		drop.style.top=(r.bottom+4)+'px';
		drop.style.maxHeight=maxH+'px';
		drop.classList.add('open');
		syncModelDropdownSelection();
		// Scroll selected into view (defer so it doesn't trigger the close-on-scroll guard)
		setTimeout(function(){
			if(!drop.classList.contains('open'))return;
			var sel=drop.querySelector('.ocModelOpt.selected');
			if(sel)sel.scrollIntoView({block:'nearest'});
		},0);
	});
	btn.addEventListener('keydown',function(e){
		if(e.key==='Enter'||e.key===' '){e.preventDefault();btn.click()}
	});
	// Close on outside click (bubbling phase; btn handler stops propagation so btn clicks are safe)
	document.addEventListener('click',function(e){
		if(!drop.classList.contains('open'))return;
		if(drop.contains(e.target)||btn.contains(e.target)||e.target===btn)return;
		drop.classList.remove('open');
	});
	// Close on Escape
	document.addEventListener('keydown',function(e){
		if(e.key==='Escape')drop.classList.remove('open');
	});
	// Close on window resize (layout changes); do NOT close on scroll since the dropdown is fixed
	window.addEventListener('resize',function(){if(drop.classList.contains('open'))drop.classList.remove('open')});
})();
document.getElementById('ocNew').addEventListener('click',newS);
document.getElementById('ocTogSb').addEventListener('click',function(){
	var sb=document.getElementById('ocSb');
	if(window.innerWidth<=768){
		if(sb.classList.contains('resp')){
			sb.classList.remove('resp');
			sb.classList.add('hid');
		}else{
			sb.classList.remove('hid');
			sb.classList.add('resp');
		}
	}else{
		sb.classList.toggle('hid');
	}
});
window.addEventListener('resize',function(){
	var sb=document.getElementById('ocSb');
	if(window.innerWidth<=768){
		sb.classList.add('hid');
		sb.classList.remove('resp');
	}else{
		sb.classList.remove('resp');
		if(!sb.classList.contains('hid'))sb.classList.remove('hid');
	}
});

// Initial state
if(window.innerWidth<=768){
	document.getElementById('ocSb').classList.add('hid');
}

api('status',null,function(e,d){
	if(!e&&d){
		if(d.session){
			if(d.session.provider&&d.session.model){
				selModel=d.session.provider+'/'+d.session.model;
				selMode=d.session.mode||'build';
				if(d.session.variant&&d.session.variant!=='default'){
					currentVariant[selModel]=d.session.variant;
				}
				// Re-apply model selection if dropdown already populated
				var ms=document.getElementById('ocModel');
				if(ms&&ms.options.length>1){
					ms.value=selModel;
					if(ms.value!==selModel){
						var opts=ms.querySelectorAll('option');
						for(var i=0;i<opts.length;i++){
							if(opts[i].value===selModel){ms.selectedIndex=i;break}
						}
					}
					syncModelBtn();
					syncModelDropdownSelection();
					updateVariantBadge();
				}
			}
			if(d.session.mode)document.getElementById('ocMode').value=d.session.mode;
			var urlSession=new URL(window.location).searchParams.get('session');
			if(urlSession){
				aC=urlSession;
				loadC(aC);
			}else if(d.session.active_conversation){
				aC=d.session.active_conversation;
				loadC(aC);
			}
		}
		var hc=(d.providers||[]).some(function(p){return p.connected});
		st(hc?'Ready':'No provider connected',hc);

// Apply favorite models from status (covers the case where settings_load hasn't returned yet)
		if(d.favorite_models && d.favorite_models.length && !favModels.length){
			favModels=d.favorite_models;
			if(_providersCache){
				renderModelSelect(_providersCache);
				renderModelDropdown(_providersCache);
				syncModelBtn();
				syncModelDropdownSelection();
			}
		}

// Auto-detect model metadata from models.dev
		if(d.model_info){
			for(var mid in d.model_info){
				if(d.model_info[mid].context){
					modelCtx[mid]=d.model_info[mid].context;
				}
			}
		}
		if(d.lock&&d.lock.locked){
			lockActive=true;
			str=false;
			document.getElementById('ocSend').style.display='flex';
			document.getElementById('ocStopBtn').style.display='flex';
			st('Generation in progress...',true);
		}
	}
});

api('project_info',null,function(e,d){
	if(!e&&d){
		var overviewText=(d.overview||'');
		var lines=overviewText.split('\n');
		var typeLine=lines[0]||'';
		var pathLine=lines[1]||'';
		var typeMatch=typeLine.match(/Project type:\s*(.+)/i);
		var pathMatch=pathLine.match(/Project path:\s*(.+)/i);
		var dispType=typeMatch?typeMatch[1].trim():(d.type||'unknown');
		var dispPath=pathMatch?pathMatch.trim():SP;
		if(dispPath&&HD&&dispPath.indexOf(HD)===0) dispPath=dispPath.substring(HD.length+1);
		ctx='<b>Project Type:</b> '+esc(dispType)+'<br>'
			+'<b>Path:</b> <code>'+esc(dispPath||SP)+'</code><br>';
		var restOfOverview=lines.slice(2).join('\n').trim();
		if(restOfOverview){
			ctx+='<br>'+esc(restOfOverview.substring(0,300))+(restOfOverview.length>300?'...':'');
		}
		rCtx();
	}
});

loadP();
loadSL();

// Toast notifications
function toast(msg,type,dur){
	var t=document.getElementById('ocToast');
	var d=document.createElement('div');
	d.className='ocToastI '+(type||'info');
	d.textContent=msg;
	t.appendChild(d);
	setTimeout(function(){d.classList.add('hide');setTimeout(function(){d.remove()},300)},dur||3000);
}

// Sound notification using Web Audio API (played on tab focus, not in background)
var _audioCtx=null;
function _playChime(){
	try{
		if(!_audioCtx)_audioCtx=new(window.AudioContext||window.webkitAudioContext)();
		if(_audioCtx.state==='suspended')_audioCtx.resume();
		var t=_audioCtx.currentTime;
		function _note(freq,start,dur,vol){
			var o=_audioCtx.createOscillator(),g=_audioCtx.createGain();
			o.type='sine';o.frequency.value=freq;
			o.connect(g);g.connect(_audioCtx.destination);
			g.gain.setValueAtTime(0,t+start);
			g.gain.linearRampToValueAtTime(vol,t+start+0.015);
			g.gain.setValueAtTime(vol,t+start+dur*0.15);
			g.gain.exponentialRampToValueAtTime(0.001,t+start+dur);
			o.start(t+start);o.stop(t+start+dur+0.01);
		}
		_note(880,0,0.12,0.2);
		_note(660,0.1,0.15,0.16);
	}catch(e){}
}

// Browser notification + sound + title flash when chat completes in background tab
function _notifyOnComplete(title,body){
	if(!document.hidden)return;
	if(_notifyPending)return;
	_notifyPending=true;
	document.title='\u2728 '+(body||'Response ready');
	_playSound('complete');
	if(_desktopNotifEnabled&&typeof Notification!=='undefined'&&Notification.permission==='granted'){
		var n=new Notification(title,{body:body,tag:'ai-chat'});
		n.onclick=function(){window.focus();n.close()};
	}
}

// Reset title when user returns to tab after background notification
document.addEventListener('visibilitychange',function(){
	if(!document.hidden&&_notifyPending){
		_notifyPending=false;
		document.title=_origTitle;
	}
});

// @-Mention file resolution + mode switching in send()
var origSend=send;
send=function(){
	var inp=document.getElementById('ocIn');
	var text=inp.value.trim();
	if(!text||str)return;

// Handle @build/@plan mode mentions
	var modeMentions=text.match(/@(build|plan)\b/gi);
	if(modeMentions){
		modeMentions.forEach(function(m){
			var mode=m.substring(1).toLowerCase();
			if(mode==='build'||mode==='plan'){
				document.getElementById('ocMode').value=mode;
				api('set_mode',{mode:mode},function(){});
				text=text.replace(m,'').trim();
			}
		});
		inp.value=text;
		if(!text)return;
	}

// Message actions (edit, regenerate)
document.getElementById('ocCI').addEventListener('mouseover',function(e){
	var msg=e.target.closest('.ocMsg');
	if(!msg||msg.querySelector('.ocMsgAct'))return;
	var isU=msg.classList.contains('u');
	var isLast=!msg.nextElementSibling;
	var act=document.createElement('div');
	act.className='ocMsgAct';
	if(isU){
		var editBtn=document.createElement('button');
		editBtn.className='ocMsgActB';
		editBtn.innerHTML='<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M17 3a2.828 2.828 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5L17 3z"/></svg>';
		editBtn.title='Edit & Resend';
		editBtn.addEventListener('click',function(ev){
			ev.stopPropagation();
			var bb=msg.querySelector('.ocMbb');
			if(!bb)return;
			var oldText=bb.textContent||'';
			bb.contentEditable='true';
			bb.focus();
			bb.style.background='var(--input)';
			bb.style.color='var(--t1)';
			bb.style.border='1px solid var(--ac)';
			bb.style.borderRadius='var(--r)';
			bb.style.padding='8px 12px';
			var saveBtn=document.createElement('button');
			saveBtn.textContent='Send';
			saveBtn.className='ocB ocBP';
			saveBtn.style.cssText='position:absolute;bottom:-30px;right:0;font-size:11px;height:24px;z-index:100';
			msg.style.position='relative';
			msg.appendChild(saveBtn);
			saveBtn.addEventListener('click',function(){
				var newText=bb.textContent.trim();
				bb.contentEditable='false';
				bb.style.cssText='';
				saveBtn.remove();
				if(newText&&newText!==oldText){
					var msgId=msg.dataset.msgId||'';
					// Just set the input and send as new prompt - don't delete anything
					var inp=document.getElementById('ocIn');
					inp.value=newText;
					origSend();
					toast('Message sent as new prompt','ok');
				}
			});
		});
		act.appendChild(editBtn);
		var forkBtn=document.createElement('button');
		forkBtn.className='ocMsgActB';
		forkBtn.innerHTML='<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M6 3v12"/><circle cx="18" cy="6" r="3"/><circle cx="6" cy="18" r="3"/><path d="M18 9a9 9 0 0 1-9 9"/></svg>';
		forkBtn.title='Fork from here';
		forkBtn.addEventListener('click',function(ev){
			ev.stopPropagation();
			var msgId=msg.dataset.msgId||'';
			// Always verify msgId exists in the loaded messages
			var allMsgs=rMsgs._lastMsgs||[];
			var msgIdx=-1;
			for(var i=0;i<allMsgs.length;i++){
				if(allMsgs[i].id===msgId){msgIdx=i;break}
			}
			// If msgId not found in messages, try to find by content match
			if(msgIdx<0){
				var bbFork=msg.querySelector('.ocMbb');
				var domText=bbFork?(bbFork.textContent||'').trim().substring(0,50):'';
				for(var i=0;i<allMsgs.length;i++){
					if(allMsgs[i].role==='user'){
						var apiContent=(allMsgs[i].content||'').trim().substring(0,50);
						if(domText&&apiContent&&domText.indexOf(apiContent)===0){msgId=allMsgs[i].id;msgIdx=i;break}
					}
				}
			}
			if(!msgId||msgIdx<0){toast('Cannot fork: message ID not found','warn');return}
			st('Forking...',true);
			api('fork',{message_id:msgId},function(e,r){
				if(!e&&r&&r.success){
					aC=r.conversation_id;
					updateURL(aC);
					toast('Forked to new session: '+(r.title||'Untitled'),'ok');
					st('Ready',true);
					loadSL();
					loadC(aC);
					if(r.forked_content){
						var inp=document.getElementById('ocIn');
						inp.value=r.forked_content;
						inp.focus();
					}
				}else{
					toast('Failed to fork: '+(e||(r&&r.error)||'Unknown error'),'err');
					st('Ready',true);
				}
			});
		});
		act.appendChild(forkBtn);
	}
	if(isLast&&!isU){
		var regenBtn=document.createElement('button');
		regenBtn.className='ocMsgActB';
		regenBtn.innerHTML='<svg xmlns="http://www.w3.org/2000/svg" height="12" viewBox="0 -960 960 960" width="12" fill="currentColor"><path d="M396-200q-97 0-166.5-63T160-420q0-94 69.5-157T396-640h252L544-744l56-56 200 200-200 200-56-56 104-104H396q-63 0-109.5 40T240-420q0 60 46.5 100T396-280h284v80H396Z"/></svg>';
		regenBtn.title='Regenerate';
		regenBtn.addEventListener('click',function(ev){
			ev.stopPropagation();
			api('regenerate',{},function(e,r){
				if(!e&&r&&r.success){
					msg.parentNode.removeChild(msg);
					toast('Regenerating...','info');
					var lastUserMsg='';
					document.querySelectorAll('#ocCI .ocMsg.u').forEach(function(m){
						lastUserMsg=m.querySelector('.ocMbb').textContent||'';
					});
					if(lastUserMsg){
						var inp=document.getElementById('ocIn');
						inp.value=lastUserMsg;
						origSend();
						inp.value='';
					}
				}
			});
		});
		act.appendChild(regenBtn);
	}
	if(!isU){
		var forkBtn2=document.createElement('button');
		forkBtn2.className='ocMsgActB';
		forkBtn2.innerHTML='<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M6 3v12"/><circle cx="18" cy="6" r="3"/><circle cx="6" cy="18" r="3"/><path d="M18 9a9 9 0 0 1-9 9"/></svg>';
		forkBtn2.title='Fork from here';
		forkBtn2.addEventListener('click',function(ev){
			ev.stopPropagation();
			var prevMsg=msg.previousElementSibling;
			var forkId='';
			while(prevMsg){
				if(prevMsg.classList.contains('u')){
					forkId=prevMsg.dataset.msgId||'';
					// Verify forkId exists in messages, if not try content match
					var allMsgs2=rMsgs._lastMsgs||[];
					var found2=false;
					for(var j=0;j<allMsgs2.length;j++){
						if(allMsgs2[j].id===forkId){found2=true;break}
					}
					if(!found2){
						var bb2=prevMsg.querySelector('.ocMbb');
						var domText2=bb2?(bb2.textContent||'').trim().substring(0,50):'';
						for(var j=0;j<allMsgs2.length;j++){
							if(allMsgs2[j].role==='user'){
								var apiContent2=(allMsgs2[j].content||'').trim().substring(0,50);
								if(domText2&&apiContent2&&domText2.indexOf(apiContent2)===0){forkId=allMsgs2[j].id;found2=true;break}
							}
						}
					}
					if(found2)break;
				}
				prevMsg=prevMsg.previousElementSibling;
			}
			if(!forkId){toast('Cannot fork: no user message found before this','warn');return}
			st('Forking...',true);
			api('fork',{message_id:forkId},function(e,r){
				if(!e&&r&&r.success){
					aC=r.conversation_id;
					updateURL(aC);
					toast('Forked to new session: '+(r.title||'Untitled'),'ok');
					st('Ready',true);
					loadSL();
					loadC(aC);
					if(r.forked_content){
						var inp=document.getElementById('ocIn');
						inp.value=r.forked_content;
						inp.focus();
					}
				}else{
					toast('Failed to fork: '+(e||(r&&r.error)||'Unknown error'),'err');
					st('Ready',true);
				}
			});
		});
		act.appendChild(forkBtn2);
	}
	var copyBtn=document.createElement('button');
	copyBtn.className='ocMsgActB';
	copyBtn.innerHTML='<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="9" y="9" width="13" height="13" rx="2" ry="2"/><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/></svg>';
	copyBtn.title='Copy';
	copyBtn.addEventListener('click',function(ev){
		ev.stopPropagation();
		var bb=msg.querySelector('.ocMbb');
		if(!bb)return;
		var txt=bb.innerText||bb.textContent;
		var ta=document.createElement('textarea');ta.value=txt;ta.style.cssText='position:fixed;left:-9999px';document.body.appendChild(ta);ta.select();
		try{document.execCommand('copy')}catch(e){}
		document.body.removeChild(ta);
		toast('Copied','ok');
	});
	act.appendChild(copyBtn);
	msg.appendChild(act);
});

// Message timestamps on hover
var _origRMsg=rMsg;
rMsg=function(m){
	var bb=_origRMsg(m);
	var msgEl=bb.closest('.ocMsg');
	if(msgEl&&m.time){
		var ts=document.createElement('span');
		ts.className='ocMsgTs';
		var dt=new Date(m.time*1000);
		ts.textContent=dt.toLocaleTimeString([],{hour:'2-digit',minute:'2-digit'});
		msgEl.appendChild(ts);
	}
	if(m.id)msgEl.dataset.msgId=m.id;
	return bb;
};

// Store last loaded messages for edit lookup
var _origRMsgs=rMsgs;
rMsgs=function(msgs){
	rMsgs._lastMsgs=msgs||[];
	_origRMsgs(msgs);
};

// Conversation loading spinner
var _origLoadC=loadC;
loadC=function(id){
	aC=id;
	updateURL(id);
	loadTodos();
	var ch=document.getElementById('ocCI');
	ch.innerHTML='<div class="ocLoad"><span class="ocLoadD"></span><span class="ocLoadD"></span><span class="ocLoadD"></span><span>Loading...</span></div>';
	var u=A+'&ai_php_api=conversation&csrf_token='+C+'&conversation_id='+encodeURIComponent(id);
	var x=new XMLHttpRequest();
	x.open('GET',u,true);
	x.setRequestHeader('Accept','application/json');
	x.onload=function(){
		if(x.status===200){
			try{
				var d=JSON.parse(x.responseText);
				rMsgs(d.messages||[]);
				hlS(id);
				if(!d.messages||!d.messages.length){aC=null;updateURL('')}
			}catch(e){
				var ch=document.getElementById('ocCI');
				if(ch)ch.innerHTML='<div style="padding:20px;color:var(--err)">Error loading conversation: '+esc(e.message||'unknown')+'</div>';
			}
		}
	};
	x.send();
};

// Auto-title after first AI response
var _origXhrOnload;
var origDoSendPatched=false;

// File tree search
var ftSearchEl=document.getElementById('ocFtSearch');
if(ftSearchEl){
	ftSearchEl.addEventListener('input',function(){
		var q=this.value.toLowerCase();
		var items=document.querySelectorAll('#ocFtL .ocFtI');
		items.forEach(function(it){
			var name=it.querySelector('.ocFtIn');
			if(!name)return;
			it.style.display=(!q||name.textContent.toLowerCase().indexOf(q)!==-1)?'':'none';
		});
	});
}

// Changes panel
var chgOpen=false;
document.getElementById('ocChgBtn').addEventListener('click',function(){
	chgOpen=!chgOpen;
	var panel=document.getElementById('ocChg');
	if(chgOpen){
		api('changes',null,function(e,d){
			if(e||!d){toast('Failed to load changes','err');return}
			var list=document.getElementById('ocChgL');
			list.innerHTML='';
			var snaps=d.snapshots||[];
			if(!snaps.length){
				list.innerHTML='<div style="padding:14px;color:var(--t3);font-size:12px;text-align:center">No changes yet</div>';
			}else{
				snaps.forEach(function(s){
					var item=document.createElement('div');
					item.className='ocChgI';
					var dt=new Date((s.time||0)*1000);
					var ts=dt.toLocaleDateString()===new Date().toLocaleDateString()
						?dt.toLocaleTimeString([],{hour:'2-digit',minute:'2-digit'})
						:dt.toLocaleDateString([],{month:'short',day:'numeric',hour:'2-digit',minute:'2-digit'});
				item.innerHTML='<span>'+esc(s.message||'Snapshot')+' <span style="color:var(--t3);font-size:10px">'+ts+'</span></span>'
					+'<div style="display:flex;gap:4px"><button class="ocChgBtn ocChgDiffBtn" data-id="'+esc(s.id||'')+'" data-msg="'+esc(s.message||'')+'">Diff</button><button class="ocChgBtn" data-id="'+esc(s.id||'')+'">Restore</button></div>';
				list.appendChild(item);
				});
				list.querySelectorAll('.ocChgBtn:not(.ocChgDiffBtn)').forEach(function(btn){
					btn.addEventListener('click',function(){
						if(confirm('Restore this snapshot?')){
							api('restore',{id:this.dataset.id},function(e,r){
								if(!e&&r&&r.restored)toast('Snapshot restored','ok');
								else toast('Failed to restore','err');
							});
						}
					});
				});
				list.querySelectorAll('.ocChgDiffBtn').forEach(function(btn){
					btn.addEventListener('click',function(){
						var snapId=this.dataset.id;
						var snapMsg=this.dataset.msg;
						api('diff',{id:snapId},function(e,r){
							if(!e&&r&&r.diff){
								var modal=document.getElementById('ocDiffMod');
								var body=document.getElementById('ocDiffBd');
								var toggleHtml='<div class="ocDiffToggle"><button class="ocDiffToggleBtn active" id="ocDiffUnifiedBtn">Unified</button><button class="ocDiffToggleBtn" id="ocDiffSplitBtn">Split</button></div>';
								var diffHtml='<pre style="font-size:12px;overflow-x:auto;padding:8px;background:var(--bgS);border-radius:var(--r);line-height:1.6">';
								var lines=r.diff.split('\n');
								lines.forEach(function(line,i){
									var cls='';
									if(line.substring(0,1)==='+')cls='color:var(--ok)';
									else if(line.substring(0,1)==='-')cls='color:var(--err)';
									else if(line.substring(0,2)==='@@')cls='color:var(--p);font-weight:600';
									diffHtml+='<div class="ocDiffHunkLine" data-line="'+(i+1)+'" style="'+cls+'">'+esc(line)+'</div>';
								});
								diffHtml+='</pre>';
								var splitHtml='<div id="ocDiffSplitView" style="display:none"><div class="ocDiffSplit"><div class="ocDiffSplitL"><div style="padding:4px 8px;font-size:11px;color:var(--t3);border-bottom:1px solid var(--bd2);font-weight:500">Original</div></div><div class="ocDiffSplitR"><div style="padding:4px 8px;font-size:11px;color:var(--t3);border-bottom:1px solid var(--bd2);font-weight:500">Modified</div></div></div></div>';
								body.innerHTML='<div style="margin-bottom:8px;font-size:13px;color:var(--t1);font-weight:500">'+esc(snapMsg||'Snapshot')+'</div>'+toggleHtml+'<div id="ocDiffUnifiedView">'+diffHtml+'</div>'+splitHtml;
								modal.classList.add('open');
								document.getElementById('ocDiffUnifiedBtn').addEventListener('click',function(){
									this.classList.add('active');document.getElementById('ocDiffSplitBtn').classList.remove('active');
									document.getElementById('ocDiffUnifiedView').style.display='block';
									document.getElementById('ocDiffSplitView').style.display='none';
								});
								document.getElementById('ocDiffSplitBtn').addEventListener('click',function(){
									this.classList.add('active');document.getElementById('ocDiffUnifiedBtn').classList.remove('active');
									document.getElementById('ocDiffUnifiedView').style.display='none';
									document.getElementById('ocDiffSplitView').style.display='block';
									renderSplitDiff(r.diff);
								});
								showDiffHunkNav(body,r.diff);
							}else{
								toast('Failed to load diff: '+(e||'Unknown'),'err');
							}
						});
					});
				});
			}
		});
	}
	panel.classList.toggle('open',chgOpen);
});
document.getElementById('ocChgC').addEventListener('click',function(){
	chgOpen=false;
	document.getElementById('ocChg').classList.remove('open');
});

// Auto-title generation after streaming - triggered in 'done' handler

// Command Palette
var cmdPaletteCommands=[
	{cmd:'New Session',key:'Ctrl+Shift+N',action:function(){newS()}},
	{cmd:'Plan Mode',key:'Ctrl+Shift+P',action:function(){document.getElementById('ocMode').value='plan';api('set_mode',{mode:'plan'},function(){toast('Plan mode','ok')})}},
	{cmd:'Build Mode',key:'',action:function(){document.getElementById('ocMode').value='build';api('set_mode',{mode:'build'},function(){toast('Build mode','ok')})}},
	{cmd:'Settings',key:'Ctrl+,',action:function(){document.getElementById('ocSetMod').classList.add('open');loadP()}},
	{cmd:'Toggle Files',key:'',action:function(){document.getElementById('ocFtBtn').click()}},
	{cmd:'Toggle Sidebar',key:'',action:function(){document.getElementById('ocTogSb').click()}},
	{cmd:'Toggle Theme',key:'',action:function(){document.getElementById('ocThBtn').click()}},
	{cmd:'Compact Conversation',key:'/compact',action:function(){
		st('Compacting...',true);
		api('compact',{keep_last_n:3},function(e,r){
			if(!e&&r&&r.success){rMsgs(r.messages||[]);toast('Compacted','ok');st('Ready',true)}
			else{toast('Failed','err');st('Ready',true)}
		});
	}},
	{cmd:'Clear Conversation',key:'/clear',action:function(){api('clear',{},function(){rMsgs([]);st('Cleared',true)})}},
	{cmd:'Export as Markdown',key:'/export',action:function(){exportChat()}},
	{cmd:'Undo Last Message',key:'/undo',action:function(){
		if(!rMsgs._lastMsgs||!rMsgs._lastMsgs.length){toast('Nothing to undo','warn');return}
		var lu=null;for(var i=rMsgs._lastMsgs.length-1;i>=0;i--){if(rMsgs._lastMsgs[i].role==='user'){lu=rMsgs._lastMsgs[i];break}}
		if(!lu||!lu.id){toast('Cannot undo','warn');return}
		api('undo',{message_id:lu.id},function(e,r){if(!e&&r&&r.success){rMsgs(r.messages||[]);toast('Undone','ok');st('Ready',true);loadSL()}else{toast('Failed','err');st('Ready',true)}});
	}},
	{cmd:'Fork Conversation',key:'/fork',action:function(){
		if(!rMsgs._lastMsgs||!rMsgs._lastMsgs.length){toast('Nothing to fork','warn');return}
		var lu=null;for(var i=rMsgs._lastMsgs.length-1;i>=0;i--){if(rMsgs._lastMsgs[i].role==='user'){lu=rMsgs._lastMsgs[i];break}}
		if(!lu||!lu.id){toast('Cannot fork','warn');return}
		api('fork',{message_id:lu.id},function(e,r){
			if(!e&&r&&r.success){
				aC=r.conversation_id;
				updateURL(aC);
				toast('Forked','ok');
				st('Ready',true);
				loadSL();
				loadC(aC);
				if(r.forked_content){
					var inp=document.getElementById('ocIn');
					inp.value=r.forked_content;
					inp.focus();
				}
			}else{toast('Failed','err');st('Ready',true)}
		});
	}},
	{cmd:'Rename Session',key:'/rename',action:function(){
		var t=prompt('Enter new session title:',curSessionTitle());
		if(t!==null&&t.trim()){api('rename_conversation',{conversation_id:aC,title:t.trim()},function(e,r){if(!e&&r&&r.success){toast('Renamed','ok');loadSL()}else{toast('Failed','err')}})}
	}},
	{cmd:'Help & FAQ',key:'',action:function(){document.getElementById('ocHlBtn').click()}}
];

// Command palette is handled by _origCmdCommands and renderCmdList below
document.getElementById('ocCmdP').addEventListener('click',function(e){if(e.target===this)this.classList.remove('open')});

// Model Favorites
var favModels=[];
function loadFavModels(){
	api('settings_load',null,function(e,d){
		if(!e&&d&&d.favorite_models){
			favModels=d.favorite_models;
			refreshModelFavs();
		}
	});
}
function refreshModelFavs(){
	if(_providersCache){
		renderModelSelect(_providersCache);
		renderModelDropdown(_providersCache);
		syncModelBtn();
		syncModelDropdownSelection();
	}
}
function toggleFavModel(modelId){
	var idx=favModels.indexOf(modelId);
	if(idx===-1){
		favModels.push(modelId);
		api('favorite_model',{model_id:modelId},function(){});
		toast('Added to favorites','ok');
	}else{
		favModels.splice(idx,1);
		api('unfavorite_model',{model_id:modelId},function(){});
		toast('Removed from favorites','info');
	}
}

// Permission System
var permConfig={};
var permResolve=null;
function askPermission(permType,detail){
	var permKey=permType;
	if(permConfig[permKey]==='allow_always')return Promise.resolve(true);
	if(permConfig[permKey]==='deny')return Promise.resolve(false);
	return new Promise(function(resolve){
		var mod=document.getElementById('ocPermMod');
		document.getElementById('ocPermTitle').textContent='Allow '+permType+'?';
		document.getElementById('ocPermSub').textContent=permType;
		var detailText='';
		if(typeof detail==='string')detailText=detail;
		else if(typeof detail==='object')detailText=JSON.stringify(detail,null,2);
		document.getElementById('ocPermDetail').textContent=detailText;
		var iconMap={write_file:'\uD83D\uDCDD',edit_file:'\u270F\uFE0F',bash:'\uD83D\uDCBB',php_eval:'\uD83D\uDCBB',file_download:'\u2B07\uFE0F'};
		document.getElementById('ocPermIcon').textContent=iconMap[permType]||'\uD83D\uDD12';
		mod.classList.add('open');
		var onOnce=function(){mod.classList.remove('open');cleanup();resolve(true)};
		var onAlways=function(){permConfig[permKey]='allow_always';mod.classList.remove('open');cleanup();resolve(true);api('toggle_permission',{permission:permKey,value:'allow_always'},function(){});}
		var onDeny=function(){mod.classList.remove('open');cleanup();resolve(false)};
		var cleanup=function(){
			document.getElementById('ocPermAllowOnce').removeEventListener('click',onOnce);
			document.getElementById('ocPermAllowAlways').removeEventListener('click',onAlways);
			document.getElementById('ocPermDeny').removeEventListener('click',onDeny);
		};
		document.getElementById('ocPermAllowOnce').addEventListener('click',onOnce);
		document.getElementById('ocPermAllowAlways').addEventListener('click',onAlways);
		document.getElementById('ocPermDeny').addEventListener('click',onDeny);
	});
}

// Session Rename (double-click sidebar item)
document.getElementById('ocSL').addEventListener('dblclick',function(e){
	var item=e.target.closest('.ocSi');
	if(!item||!item.dataset.id)return;
	var currentTitle=item.querySelector('.ocSiT');
	if(!currentTitle)return;
	var newTitle=prompt('Rename session:',currentTitle.textContent);
	if(newTitle!==null&&newTitle.trim()){
		api('rename_conversation',{conversation_id:item.dataset.id,title:newTitle.trim()},function(e,r){
			if(!e&&r&&r.success){
				currentTitle.textContent=newTitle.trim();
				toast('Renamed','ok');
			}else{
				toast('Failed to rename','err');
			}
		});
	}
});

// Load favorites on init
loadFavModels();

// Project Management
function loadProjects(force){
	if(_projectsCache&&!force){
		projects=_projectsCache.projects||[];
		wordpressInstalls=_projectsCache.wordpress||[];
		renderProjectList('');
		if(typeof loadSidebarProjects==='function') loadSidebarProjects();
		renderWpInstalls(_projectsCache.wordpress||[]);
		return;
	}
	api('projects_list',null,function(e,d){
		if(e||!d)return;
		projects=d;
		_projectsCache=_projectsCache||{};
		_projectsCache.projects=d;
		renderProjectList('');
		if(typeof loadSidebarProjects==='function') loadSidebarProjects();
	});
	api('projects_wordpress',null,function(e,d){
		if(e||!d)return;
		wordpressInstalls=d;
		_projectsCache=_projectsCache||{};
		_projectsCache.wordpress=d;
		renderWpInstalls(d);
	});
}
function renderWpInstalls(d){
		var sel=document.getElementById('ocProjWpSel');
		if(sel){
			sel.innerHTML='<option value="">Select installation...</option>';
			d.forEach(function(w){
				var o=document.createElement('option');
				o.value=w.insid;
				o.textContent=w.name+' - '+w.path;
				sel.appendChild(o);
			});
		}
}

function switchToProject(projectId){
	var u=new URL(window.location);
	u.searchParams.set('project_id',projectId);
	u.searchParams.delete('insid');
	u.searchParams.delete('path');
	u.searchParams.delete('session');
	window.location.href=u.toString();
}

function openProjectModal(){
	document.getElementById('ocProjMod').classList.add('open');
	document.getElementById('ocProjSearch').value='';
	document.getElementById('ocProjNewForm').style.display='none';
	loadProjects();
}

function closeProjectModal(){
	document.getElementById('ocProjMod').classList.remove('open');
}

document.getElementById('ocProjBtn').addEventListener('click',openProjectModal);
document.getElementById('ocProjC').addEventListener('click',closeProjectModal);
document.getElementById('ocProjMod').addEventListener('click',function(e){
	if(e.target===this)closeProjectModal();
});

// Help FAQ Popup
var faqs=[
{q:'What is the AI Assistant?',a:'The AI Assistant is a coding companion integrated into Softaculous that helps you write, debug, refactor, and understand code in your projects. It can read and write files, run shell commands, and search your codebase.'},
{q:'How do I get started?',a:'1. Create a project by clicking "Projects" then "+ New Project". You can select an existing WordPress installation or enter a custom directory path.\n2. Choose an AI model from the dropdown in the header (you need to connect a provider in Settings first).\n3. Type your request in the chat input and press Enter.\n4. The AI will respond and can perform actions like editing files or running commands.'},
{q:'What are Build and Plan modes?',a:'Build Mode: The AI has full access to read, write, edit files and run commands. Use this when you want the AI to make changes.\nPlan Mode: The AI operates in read-only mode - it can explore and analyze your code but cannot modify anything. Use this for code reviews, explanations, and planning changes before implementing them.'},
{q:'How do I connect an AI provider?',a:'1. Click the Settings button in the header.\n2. Find the provider you want to use and click "Connect".\n3. Enter your API key and click "Connect".\n4. You can use the "Test" button to verify your connection works.\n\nFree models are available through "OpenCode Zen (Free)" which requires no API key.'},
{q:'What AI providers are supported?',a:'OpenAI (GPT-4o, GPT-5), Anthropic (Claude), Google (Gemini), DeepSeek, Groq, Together AI, OpenRouter, Ollama (local), MiniMax, and custom OpenAI-compatible providers.'},
{q:'How do projects work?',a:'A project is linked to a directory on your server. The AI Assistant works within that project directory. Each project has its own chat sessions, conversation history, and file tree. You can switch between projects using the dropdown in the header, next to the sidebar toggle button.'},
{q:'How do sessions work?',a:'Each project can have multiple chat sessions. Click "+ New Session" to start a fresh conversation. Previous sessions are listed in the sidebar and can be clicked to resume. You can delete sessions with the \u00d7 button, and rename them by double-clicking.'},
{q:'What can the AI do?',a:'Read and write files, edit existing files with targeted changes, search files by name or content, run shell commands, create directory listings, and more. In Build mode it can make all these changes. In Plan mode it can only read and search.'},
{q:'How do I edit and resend a message?',a:'Hover over any user message and click the pencil icon. Edit the text inline and click "Send". The edited message will be sent as a new prompt without deleting any existing messages.'},
{q:'How do I use the command palette?',a:'Press Ctrl+K to open the command palette. Type to search for commands like "New Session", "Plan Mode", "Compact", "Undo", "Fork", "Settings", etc. Use arrow keys to navigate and Enter to execute.'},
{q:'What is conversation compaction?',a:'When your conversation gets long, use /compact to summarize the earlier parts and reduce token usage. This keeps the most recent messages intact while compressing the history. This helps stay within the model\'s context window.'},
{q:'How do I undo a message?',a:'Type /undo or use Ctrl+K \u2192 "Undo Last Message" to remove the last user message and all responses after it. This is useful when you want to rephrase your question.'},
{q:'How do I fork a conversation?',a:'Type /fork or use Ctrl+K \u2192 "Fork Conversation" to create a new session from the current point. The forked session will contain all messages up to your last user message, allowing you to explore a different direction.'},
{q:'What are the keyboard shortcuts?',a:'All shortcuts can be customized via Settings \u2192 Keybindings. Defaults:\nEscape: Stop streaming / Close modals\nEnter: Send message (Shift+Enter for new line)\nAlt+Shift+N: New session\nAlt+Shift+P: Plan mode\nAlt+Shift+S: Settings\nCtrl+K: Command palette\nAlt+Shift+L: Toggle sidebar\nAlt+Shift+F: Toggle file tree\nAlt+Shift+T: Toggle tasks panel\nAlt+Shift+M: Toggle modified files\nAlt+1\u20269: Switch to session 1\u20139\nUp (at start of input): Previous prompt in history\nDown (at end of input): Next prompt in history\nShell mode: Type !command to run shell commands\nQuestion mode: AI can ask you questions with selectable options'},
{q:'What are slash commands?',a:'Type / in the chat input to see available commands:\n/build - Switch to Build mode\n/plan - Switch to Plan mode\n/clear - Clear current conversation\n/compact - Summarize conversation to reduce context\n/undo - Undo last message pair\n/fork - Fork conversation from last message\n/rename - Rename this session\n/export - Download conversation as Markdown\n/todo <text> - Add a task item\n/sound - Toggle sound notifications\n/notify - Toggle desktop notifications\n/keybindings - Customize keyboard shortcuts\n/help - Show keyboard shortcuts\n\nShell mode: Type ! at the start to execute a shell command.\nExample: !ls -la or !git status\n\nYou can also type @build or @plan in your message to switch modes inline.'}
];
document.getElementById('ocHlBtn').addEventListener('click',function(){
	var bd=document.getElementById('ocHelpBd');
	bd.innerHTML='';
	var helpLabels={
		stop:'Stop streaming / Close modals',send:'Send message',newline:'New line',
		new_session:'New session',plan_mode:'Plan mode',build_mode:'Build mode',
		settings:'Settings',command_palette:'Command palette',toggle_sidebar:'Toggle sidebar',
		toggle_files:'Toggle file tree',toggle_todos:'Toggle tasks',
		toggle_modified:'Toggle modified files',keybindings:'Customize keybindings',
		sound:'Sound notifications',notifications:'Desktop notifications',
		clear:'Clear conversation',compact:'Compact conversation',
		export:'Export as Markdown',copy:'Copy transcript',help:'Help & FAQ',
		prev_prompt:'Previous prompt',next_prompt:'Next prompt'
	};
	var tbl=document.createElement('table');
	tbl.className='ocSCT';
	var rows='';
	Object.keys(_defaultKeybindings).forEach(function(k){
		var kb=getKeybinding(k);
		if(!kb||!helpLabels[k])return;
		rows+='<tr><td><kbd>'+esc(kb)+'</kbd></td><td>'+helpLabels[k]+'</td></tr>';
	});
	rows+='<tr><td><kbd>Alt+1\u20269</kbd></td><td>Switch to session</td></tr>';
	rows+='<tr><td><kbd>!</kbd></td><td>Shell mode prefix</td></tr>';
	tbl.innerHTML='<thead><tr><th>Shortcut</th><th>Action</th></tr></thead><tbody>'+rows+'</tbody>';
	bd.appendChild(tbl);
	var sep=document.createElement('div');
	sep.style.cssText='border-top:1px solid var(--bd2);margin:16px 0';
	bd.appendChild(sep);
	faqs.forEach(function(f){
		var item=document.createElement('div');
		item.className='ocFaqI';
		item.innerHTML='<div class="ocFaqQ">'+esc(f.q)+'</div><div class="ocFaqA">'+md(f.a)+'</div>';
		item.querySelector('.ocFaqQ').addEventListener('click',function(){
			var wasOpen=item.classList.contains('open');
			bd.querySelectorAll('.ocFaqI.open').forEach(function(el){el.classList.remove('open')});
			if(!wasOpen) item.classList.add('open');
		});
		bd.appendChild(item);
	});
	document.getElementById('ocHelpMod').classList.add('open');
});
document.getElementById('ocHelpC').addEventListener('click',function(){
	document.getElementById('ocHelpMod').classList.remove('open');
});
document.getElementById('ocHelpMod').addEventListener('click',function(e){
	if(e.target===this)this.classList.remove('open');
});
document.getElementById('ocProjSearch').addEventListener('input',function(){
	renderProjectList(this.value);
});
document.getElementById('ocProjNewBtn').addEventListener('click',function(){
	document.getElementById('ocProjNewForm').style.display='block';
	document.getElementById('ocProjName').value='';
	document.getElementById('ocProjPath').value='';
	document.getElementById('ocProjWpSel').value='';
	if(wordpressInstalls&&wordpressInstalls.length){
		document.getElementById('ocProjWpSection').style.display='block';
	}else{
		document.getElementById('ocProjWpSection').style.display='none';
	}
});
document.getElementById('ocProjCan').addEventListener('click',function(){
	document.getElementById('ocProjNewForm').style.display='none';
});
document.getElementById('ocProjWpSel').addEventListener('change',function(){
	if(this.value){
		var wp=wordpressInstalls.find(function(w){return w.insid===this.value},this);
		if(wp){
			var relPath=wp.path;
			if(relPath.indexOf(HD)===0 && HD.length>0) relPath=relPath.substring(HD.length+1);
			document.getElementById('ocProjPath').value=relPath;
			if(!document.getElementById('ocProjName').value){
				document.getElementById('ocProjName').value=wp.name;
			}
		}
	}
});
document.getElementById('ocProjCre').addEventListener('click',function(){
	var name=document.getElementById('ocProjName').value.trim();
	var path=document.getElementById('ocProjPath').value.trim();
	var insid=document.getElementById('ocProjWpSel').value;
	var fullPath=path;
	if(path.indexOf('/')!==0){
		fullPath=HD+'/'+path;
	}
	var type='custom';
	if(insid){
		type='wordpress';
	}
	api('projects_create',{name:name,path:fullPath,type:type,insid:insid},function(e,r){
		if(!e&&r&&!r.error){
			closeProjectModal();
			if(r.project_id){
				switchToProject(r.project_id);
			}else{
				toast('Project created but failed to switch','warn');
				loadProjects(true);
			}
		}else{
			toast('Failed to create project: '+(r&&r.error||e),'err');
		}
	});
});

// If no softpath, auto-open project modal
if(!SP){
	setTimeout(openProjectModal,500);
}

// ========== Model Variants (Reasoning Effort) ==========
var modelVariants={
	'anthropic/claude-sonnet-4-20250514':[{id:'default',label:'Default'},{id:'low',label:'Low'},{id:'medium',label:'Medium'},{id:'high',label:'High'}],
	'anthropic/claude-opus-4-20250514':[{id:'default',label:'Default'},{id:'low',label:'Low'},{id:'medium',label:'Medium'},{id:'high',label:'High'}],
	'anthropic/claude-3-5-sonnet-20241022':[{id:'default',label:'Default'},{id:'low',label:'Low'},{id:'medium',label:'Medium'},{id:'high',label:'High'}],
	'openai/gpt-4o':[{id:'default',label:'Default'},{id:'low',label:'Low'},{id:'medium',label:'Medium'},{id:'high',label:'High'}],
	'openai/gpt-4o-mini':[{id:'default',label:'Default'},{id:'low',label:'Low'},{id:'medium',label:'Medium'},{id:'high',label:'High'}],
	'openai/gpt-4-turbo':[{id:'default',label:'Default'},{id:'low',label:'Low'},{id:'medium',label:'Medium'},{id:'high',label:'High'}],
	'google/gemini-2.5-pro':[{id:'default',label:'Default'},{id:'low',label:'Low'},{id:'medium',label:'Medium'},{id:'high',label:'High'}],
	'google/gemini-2.5-flash':[{id:'default',label:'Default'},{id:'low',label:'Low'},{id:'medium',label:'Medium'},{id:'high',label:'High'}],
	'deepseek/deepseek-chat':[{id:'default',label:'Default'},{id:'low',label:'Low'},{id:'medium',label:'Medium'},{id:'high',label:'High'}],
	'opencode_zen/deepseek-v4-flash-free':[{id:'default',label:'Default'},{id:'low',label:'Low'},{id:'medium',label:'Medium'},{id:'high',label:'High'}],
	'opencode_zen/mimo-v2.5-free':[{id:'default',label:'Default'},{id:'low',label:'Low'},{id:'medium',label:'Medium'},{id:'high',label:'High'}],
	'opencode_zen/minimax-m3-free':[{id:'default',label:'Default'},{id:'low',label:'Low'},{id:'medium',label:'Medium'},{id:'high',label:'High'}],
	'opencode_zen/nemotron-3-ultra-free':[{id:'default',label:'Default'},{id:'low',label:'Low'},{id:'medium',label:'Medium'},{id:'high',label:'High'}],
	'opencode_zen/north-mini-code-free':[{id:'default',label:'Default'},{id:'low',label:'Low'},{id:'medium',label:'Medium'},{id:'high',label:'High'}],
	'opencode_zen/qwen3.6-plus-free':[{id:'default',label:'Default'},{id:'low',label:'Low'},{id:'medium',label:'Medium'},{id:'high',label:'High'}],
	'ollama/llama3':[{id:'default',label:'Default'},{id:'low',label:'Low'},{id:'medium',label:'Medium'},{id:'high',label:'High'}],
	'ollama/codellama':[{id:'default',label:'Default'},{id:'low',label:'Low'},{id:'medium',label:'Medium'},{id:'high',label:'High'}],
	'ollama/mistral':[{id:'default',label:'Default'},{id:'low',label:'Low'},{id:'medium',label:'Medium'},{id:'high',label:'High'}]
};
var currentVariant={};

function updateVariantBadge(){
	var badge=document.getElementById('ocVariantBadge');
	var mv=document.getElementById('ocModel').value;
	var variants=getVariantsForModel(mv);
	if(!variants||variants.length<=1){
		badge.style.display='none';
		return;
	}
	badge.style.display='inline-flex';
	var v=currentVariant[mv]||'default';
	var label=v==='default'?'Default':v.charAt(0).toUpperCase()+v.slice(1);
	badge.textContent=label;
	badge.className='ocVariantBadge'+(v!=='default'?' active':'');
}

document.addEventListener('click',function(e){
	var drop=document.getElementById('ocVariantDrop');
	if(drop&&!drop.contains(e.target)&&e.target.id!=='ocVariantBadge'){
		drop.classList.remove('open');
	}
});

document.getElementById('ocModel').addEventListener('change',function(){
	updateVariantBadge();
});

// Ctrl+Shift+V to cycle variants
document.addEventListener('keydown',function(e){
	if((e.ctrlKey||e.metaKey)&&e.shiftKey&&e.key==='V'){
		var mv=document.getElementById('ocModel').value;
		var variants=getVariantsForModel(mv);
		if(!variants||variants.length<=1)return;
		e.preventDefault();
		var current=currentVariant[mv]||'default';
		var idx=variants.findIndex(function(v){return v.id===current});
		var next=variants[(idx+1)%variants.length];
		currentVariant[mv]=next.id;
		updateVariantBadge();
		toast('Reasoning: '+next.label,'ok');
	}
});

updateVariantBadge();

// ========== Reasoning Toggle (Show/Collapse/Hide all) ==========
var reasonToggleState=localStorage.getItem('ocReasonToggle')||'show';
var reasonToggleBtn=document.getElementById('ocReasonToggle');

reasonToggleBtn.addEventListener('click',function(){
	var next={show:'collapse',collapse:'hide',hide:'show'};
	reasonToggleState=next[reasonToggleState]||'show';
	localStorage.setItem('ocReasonToggle',reasonToggleState);
	updateReasonToggle();
});

var origRDE=window.onReasonDeltaEnd||null;

// Observe new reasoning blocks added to DOM
var reasonObserver=new MutationObserver(function(mutations){
	var needUpdate=false;
	mutations.forEach(function(m){
		m.addedNodes.forEach(function(n){
			if(n.nodeType===1){
				if(n.classList&&n.classList.contains('ocReason')){
					needUpdate=true;
				}else if(n.querySelectorAll&&n.querySelectorAll('.ocReason').length){
					needUpdate=true;
				}
			}
		});
	});
	if(needUpdate)updateReasonToggle();
});
reasonObserver.observe(document.getElementById('ocCI')||document.body,{childList:true,subtree:true});

updateReasonToggle();

// ========== @-Mention Mode Selection ==========
var atItems=[
	{id:'build',label:'@build',desc:'Build mode (full access)',icon:'\uD83D\uDEE0\uFE0F'},
	{id:'plan',label:'@plan',desc:'Plan mode (read-only)',icon:'\uD83D\uDCD6'}
];
var atEl=document.getElementById('ocAt');
var atActive=false;
var atIdx=-1;
var atStart=-1;

function hideAt(){
	atEl.classList.remove('open');
	atActive=false;
	atIdx=-1;
	atStart=-1;
}

document.getElementById('ocIn').addEventListener('blur',function(){
	setTimeout(hideAt,150);
});

// Shell Mode is handled directly in send() function above

// ===== FEATURE: Enhanced Sound Notifications =====
function _playSound(type){
	if(!_soundEnabled)return;
	try{
		if(!_audioCtx)_audioCtx=new(window.AudioContext||window.webkitAudioContext)();
		if(_audioCtx.state==='suspended')_audioCtx.resume();
		var t=_audioCtx.currentTime;
		function _note(freq,start,dur,vol){
			var o=_audioCtx.createOscillator(),g=_audioCtx.createGain();
			o.type='sine';o.frequency.value=freq;
			o.connect(g);g.connect(_audioCtx.destination);
			g.gain.setValueAtTime(0,t+start);
			g.gain.linearRampToValueAtTime(vol,t+start+0.015);
			g.gain.setValueAtTime(vol,t+start+dur*0.15);
			g.gain.exponentialRampToValueAtTime(0.001,t+start+dur);
			o.start(t+start);o.stop(t+start+dur+0.01);
		}
		if(type==='complete'){_note(880,0,0.12,0.2);_note(660,0.1,0.15,0.16)}
		else if(type==='error'){_note(330,0,0.2,0.25);_note(220,0.15,0.25,0.2)}
		else if(type==='question'){_note(523,0,0.1,0.15);_note(659,0.08,0.1,0.15);_note(784,0.16,0.12,0.15)}
	}catch(e){}
}

// ===== FEATURE: Desktop Notifications =====
function _desktopNotify(title,body,icon){
	if(!_desktopNotifEnabled)return;
	if(typeof Notification==='undefined')return;
	if(Notification.permission!=='granted')return;
	try{
		var n=new Notification(title,{body:body,icon:icon||'',tag:'ai-chat-'+Date.now()});
		n.onclick=function(){window.focus();n.close()};
	}catch(e){}
}
if(typeof Notification!=='undefined'&&Notification.permission==='default'){
	Notification.requestPermission();
}

// ===== FEATURE: Permission Prompt Wiring =====
var _permCb=null;
function showPermPrompt(title,sub,detail,toolName){
	return new Promise(function(resolve){
		document.getElementById('ocPermTitle').textContent=title||'Permission Required';
		document.getElementById('ocPermSub').textContent=sub||toolName||'';
		document.getElementById('ocPermDetail').textContent=detail||'';
		document.getElementById('ocPermIcon').textContent=toolName==='bash'?'\u{1F4BB}':'\u{1F512}';
		document.getElementById('ocPermMod').classList.add('open');
		_permCb=resolve;
	});
}
document.getElementById('ocPermDeny').addEventListener('click',function(){
	document.getElementById('ocPermMod').classList.remove('open');
	if(_permCb)_permCb('deny');_permCb=null;
});
document.getElementById('ocPermAllowOnce').addEventListener('click',function(){
	document.getElementById('ocPermMod').classList.remove('open');
	if(_permCb)_permCb('allow_once');_permCb=null;
});
document.getElementById('ocPermAllowAlways').addEventListener('click',function(){
	document.getElementById('ocPermMod').classList.remove('open');
	api('toggle_permission',{permission:document.getElementById('ocPermSub').textContent,value:'allow_always'},function(){});
	if(_permCb)_permCb('allow_always');_permCb=null;
});
document.getElementById('ocPermMod').addEventListener('click',function(e){
	if(e.target===this){this.classList.remove('open');if(_permCb)_permCb('deny');_permCb=null}
});

// ===== FEATURE: Multi-step Question/Prompt Flow =====
function showQuestion(qData){
	return new Promise(function(resolve){
		var chat=document.getElementById('ocCI');
		var el=document.createElement('div');
		el.className='ocMsg a';
		var optionsHtml='';
		if(qData.options&&qData.options.length){
			optionsHtml='<div class="ocQOptions">';
			qData.options.forEach(function(opt,i){
				var multi=qData.multiple?'data-multi="1"':'';
				optionsHtml+='<div class="ocQOpt" data-idx="'+i+'" '+multi+'>'+esc(opt.label||opt)+'</div>';
			});
			optionsHtml+='</div>';
		}
		var customHtml='';
		if(qData.custom!==false){
			customHtml='<div class="ocQCustom"><input type="text" id="ocQCustomIn" placeholder="'+(qData.customPlaceholder||'Type your answer...')+'"><button class="ocB ocBP ocBs" id="ocQCustomBtn">Submit</button></div>';
		}
		el.innerHTML='<div class="ocAv" style="background:var(--p);color:#fff"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"/><line x1="12" y1="17" x2="12.01" y2="17"/></svg></div>'
			+'<div class="ocMb"><div class="ocQuestion"><div class="ocQHeader"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"/><line x1="12" y1="17" x2="12.01" y2="17"/></svg>Question</div><div class="ocQBody"><div class="ocQText">'+(qData.question||qData.header||'')+'</div>'+optionsHtml+customHtml+'</div></div></div>';
		chat.appendChild(el);
		document.getElementById('ocChat').scrollTop=1e9;
		_playSound('question');
		_desktopNotify('AI Question','The AI is asking you a question');
		var selected=[];
		el.querySelectorAll('.ocQOpt').forEach(function(opt){
			opt.addEventListener('click',function(){
				if(qData.multiple){
					this.classList.toggle('sel');
					selected=Array.from(el.querySelectorAll('.ocQOpt.sel')).map(function(o){return qData.options[parseInt(o.dataset.idx)]});
				}else{
					el.querySelectorAll('.ocQOpt').forEach(function(o){o.classList.remove('sel')});
					this.classList.add('sel');
					selected=[qData.options[parseInt(this.dataset.idx)]];
				}
			});
		});
		function submitAnswer(){
			var customIn=document.getElementById('ocQCustomIn');
			var customVal=customIn?customIn.value.trim():'';
			if(selected.length){
				resolve({answer:selected.map(function(s){return s.value||s.label||s}),type:'option'});
			}else if(customVal){
				resolve({answer:customVal,type:'custom'});
			}
			var btns=el.querySelectorAll('.ocQOpt');
			btns.forEach(function(b){b.style.pointerEvents='none';b.style.opacity='0.6'});
			var customArea=el.querySelector('.ocQCustom');
			if(customArea)customArea.style.display='none';
		}
		if(qData.options&&qData.options.length){
			el.querySelectorAll('.ocQOpt').forEach(function(opt){
				if(!qData.multiple){
					opt.addEventListener('click',function(){setTimeout(submitAnswer,150)});
				}
			});
		}
		var customBtn=document.getElementById('ocQCustomBtn');
		if(customBtn)customBtn.addEventListener('click',submitAnswer);
		var customInEl=document.getElementById('ocQCustomIn');
		if(customInEl)customInEl.addEventListener('keydown',function(e){if(e.key==='Enter')submitAnswer()});
	});
}

// ===== FEATURE: Todo List Panel =====
document.getElementById('ocTodoBtn').addEventListener('click',function(){
	var p=document.getElementById('ocTodoP');
	p.classList.toggle('open');
	if(p.classList.contains('open'))renderTodos();
});
document.getElementById('ocTodoC').addEventListener('click',function(){
	document.getElementById('ocTodoP').classList.remove('open');
});

function addTodo(text,priority,status){
	_todoItems.push({text:text,priority:priority||'medium',status:status||'pending',id:Date.now()+Math.random()});
	saveTodos();
	renderTodos();
}

function saveTodos(){
	try{localStorage.setItem('oc_todos_'+aC,JSON.stringify(_todoItems))}catch(e){}
}

function loadTodos(){
	try{
		var saved=localStorage.getItem('oc_todos_'+aC);
		if(saved){_todoItems=JSON.parse(saved);renderTodos()}
	}catch(e){}
}

// ===== FEATURE: Modified Files Panel =====
document.getElementById('ocModBtn').addEventListener('click',function(){
	var p=document.getElementById('ocFilesP');
	p.classList.toggle('open');
	if(p.classList.contains('open'))loadModifiedFiles();
});
document.getElementById('ocFilesC').addEventListener('click',function(){
	document.getElementById('ocFilesP').classList.remove('open');
});

function loadModifiedFiles(){
	// Render in-session tracked files (in-memory tracking only)
	renderModifiedFiles();
}

// ===== FEATURE: Configurable Keybindings =====
var _defaultKeybindings={
	new_session:'Alt+Shift+N',
	plan_mode:'Alt+Shift+P',
	build_mode:'Alt+Shift+B',
	settings:'Alt+Shift+S',
	command_palette:'Ctrl+K',
	toggle_sidebar:'Alt+Shift+L',
	toggle_files:'Alt+Shift+F',
	toggle_todos:'Alt+Shift+T',
	toggle_modified:'Alt+Shift+M',
	keybindings:'Alt+Shift+K',
	sound:'Alt+Shift+O',
	notifications:'Alt+Shift+D',
	clear:'Alt+Shift+X',
	compact:'Alt+Shift+C',
	export:'Alt+Shift+E',
	copy:'Alt+Shift+Y',
	help:'Alt+Shift+H',
	stop:'Escape',
	send:'Enter',
	newline:'Shift+Enter',
	prev_prompt:'Up',
	next_prompt:'Down'
};
// Migrate old keys to new defaults if user hasn't customized
(function(){var saved=localStorage.getItem('oc_keybindings');if(saved){try{var s=JSON.parse(saved);var olds=Object.keys(s).sort().join(',');var defs=Object.keys(_defaultKeybindings).sort().join(',');if(olds!==defs){localStorage.removeItem('oc_keybindings')}}catch(e){localStorage.removeItem('oc_keybindings')}}})();
_keybindings=JSON.parse(localStorage.getItem('oc_keybindings')||'null')||Object.assign({},_defaultKeybindings);

document.getElementById('ocKbC').addEventListener('click',function(){
	document.getElementById('ocKbMod').classList.remove('open');
});
document.getElementById('ocKbMod').addEventListener('click',function(e){
	if(e.target===this)this.classList.remove('open');
});

// ===== FEATURE: Subagent/Task System =====
function launchTask(taskDesc,taskType){
	var chat=document.getElementById('ocCI');
	var el=document.createElement('div');
	el.className='ocMsg a';
	var taskId=Date.now();
	el.innerHTML='<div class="ocAv" style="background:var(--s);color:#fff"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="23 6 13.5 15.5 8.5 10.5 1 18"/><polyline points="17 6 23 6 23 12"/></svg></div>'
		+'<div class="ocMb"><div class="ocTaskP"><div class="ocTaskPH"><span class="ocTaskSt running"></span><span class="ocTaskNm">'+esc(taskDesc.substring(0,80))+'</span><span style="color:var(--p);font-size:10px"><span class="ocTaskSpin"></span>Running</span></div><div class="ocTaskR" id="ocTask_'+taskId+'"></div></div></div>';
	chat.appendChild(el);
	document.getElementById('ocChat').scrollTop=1e9;
	return taskId;
}

function completeTask(taskId,result,isErr){
	var el=document.getElementById('ocTask_'+taskId);
	if(!el)return;
	var parent=el.closest('.ocTaskP');
	parent.classList.add('open');
	var statusSpan=parent.querySelector('span:last-child');
	var statusDot=parent.querySelector('.ocTaskSt');
	statusDot.classList.remove('running');
	statusDot.classList.add(isErr?'err':'done');
	statusSpan.innerHTML=isErr?'<span style="color:var(--err)">Error</span>':'<span style="color:var(--ok)">Done</span>';
	el.textContent=result||'Completed';
}

// ===== FEATURE: Plugin System =====
var _plugins=[];
function registerPlugin(plugin){
	if(!plugin||!plugin.id)return;
	_plugins.push(plugin);
	if(plugin.onRegister)plugin.onRegister();
}

// Hook: add slash command for shell mode
var _origSlashCmds=true;
(function(){
	var origSend=send;
})();

// ===== Enhanced event: extract todos and modified files from stream =====
var _origRMsg2=rMsg;
rMsg=function(msg){
	var el=_origRMsg2(msg);
	if(msg.role==='asst'&&msg.content){
		var content=msg.content;
		var todoMatches=content.match(/(?:^|\n)\s*[-*]\s+(.{2,})/g);
		if(todoMatches&&todoMatches.length>0){
			todoMatches.forEach(function(t){
				var text=t.replace(/^\s*[-*]\s+/,'').trim();
				if(text.length>3&&text.length<200&&!_todoItems.find(function(x){return x.text===text})){
					addTodo(text,'medium','pending');
				}
			});
		}
	}
	return el;
};

// ===== Wire up Keybindings button (in settings) =====
document.getElementById('ocSetBtn').addEventListener('click',function(){
	document.getElementById('ocSetMod').classList.add('open');
	loadP();
});

// Add keybindings section to settings
var _origLoadP=loadP;
loadP=function(){
	_origLoadP();
	var bd=document.querySelector('#ocSetMod .ocMoBd');
	if(bd&&!document.getElementById('ocKbSection')){
		var sec=document.createElement('div');
		sec.id='ocKbSection';
		sec.style.cssText='margin-top:16px;padding-top:16px;border-top:1px solid var(--bd3)';
		sec.innerHTML='<div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:8px"><span style="font-weight:500;font-size:14px">Keybindings</span><button class="ocB ocBs" id="ocKbBtn">Customize</button></div><div style="font-size:12px;color:var(--t3)">Press keys to perform actions quickly</div>';
		bd.appendChild(sec);
		document.getElementById('ocKbBtn').addEventListener('click',function(){
			document.getElementById('ocSetMod').classList.remove('open');
			renderKeybindings();
			document.getElementById('ocKbMod').classList.add('open');
		});
	}
};

// ===== Hook: Track modified files from tool calls =====
var _origStreamOnProgress=null;
(function(){
	var origXHROpen=XMLHttpRequest.prototype.open;
	XMLHttpRequest.prototype.open=function(method,url){
		this._isAIStream=url&&url.indexOf('ai_chat_stream=1')!==-1;
		return origXHROpen.apply(this,arguments);
	};
})();

// ===== Enhanced slash commands =====
var _origSendHandler=document.getElementById('ocSend').onclick;
var _slashCommands={
	shell:{desc:'Execute a shell command (prefix: !)',action:null},
	todo:{desc:'Add a task item',action:function(args){
		if(!args)return toast('Usage: /todo <task text>','warn');
		addTodo(args,'medium','pending');
		toast('Task added','ok');
	}},
	keybindings:{desc:'Customize keyboard shortcuts',action:function(){
		renderKeybindings();
		document.getElementById('ocKbMod').classList.add('open');
	}},
	sound:{desc:'Toggle sound notifications (on/off)',action:function(){
		_soundEnabled=!_soundEnabled;
		toast('Sound notifications: '+(_soundEnabled?'ON':'OFF'),'ok');
		localStorage.setItem('oc_sound_enabled',_soundEnabled?'1':'0');
	}},
	notify:{desc:'Toggle desktop notifications',action:function(){
		if(typeof Notification==='undefined'){toast('Notifications not supported','warn');return}
		if(Notification.permission==='granted'){
			_desktopNotifEnabled=!_desktopNotifEnabled;
			toast('Desktop notifications: '+(_desktopNotifEnabled?'ON':'OFF'),'ok');
		}else if(Notification.permission==='default'){
			Notification.requestPermission(function(p){
				if(p==='granted'){_desktopNotifEnabled=true;toast('Notifications enabled','ok')}
				else toast('Notification permission denied','warn');
			});
		}else{
			toast('Notifications blocked in browser settings','warn');
		}
	}}
};

// Load sound preference
_soundEnabled=localStorage.getItem('oc_sound_enabled')!=='0';
_desktopNotifEnabled=typeof Notification!=='undefined'&&Notification.permission==='granted';

// ===== Enhanced sound on stream complete =====
var _origDoneHandler=null;

// ===== Track modified files from stream =====

// ===== Update slash hints with new commands =====
var _origSlashItems=[
	{cmd:'/build',desc:'Switch to Build mode'},
	{cmd:'/plan',desc:'Switch to Plan mode'},
	{cmd:'/clear',desc:'Clear conversation'},
	{cmd:'/compact',desc:'Summarize to reduce context'},
	{cmd:'/undo',desc:'Undo last message pair'},
	{cmd:'/redo',desc:'Redo last undone message'},
	{cmd:'/fork',desc:'Fork conversation'},
	{cmd:'/rename',desc:'Rename this session'},
	{cmd:'/export',desc:'Download as Markdown'},
	{cmd:'/copy',desc:'Copy transcript to clipboard'},
	{cmd:'/help',desc:'Show keyboard shortcuts'},
	{cmd:'/todo <text>',desc:'Add a task item'},
	{cmd:'/sound',desc:'Toggle sound notifications'},
	{cmd:'/notify',desc:'Toggle desktop notifications'},
	{cmd:'/keybindings',desc:'Customize shortcuts'},
	{cmd:'/timeline',desc:'Toggle message timeline'}
];
// Replace the built-in slash command list
var _origShowSlashHint=null;

// Override command palette commands to include new features
var _origCmdCommands=[
	{kb:'new_session',cmd:'New Session',desc:'Start a new conversation',action:function(){newS()}},
	{kb:'plan_mode',cmd:'Plan Mode',desc:'Switch to read-only plan mode',action:function(){document.getElementById('ocMode').value='plan';api('set_mode',{mode:'plan'},function(){})}},
	{kb:'build_mode',cmd:'Build Mode',desc:'Switch to build mode (read+write)',action:function(){document.getElementById('ocMode').value='build';api('set_mode',{mode:'build'},function(){})}},
	{kb:'toggle_sidebar',cmd:'Toggle Sidebar',desc:'Show/hide session history',action:function(){document.getElementById('ocSb').classList.toggle('hid')}},
	{kb:'toggle_files',cmd:'Toggle Files',desc:'Show/hide file tree panel',action:function(){document.getElementById('ocFtBtn').click()}},
	{kb:'toggle_todos',cmd:'Toggle Tasks',desc:'Show/hide tasks panel',action:function(){document.getElementById('ocTodoP').classList.toggle('open')}},
	{kb:'toggle_modified',cmd:'Toggle Modified Files',desc:'Show/hide modified files panel',action:function(){var _fp2=document.getElementById('ocFilesP');_fp2.classList.toggle('open');if(_fp2.classList.contains('open'))loadModifiedFiles()}},
	{kb:'settings',cmd:'Settings',desc:'Open provider and permission settings',action:function(){document.getElementById('ocSetMod').classList.add('open');loadP()}},
	{kb:'keybindings',cmd:'Keybindings',desc:'View and customize keyboard shortcuts',action:function(){renderKeybindings();document.getElementById('ocKbMod').classList.add('open')}},
	{kb:'sound',cmd:'Sound Notifications',desc:'Toggle audio alerts on/off',action:function(){_soundEnabled=!_soundEnabled;localStorage.setItem('oc_sound_enabled',_soundEnabled?'1':'0');toast('Sound: '+(_soundEnabled?'ON':'OFF'),'ok')}},
	{kb:'notifications',cmd:'Desktop Notifications',desc:'Toggle desktop notification popups',action:function(){
		if(typeof Notification!=='undefined'){
			if(Notification.permission==='default')Notification.requestPermission();
			else{_desktopNotifEnabled=!_desktopNotifEnabled;toast('Desktop notifications: '+(_desktopNotifEnabled?'ON':'OFF'),'ok')}
		}
	}},
	{kb:'clear',cmd:'Clear Conversation',desc:'Delete all messages in this session',action:function(){api('clear',{},function(){rMsgs([]);st('Cleared',true)})}},
	{kb:'compact',cmd:'Compact Conversation',desc:'Summarize history to free context space',action:function(){st('Compacting...',true);api('compact',{keep_last_n:3},function(e,r){if(!e&&r&&r.success){rMsgs(r.messages||[]);toast('Compacted','ok');st('Ready',true)}else{toast('Failed','err');st('Ready',true)}})}},
	{kb:'export',cmd:'Export as Markdown',desc:'Download conversation with export options',action:function(){showExportDialog()}},
	{kb:'copy',cmd:'Copy Transcript',desc:'Copy conversation to clipboard',action:function(){copyTranscript()}},
	{kb:'help',cmd:'Help',desc:'Show keyboard shortcuts and FAQ',action:function(){document.getElementById('ocHlBtn').click()}}
];

// Patch the command palette to include new commands
function toggleCmdPalette(){
	var p=document.getElementById('ocCmdP');
	if(p.classList.contains('open')){p.classList.remove('open');return}
	var inp=document.getElementById('ocCmdIn');
	inp.value='';
	renderCmdList('');
	p.classList.add('open');
	setTimeout(function(){inp.focus()},50);
}
function renderCmdList(q){
	var list=document.getElementById('ocCmdL');
	list.innerHTML='';
	var lq=(q||'').toLowerCase();
	_origCmdCommands.filter(function(c){return !lq||c.cmd.toLowerCase().indexOf(lq)!==-1||(c.desc&&c.desc.toLowerCase().indexOf(lq)!==-1)}).forEach(function(c,i){
		var dynKey=c.kb?getKeybinding(c.kb):'';
		var div=document.createElement('div');
		div.className='ocCmdIt';
		div.innerHTML=(dynKey?'<span class="ocCmdItK">'+esc(dynKey)+'</span>':'<span class="ocCmdItK empty"></span>')+'<div style="flex:1;min-width:0"><div class="ocCmdItN">'+esc(c.cmd)+'</div>'+(c.desc?'<div class="ocCmdItD">'+esc(c.desc)+'</div>':'')+'</div>';
		div.addEventListener('click',function(){
			document.getElementById('ocCmdP').classList.remove('open');
			c.action();
		});
		div.addEventListener('mouseenter',function(){
			list.querySelectorAll('.ocCmdIt').forEach(function(el){el.classList.remove('act')});
			div.classList.add('act');
		});
		list.appendChild(div);
	});
}
document.getElementById('ocCmdIn').addEventListener('input',function(){
	renderCmdList(this.value);
});
document.getElementById('ocCmdIn').addEventListener('keydown',function(e){
	if(e.key==='Escape'){document.getElementById('ocCmdP').classList.remove('open');return}
	if(e.key==='Enter'){
		var act=list.querySelector('.ocCmdIt.act')||list.querySelector('.ocCmdIt');
		if(act)act.click();
		return;
	}
	var items=Array.from(list.querySelectorAll('.ocCmdIt'));
	var idx=items.findIndex(function(el){return el.classList.contains('act')});
	if(e.key==='ArrowDown'){
		e.preventDefault();
		if(idx<items.length-1){items[idx].classList.remove('act');items[idx+1].classList.add('act');items[idx+1].scrollIntoView({block:'nearest'})}
	}else if(e.key==='ArrowUp'){
		e.preventDefault();
		if(idx>0){items[idx].classList.remove('act');items[idx-1].classList.add('act');items[idx-1].scrollIntoView({block:'nearest'})}
	}
});
var list=document.getElementById('ocCmdL');

// ===== FEATURE: Session Timeline =====
var _timelineOpen=false;
function renderTimeline(){
	var list=document.getElementById('ocTimelineL');
	if(!list)return;
	var msgs=document.querySelectorAll('#ocCI .ocMsg');
	var html='';
	var userIdx=0;
	msgs.forEach(function(msg,i){
		if(msg.classList.contains('u')){
			userIdx++;
			var txt=msg.querySelector('.ocMbb');
			var preview=txt?txt.textContent.substring(0,60):'';
			html+='<div class="ocTimelineI" data-idx="'+i+'"><span class="ocTimelineN">#'+userIdx+'</span>'+esc(preview)+'</div>';
		}
	});
	list.innerHTML=html||'<div style="padding:14px;color:var(--t3);font-size:12px;text-align:center">No messages yet</div>';
	list.querySelectorAll('.ocTimelineI').forEach(function(el){
		el.addEventListener('click',function(){
			var idx=parseInt(this.dataset.idx);
			var msgs2=document.querySelectorAll('#ocCI .ocMsg');
			if(msgs2[idx]){
				msgs2[idx].scrollIntoView({behavior:'smooth',block:'center'});
				msgs2[idx].style.transition='background .3s';
				msgs2[idx].style.background='rgba(59,130,246,.08)';
				setTimeout(function(){msgs2[idx].style.background=''},1000);
			}
		});
	});
}
document.getElementById('ocTimelineToggle').addEventListener('click',function(){
	_timelineOpen=!_timelineOpen;
	document.getElementById('ocTimeline').classList.toggle('open',_timelineOpen);
	if(_timelineOpen)renderTimeline();
});
var _origRMsgs2=rMsgs;
rMsgs=function(msgs){
	rMsgs._lastMsgs=msgs||[];
	_origRMsgs2(msgs);
	if(_timelineOpen)renderTimeline();
};

// ===== FEATURE: Inline Diff Viewer (side-by-side toggle) =====
var _diffSplitMode=false;
function showDiffViewer(filePath,oldContent,newContent){
	var modal=document.getElementById('ocDiffMod');
	if(!modal)return;
	var body=document.getElementById('ocDiffBd');
	if(!body)return;
	var oldLines=oldContent.split('\n');
	var newLines=newContent.split('\n');
	var maxLen=Math.max(oldLines.length,newLines.length);
	var unifiedHtml='<div class="ocDiffToggle"><button class="ocDiffToggleBtn active" onclick="window._diffMode(false)">Unified</button><button class="ocDiffToggleBtn" onclick="window._diffMode(true)">Split</button></div>';
	unifiedHtml+='<div id="ocDiffUnified"><pre style="font-size:12px;overflow-x:auto;padding:8px;background:var(--bgS);border-radius:var(--r)">';
	for(var i=0;i<maxLen;i++){
		var o=oldLines[i]||'',n=newLines[i]||'';
		if(o===n){
			unifiedHtml+='  '+esc(n)+'\n';
		}else{
			if(o)unifiedHtml+='<span style="color:var(--err)">- '+esc(o)+'</span>\n';
			if(n)unifiedHtml+='<span style="color:var(--ok)">+ '+esc(n)+'</span>\n';
		}
	}
	unifiedHtml+='</pre></div>';
	var splitHtml='<div id="ocDiffSplit" style="display:none"><div class="ocDiffSplit"><div class="ocDiffSplitL"><div style="padding:4px 8px;font-size:11px;color:var(--t3);border-bottom:1px solid var(--bd2);font-weight:500">Original</div>';
	for(var i=0;i<oldLines.length;i++){
		splitHtml+='<div class="ocDiffSplitRow"><span class="ocDiffLN">'+(i+1)+'</span><span class="ocDiffLC">'+esc(oldLines[i])+'</span></div>';
	}
	splitHtml+='</div><div class="ocDiffSplitR"><div style="padding:4px 8px;font-size:11px;color:var(--t3);border-bottom:1px solid var(--bd2);font-weight:500">Modified</div>';
	for(var i=0;i<newLines.length;i++){
		splitHtml+='<div class="ocDiffSplitRow"><span class="ocDiffLN">'+(i+1)+'</span><span class="ocDiffLC">'+esc(newLines[i])+'</span></div>';
	}
	splitHtml+='</div></div></div>';
	body.innerHTML='<div style="margin-bottom:8px;font-size:13px;color:var(--t1);font-weight:500">'+esc(filePath)+'</div>'+unifiedHtml+splitHtml;
	modal.classList.add('open');
}
window._diffMode=function(split){
	var u=document.getElementById('ocDiffUnified');
	var s=document.getElementById('ocDiffSplit');
	var btns=document.querySelectorAll('.ocDiffToggleBtn');
	if(split){
		if(u)u.style.display='none';
		if(s)s.style.display='block';
		btns[0].classList.remove('active');btns[1].classList.add('active');
	}else{
		if(u)u.style.display='block';
		if(s)s.style.display='none';
		btns[0].classList.add('active');btns[1].classList.remove('active');
	}
};

// ===== FEATURE: Single-Patch Navigation (hunk-by-hunk) =====
var _diffHunks=[];
var _diffHunkIdx=0;
function parseDiffHunks(diffText){
	var hunks=[];
	var lines=diffText.split('\n');
	var currentHunk=null;
	for(var i=0;i<lines.length;i++){
		if(lines[i].substring(0,2)==='@@'){
			if(currentHunk)hunks.push(currentHunk);
			currentHunk={header:lines[i],lines:[],startLine:i};
		}else if(currentHunk){
			currentHunk.lines.push(lines[i]);
		}
	}
	if(currentHunk)hunks.push(currentHunk);
	return hunks;
}
function showDiffHunkNav(container,diffText){
	_diffHunks=parseDiffHunks(diffText);
	_diffHunkIdx=0;
	if(_diffHunks.length===0)return;
	var nav=document.createElement('div');
	nav.className='ocDiffHunkNav';
	nav.id='ocDiffHunkNav';
	nav.innerHTML='<button class="ocDiffHunkBtn" id="ocDiffHunkPrev">‹ Prev</button><span id="ocDiffHunkPos">Hunk 1/'+_diffHunks.length+'</span><button class="ocDiffHunkBtn" id="ocDiffHunkNext">Next ›</button>';
	container.insertBefore(nav,container.firstChild);
	document.getElementById('ocDiffHunkPrev').addEventListener('click',function(){navHunk(-1)});
	document.getElementById('ocDiffHunkNext').addEventListener('click',function(){navHunk(1)});
	highlightHunk();
}
function navHunk(dir){
	_diffHunkIdx=Math.max(0,Math.min(_diffHunkIdx+dir,_diffHunks.length-1));
	highlightHunk();
}
function highlightHunk(){
	var pos=document.getElementById('ocDiffHunkPos');
	if(pos)pos.textContent='Hunk '+(_diffHunkIdx+1)+'/'+_diffHunks.length;
	var prev=document.getElementById('ocDiffHunkPrev');
	var next=document.getElementById('ocDiffHunkNext');
	if(prev)prev.disabled=_diffHunkIdx===0;
	if(next)next.disabled=_diffHunkIdx===_diffHunks.length-1;
	var pre=document.querySelector('#ocDiffBd pre');
	if(!pre)return;
	var allLines=pre.querySelectorAll('.ocDiffHunkLine');
	allLines.forEach(function(l){l.style.background=''});
	var hunk=_diffHunks[_diffHunkIdx];
	if(!hunk)return;
	var start=hunk.startLine;
	for(var i=0;i<hunk.lines.length;i++){
		var lineEl=pre.querySelector('.ocDiffHunkLine[data-line="'+(start+i+1)+'"]');
		if(lineEl)lineEl.style.background='rgba(59,130,246,.06)';
	}
	var firstEl=pre.querySelector('.ocDiffHunkLine[data-line="'+(start+1)+'"]');
	if(firstEl)firstEl.scrollIntoView({block:'center',behavior:'smooth'});
}

// ===== FEATURE: File Line Range Attachments (@file.php#10-20) =====
var _origApiSend=send;
send=function(){
	var inp=document.getElementById('ocIn');
	var text=inp.value;
	var rangeMatch=text.match(/@([^\s@]+)#(\d+)(?:-(\d+))?/);
	if(rangeMatch){
		var filePath=rangeMatch[1];
		var startLine=parseInt(rangeMatch[2]);
		var endLine=rangeMatch[3]?parseInt(rangeMatch[3]):startLine;
		var relPath=filePath.replace(/^\//,'');
		api('read_file',{path:relPath},function(e,r){
			if(!e&&r&&r.content){
				var lines=r.content.split('\n');
				var excerpt=lines.slice(startLine-1,endLine).join('\n');
				pendingFiles.push({name:relPath+'#'+startLine+(endLine>startLine?'-'+endLine:''),content:excerpt});
				toast('Attached '+relPath+':'+startLine+(endLine>startLine?'-'+endLine:''),'ok');
			}else{
				toast('Could not read '+relPath,'err');
			}
			inp.value=inp.value.replace(/@[^\s@]+#\d+(?:-\d+)?/,'').trim();
			_origApiSend();
		});
	}else{
		_origApiSend();
	}
};

// ===== FEATURE: Grep/Search Results with Clickable File References =====
var _origRMsg3=rMsg;
rMsg=function(msg){
	var el=_origRMsg3(msg);
	if(!el)return el;
	if(msg.role==='asst'){
		var toolUses=(msg.parts||[]).filter(function(p){return p.type==='tool_use'});
		toolUses.forEach(function(p){
			if(p.name==='grep'||p.name==='search'||p.name==='glob'){
				var toolEls=el.querySelectorAll('.ocTk');
				toolEls.forEach(function(tEl){
					var body=tEl.querySelector('.ocTkB');
					if(body){
						var text=body.textContent;
						var html=text.replace(/([^\s:]+\.php|[^\s:]+\.js|[^\s:]+\.ts|[^\s:]+\.css|[^\s:]+\.html|[^\s:]+\.json):(\d+)/g,function(m,file,line){
							return '<span class="ocGrepFile" data-file="'+file+'" data-line="'+line+'">'+file+'<span class="ocGrepLine">:'+line+'</span></span>';
						});
						body.innerHTML=html;
						body.querySelectorAll('.ocGrepFile').forEach(function(fEl){
							fEl.addEventListener('click',function(){
								var f=this.dataset.file;
								var l=parseInt(this.dataset.line);
								api('read_file',{path:f},function(e,r){
									if(!e&&r&&r.content){
										var viewer=document.getElementById('ocFv');
										if(viewer){
											viewer.classList.add('open');
											var pre=document.getElementById('ocFvPre');
											var lines=r.content.split('\n');
											var start=Math.max(0,l-5);
											var end=Math.min(lines.length,l+5);
											pre.innerHTML=lines.slice(start,end).map(function(line,i){
												var ln=start+i+1;
												var cls=ln===l?'background:rgba(250,204,21,.15)':'';
												return '<div style="'+cls+'"><span style="color:var(--t4);width:30px;display:inline-block;text-align:right;padding-right:8px">'+ln+'</span>'+esc(line)+'</div>';
											}).join('');
											document.getElementById('ocFvTitle').textContent=f+':'+l;
										}
									}
								});
							});
						});
					}
				});
			}
		});
	}
	return el;
};

// ===== FEATURE: Timeline slash command =====
// /timeline is already in slashCmds array
var _origSendRef2=send;
// Handle /timeline command
var _origProcessCmd=null;

// ===== FEATURE: Plugin/Extension System =====
var _plugins={};
function registerPlugin(name,handlers){
	_plugins[name]=handlers;
	if(handlers.onMount){
		try{handlers.onMount()}catch(e){console.error('Plugin '+name+' mount error:',e)}
	}
	toast('Plugin loaded: '+name,'ok');
}
function getPlugin(name){return _plugins[name]||null}
function listPlugins(){return Object.keys(_plugins)}

// ===== HELPER: Render Split Diff =====
function renderSplitDiff(diffText){
	var splitView=document.getElementById('ocDiffSplitView');
	if(!splitView)return;
	var leftDiv=splitView.querySelector('.ocDiffSplitL');
	var rightDiv=splitView.querySelector('.ocDiffSplitR');
	if(!leftDiv||!rightDiv)return;
	var lines=diffText.split('\n');
	var leftHtml='',rightHtml='';
	var leftLn=1,rightLn=1;
	lines.forEach(function(line){
		var prefix=line.substring(0,1);
		var content=line.substring(1);
		if(prefix==='@'){
			leftHtml+='<div style="padding:4px 8px;color:var(--p);font-weight:600">'+esc(line)+'</div>';
			rightHtml+='<div style="padding:4px 8px;color:var(--p);font-weight:600">'+esc(line)+'</div>';
			var m=line.match(/\+(\d+)/);
			if(m)rightLn=parseInt(m[1]);
			var m2=line.match(/-(\d+)/);
			if(m2)leftLn=parseInt(m2[1]);
		}else if(prefix==='+'){
			rightHtml+='<div class="ocDiffSplitRow add"><span class="ocDiffLN">'+(rightLn++)+'</span><span class="ocDiffLC">'+esc(content)+'</span></div>';
		}else if(prefix==='-'){
			leftHtml+='<div class="ocDiffSplitRow del"><span class="ocDiffLN">'+(leftLn++)+'</span><span class="ocDiffLC">'+esc(content)+'</span></div>';
		}else{
			leftHtml+='<div class="ocDiffSplitRow"><span class="ocDiffLN">'+(leftLn++)+'</span><span class="ocDiffLC">'+esc(line)+'</span></div>';
			rightHtml+='<div class="ocDiffSplitRow"><span class="ocDiffLN">'+(rightLn++)+'</span><span class="ocDiffLC">'+esc(line)+'</span></div>';
		}
	});
	leftDiv.innerHTML='<div style="padding:4px 8px;font-size:11px;color:var(--t3);border-bottom:1px solid var(--bd2);font-weight:500">Original</div>'+leftHtml;
	rightDiv.innerHTML='<div style="padding:4px 8px;font-size:11px;color:var(--t3);border-bottom:1px solid var(--bd2);font-weight:500">Modified</div>'+rightHtml;
}

})();

</script>
</body>
</html>
<?php
}

function ai_select_theme(){
	global $user, $globals, $l, $theme, $softpanel, $error, $iscripts;

$username = (!empty($softpanel->user['name']) ? $softpanel->user['name'] : (!empty($user['username']) ? $user['username'] : ''));
	$home_dir = !empty($softpanel->user['homedir']) ? $softpanel->user['homedir'] : (function_exists('ai_get_homedir') ? ai_get_homedir($username) : '/home/' . $username);

$installations = array();
	if(!empty($user['ins'])){
		foreach($user['ins'] as $insid => $data){
			$soft = get_sid_by_version($data['ver'], $data['sid']);
			$software = !empty($iscripts[$soft]) ? $iscripts[$soft] : array('name' => 'Software');
			$installations[] = array('insid' => $insid, 'name' => $software['name'], 'url' => !empty($data['softurl']) ? $data['softurl'] : '', 'path' => $data['softpath']);
		}
	}

ob_start();
	softheader(__('$0 - Code with AI', array(APP)));
	ob_end_clean();

echo '<style>
		body { background: #F9FAFB !important; }
		.ai-select-container { max-width: 800px; margin: 40px auto; padding: 0; background: transparent; border: none; box-shadow: none; }
		.ai-select-header { background: #fff; border-radius: 12px 12px 0 0; padding: 24px 30px; border-bottom: 1px solid #e1e8ed; }
		.ai-select-title { font-size: 24px; font-weight: 500; color: #1a1a2e; margin-bottom: 6px; display: flex; align-items: center; gap: 10px; }
		.ai-select-title i { color: #6c5ce7; font-size: 24px; }
		.ai-select-subtitle { font-size: 14px; color: #6f6f6f; margin: 0; }
		.ai-select-alert { background: #fff3cd; border: 1px solid #ffc107; border-radius: 8px; padding: 12px 16px; margin: 20px 0 0; font-size: 13px; color: #856404; display: flex; align-items: center; gap: 10px; }
		.ai-select-alert i { color: #ffc107; }
		.ai-custom-section { background: #fff; border-radius: 12px; padding: 24px 30px; margin-bottom: 20px; border: 1px solid #e1e8ed; }
		.ai-custom-title { font-size: 16px; font-weight: 500; color: #1a1a2e; margin-bottom: 6px; display: flex; align-items: center; gap: 8px; }
		.ai-custom-title i { color: #6c5ce7; }
		.ai-custom-desc { font-size: 13px; color: #6f6f6f; margin-bottom: 16px; }
		.ai-custom-form { display: flex; gap: 10px; align-items: center; }
		.ai-custom-home { font-size: 13px; color: #8f8f8f; background: #f8f9fa; padding: 10px 12px; border: 1px solid #e1e8ed; border-right: none; border-radius: 6px 0 0 6px; font-family: monospace; white-space: nowrap; }
		.ai-custom-input { flex: 1; padding: 10px 14px; border: 1px solid #e1e8ed; border-radius: 0 6px 6px 0; background: #fff; color: #1a1a2e; font-size: 14px; font-family: monospace; }
		.ai-custom-input:focus { outline: none; border-color: #6c5ce7; }
		.ai-custom-btn { padding: 10px 20px; background: #6c5ce7; color: #fff; border: none; border-radius: 6px; font-size: 13px; font-weight: 500; cursor: pointer; white-space: nowrap; }
		.ai-custom-btn:hover { background: #5a4ad1; }
		.ai-or-divider { text-align: center; margin: 20px 0; color: #8f8f8f; font-size: 13px; position: relative; }
		.ai-or-divider::before, .ai-or-divider::after { content: ""; position: absolute; top: 50%; width: 40%; height: 1px; background: #e1e8ed; }
		.ai-or-divider::before { left: 0; }
		.ai-or-divider::after { right: 0; }
		.ai-installs-section { background: #fff; border-radius: 12px; padding: 24px 30px; border: 1px solid #e1e8ed; }
		.ai-installs-header { font-weight: 500; color: #6f6f6f; margin-bottom: 16px; font-size: 12px; text-transform: uppercase; letter-spacing: 0.5px; display: flex; align-items: center; gap: 8px; }
		.ai-installs-header i { color: #6c5ce7; }
		.ai-install-list { display: flex; flex-direction: column; gap: 10px; }
		.ai-install-item { display: flex; align-items: center; padding: 14px 16px; border: 1px solid #e1e8ed; border-radius: 10px; cursor: pointer; transition: all 0.2s; text-decoration: none; color: inherit; }
		.ai-install-item:hover { border-color: #6c5ce7; background: #fafafe; transform: translateY(-1px); box-shadow: 0 2px 8px rgba(108,92,231,0.1); }
		.ai-install-icon { width: 40px; height: 40px; background: linear-gradient(135deg, #6c5ce7, #a29bfe); border-radius: 10px; display: flex; align-items: center; justify-content: center; color: #fff; margin-right: 14px; font-size: 16px; flex-shrink: 0; }
		.ai-install-info { flex: 1; min-width: 0; }
		.ai-install-name { font-weight: 500; color: #1a1a2e; margin-bottom: 4px; font-size: 14px; }
		.ai-install-url { font-size: 12px; color: #6c5ce7; margin-bottom: 2px; word-break: break-all; }
		.ai-install-path { font-size: 11px; color: #8f8f8f; font-family: monospace; }
		.ai-install-arrow { color: #ccc; font-size: 14px; margin-left: 10px; }
	</style>';

echo '<div class="ai-select-container">
		<div class="ai-select-header">
			<div class="ai-select-title">
				<i class="fas fa-robot"></i> Code with AI
			</div>
			<div class="ai-select-subtitle">Select a project to start coding with AI</div>
		</div>

<div class="ai-custom-section">
			<div class="ai-custom-title">
				<i class="fas fa-folder-open"></i> Open Custom Path
			</div>
			<div class="ai-custom-desc">Enter a directory path to work with AI on any project</div>
			<form method="get" action="'.$globals['index'].'">
				<input type="hidden" name="act" value="ai"/>
				<div class="ai-custom-form">
					<span class="ai-custom-home">'.$home_dir.'/</span>
					<input type="text" name="path" class="ai-custom-input" placeholder="public_html/project" />
					<button type="submit" class="ai-custom-btn">Open</button>
				</div>
			</form>
		</div>';

if(!empty($installations)){
		echo '<div class="ai-or-divider">OR select from your installations</div>

<div class="ai-installs-section">
			<div class="ai-installs-header">
				<i class="fas fa-globe"></i> Your Installations
			</div>
			<div class="ai-install-list">';

foreach($installations as $ins){
			echo '<a href="'.$globals['ind'].'act=ai&insid='.$ins['insid'].'" class="ai-install-item">
				<div class="ai-install-icon"><i class="fas fa-globe"></i></div>
				<div class="ai-install-info">
					<div class="ai-install-name">'.htmlspecialchars($ins['name']).'</div>
					<div class="ai-install-url">'.htmlspecialchars($ins['url']).'</div>
					<div class="ai-install-path">'.htmlspecialchars($ins['path']).'</div>
				</div>
				<div class="ai-install-arrow"><i class="fas fa-chevron-right"></i></div>
			</a>';
		}
		echo '</div></div>';
	}

echo '</div>';
	die();
}

文件操作 - ai_theme.php

文件: /usr/local/softaculous/lib/ai/theme/ai_theme.php

编辑文件内容

修改文件时间

删除文件