:root{--primary-bg: #1e1e1e;--secondary-bg: #252526;--sidebar-bg: #333333;--text-primary: #cccccc;--text-secondary: #858585;--accent-blue: #007acc;--border-color: #3c3c3c;--scrollbar-thumb: #424242;--header-height: 40px;--nav-height: 50px;--sidebar-width: 200px;--mobile-nav-height: 60px}*{margin:0;padding:0;box-sizing:border-box;font-family:Consolas,Monaco,monospace}html{font-size:16px}img{max-width:100%;height:auto;display:block}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--primary-bg)}::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);border-radius:4px}body{background-color:var(--primary-bg);color:var(--text-primary);min-height:100vh;display:flex;flex-direction:column;overflow-x:hidden;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);font-size:1rem}.app-layout{display:flex;flex-direction:column;flex:1;overflow:hidden}.header{background-color:var(--secondary-bg);padding:0 1rem;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border-color);height:var(--header-height);font-size:.75rem;flex-shrink:0;z-index:20}.container{display:flex;flex:1;overflow:hidden;position:relative;flex-direction:column}.nav-bar{background-color:var(--sidebar-bg);border-top:1px solid var(--border-color);display:flex;flex-direction:row;justify-content:space-around;align-items:center;height:var(--mobile-nav-height);width:100%;flex-shrink:0;z-index:15;position:fixed;bottom:0;left:0;right:0}.nav-item{padding:.5rem .2rem;color:var(--text-secondary);text-align:center;cursor:pointer;transition:all .2s ease;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;flex:1;text-decoration:none;font-size:.7rem}.nav-item i{font-size:1.2rem;transition:all .2s ease;margin-bottom:.2rem}.nav-item span{font-size:.7rem;text-transform:uppercase;font-weight:700;transition:all .2s ease}.nav-item.active{color:var(--accent-blue)}.nav-item:hover{color:var(--accent-blue);background-color:#007acc1a}.main-workspace{flex:1;display:flex;flex-direction:column;overflow:hidden;padding-bottom:var(--mobile-nav-height)}.editor-content{flex:1;overflow-y:auto;padding:clamp(1rem,4vw,2rem);display:flex;flex-direction:column;position:relative;min-height:calc(100% - var(--header-height, 0px))}.editor-page{display:none;width:100%;flex-grow:1}.editor-page.active{display:block;animation:fadeIn .2s ease-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(5px)}to{transform:translateY(0);opacity:1}}.hero-block{border:1px solid var(--accent-blue);padding:1.5rem;background:#007acc0d;border-radius:4px;margin-bottom:1.5rem;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;text-align:left}.hero-block h1{font-size:clamp(1.8rem,5vw,3rem);margin-bottom:.5rem}.hero-block p{font-size:clamp(1rem,2.5vw,1.5rem);color:var(--text-secondary)}.card{background:#2d2d30;border:1px solid var(--border-color);padding:1rem;border-radius:4px;margin-bottom:1rem}.card h2{font-size:clamp(1.2rem,3vw,1.8rem);margin-bottom:.8rem}.card h3{font-size:clamp(1rem,2.5vw,1.4rem);margin-bottom:.5rem}.card p,.card ul,.card li,.card span{font-size:clamp(.85rem,2vw,1rem)}.line{display:flex;font-size:.75rem;margin-bottom:.125rem}.num{color:#858585;min-width:1.875rem;text-align:right;padding-right:.625rem;user-select:none}.key{color:#9cdcfe}.str{color:#ce9178}.faq-item{border:1px solid var(--border-color);border-radius:4px;margin-bottom:.5rem;overflow:hidden;transition:all .3s ease}.faq-question{background:#4ec9b01a;padding:.8rem;cursor:pointer;display:flex;justify-content:space-between;align-items:center;transition:all .3s ease}.faq-question:hover{background:#4ec9b026}.faq-question h4{color:#4ec9b0;margin:0;font-size:clamp(.9rem,2.2vw,1.1rem);display:flex;align-items:center}.faq-question h4 i{margin-right:.6rem;font-size:clamp(.8rem,2vw,1rem)}.faq-toggle{color:#4ec9b0;font-size:.9rem;transition:transform .3s ease}.faq-answer{background:#2aa18a0d;padding:0;max-height:0;overflow:hidden;transition:all .3s ease}.faq-answer.active{padding:.8rem;max-height:500px}.faq-answer p,.faq-answer ul,.faq-answer li{font-size:clamp(.8rem,1.8vw,.95rem);line-height:1.5;margin:0}.faq-answer ul{padding-left:1.2rem;margin-top:.6rem}.faq-answer li{margin-bottom:.3rem}.faq-item.active .faq-toggle{transform:rotate(180deg)}.editor-footer{background-color:var(--secondary-bg);color:var(--text-secondary);padding:1rem;text-align:center;border-top:1px solid var(--border-color);flex-shrink:0;font-size:.75rem}.editor-footer p{margin:0 0 .5rem}.editor-footer a{color:var(--text-secondary);margin:0 .5rem;text-decoration:none}@media(min-width:768px){.app-layout{flex-direction:row}.nav-bar{position:fixed;inset:0 auto auto 0;width:var(--sidebar-width);height:100vh;flex-direction:column;justify-content:flex-start;border-right:1px solid var(--border-color);border-top:none;overflow-y:auto}.main-workspace{margin-left:var(--sidebar-width);padding-bottom:0}.nav-item{padding:.8rem 1.2rem;flex-direction:row;justify-content:flex-start;font-size:.9rem}.nav-item i{margin-right:.8rem;margin-bottom:0}.nav-item span{font-size:clamp(.7rem,1.5vw,.9rem)}.hero-block{flex-direction:row;align-items:center;justify-content:space-between;text-align:left}}@media(min-width:1024px){.editor-content{padding:2rem}}