@font-face{font-family:Bungee;font-style:normal;font-display:swap;font-weight:400;src:url(/markon/assets/bungee-vietnamese-400-normal-B6gKbkHm.woff2) format("woff2"),url(/markon/assets/bungee-vietnamese-400-normal-CmjDSWyd.woff) format("woff");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Bungee;font-style:normal;font-display:swap;font-weight:400;src:url(/markon/assets/bungee-latin-ext-400-normal-DWzJMwsA.woff2) format("woff2"),url(/markon/assets/bungee-latin-ext-400-normal-DXe9_7Rr.woff) format("woff");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Bungee;font-style:normal;font-display:swap;font-weight:400;src:url(/markon/assets/bungee-latin-400-normal-Dfnurram.woff2) format("woff2"),url(/markon/assets/bungee-latin-400-normal-DA8IEVW_.woff) format("woff");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Monaspace Argon;font-style:normal;font-display:swap;font-weight:400;src:url(/markon/assets/monaspace-argon-latin-400-normal-RS-2TGNg.woff2) format("woff2"),url(/markon/assets/monaspace-argon-latin-400-normal-DZUN4ACH.woff) format("woff")}@font-face{font-family:Monaspace Argon;font-style:italic;font-display:swap;font-weight:400;src:url(/markon/assets/monaspace-argon-latin-400-italic-DHf095HZ.woff2) format("woff2"),url(/markon/assets/monaspace-argon-latin-400-italic-DZMiIHEH.woff) format("woff")}@font-face{font-family:Monaspace Argon;font-style:normal;font-display:swap;font-weight:700;src:url(/markon/assets/monaspace-argon-latin-700-normal-D9kWRRK5.woff2) format("woff2"),url(/markon/assets/monaspace-argon-latin-700-normal-4y--rLW1.woff) format("woff")}@font-face{font-family:Monaspace Krypton;font-style:normal;font-display:swap;font-weight:400;src:url(/markon/assets/monaspace-krypton-latin-400-normal-DsuVXUab.woff2) format("woff2"),url(/markon/assets/monaspace-krypton-latin-400-normal-D9XlxC9R.woff) format("woff")}@font-face{font-family:Monaspace Krypton;font-style:italic;font-display:swap;font-weight:400;src:url(/markon/assets/monaspace-krypton-latin-400-italic-BoBCEexI.woff2) format("woff2"),url(/markon/assets/monaspace-krypton-latin-400-italic-LWEicbvC.woff) format("woff")}@font-face{font-family:Monaspace Krypton;font-style:normal;font-display:swap;font-weight:700;src:url(/markon/assets/monaspace-krypton-latin-700-normal-D3bMlBdP.woff2) format("woff2"),url(/markon/assets/monaspace-krypton-latin-700-normal-C7unnqeV.woff) format("woff")}:root{--bar-h: 50px;--radius: 14px;--pad: 8px;--bg-alpha: color-mix(in srgb, var(--bg) 40%, transparent);--text-alpha: color-mix(in srgb, var(--text) 10%, transparent);--accent-alpha: color-mix(in srgb, var(--accent) 20%, transparent);--brand-alpha: color-mix(in srgb, var(--brand) 30%, transparent);--shadow: 0 0 20px currentColor;--shadow-strong: 0 0 24px color-mix(in srgb, black 32%, transparent)}html{font-family:Monaspace Krypton,system-ui,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100%;width:100%}body{margin:0;min-height:100dvh;background:var(--bg);width:100%}*{scrollbar-width:thin;scrollbar-color:var(--bg) var(--bg-light)}*::-webkit-scrollbar{width:10px;height:10px}*::-webkit-scrollbar-thumb{background:var(--comment);border-radius:8px;border:2px solid transparent;background-clip:content-box}.profiler-overlay{position:fixed;bottom:20px;left:20px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:16px;padding:8px 12px;font-family:Monaspace Krypton,monospace;font-size:12px;font-weight:600;color:#fff;mix-blend-mode:hard-light;min-width:20px;text-shadow:0 1px 3px rgba(0,0,0,.5);z-index:1000;-webkit-user-select:none;user-select:none;pointer-events:none;transition:all .3s ease;box-shadow:0 4px 20px #00000026}.profiler-overlay.good{background:linear-gradient(135deg,#3b82f633,#9333ea33);border-color:#3b82f64d}.profiler-overlay.ok{background:linear-gradient(135deg,#9333ea33,#ec489933);border-color:#9333ea4d}.profiler-overlay.bad{background:linear-gradient(135deg,#ec489933,#ef444433);border-color:#ec48994d}*::-webkit-scrollbar-track{background:transparent}#wrap{position:relative;inset:0;display:grid;grid-template-columns:1fr 10px 400px;background:var(--bg);min-width:0;width:100%;max-width:none;height:100dvh;overflow:hidden}#editor{font-size:16px;position:relative;min-width:0;overflow:auto;background:var(--bg);max-width:100%;container-type:inline-size}#bar{position:fixed;inset-inline:0;top:0;height:var(--bar-h);display:grid;grid-template-columns:auto 1fr;align-items:center;gap:12px;padding:0 var(--pad);-webkit-backdrop-filter:blur(10px) saturate(120%);backdrop-filter:blur(10px) saturate(120%);background:var(--text-alpha);box-shadow:0 0 30px var(--bg);z-index:100;transition:top .3s ease}#brand{font-weight:700;font-family:Bungee,monospace;font-size:1.2rem;letter-spacing:.5px;display:grid;grid-auto-flow:column;place-items:center;gap:12px;text-shadow:0 0 14px var(--brand);background:linear-gradient(45deg,var(--hint),var(--brand));-webkit-background-clip:text;background-clip:text;color:transparent}#brand img{opacity:.5;margin-left:6px}#actions{display:grid;grid-auto-flow:column;gap:8px;justify-content:end;min-width:0;overflow:visible;padding-right:36px;transition:padding-right .5s ease}#bar.open #actions{padding-right:0}#bar-pull{position:fixed;transition:top .3s ease;color:var(--secondary);z-index:10;width:auto;height:auto;min-width:48px;min-height:48px;right:10px;animation:pulse 10s ease-in-out infinite}button{all:unset;display:grid;grid-auto-flow:column;align-items:center;justify-content:center;padding:2px 4px;opacity:.8;border-radius:14px;color:var(--comment);background:transparent;cursor:pointer;mix-blend-mode:screen;white-space:nowrap;min-width:0;transition:all .2s ease;position:relative;overflow:visible}button:before{content:"";z-index:1;width:14px;height:14px;background:currentColor;position:absolute;margin-left:9px;filter:blur(8px) saturate(.6)}button span{position:absolute;top:100%;left:50%;transform:translate(-50%) translateY(-8px);display:grid;place-items:center;opacity:0;transition:all .2s ease;font-weight:600;font-size:.75rem;text-shadow:0 0 8px currentColor;color:inherit;z-index:10;padding:4px 8px;white-space:nowrap;background:var(--bg);border-radius:8px;box-shadow:0 4px 12px var(--shadow-strong);margin-top:4px;pointer-events:none}button:hover{transform:scale(1.1);opacity:1}button:hover span{opacity:1;transform:translate(-50%) translateY(0)}button:active{transform:translateY(1px)}button iconify-icon{opacity:.9;mix-blend-mode:lighten;transition:opacity .2s ease}button.toggle{color:var(--muted)}button.toggle[aria-pressed=true]{color:var(--primary)}button#toggle-spell[aria-pressed=true]{background:var(--accent-alpha);box-shadow:var(--shadow-strong)}button#toggle-theme{color:var(--meta)}button#toggle-theme iconify-icon{opacity:1}button#copy-to-clipboard:hover{color:var(--success)!important}button#load-from-clipboard:hover{color:var(--warning)!important}button#save-to-file:hover{color:var(--error)!important}button#load-from-file:hover{color:var(--hint)!important}button#toggle-spell:hover{color:var(--string)!important}button#toggle-theme:hover{color:var(--warning)!important}button#github:hover{color:var(--info)!important}button#install-pwa:hover{color:var(--success)!important}button#settings:hover{color:var(--info)!important}@media (hover: none){button span{display:none}}#preview{display:grid;grid-template-columns:1fr;overflow:hidden auto;position:relative;box-sizing:border-box;min-width:0;width:100%;max-width:none}#previewhtml{width:100%;height:100%;overflow:auto;overflow-x:hidden;border:0;outline:none;padding:16px;background:var(--bg-light);color:var(--text);font-family:system-ui,Helvetica,Arial,sans-serif;font-size:15px;line-height:1.5;box-sizing:border-box;word-wrap:break-word;overflow-wrap:break-word;min-width:0;max-width:none}#previewhtml h1,#previewhtml h2,#previewhtml h3,#previewhtml h4,#previewhtml h5,#previewhtml h6{margin:1.2em 0 .4em}#previewhtml p{margin:.6em 0}#previewhtml ul,#previewhtml ol{margin:.6em 0 .6em 1.2em}#previewhtml blockquote{margin:.8em 0;padding-left:1em;border-left:3px solid var(--text-alpha);opacity:.9}#previewhtml hr{border:none;height:1px;background:var(--text-alpha);margin:.8em 0}#previewhtml a{color:var(--accent);text-decoration:underline}#previewhtml pre,#previewhtml code{background:var(--text-alpha);border-radius:14px;font-family:Monaspace Krypton,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}#previewhtml pre{padding:.8em;overflow:auto}#previewhtml code{padding:0 .3em;border-radius:6px}#previewhtml kbd{display:inline-block;padding:2px 6px;font:600 .86em/1.2 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;color:var(--text);background:var(--text-alpha);border:1px solid var(--text-alpha);border-bottom-color:color-mix(in srgb,var(--text) 35%,transparent);border-radius:6px;box-shadow:0 1px color-mix(in srgb,var(--text) 30%,transparent),inset 0 -1px 0 var(--text-alpha);vertical-align:middle;white-space:nowrap}#previewhtml kbd+kbd{margin-left:4px}#previewhtml table{width:100%;border-collapse:collapse;margin:.8em 0;font-size:.95em}#previewhtml table th,#previewhtml table td{border:1px solid color-mix(in srgb,var(--text) 18%,transparent);padding:6px 8px;text-align:left}#previewhtml table thead th{background:var(--text-alpha)}#previewhtml table tbody tr:nth-child(2n){background:color-mix(in srgb,var(--text) 6%,transparent)}#previewhtml .callout{border-left:5px solid var(--brand);background:var(--text-alpha);padding:10px 12px;border-radius:0 10px 10px 0;margin:.8em 0}#previewhtml .callout:before{content:attr(data-title);display:block;font-weight:700;margin-bottom:4px;color:var(--accent);letter-spacing:.5px}#previewhtml .callout[data-kind=note]{border-color:var(--accent)}#previewhtml .callout[data-kind=tip]{border-color:var(--string)}#previewhtml .callout[data-kind=important]{border-color:var(--brand)}#previewhtml .callout[data-kind=warning]{border-color:var(--warning)}#previewhtml .callout[data-kind=caution]{border-color:var(--error)}.preview-toggle{all:unset;display:inline-block;color:var(--comment);position:fixed;margin-left:-15px;transition:all .3s ease;pointer-events:auto;top:100px;z-index:10;cursor:pointer;opacity:0;padding:0;background:transparent;border:none;overflow:visible;line-height:0;vertical-align:top;width:20px;height:20px}.preview-toggle iconify-icon{width:20px;height:20px;display:block;margin:0;padding:0;position:absolute;top:0;left:0}.preview-toggle span{position:absolute;top:100%;left:50%;transform:translate(-50%) translateY(0);display:grid;place-items:center;opacity:0;transition:all .2s ease;font-weight:600;font-size:.75rem;text-shadow:0 0 8px currentColor;color:inherit;z-index:10;padding:4px 8px;white-space:nowrap;background:var(--bg);border-radius:8px;box-shadow:0 4px 12px var(--shadow-strong);margin-top:8px;pointer-events:none}.preview-toggle:hover{color:var(--primary);opacity:1;transform:scale(1.1) translate(0)}.preview-toggle:hover span{opacity:1;transform:translate(-50%) translateY(10px);padding:10px 6px}#split:hover .preview-toggle:hover{transform:scale(1.1) translate(0)}#resize-handle{position:fixed;margin-left:-12px;pointer-events:none;-webkit-user-select:none;user-select:none;top:200px;z-index:5;opacity:1;transform:translate(12px);filter:invert(1) brightness(60%)}.resize-hover-icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);opacity:0;transition:opacity .2s ease;pointer-events:none;z-index:1}#split:hover .resize-hover-icon{opacity:.6}#split{width:14px;cursor:col-resize;background:var(--bg-light);position:relative;user-select:none;-webkit-user-select:none;touch-action:none}#split:before{content:"";position:absolute;inset:0;background:var(--text-alpha);transition:background .15s ease}#split:hover:before{background:var(--bg-alpha)}#split:hover .preview-toggle{transform:scale(1.1);opacity:1;color:var(--operator)}#split.active:before{background:var(--accent)}@keyframes gradientShift{0%{background-position:0% 50%}25%{background-position:100% 0%}50%{background-position:100% 100%}75%{background-position:0% 100%}to{background-position:0% 50%}}@keyframes pulse{0%,to{transform:scale(1) translateY(-26px);opacity:.4}50%{transform:scale(1.2) translateY(-4px);opacity:.1;color:var(--primary)}}#pwa-install-banner{position:fixed;bottom:0;left:0;right:0;z-index:100;display:flex;align-items:center;gap:8px;padding:10px 16px;color:var(--secondary);background:var(--bg-alpha);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 -2px 10px var(--bg);transition:transform .3s ease,opacity .3s ease;transform:translateY(100%);opacity:0;pointer-events:none}#pwa-install-banner button:first-of-type{background:#000!important;color:#fff!important;border:none!important;font-weight:bolder!important}#pwa-install-banner button:before{display:none}#pwa-install-banner iconify-icon{pointer-events:none;color:var(--brand)}#pwa-install-banner[hidden]{transform:translateY(100%);opacity:0;pointer-events:none}#pwa-install-banner:not([hidden]){transform:translateY(0);opacity:1;pointer-events:auto}@media (max-width: 640px){#pwa-install-banner{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;grid-template-areas:"message message" "install dismiss";padding:10px 12px;gap:8px}#pwa-install-banner span{grid-area:message}#pwa-install-banner button:first-of-type{grid-area:install}#pwa-install-banner button:last-of-type{grid-area:dismiss}}html[data-theme=panda][data-mode=dark]{--bg: #1a0f1f;--bg-light: #2d1a2d;--text: #f0f0e8;--brand: #ff1100;--accent: #8866ff;--primary: #bb66ff;--secondary: #22aa88;--comment: #bbbbbb;--meta: #ff1100;--operator: #bb88ee;--keyword: #ff88bb;--regex: #ff99cc;--property: #4488ff;--string: #22aa88;--literal: #ffbb66;--hint: #8866dd;--success: #22bb11;--warning: #ffaa00;--info: #1199cc;--error: #ff1100}html[data-theme=panda][data-mode=light]{--bg: #f5f5f0;--bg-light: #ffffff;--text: #1a1a1a;--brand: #d73a49;--accent: #0366d6;--primary: #8b5cf6;--secondary: #28a745;--comment: #6a737d;--meta: #6f42c1;--operator: #0366d6;--keyword: #d73a49;--regex: #e36209;--property: #0366d6;--string: #032f62;--literal: #6f42c1;--hint: #28a745;--success: #22bb11;--warning: #ffaa00;--info: #1199cc;--error: #cc6600}html[data-theme=muted][data-mode=dark]{--bg: #1a1a1a;--bg-light: #2a2a2a;--text: #e0e0e0;--brand: #b3667a;--accent: #7a7ab3;--primary: #a855f7;--secondary: #66a3a3;--comment: #888888;--meta: #9a7ab3;--operator: #66a3a3;--keyword: #b3667a;--regex: #b37a9a;--property: #7a9ab3;--string: #7ab37a;--literal: #b3a366;--hint: #9a7ab3;--success: #66a366;--warning: #b3a366;--info: #669ab3;--error: #b3667a}html[data-theme=muted][data-mode=light]{--bg: #f5f5f5;--bg-light: #ffffff;--text: #333333;--brand: #8c4a5a;--accent: #5a5a8c;--primary: #9333ea;--secondary: #5a8c5a;--comment: #666666;--meta: #7a4a8c;--operator: #5a7a8c;--keyword: #8c4a5a;--regex: #8c4a7a;--property: #5a7a8c;--string: #5a8c5a;--literal: #8c7a4a;--hint: #7a4a8c;--success: #5a8c5a;--warning: #8c7a4a;--info: #5a7a8c;--error: #8c4a5a}html[data-theme=nord][data-mode=dark]{--bg: #2e3440;--bg-light: #3b4252;--text: #d8dee9;--brand: #88c0d0;--accent: #5e81ac;--primary: #c084fc;--secondary: #a3be8c;--comment: #6c7a8a;--meta: #88c0d0;--operator: #d08770;--keyword: #b48ead;--regex: #bf616a;--property: #81a1c1;--string: #a3be8c;--literal: #ebcb8b;--hint: #88c0d0;--success: #a3be8c;--warning: #ebcb8b;--info: #88c0d0;--error: #bf616a}html[data-theme=nord][data-mode=light]{--bg: #eceff4;--bg-light: #ffffff;--text: #2e3440;--brand: #5e81ac;--accent: #88c0d0;--primary: #a855f7;--secondary: #a3be8c;--comment: #4c566a;--meta: #5e81ac;--operator: #d08770;--keyword: #b48ead;--regex: #bf616a;--property: #5e81ac;--string: #a3be8c;--literal: #d08770;--hint: #88c0d0;--success: #a3be8c;--warning: #d08770;--info: #5e81ac;--error: #bf616a}html[data-theme=monokai][data-mode=dark]{--bg: #272822;--bg-light: #3e3d32;--text: #f8f8f2;--brand: #f92672;--accent: #66d9ef;--primary: #d8b4fe;--secondary: #a6e22e;--comment: #75715e;--meta: #fd971f;--operator: #66d9ef;--keyword: #f92672;--regex: #fd971f;--property: #66d9ef;--string: #e6db74;--literal: #ae81ff;--hint: #a6e22e;--success: #a6e22e;--warning: #e6db74;--info: #66d9ef;--error: #f92672}html[data-theme=monokai][data-mode=light]{--bg: #fbf8f2;--bg-light: #ffffff;--text: #2b2a28;--brand: #c6286b;--accent: #006b8f;--primary: #6f42c1;--secondary: #2d8f3a;--comment: #6a737d;--meta: #a66bff;--operator: #006b8f;--keyword: #c6286b;--regex: #d65a07;--property: #006b8f;--string: #8a5b00;--literal: #a66bff;--hint: #2d8f3a;--success: #2d8f3a;--warning: #d65a07;--info: #006b8f;--error: #c6286b}html[data-theme=dracula][data-mode=dark]{--bg: #282a36;--bg-light: #44475a;--text: #f8f8f2;--brand: #ff79c6;--accent: #8be9fd;--primary: #e879f9;--secondary: #50fa7b;--comment: #6272a4;--meta: #ffb86c;--operator: #bd93f9;--keyword: #ff79c6;--regex: #ffb86c;--property: #8be9fd;--string: #f1fa8c;--literal: #bd93f9;--hint: #50fa7b;--success: #50fa7b;--warning: #ffb86c;--info: #8be9fd;--error: #ff5555}html[data-theme=dracula][data-mode=light]{--bg: #f4f7fb;--bg-light: #ffffff;--text: #26272b;--brand: #b0476a;--accent: #0366d6;--primary: #8b5cf6;--secondary: #238a4b;--comment: #6a737d;--meta: #e36209;--operator: #6f42c1;--keyword: #b0476a;--regex: #e36209;--property: #0366d6;--string: #0b3a62;--literal: #6f42c1;--hint: #238a4b;--success: #238a4b;--warning: #e36209;--info: #0366d6;--error: #b0476a}html[data-theme=solarized][data-mode=dark]{--bg: #002b36;--bg-light: #073642;--text: #839496;--brand: #d33682;--accent: #268bd2;--primary: #c084fc;--secondary: #859900;--comment: #586e75;--meta: #2aa198;--operator: #cb4b16;--keyword: #6c71c4;--regex: #dc322f;--property: #268bd2;--string: #859900;--literal: #b58900;--hint: #2aa198;--success: #859900;--warning: #b58900;--info: #268bd2;--error: #dc322f}html[data-theme=solarized][data-mode=light]{--bg: #fdf6e3;--bg-light: #eee8d5;--text: #657b83;--brand: #d33682;--accent: #268bd2;--primary: #c084fc;--secondary: #859900;--comment: #93a1a1;--meta: #2aa198;--operator: #cb4b16;--keyword: #6c71c4;--regex: #dc322f;--property: #268bd2;--string: #859900;--literal: #b58900;--hint: #2aa198;--success: #859900;--warning: #b58900;--info: #268bd2;--error: #dc322f}html[data-theme=github][data-mode=dark]{--bg: #0d1117;--bg-light: #161b22;--text: #e6edf3;--brand: #f85149;--accent: #58a6ff;--primary: #d8b4fe;--secondary: #7ee787;--comment: #7d8590;--meta: #ffa657;--operator: #f85149;--keyword: #ff7b72;--regex: #ffa657;--property: #79c0ff;--string: #a5d6ff;--literal: #d2a8ff;--hint: #7ee787;--success: #7ee787;--warning: #ffa657;--info: #58a6ff;--error: #f85149}html[data-theme=github][data-mode=light]{--bg: #ffffff;--bg-light: #f6f8fa;--text: #24292f;--brand: #d73a49;--accent: #0969da;--primary: #8b5cf6;--secondary: #28a745;--comment: #6a737d;--meta: #e36209;--operator: #0969da;--keyword: #d73a49;--regex: #e36209;--property: #0969da;--string: #032f62;--literal: #6f42c1;--hint: #28a745;--success: #28a745;--warning: #e36209;--info: #0969da;--error: #d73a49}html[data-theme=one-dark][data-mode=dark]{--bg: #282c34;--bg-light: #21252b;--text: #abb2bf;--brand: #e06c75;--accent: #61afef;--primary: #c084fc;--secondary: #98c379;--comment: #5c6370;--meta: #d19a66;--operator: #56b6c2;--keyword: #c678dd;--regex: #d19a66;--property: #61afef;--string: #98c379;--literal: #e5c07b;--hint: #56b6c2;--success: #98c379;--warning: #e5c07b;--info: #61afef;--error: #e06c75}html[data-theme=one-dark][data-mode=light]{--bg: #fafafa;--bg-light: #ffffff;--text: #383a42;--brand: #e45649;--accent: #0184bc;--primary: #a855f7;--secondary: #50a14f;--comment: #a0a1a7;--meta: #986801;--operator: #0997b3;--keyword: #a626a4;--regex: #986801;--property: #0184bc;--string: #50a14f;--literal: #c18401;--hint: #0997b3;--success: #50a14f;--warning: #c18401;--info: #0184bc;--error: #e45649}html[data-theme=gruvbox][data-mode=dark]{--bg: #282828;--bg-light: #3c3836;--text: #ebdbb2;--brand: #fb4934;--accent: #83a598;--primary: #e879f9;--secondary: #b8bb26;--comment: #928374;--meta: #fe8019;--operator: #83a598;--keyword: #fb4934;--regex: #fe8019;--property: #83a598;--string: #b8bb26;--literal: #fabd2f;--hint: #8ec07c;--success: #b8bb26;--warning: #fabd2f;--info: #83a598;--error: #fb4934}html[data-theme=gruvbox][data-mode=light]{--bg: #fbf1c7;--bg-light: #f2e5bc;--text: #3c3836;--brand: #cc241d;--accent: #458588;--primary: #c084fc;--secondary: #98971a;--comment: #928374;--meta: #b16286;--operator: #83a598;--keyword: #cc241d;--regex: #d65d0e;--property: #458588;--string: #98971a;--literal: #d79921;--hint: #689d6a;--success: #98971a;--warning: #d79921;--info: #458588;--error: #cc241d}html[data-theme=tokyo-night][data-mode=dark]{--bg: #1a1b26;--bg-light: #24283b;--text: #a9b1d6;--brand: #f7768e;--accent: #7aa2f7;--primary: #d8b4fe;--secondary: #9ece6a;--comment: #565f89;--meta: #73daca;--operator: #f7768e;--keyword: #bb9af7;--regex: #ff9e64;--property: #7aa2f7;--string: #9ece6a;--literal: #e0af68;--hint: #73daca;--success: #9ece6a;--warning: #e0af68;--info: #7aa2f7;--error: #f7768e}html[data-theme=tokyo-night][data-mode=light]{--bg: #e8e9ed;--bg-light: #ffffff;--text: #2d3748;--brand: #e53e3e;--accent: #3182ce;--primary: #a855f7;--secondary: #38a169;--comment: #718096;--meta: #319795;--operator: #e53e3e;--keyword: #805ad5;--regex: #dd6b20;--property: #3182ce;--string: #38a169;--literal: #d69e2e;--hint: #319795;--success: #38a169;--warning: #d69e2e;--info: #3182ce;--error: #e53e3e}html:not([data-theme]){--bg: #1a0f1f;--bg-light: #2d1a2d;--text: #f0f0e8;--brand: #ff1100;--accent: #8866ff;--primary: #bb66ff;--secondary: #22aa88;--comment: #bbbbbb;--meta: #ff1100;--operator: #bb88ee;--keyword: #ff88bb;--regex: #ff99cc;--property: #4488ff;--string: #22aa88;--literal: #ffbb66;--hint: #8866dd;--success: #22bb11;--warning: #ffaa00;--info: #1199cc;--error: #ff1100}#settings-system{display:grid;grid-template-rows:1fr auto;gap:20px;background:var(--bg-alpha);border-radius:20px;padding:20px;max-width:700px;width:calc(90vw - 40px);max-height:calc(90vh - 40px);box-shadow:var(--shadow-strong);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:none;color:var(--text);box-sizing:border-box;overflow:hidden;position:relative}#settings-system::backdrop{background:var(--bg-alpha);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.settings-close{position:absolute;top:12px;right:12px;border:none;color:var(--secondary);cursor:pointer;padding:6px;border-radius:50%;font-size:20px;width:36px;height:36px;display:grid;place-items:center;transition:all .2s ease;z-index:10;background:var(--bg-alpha);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.settings-close:hover{color:var(--accent);transform:scale(1.1)}.settings-content{display:grid;gap:20px;min-width:0;overflow-y:auto;overflow-x:hidden}.settings-section{display:grid;gap:12px;min-width:0}.settings-section-title{margin:0;color:var(--accent);font-size:16px;font-weight:600;font-family:Bungee,monospace;border-bottom:1px solid var(--text-alpha);padding-bottom:4px}.settings-shortcuts{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;min-width:0}.settings-item{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:10px;padding:12px 16px;background:var(--bg-alpha);border-radius:16px;transition:background .2s ease,transform .2s ease,box-shadow .2s ease;min-width:0}.settings-item:hover{background:var(--accent-alpha);transform:translateY(-2px);box-shadow:0 4px 20px var(--accent-alpha)}.settings-item>span:first-of-type{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}.settings-key{background:var(--primary);border:none;border-radius:8px;padding:6px 8px;font-size:12px;font-family:Monaspace Krypton,ui-monospace,monospace;color:var(--bg);font-weight:600;min-width:28px;text-align:center;box-shadow:0 2px 8px color-mix(in srgb,var(--primary) 30%,transparent);white-space:nowrap;display:inline-block}.settings-theme-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px;min-width:0}.settings-theme-card{background:var(--bg-alpha);border:2px solid transparent;border-radius:16px;padding:12px;cursor:pointer;transition:all .2s ease;text-align:center;min-width:0}.settings-theme-card:hover{background:var(--accent-alpha);transform:translateY(-2px);box-shadow:0 4px 20px var(--accent-alpha)}.settings-theme-card.selected{border-color:var(--accent);background:var(--accent-alpha)}.settings-theme-name{font-weight:600;color:var(--text);margin-bottom:4px;font-family:Monaspace Krypton,system-ui,Helvetica,Arial,sans-serif}.settings-theme-preview{display:grid;grid-auto-flow:column;justify-content:center;gap:4px}.settings-theme-color{width:12px;height:12px;border-radius:50%;border:1px solid var(--text-alpha)}.settings-theme-card:has(.settings-theme-control-btn){display:grid;place-items:center}.settings-theme-control-btn{width:auto;min-width:80px;background:transparent;border:none;outline:none;border-radius:12px;color:var(--accent);font-size:14px;font-weight:800;padding:8px 12px;cursor:pointer;transition:all .2s ease;font-family:Monaspace Krypton,system-ui,Helvetica,Arial,sans-serif;display:grid;grid-auto-flow:column;align-items:center;gap:6px}.settings-theme-control-btn iconify-icon{opacity:.9;transition:all .2s ease}.settings-theme-control-btn span{font-size:11px;font-weight:600;white-space:nowrap}.settings-theme-control-btn:hover{background:var(--accent);color:var(--bg)}.settings-theme-control-btn:hover iconify-icon{opacity:1;transform:scale(1.1)}.settings-footer{text-align:center;padding-top:12px;border-top:1px solid var(--text-alpha);color:var(--comment);font-size:13px;font-weight:500;font-family:Monaspace Krypton,system-ui,Helvetica,Arial,sans-serif}.settings-footer .heart{display:inline-block;background:linear-gradient(45deg,#f10,#48f,#fd4,#4fd,#f48);background-size:300% 300%;animation:gradientShift 2s ease-in-out infinite;background-clip:text;-webkit-background-clip:text;color:transparent;font-size:18px;font-weight:700}.settings-footer a{color:var(--secondary);text-decoration:none;transition:color .2s ease}.settings-footer a:hover{color:var(--brand)}.settings-version{color:var(--comment);font-weight:600;font-family:Monaspace Krypton,ui-monospace,monospace;font-size:12px;background:var(--bg-light);border-radius:4px;padding:2px 6px}@media (max-width: 640px){#settings-system{width:100vw;height:100vh;max-width:none;max-height:none;border-radius:0;padding:16px;margin:0}.settings-shortcuts{grid-template-columns:1fr}}
