@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap";body{width:100vw;height:100vh;margin:0;padding:0;overflow:hidden}#root{width:100%;height:100%}:root{--bg-dark:#0d0d0d;--bg-dark-grad:radial-gradient(circle at 50% -20%, #2a2a35, #0d0d0d 80%);--panel-bg:#181818d9;--panel-border:#ffffff14;--text-light:#ececec;--text-muted:#888;--accent:#bb86fc;--accent-hover:#9965f4;--editor-bg:#1e1e1e}body{background:var(--bg-dark);background-image:var(--bg-dark-grad);color:var(--text-light);height:100vh;margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;overflow:hidden}.app-container{flex-direction:column;height:100vh;display:flex}.app-header{background-color:var(--panel-bg);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--panel-border);z-index:10;align-items:center;padding:1rem 2rem;display:flex}.app-header h1{letter-spacing:.5px;color:var(--text-light);margin:0;font-size:1.1rem;font-weight:600}.ide-layout{flex:1;display:flex;position:relative;overflow:hidden}.left-sidebar,.right-sidebar{background-color:var(--panel-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);flex:0 0 300px;min-width:260px;max-width:400px;padding:1.5rem;overflow-y:auto}.left-sidebar{border-right:1px solid var(--panel-border)}.right-sidebar{border-left:1px solid var(--panel-border)}.center-canvas{flex-direction:column;flex:auto;align-items:center;min-width:400px;padding:3rem;display:flex;overflow-y:auto}.editor-pane{flex-direction:column;width:100%;max-width:800px;display:flex}.editor-canvas{background:var(--editor-bg);border:1px solid var(--panel-border);color:#fff;border-radius:8px;outline:none;min-height:60vh;padding:3rem 4rem;font-size:1.1rem;line-height:1.6;transition:border-color .2s;box-shadow:0 10px 30px #00000080}.editor-canvas:focus{border-color:#bb86fc66}.toolbar{align-self:flex-start;gap:.5rem;margin-bottom:1.5rem;display:flex}.toolbar button{color:var(--text-light);border:1px solid var(--panel-border);cursor:pointer;background:#ffffff0d;border-radius:6px;padding:.4rem .8rem;font-size:.9rem;font-weight:500;transition:all .2s}.toolbar button:hover{border-color:var(--accent);color:var(--accent);background:#ffffff1a}.segmented-control{border:1px solid var(--panel-border);background:#0000004d;border-radius:8px;flex-direction:column;gap:4px;margin-bottom:1.5rem;padding:4px;display:flex}.segmented-control button{color:var(--text-muted);cursor:pointer;text-align:left;background:0 0;border:none;border-radius:6px;padding:.6rem 1rem;font-size:.9rem;font-weight:500;transition:all .2s}.segmented-control button:hover{color:var(--text-light);background:#ffffff0d}.segmented-control button.active{color:var(--accent);box-shadow:inset 2px 0 0 var(--accent);background:#bb86fc26}.tab-content{border:1px solid var(--panel-border);color:var(--text-muted);background:#0003;border-radius:8px;flex:1;padding:1rem;font-size:.9rem}.comments-pane h2{color:var(--text-light);margin-top:0;margin-bottom:1rem;font-size:1rem;font-weight:600}