:root{--spacing-unit: 8px;--font-main: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-mono: "Fira Code", Consolas, Monaco, "Courier New", monospace;--bg-color: #121212;--bg-secondary: #1e1e1e;--text-color: #E0E0E0;--text-muted: #A0A0A0;--border-color: #333333;--accent-cyan: #00FFFF;--accent-lime: #32CD32;--accent-orange: #FF4500;--editor-bg: #1e1e1e}[data-theme=light]{--bg-color: #ffffff;--bg-secondary: #f4f4f4;--text-color: #212121;--text-muted: #666666;--border-color: #e0e0e0;--accent-cyan: #008080;--accent-lime: #228B22;--accent-orange: #D35400;--editor-bg: #f5f5f5}body{margin:0;padding:0;background-color:var(--bg-color);color:var(--text-color);font-family:var(--font-main);-webkit-font-smoothing:antialiased;transition:background-color .3s,color .3s}*{box-sizing:border-box}h1,h2,h3,h4,h5,h6{font-weight:600;margin:0 0 1rem}a{color:var(--text-color);text-decoration:none;transition:color .2s}a:hover{color:var(--accent-cyan)}button{background:var(--bg-secondary);border:1px solid var(--border-color);color:var(--text-color);padding:.5rem 1rem;font-family:var(--font-main);cursor:pointer;border-radius:4px;transition:all .2s}button:hover{border-color:var(--accent-cyan);color:var(--accent-cyan)}input,textarea,select{background:var(--bg-secondary);border:1px solid var(--border-color);color:var(--text-color);padding:.5rem;font-family:var(--font-mono);width:100%}input:focus,textarea:focus,select:focus{outline:none;border-color:var(--accent-cyan)}.layout-container{display:flex;min-height:100vh}.sidebar{width:250px;border-right:1px solid var(--border-color);padding:2rem;display:flex;flex-direction:column;background:var(--bg-color);transition:background-color .3s;height:100vh;position:sticky;top:0;overflow-y:auto}.main-content{flex:1;padding:3rem;background:var(--bg-color);max-width:100%;position:relative}@media(max-width:768px){.layout-container{flex-direction:column}.sidebar{width:100%;height:auto;border-right:none;border-bottom:1px solid var(--border-color);padding:1rem;position:relative}.ad-placeholder-container{display:none}.main-content{padding:1rem}}.nav-section{margin-bottom:2rem}.nav-title{font-size:.8rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em;margin-bottom:1rem}.nav-link{display:block;padding:.5rem 0;color:var(--text-color);opacity:.8}.nav-link:hover,.nav-link.active{opacity:1;color:var(--accent-cyan);padding-left:5px}.tool-header{margin-bottom:2rem;border-bottom:1px solid var(--border-color);padding-bottom:1rem;display:flex;justify-content:space-between;align-items:center}.tool-title{font-size:2rem;color:var(--accent-cyan)}.result-box{background:var(--editor-bg);border:1px solid var(--border-color);padding:1rem;font-family:var(--font-mono);margin-top:1rem;white-space:pre-wrap;word-break:break-all;border-radius:4px}.error-text{color:var(--accent-orange)}.success-text{color:var(--accent-lime)}.theme-toggle{position:fixed;top:16px;right:20px;z-index:1200;display:inline-flex;align-items:center;gap:.4rem;background:var(--bg-secondary);border:1px solid var(--border-color);color:var(--text-color);padding:.45rem .9rem;border-radius:999px;box-shadow:0 6px 16px #00000040}.theme-toggle:hover{border-color:var(--accent-cyan);color:var(--accent-cyan)}@media(max-width:768px){.theme-toggle{top:12px;right:12px}}.prism-editor{background:var(--editor-bg);min-height:200px;font-family:var(--font-mono);font-size:14px;border:1px solid var(--border-color);border-radius:4px;line-height:1.5}textarea.prism-editor-textarea{outline:none!important}[data-theme=light] .prism-editor{background:#f5f5f5;color:#333}[data-theme=light] .token.comment,[data-theme=light] .token.prolog,[data-theme=light] .token.doctype,[data-theme=light] .token.cdata{color:#708090}[data-theme=light] .token.punctuation{color:#555}[data-theme=light] .token.property,[data-theme=light] .token.tag,[data-theme=light] .token.boolean,[data-theme=light] .token.number,[data-theme=light] .token.constant,[data-theme=light] .token.symbol,[data-theme=light] .token.deleted{color:#905}[data-theme=light] .token.selector,[data-theme=light] .token.attr-name,[data-theme=light] .token.string,[data-theme=light] .token.char,[data-theme=light] .token.builtin,[data-theme=light] .token.inserted{color:#690}[data-theme=light] .token.operator,[data-theme=light] .token.entity,[data-theme=light] .token.url,[data-theme=light] .language-css .token.string,[data-theme=light] .style .token.string{color:#9a6e3a}[data-theme=light] .token.atrule,[data-theme=light] .token.attr-value,[data-theme=light] .token.keyword{color:#07a}[data-theme=light] .token.function,[data-theme=light] .token.class-name{color:#dd4a68}[data-theme=light] .token.regex,[data-theme=light] .token.important,[data-theme=light] .token.variable{color:#e90}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-color)}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}code[class*=language-],pre[class*=language-]{color:#ccc;background:none;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}pre[class*=language-]{padding:1em;margin:.5em 0;overflow:auto}:not(pre)>code[class*=language-],pre[class*=language-]{background:#2d2d2d}:not(pre)>code[class*=language-]{padding:.1em;border-radius:.3em;white-space:normal}.token.comment,.token.block-comment,.token.prolog,.token.doctype,.token.cdata{color:#999}.token.punctuation{color:#ccc}.token.tag,.token.attr-name,.token.namespace,.token.deleted{color:#e2777a}.token.function-name{color:#6196cc}.token.boolean,.token.number,.token.function{color:#f08d49}.token.property,.token.class-name,.token.constant,.token.symbol{color:#f8c555}.token.selector,.token.important,.token.atrule,.token.keyword,.token.builtin{color:#cc99cd}.token.string,.token.char,.token.attr-value,.token.regex,.token.variable{color:#7ec699}.token.operator,.token.entity,.token.url{color:#67cdcc}.token.important,.token.bold{font-weight:700}.token.italic{font-style:italic}.token.entity{cursor:help}.token.inserted{color:green}