@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";@font-face{font-family:Alegreya Sans SC Thin;src:url(/AlegreyaSansSC-Thin.ttf)format("truetype");font-weight:100}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;width:100%;margin:0;padding:0}html{overscroll-behavior:none;overscroll-behavior-y:none;background-color:#e8edf2}body{overscroll-behavior:none;min-height:100dvh;padding-bottom:env(safe-area-inset-bottom);background-color:#0000}#root{min-height:100dvh}html{overscroll-behavior:none;overscroll-behavior-y:none;background-color:#e8edf2;transition:background-color .6s}body{background-color:#0000}.app{overscroll-behavior:none;color:#1d1d1f;width:100%;min-height:100dvh;font-family:-apple-system,BlinkMacSystemFont,SF Pro Display,SF Pro Text,Inter,Helvetica Neue,sans-serif;position:relative;overflow-x:clip}.app:before{content:"";z-index:0;pointer-events:none;background:linear-gradient(145deg,#f0f4f8 0%,#f5f5f7 50%,#e8edf2 100%);transition:background .6s;position:fixed;inset:-150px 0}.bg-blur{z-index:1;pointer-events:none;border-radius:50%;position:fixed}.orb-1{filter:blur(100px);background:#00c7be2e;width:500px;height:500px;top:-100px;right:-100px}.orb-2{filter:blur(100px);background:#ff2d5524;width:400px;height:400px;bottom:-80px;left:-60px}.header{z-index:10;padding:16px 40px;padding-top:max(16px, env(safe-area-inset-top));align-items:center;gap:14px;display:flex;position:relative}@media (width<=768px){.header{flex-wrap:wrap;padding:12px 20px}}@media (width<=480px){.header{padding:10px 16px}}.author-tag{white-space:nowrap;margin-top:2px;font-size:11px;font-weight:500;transition:color .4s}@media (width<=900px){.header-text{max-width:100%}}.header-text{flex-direction:column;gap:1px;max-width:320px;display:flex}.header-logo{border-radius:9px;flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;transition:background .4s,color .4s;display:flex}.title-text{letter-spacing:-.36px;margin:0;font-size:22px;font-weight:600;transition:color .4s}.subtitle-text{margin:0;font-size:14px;font-weight:400;transition:color .4s}.main-grid{z-index:10;grid-template-columns:1fr 1fr;gap:20px;max-width:1340px;margin:0 auto;padding:24px 40px 20px;display:grid;position:relative}@media (width<=900px){.main-grid{grid-template-columns:1fr;gap:18px;padding:20px 24px}}@media (width<=768px){.main-grid{gap:14px;padding:12px 16px 16px}}@media (width<=480px){.main-grid{gap:10px;padding:8px 12px 12px}}.glass-card{-webkit-backdrop-filter:blur(60px)saturate(200%);background:linear-gradient(135deg,#ffffff80 0%,#ffffff40 40%,#ffffff26 60%,#ffffff59 100%);border:1px solid #ffffff8c;border-radius:24px;flex-direction:column;padding:22px;transition:background .4s,border-color .4s,box-shadow .4s;display:flex;box-shadow:0 8px 32px #0000000f,0 2px 8px #0000000a,inset 0 1px 1px #ffffffa6,inset 0 -.5px 1px #ffffff40,inset 0 0 0 .5px #ffffff26}@media (width<=768px){.glass-card{border-radius:18px;padding:18px}}@media (width<=480px){.glass-card{border-radius:16px;padding:14px}}.card-header{flex-wrap:wrap;flex-shrink:0;justify-content:space-between;align-items:center;gap:10px;margin-bottom:14px;display:flex}.card-title{text-transform:uppercase;letter-spacing:.6px;align-items:center;gap:7px;font-size:12px;font-weight:600;transition:color .4s;display:flex}.preview-actions{align-items:center;gap:14px;display:flex}@media (width<=768px){.preview-actions{justify-content:space-between;width:100%}}.editor-card{min-height:480px}@media (width<=768px){.editor-card{min-height:300px}}@media (width<=480px){.editor-card{min-height:240px}}.code-textarea{resize:none;-webkit-backdrop-filter:blur(20px)saturate(150%);border-radius:16px;outline:none;flex:1;width:100%;padding:16px;font-family:SF Mono,Fira Code,Cascadia Code,Consolas,monospace;font-size:13px;line-height:1.6;transition:border-color .2s,box-shadow .2s,background .4s,color .4s}.code-textarea::placeholder{transition:color .4s}.code-textarea:focus{box-shadow:0 0 0 3.5px #0071e326}.error-banner{border-radius:14px;align-items:center;gap:8px;margin-top:12px;padding:10px 14px;font-size:13px;transition:background .4s;display:flex}.preview-card{min-height:480px;position:relative}@media (width<=768px){.preview-card{min-height:auto}}.flowchart{-webkit-backdrop-filter:blur(10px)saturate(120%);border-radius:16px;flex:1;justify-content:center;align-items:center;padding:20px;transition:background .4s,border-color .4s;display:flex;overflow:auto}.flowchart svg{max-width:100%;height:auto}.toggle-label{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:8px;display:flex}.hidden-checkbox{opacity:0;width:0;height:0;position:absolute}.toggle-track{border-radius:294px;width:51px;height:31px;transition:background .3s,box-shadow .3s;position:relative;overflow:hidden;box-shadow:inset 0 1px 3px #0000001f,inset 0 .5px 1px #00000014,0 .5px #ffffff80}.toggle-track:before{content:"";border-radius:inherit;pointer-events:none;background:linear-gradient(#ffffff4d 0%,#fff0 50%,#0000000d 100%);position:absolute;inset:0}.toggle-thumb{-webkit-backdrop-filter:blur(8px)saturate(150%);background:linear-gradient(#fffffff2 0%,#ffffffb3 100%);border-radius:50%;justify-content:center;align-items:center;width:27px;height:27px;transition:transform .3s cubic-bezier(.34,1.56,.64,1),background .3s;display:flex;position:absolute;top:2px;left:2px;box-shadow:0 2px 5px #0000002e,0 1px 2px #00000026,inset 0 1px #fffc}.theme-icon{transition:opacity .25s}.btn{cursor:pointer;white-space:nowrap;-webkit-user-select:none;user-select:none;border:none;border-radius:980px;justify-content:center;align-items:center;gap:6px;min-height:36px;padding:8px 18px;font-family:inherit;font-size:13px;font-weight:500;transition:all .2s;display:inline-flex;position:relative;overflow:hidden}.btn:before{content:"";border-radius:inherit;pointer-events:none;background:linear-gradient(#ffffff40 0%,#fff0 50%,#0000000f 100%);position:absolute;inset:0}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-spinner{border:2px solid #0000;border-top-color:currentColor;border-radius:50%;width:14px;height:14px;animation:.6s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}[data-theme=night] .header-logo{color:#1d1d1f;background:#0000000f}[data-theme=night] .title-text{color:#1d1d1f}[data-theme=night] .subtitle-text{color:#86868b}[data-theme=night] .author-tag{color:#6e6e73}[data-theme=night] .glass-card{-webkit-backdrop-filter:blur(60px)saturate(200%);background:linear-gradient(135deg,#ffffff8c 0%,#ffffff4d 40%,#fff3 60%,#fff6 100%);border:1px solid #ffffffa6;box-shadow:0 8px 40px #0000000d,0 4px 12px #00000008,inset 0 1px 1px #ffffffb3,inset 0 -.5px 1px #ffffff4d,inset 0 0 0 .5px #ffffff1f}[data-theme=night] .card-title{color:#86868b}[data-theme=night] .code-textarea{color:#1d1d1f;background:linear-gradient(135deg,#00000008 0%,#0000000e 100%);border:1px solid #0000000f;box-shadow:inset 0 1px 2px #00000008}[data-theme=night] .code-textarea::placeholder{color:#aeaeb2}[data-theme=night] .code-textarea:focus{border-color:#0071e3}[data-theme=night] .error-banner{color:#ff3b30;background:#ff3b3014;border:1px solid #ff3b3026}[data-theme=night] .flowchart{background:#00000003;border:1px dashed #0000000f}[data-theme=night] .toggle-track{background:#e5e5ea}[data-theme=night] .toggle-thumb{background:#fff}.hidden-checkbox:checked+.toggle-track{background:#34c759}.hidden-checkbox:checked+.toggle-track .toggle-thumb{transform:translate(20px)}[data-theme=night] .btn-primary{color:#fff;background:linear-gradient(#0077ed 0%,#0064d0 100%);box-shadow:0 2px 8px #0071e340,inset 0 1px #fff3}[data-theme=night] .btn-primary:hover:not(:disabled){background:linear-gradient(#0081f2 0%,#006fdb 100%)}[data-theme=night] .btn-primary:active:not(:disabled){background:linear-gradient(#005fbb 0%,#05a 100%)}[data-theme=night] .btn-secondary{color:#0071e3;background:linear-gradient(#ffffffb3 0%,#fff6 100%);border:1px solid #ffffff80;box-shadow:0 2px 6px #0000000a,inset 0 1px #fff9}[data-theme=night] .btn-secondary:hover{background:linear-gradient(#fffc 0%,#f0f0f880 100%)}[data-theme=night] .btn-secondary:active{background:linear-gradient(#f0f0f599 0%,#e6e6f066 100%)}[data-theme=night] .toggle-text{color:#86868b;font-size:11px}html[data-theme=dark]{background-color:#080810;transition:background-color .6s}[data-theme=dark] body{background-color:#0000}[data-theme=dark] #root{background:0 0}[data-theme=dark] .app:before{background:linear-gradient(145deg,#0a0a0c 0%,#000 50%,#080810 100%)}[data-theme=dark] .header-logo{color:#f5f5f7;background:#ffffff1a}[data-theme=dark] .title-text{color:#f5f5f7}[data-theme=dark] .subtitle-text{color:#8e8e93}[data-theme=dark] .author-tag{color:#636366}[data-theme=dark] .glass-card{-webkit-backdrop-filter:blur(60px)saturate(200%);background:linear-gradient(135deg,#2c2c308c 0%,#2c2c3040 40%,#2c2c3026 60%,#2c2c3066 100%);border:1px solid #ffffff1a;box-shadow:0 8px 40px #0000004d,0 4px 12px #0003,inset 0 1px 1px #ffffff0f,inset 0 -.5px 1px #ffffff08}[data-theme=dark] .card-title{color:#8e8e93}[data-theme=dark] .code-textarea{color:#f5f5f7;background:linear-gradient(135deg,#ffffff0a 0%,#ffffff12 100%);border:1px solid #ffffff1a;box-shadow:inset 0 1px 2px #00000026}[data-theme=dark] .code-textarea::placeholder{color:#636366}[data-theme=dark] .code-textarea:focus{border-color:#0a84ff}[data-theme=dark] .error-banner{color:#ff6961;background:#ff453a26;border:1px solid #ff453a40}[data-theme=dark] .flowchart{background:#ffffff05;border:1px dashed #ffffff14}[data-theme=dark] .toggle-track{background:#39393d}[data-theme=dark] .toggle-thumb{background:linear-gradient(#505055e6 0%,#2c2c30d9 100%)}[data-theme=dark] .hidden-checkbox:checked+.toggle-track,.hidden-checkbox:checked+[data-theme=dark] .toggle-track{background:#30d158}[data-theme=dark] .hidden-checkbox:checked+.toggle-track .toggle-thumb{background:linear-gradient(#1c1c1ef2 0%,#141416e6 100%);transform:translate(20px)}[data-theme=dark] .btn-primary{color:#fff;background:linear-gradient(#3a9bff 0%,#0070e0 100%);box-shadow:0 2px 8px #0a84ff4d,inset 0 1px #ffffff26}[data-theme=dark] .btn-primary:hover:not(:disabled){background:linear-gradient(#5aadff 0%,#1a84f0 100%)}[data-theme=dark] .btn-primary:active:not(:disabled){background:linear-gradient(#0060c8 0%,#0055b0 100%)}[data-theme=dark] .btn-secondary{color:#0a84ff;background:linear-gradient(#ffffff1f 0%,#ffffff0f 100%);border:1px solid #ffffff14;box-shadow:0 2px 6px #00000026,inset 0 1px #ffffff14}[data-theme=dark] .btn-secondary:hover{background:linear-gradient(#ffffff29 0%,#ffffff17 100%)}[data-theme=dark] .btn-secondary:active{background:linear-gradient(#ffffff14 0%,#ffffff0a 100%)}[data-theme=dark] .toggle-text{color:#8e8e93;font-size:11px}@media (width<=480px){.toggle-text{font-size:11px}}