<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>Synthenis Code</title>
<link rel="icon" type="image/png" href="https://cdn.synthenis.com/img/apps/code.png">
<link rel="preconnect" href="https://cdn.synthenis.com" crossorigin>
<link rel="dns-prefetch" href="https://cdn.synthenis.com">
<link rel="preconnect" href="https://synthenis.com" crossorigin>
<link rel="dns-prefetch" href="https://synthenis.com">
<link rel="preconnect" href="https://cdn.jsdelivr.net" crossorigin>
<link rel="dns-prefetch" href="https://cdn.jsdelivr.net">
<meta name="referrer" content="strict-origin-when-cross-origin">
<meta name="theme-color" content="#0a0a0a" media="(prefers-color-scheme: dark)">
<meta name="theme-color" content="#eef0f3" media="(prefers-color-scheme: light)">
<link rel="stylesheet" href="/static/syn/chunks/app.min.css">
</head>
<body>
<div id="loadingOverlay" class="loading-overlay"><div class="loading-spinner"></div><div class="loading-text" data-i18n="loading">Loading...</div></div>
<div class="app-shell">
<div id="mobileOverlay" class="mobile-overlay"></div>
<aside class="sidebar collapsed" id="sidebar">
<div class="sidebar-header"><div class="sidebar-brand"><img src="https://cdn.synthenis.com/img/apps/code.png" alt=""><span>Synthenis Code</span></div><button class="sb-btn" id="btnNewProject"><img src="https://cdn.synthenis.com/img/phosphor/SVG/regular/plus.svg" alt=""></button></div>
<div class="sidebar-content">
<div class="sidebar-section"><div class="sidebar-section-title"><span data-i18n="sidebar_projects">Projects</span></div><div id="projectList"></div></div>
<div class="sidebar-section" id="sectionFiles" style="display:none"><div class="sidebar-section-title"><span data-i18n="sidebar_files">Files</span><button class="sb-btn" id="btnNewFile" style="width:24px;height:24px"><img src="https://cdn.synthenis.com/img/phosphor/SVG/regular/file-plus.svg" alt="" style="width:14px;height:14px"></button></div><div id="fileList"></div></div>
</div>
<div class="sidebar-footer">
<button class="user-avatar-btn" id="userAvatarBtn"><img class="user-avatar-img" id="userAvatarImg" src="https://cdn.synthenis.com/img/avatars/def.png" alt=""><div class="user-avatar-info"><div class="user-avatar-name" id="userAvatarName" data-i18n="menu_sign_in">Sign In</div><div class="user-avatar-sub" id="userAvatarSub"></div></div></button>
<div class="user-menu" id="userMenu">
<button class="um-item" id="menuAccount" style="display:none"><img src="https://cdn.synthenis.com/img/phosphor/SVG/regular/user-circle.svg" alt=""><span data-i18n="menu_account">Account</span></button>
<button class="um-item" id="menuSettings"><img src="https://cdn.synthenis.com/img/phosphor/SVG/regular/gear.svg" alt=""><span data-i18n="menu_settings">Settings</span></button>
<button class="um-item" id="menuHelp"><img src="https://cdn.synthenis.com/img/phosphor/SVG/regular/question.svg" alt=""><span data-i18n="menu_help">Help</span></button>
<div class="um-sep"></div>
<button class="um-item" id="menuSignIn"><img src="https://cdn.synthenis.com/img/phosphor/SVG/regular/sign-in.svg" alt=""><span data-i18n="menu_sign_in">Sign In</span></button>
<button class="um-item danger" id="menuSignOut" style="display:none"><img src="https://cdn.synthenis.com/img/phosphor/SVG/regular/sign-out.svg" alt=""><span data-i18n="menu_sign_out">Sign Out</span></button>
</div>
</div>
</aside>
<main class="main-area">
<div class="topbar"><div class="topbar-left"><button class="sb-btn" id="btnToggleSidebar"><img src="https://cdn.synthenis.com/img/phosphor/SVG/regular/sidebar-simple.svg" alt=""></button></div><div class="topbar-tabs" id="editorTabs"></div><div class="topbar-right"><button class="sb-btn" id="btnToggleAI" title="Synthenis AI"><img src="https://cdn.synthenis.com/img/phosphor/SVG/regular/sparkle.svg" alt=""></button></div></div>
<div style="display:flex;flex:1;min-height:0;overflow:hidden">
<div class="editor-container" style="flex:1;min-width:0">
<div id="welcomeScreen" class="welcome-screen">
<img class="welcome-logo" src="https://cdn.synthenis.com/land/syn-big.png" alt="" onerror="this.src='https://cdn.synthenis.com/img/apps/code.png'">
<h1 class="welcome-title" data-i18n="welcome_title">Welcome to Synthenis Code</h1>
<p class="welcome-sub" data-i18n="welcome_sub">Powerful cloud-based code editor.</p>
<div class="welcome-actions">
<button class="welcome-btn" id="btnWelcomeNew"><img src="https://cdn.synthenis.com/img/phosphor/SVG/regular/folder-simple-plus.svg" alt=""><div class="welcome-btn-text"><div class="welcome-btn-title" data-i18n="action_new_project">New Project</div><div class="welcome-btn-desc" data-i18n="action_new_project_desc">Create a new project</div></div></button>
<button class="welcome-btn" id="btnWelcomeOpen"><img src="https://cdn.synthenis.com/img/phosphor/SVG/regular/folder-open.svg" alt=""><div class="welcome-btn-text"><div class="welcome-btn-title" data-i18n="action_open_project">Open Folder</div><div class="welcome-btn-desc" data-i18n="action_open_project_desc">Open a local folder</div></div></button>
<button class="welcome-btn" id="btnWelcomeRecent"><img src="https://cdn.synthenis.com/img/phosphor/SVG/regular/clock-counter-clockwise.svg" alt=""><div class="welcome-btn-text"><div class="welcome-btn-title" data-i18n="action_recent">Recent Projects</div><div class="welcome-btn-desc" data-i18n="action_recent_desc">Continue where you left off</div></div></button>
</div>
</div>
<div id="editorMount" style="height:100%;width:100%"></div>
</div>
<aside class="ai-panel" id="aiPanel" style="display:none">
<div class="ai-panel-header"><img src="https://cdn.synthenis.com/img/apps/code.png" alt=""><span data-i18n="ai_panel_title">Synthenis AI</span><span class="ai-model-badge">Preview</span><button class="sb-btn" style="width:28px;height:28px" onclick="document.getElementById('aiPanel').style.display='none';document.getElementById('btnToggleAI').classList.remove('active');"><img src="https://cdn.synthenis.com/img/phosphor/SVG/regular/x.svg" alt="" style="width:14px;height:14px"></button></div>
<div class="ai-chat-messages" id="aiChatMessages"></div>
<div class="ai-chat-footer"><div class="ai-chat-input-row"><textarea id="aiChatInput" rows="1" data-i18n="ai_placeholder" placeholder="Ask a question..."></textarea><button class="ai-send-btn" id="aiChatSendBtn"><img src="https://cdn.synthenis.com/img/phosphor/SVG/regular/paper-plane-tilt.svg" alt=""></button></div><div class="ai-suggestions"><button class="ai-suggestion-chip" data-i18n="ai_explain">Explain</button><button class="ai-suggestion-chip" data-i18n="ai_fix">Fix</button><button class="ai-suggestion-chip" data-i18n="ai_optimize">Optimize</button><button class="ai-suggestion-chip" data-i18n="ai_test">Write Tests</button></div></div>
</aside>
</div>
<div class="statusbar"><div class="statusbar-left"><div class="status-item" id="syncStatus"><img src="https://cdn.synthenis.com/img/phosphor/SVG/regular/cloud-slash.svg" alt=""><span data-i18n="sync_disconnected">Offline</span></div></div><div class="statusbar-right"><span class="ai-status" id="btnToggleAI2"><img src="https://cdn.synthenis.com/img/phosphor/SVG/regular/sparkle.svg" alt="">Synthenis AI</span><span class="status-item" id="statusLn"></span><span class="status-item" id="statusCol"></span><span class="status-item" id="statusLang"></span></div></div>
</main>
</div>
<div id="ctxMenu" class="ctx-menu"></div>
<div id="toastContainer" class="toast-container"></div>
<div class="select-menu" id="langSelectMenu" style="display:none;z-index:9999"></div>
<div class="modal-overlay" id="modalNewProject"><div class="modal-box"><div class="modal-head"><h3 data-i18n="new_project_title">New Project</h3><button class="modal-close" data-modal-close="modalNewProject"><img src="https://cdn.synthenis.com/img/phosphor/SVG/regular/x.svg" alt=""></button></div><div class="modal-body"><div class="fg"><label data-i18n="new_project_name">Project Name</label><input type="text" class="input-f" id="newProjectNameInput" data-i18n="new_project_name_ph" placeholder="Project name..."></div></div><div class="modal-footer"><button class="btn-s" data-modal-close="modalNewProject" data-i18n="btn_cancel">Cancel</button><button class="btn-p" id="btnCreateProject" data-i18n="new_project_create">Create</button></div></div></div>
<div class="modal-overlay" id="modalNewFile"><div class="modal-box"><div class="modal-head"><h3 data-i18n="new_file_title">New File</h3><button class="modal-close" data-modal-close="modalNewFile"><img src="https://cdn.synthenis.com/img/phosphor/SVG/regular/x.svg" alt=""></button></div><div class="modal-body"><div class="fg"><label data-i18n="new_file_name">File Name</label><input type="text" class="input-f" id="newFileNameInput" data-i18n="new_file_name_ph" placeholder="file.html"></div></div><div class="modal-footer"><button class="btn-s" data-modal-close="modalNewFile" data-i18n="btn_cancel">Cancel</button><button class="btn-p" id="btnCreateFile" data-i18n="new_file_create">Create</button></div></div></div>
<div class="modal-overlay" id="modalDelete"><div class="modal-box"><div class="modal-head"><h3 data-i18n="delete_title">Delete</h3><button class="modal-close" data-modal-close="modalDelete"><img src="https://cdn.synthenis.com/img/phosphor/SVG/regular/x.svg" alt=""></button></div><div class="modal-body"><p data-i18n="delete_confirm">Are you sure?</p><p style="font-weight:600;margin-top:8px;color:var(--t1)" id="deleteItemName"></p></div><div class="modal-footer"><button class="btn-s" data-modal-close="modalDelete" data-i18n="delete_no">Cancel</button><button class="btn-d" id="btnConfirmDelete" data-i18n="delete_yes">Delete</button></div></div></div>
<div class="modal-overlay" id="modalRename"><div class="modal-box"><div class="modal-head"><h3 data-i18n="rename_title">Rename</h3><button class="modal-close" data-modal-close="modalRename"><img src="https://cdn.synthenis.com/img/phosphor/SVG/regular/x.svg" alt=""></button></div><div class="modal-body"><div class="fg"><input type="text" class="input-f" id="renameInput" data-i18n="rename_ph" placeholder="New name..."></div></div><div class="modal-footer"><button class="btn-s" data-modal-close="modalRename" data-i18n="btn_cancel">Cancel</button><button class="btn-p" id="btnConfirmRename" data-i18n="btn_ok">OK</button></div></div></div>
<div class="modal-overlay" id="modalUnsaved"><div class="modal-box"><div class="modal-head"><h3 data-i18n="unsaved_title">Unsaved Changes</h3><button class="modal-close" data-modal-close="modalUnsaved"><img src="https://cdn.synthenis.com/img/phosphor/SVG/regular/x.svg" alt=""></button></div><div class="modal-body"><p data-i18n="unsaved_msg">You have unsaved changes.</p><p style="font-weight:600;margin-top:8px;color:var(--t1)" id="unsavedFileName"></p></div><div class="modal-footer"><button class="btn-s" id="btnUnsavedDiscard" data-i18n="unsaved_discard">Discard</button><button class="btn-p" id="btnUnsavedSave" data-i18n="unsaved_save">Save</button></div></div></div>
<div class="modal-overlay" id="modalSettings"><div class="modal-box" style="max-width:520px"><div class="modal-head"><h3 data-i18n="settings_title">Settings</h3><button class="modal-close" data-modal-close="modalSettings"><img src="https://cdn.synthenis.com/img/phosphor/SVG/regular/x.svg" alt=""></button></div><div class="modal-body" style="max-height:65vh;overflow-y:auto;padding-right:4px">
<div class="settings-tile"><div class="settings-tile-head"><img src="https://cdn.synthenis.com/img/phosphor/SVG/regular/code.svg" alt=""><span data-i18n="settings_editor_title">Editor</span></div>
<div class="switch-row"><div><div class="switch-row-label" data-i18n="settings_word_wrap">Word Wrap</div></div><button class="sw-btn" id="swWordWrap" role="switch" aria-checked="true"><span class="sw-thumb"></span></button></div>
<div class="switch-row"><div><div class="switch-row-label" data-i18n="settings_minimap">Minimap</div></div><button class="sw-btn" id="swMinimap" role="switch" aria-checked="false"><span class="sw-thumb"></span></button></div>
<div class="switch-row"><div><div class="switch-row-label" data-i18n="settings_line_numbers">Line Numbers</div></div><button class="sw-btn" id="swLineNumbers" role="switch" aria-checked="true"><span class="sw-thumb"></span></button></div>
<div class="switch-row"><div><div class="switch-row-label" data-i18n="settings_bracket_colors">Bracket Colors</div></div><button class="sw-btn" id="swBracketColors" role="switch" aria-checked="true"><span class="sw-thumb"></span></button></div>
<div class="switch-row"><div><div class="switch-row-label" data-i18n="settings_smooth_scroll">Smooth Scrolling</div></div><button class="sw-btn" id="swSmoothScroll" role="switch" aria-checked="true"><span class="sw-thumb"></span></button></div>
<div class="switch-row"><div><div class="switch-row-label" data-i18n="settings_sticky_scroll">Sticky Scroll</div></div><button class="sw-btn" id="swStickyScroll" role="switch" aria-checked="true"><span class="sw-thumb"></span></button></div>
<div class="switch-row"><div><div class="switch-row-label" data-i18n="settings_linked_editing">Linked Editing</div></div><button class="sw-btn" id="swLinkedEditing" role="switch" aria-checked="false"><span class="sw-thumb"></span></button></div>
<div class="switch-row"><div><div class="switch-row-label" data-i18n="settings_format_paste">Format on Paste</div></div><button class="sw-btn" id="swFormatPaste" role="switch" aria-checked="false"><span class="sw-thumb"></span></button></div>
<div class="switch-row"><div><div class="switch-row-label" data-i18n="settings_format_type">Format on Type</div></div><button class="sw-btn" id="swFormatType" role="switch" aria-checked="false"><span class="sw-thumb"></span></button></div>
<div style="display:flex;gap:10px;margin-top:8px"><div class="fg" style="flex:1"><label data-i18n="settings_font_size">Font Size</label><select class="input-f" id="inpFontSize" style="padding:8px 12px"><option value="12">12</option><option value="13">13</option><option value="14" selected>14</option><option value="15">15</option><option value="16">16</option><option value="18">18</option><option value="20">20</option></select></div><div class="fg" style="flex:1"><label data-i18n="settings_tab_size">Tab Size</label><select class="input-f" id="inpTabSize" style="padding:8px 12px"><option value="2" selected>2</option><option value="4">4</option><option value="8">8</option></select></div></div>
<div style="display:flex;gap:10px"><div class="fg" style="flex:1"><label data-i18n="settings_cursor_blink">Cursor</label><select class="input-f" id="selCursorBlink" style="padding:8px 12px"><option value="blink">Blink</option><option value="smooth">Smooth</option><option value="phase">Phase</option><option value="expand">Expand</option><option value="solid">Solid</option></select></div><div class="fg" style="flex:1"><label data-i18n="settings_whitespace">Whitespace</label><select class="input-f" id="selWhitespace" style="padding:8px 12px"><option value="none">None</option><option value="boundary">Boundary</option><option value="selection">Selection</option><option value="trailing">Trailing</option><option value="all">All</option></select></div></div>
</div>
<div class="settings-tile"><div class="settings-tile-head"><img src="https://cdn.synthenis.com/img/phosphor/SVG/regular/cloud.svg" alt=""><span data-i18n="settings_sync_title">Sync</span></div>
<div class="switch-row"><div><div class="switch-row-label" data-i18n="settings_auto_sync">Auto Sync</div><div class="switch-row-desc" data-i18n="settings_auto_sync_desc">Save to cloud</div></div><button class="sw-btn" id="swAutoSync" role="switch" aria-checked="true"><span class="sw-thumb"></span></button></div>
<div class="switch-row"><div><div class="switch-row-label" data-i18n="settings_auto_save">Auto Save</div></div><button class="sw-btn" id="swAutoSave" role="switch" aria-checked="true"><span class="sw-thumb"></span></button></div>
</div>
<div class="settings-tile"><div class="settings-tile-head"><img src="https://cdn.synthenis.com/img/phosphor/SVG/regular/sparkle.svg" alt=""><span data-i18n="settings_ai_title">AI</span></div>
<div class="switch-row"><div><div class="switch-row-label" data-i18n="settings_local_ai">Local AI Autocomplete</div><div class="switch-row-desc" data-i18n="settings_local_ai_desc">Learn from your patterns</div></div><button class="sw-btn" id="swLocalAI" role="switch" aria-checked="true"><span class="sw-thumb"></span></button></div>
<div class="switch-row"><div><div class="switch-row-label" data-i18n="settings_inline_suggest">Inline Suggestions</div></div><button class="sw-btn" id="swInlineSuggest" role="switch" aria-checked="true"><span class="sw-thumb"></span></button></div>
<button class="btn-s" id="btnClearLearnedData" style="margin-top:8px;width:100%;font-size:12px" data-i18n="settings_clear_learned">Clear Learned Data</button>
</div>
<div class="settings-tile"><div class="settings-tile-head"><img src="https://cdn.synthenis.com/img/phosphor/SVG/regular/speaker-high.svg" alt=""><span data-i18n="settings_sound">Sounds</span></div>
<div class="switch-row"><div><div class="switch-row-label" data-i18n="settings_sound">Sound Effects</div></div><button class="sw-btn" id="swSound" role="switch" aria-checked="true"><span class="sw-thumb"></span></button></div>
</div>
<div class="settings-tile"><div class="settings-tile-head"><img src="https://cdn.synthenis.com/img/phosphor/SVG/regular/translate.svg" alt=""><span data-i18n="settings_language">Language</span></div>
<div style="position:relative"><button class="select-trigger" id="langTrigger" style="width:100%"><img class="flag-img" src="https://cdn.synthenis.com/img/flag/gb.png" alt="" style="width:18px;height:13px;border-radius:2px;object-fit:cover;filter:none"><span>English</span><span class="arrow"><img src="https://cdn.synthenis.com/img/phosphor/SVG/regular/caret-down.svg" alt=""></span></button></div>
</div>
</div></div></div>
<script src="https://cdn.jsdelivr.net/npm/@supabase/supabase-js@2"></script>
<script src="/langs/tr.js"></script>
<script src="/langs/en.js"></script>
<script src="/static/syn/chunks/app.min.js"></script>
</body>
</html>
