.markdown-content{color:#e5e7eb;line-height:1.7;overflow-wrap:break-word;word-wrap:break-word}.markdown-content h1,.markdown-content h2,.markdown-content h3{color:#fff;font-weight:600;margin-top:1.5em;margin-bottom:.5em}.markdown-content p{margin-bottom:1em}.markdown-content a{color:#9ca3af;text-decoration:underline}.markdown-content ul,.markdown-content ol{list-style-position:outside;padding-left:1.5em;margin-bottom:1em}.markdown-content ul{list-style-type:disc}.markdown-content ol{list-style-type:decimal}.markdown-content pre{position:relative;background-color:#282c34;border-radius:8px;margin-top:1.5em;margin-bottom:1.5em;padding-top:3.5rem;overflow:hidden;border:1px solid #3a3f4b}.markdown-content pre code.hljs{padding:0 1rem 1rem;display:block}.code-block-header{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:.5rem .75rem;background-color:#3a3f4b;border-bottom:1px solid #4a505c;height:3.5rem}.language-name{font-size:.875rem;color:#d1d5db;font-family:monospace;font-weight:600;text-transform:lowercase;background-color:#ffffff1a;padding:.25rem .6rem;border-radius:6px;border:1px solid rgba(255,255,255,.2)}.copy-code-btn{display:flex;align-items:center;gap:.5rem;background-color:transparent;border:1px solid transparent;color:#d1d5db;padding:.5rem;border-radius:6px;cursor:pointer;transition:all .2s;transform:scale(1)}.copy-code-btn:hover{background-color:#fff3;border-color:#ffffff4d;color:#fff;transform:scale(1.1)}.copy-code-btn.copied{color:#4ade80;background-color:#4ade801a;border-color:#4ade804d}.copy-code-btn.copied:hover{color:#4ade80;background-color:#4ade8026;border-color:#4ade8066}.copy-code-btn.copied svg{animation:copy-pop .3s ease-out}@keyframes copy-pop{0%{transform:scale(.8);opacity:0}50%{transform:scale(1.1);opacity:1}to{transform:scale(1);opacity:1}}.code-wrapper{max-height:400px;overflow:auto}.code-preview-container{margin-top:1.5rem;border:1px solid rgba(255,255,255,.1);border-radius:.5rem;overflow:hidden;background-color:#1f2937;box-shadow:0 10px 15px -3px #0000004d,0 4px 6px -2px #0003}.code-preview-header{display:flex;align-items:center;justify-content:space-between;background-color:#374151;padding:.5rem .75rem;font-size:.875rem;border-bottom:1px solid rgba(255,255,255,.1)}.window-controls{display:flex;gap:.5rem;flex:1}.window-dot{width:12px;height:12px;border-radius:9999px;border:1px solid rgba(0,0,0,.2)}.code-preview-title{display:flex;align-items:center;gap:.5rem;font-weight:500;color:#d1d5db;flex:2;justify-content:center}.live-indicator{width:8px;height:8px;border-radius:9999px;background-color:#22c55e;animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.code-preview-close-btn{padding:.25rem;border-radius:9999px;color:#9ca3af;transition:background-color .2s,color .2s;background-color:transparent;border:none;cursor:pointer;flex:1;display:flex;justify-content:flex-end}.code-preview-close-btn:hover{background-color:#ffffff1a;color:#fff}.custom-scrollbar::-webkit-scrollbar{width:8px;height:8px}.custom-scrollbar::-webkit-scrollbar-track{background:#ffffff0d;border-radius:10px}.custom-scrollbar::-webkit-scrollbar-thumb{background:#fff3;border-radius:10px}.custom-scrollbar::-webkit-scrollbar-thumb:hover{background:#ffffff4d}.palette-scrollbar::-webkit-scrollbar{width:6px}.palette-scrollbar::-webkit-scrollbar-track{background:transparent}.palette-scrollbar::-webkit-scrollbar-thumb{background:#4b5563;border-radius:10px}.palette-scrollbar::-webkit-scrollbar-thumb:hover{background:#6b7280}.tour-highlight{position:relative;z-index:10001;box-shadow:0 0 0 9999px #000000b3,0 0 15px #a855f7cc;border-radius:8px;transition:box-shadow .3s ease-in-out}.background-grid{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;background-image:linear-gradient(to right,rgba(255,255,255,.1) 1px,transparent 1px),linear-gradient(to bottom,rgba(255,255,255,.1) 1px,transparent 1px);background-size:3rem 3rem;z-index:-1;-webkit-mask-image:radial-gradient(ellipse 80% 50% at 50% 0%,black,transparent);mask-image:radial-gradient(ellipse 80% 50% at 50% 0%,black,transparent)}.animate-fade-in{animation:fade-in .5s ease-out forwards}@keyframes fade-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}