@import "https://fonts.googleapis.com/css2?family=Helvetica+Neue:wght@400;500;700&family=Arial:wght@400;700&display=swap";:root{--cc-bg-light:#f4f6f8;--cc-primary-blue:#0056b3;--cc-text-main:#333;--cc-text-muted:#666;--cc-border:#e0e0e0;--cc-surface:#fff;--cc-hero-grad-start:#e0f7fa;--cc-hero-grad-end:#fff;--btn-sc:#f39c12;--btn-lc:#2ecc71;--btn-uc:#3498db;--btn-cc:#9b59b6;--btn-ac:#f1c40f;--btn-tc:#1abc9c;--btn-ic:#e74c3c;--radius-xs:3px;--radius-sm:4px;--font-main:"Helvetica Neue", Arial, sans-serif;--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace}[data-theme=dark]{--cc-bg-light:#121212;--cc-primary-blue:#66b2ff;--cc-text-main:#e0e0e0;--cc-text-muted:#a0a0a0;--cc-border:#333;--cc-surface:#1e1e1e;--cc-hero-grad-start:#1a2634;--cc-hero-grad-end:#121212}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{font-family:var(--font-main);background-color:var(--cc-bg-light);color:var(--cc-text-main);flex-direction:column;line-height:1.6;display:flex}a{color:var(--cc-primary-blue);text-decoration:none}a:hover{text-decoration:underline}.cc-header{background-color:var(--cc-surface);border-bottom:1px solid var(--cc-border);z-index:10;height:60px;position:relative}.cc-header-container{justify-content:space-between;align-items:center;max-width:1400px;height:100%;margin:0 auto;padding:0 1.5rem;display:flex}.desktop-nav{align-items:center;gap:1.5rem;display:flex}.nav-item{display:inline-block;position:relative}.nav-item>a{color:var(--cc-text-main);align-items:center;padding:1rem 0;font-size:.95rem;font-weight:500;transition:color .2s;display:inline-flex}.nav-item:hover>a{color:var(--cc-primary-blue);text-decoration:none}.nav-dropdown-content{background-color:var(--cc-surface);z-index:20;border:1px solid var(--cc-border);border-radius:var(--radius-sm);min-width:250px;padding:.5rem 0;display:none;position:absolute;top:100%;left:0;box-shadow:0 8px 16px #0000001a}.nav-item:hover .nav-dropdown-content{display:block}.nav-dropdown-content a{color:var(--cc-text-main);padding:10px 16px;font-size:.9rem;text-decoration:none;display:block}.nav-dropdown-content a:hover{background-color:var(--cc-bg-light);color:var(--cc-primary-blue)}.mobile-menu-btn{cursor:pointer;color:var(--cc-text-main);background:0 0;border:none;align-items:center}.logo{color:var(--cc-text-main);align-items:center;gap:.5rem;font-size:1.4rem;font-weight:700;display:flex}.logo-text{color:var(--cc-text-main)}.logo-highlight{color:var(--cc-primary-blue)}.logo-icon{width:28px;height:28px;stroke:var(--cc-primary-blue)}.cc-main-content{flex:1;width:100%}.hero-section{background:linear-gradient(180deg, var(--cc-hero-grad-start) 0%, var(--cc-hero-grad-end) 100%);text-align:center;padding:3rem 1.5rem}.hero-heading{color:#1a1a1a;margin-bottom:.5rem;font-size:2rem;font-weight:700}.hero-subheading{color:var(--cc-text-muted);font-size:1.1rem;font-weight:400}.editor-wrapper{max-width:1000px;margin:2rem auto;padding:0 1rem}.cc-textarea{border:1px solid var(--cc-border);border-radius:var(--radius-sm) var(--radius-sm) 0 0;width:100%;height:350px;font-family:var(--font-main);resize:vertical;background:var(--cc-surface);color:var(--cc-text-main);outline:none;padding:1.5rem;font-size:1rem;line-height:1.5;box-shadow:inset 0 2px 4px #00000005}.cc-textarea.code-font{font-family:var(--font-mono);background:var(--cc-surface);font-size:.9rem}.cc-textarea:focus{border-color:var(--cc-primary-blue);box-shadow:inset 0 1px 3px #0000000d,0 0 0 3px #0056b31a}.editor-bottom-bar{background-color:var(--cc-surface);border:1px solid var(--cc-border);border-radius:0 0 var(--radius-sm) var(--radius-sm);border-top:none;justify-content:space-between;align-items:center;margin-bottom:1.5rem;padding:.5rem 1rem;display:flex}.io-actions{gap:.5rem;display:flex}.icon-btn{background:var(--cc-bg-light);border:1px solid var(--cc-border);border-radius:var(--radius-xs);cursor:pointer;color:var(--cc-text-muted);justify-content:center;align-items:center;padding:.4rem .6rem;transition:all .2s;display:flex}.icon-btn:hover{background:var(--cc-border);color:var(--cc-text-main)}.editor-stats{color:var(--cc-text-muted);font-size:.9rem}.editor-stats span{color:var(--cc-text-main);font-weight:500}.action-buttons-grid{flex-wrap:wrap;justify-content:flex-start;gap:.5rem;margin-bottom:2rem;display:flex}.cc-action-btn{background:var(--cc-surface);border:1px solid var(--cc-border);border-radius:var(--radius-xs);cursor:pointer;color:var(--cc-text-main);align-items:center;padding:.4rem .8rem .4rem .4rem;font-size:.95rem;transition:all .15s;display:inline-flex}.cc-action-btn:hover{background:var(--cc-bg-light);border-color:var(--cc-text-muted)}.btn-icon{color:#fff;border-radius:2px;justify-content:center;align-items:center;width:24px;height:24px;margin-right:.6rem;font-size:.75rem;font-weight:700;display:inline-flex}.bg-sc{background-color:var(--btn-sc)}.bg-lc{background-color:var(--btn-lc)}.bg-uc{background-color:var(--btn-uc)}.bg-cc{background-color:var(--btn-cc)}.bg-ac{background-color:var(--btn-ac)}.bg-tc{background-color:var(--btn-tc)}.bg-ic{background-color:var(--btn-ic)}.bg-default{background-color:var(--cc-primary-blue)}.dual-pane-editor{grid-template-columns:1fr 1fr;gap:1.5rem;display:grid}@media (width<=768px){.dual-pane-editor{grid-template-columns:1fr}}.pane.flex-col{flex-direction:column;display:flex}.featured-tools-section{max-width:1000px;margin:3rem auto;padding:0 1rem}.featured-tools-grid{grid-template-columns:1fr 1fr;gap:1.5rem;display:grid}.tool-card{background:var(--cc-surface);border:1px solid var(--cc-border);border-radius:var(--radius-sm);padding:1.5rem}.tool-card h3{color:var(--cc-primary-blue);margin-bottom:.5rem;font-size:1.1rem}.tool-card h3 a{-webkit-text-decoration:underline #0000;text-decoration:underline #0000;transition:text-decoration-color .2s}.tool-card h3 a:hover{-webkit-text-decoration-color:var(--cc-primary-blue);text-decoration-color:var(--cc-primary-blue)}.tool-card p{color:var(--cc-text-main);margin-bottom:1rem;font-size:.95rem}.tool-preview-box{background:var(--cc-bg-light);border:1px dashed var(--cc-border);color:var(--cc-text-muted);border-radius:var(--radius-xs);padding:1rem;font-family:inherit;font-size:.9rem}.cc-footer{background:var(--cc-surface);border-top:1px solid var(--cc-border);margin-top:4rem;padding:2rem 0}.footer-links a{color:var(--cc-text-muted);font-size:.9rem;transition:color .2s}.footer-links a:hover{color:var(--cc-primary-blue);text-decoration:underline}.seo-article{background:var(--cc-surface);border:1px solid var(--cc-border);border-radius:var(--radius-sm);max-width:1000px;color:var(--cc-text-main);margin:3rem auto;padding:2rem}.seo-article h2{color:var(--cc-primary-blue);border-bottom:2px solid var(--cc-bg-light);margin-bottom:1rem;padding-bottom:.5rem;font-size:1.5rem}.seo-article h3{margin-top:1.5rem;margin-bottom:.5rem;font-size:1.2rem}.seo-article p{margin-bottom:1rem;line-height:1.7}.seo-article ul{margin-bottom:1.5rem;margin-left:2rem}.seo-article li{margin-bottom:.5rem}@media (width<=768px){.desktop-nav{display:none}.mobile-menu-btn{display:flex!important}.featured-tools-grid,.footer-directory{grid-template-columns:1fr}.editor-bottom-bar{flex-direction:column;align-items:flex-start;gap:1rem}.mobile-nav{background:var(--cc-surface);border-top:1px solid var(--cc-border);border-bottom:1px solid var(--cc-border);z-index:9;flex-direction:column;padding:.5rem 0;display:flex;position:absolute;top:60px;left:0;right:0;box-shadow:0 4px 6px -1px #0000001a}.mobile-nav.open{display:flex!important}.mobile-link{color:var(--cc-text-main);border-bottom:1px solid var(--cc-bg-light);padding:1rem 1.5rem;font-weight:500}.mobile-link:last-child{border-bottom:none}}