*{margin:0;padding:0;box-sizing:border-box}:root{--bg-color: #fcfbfa;--text-main: #0f172a;--text-light: #334155;--border-color: #cbd5e1;--primary: #0f172a;--secondary: #eab308;--accent: #3b82f6;--panel-bg: #ffffff;--glass-bg: rgba(255, 255, 255, .9);--shadow-soft: 0 10px 40px rgba(0, 0, 0, .05)}body{font-family:Outfit,sans-serif;color:var(--text-main);line-height:1.6;min-height:100vh;display:flex;flex-direction:column}body:before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;--s: 194px;--c1: #f6edb3;--c2: #acc4a3;--_l: #0000 calc(25% / 3), var(--c1) 0 25%, #0000 0;--_g: conic-gradient(from 120deg at 50% 87.5%, var(--c1) 120deg, #0000 0);background:var(--_g),var(--_g) 0 calc(var(--s) / 2),conic-gradient(from 180deg at 75%,var(--c2) 60deg,#0000 0),conic-gradient(from 60deg at 75% 75%,var(--c1) 0 60deg,#0000 0),linear-gradient(150deg,var(--_l)) 0 calc(var(--s) / 2),conic-gradient(at 25% 25%,#0000 50%,var(--c2) 0 240deg,var(--c1) 0 300deg,var(--c2) 0),linear-gradient(-150deg,var(--_l)) #55897c;background-size:calc(.866 * var(--s)) var(--s)}h1,h2,h3,.logo{font-family:Inter,sans-serif;letter-spacing:-.5px;font-weight:800}a{text-decoration:none;color:var(--accent);transition:all .3s ease;font-weight:600}a:hover{color:#2563eb}.container{padding:2rem;flex:1;max-width:1100px;margin:0 auto;width:100%}.glass{background:var(--glass-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.7);border-radius:12px;box-shadow:var(--shadow-soft)}.navbar{display:flex;justify-content:space-between;align-items:center;padding:1rem 2rem;position:sticky;top:1rem;margin:0 2rem;z-index:999;transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.navbar:hover{transform:translateY(-2px)}.navbar nav{display:flex;align-items:center}.navbar nav a{margin-left:1.5rem;color:var(--text-main)}.navbar nav a:hover{color:var(--accent)}.btn-share{background:transparent;color:var(--text-main);border:1px solid var(--border-color);padding:.4rem 1rem;font-family:Outfit,sans-serif;font-weight:600;font-size:.95rem;border-radius:8px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:6px;background:#ffffff}.btn-share:hover{border-color:var(--primary);color:var(--primary);transform:translateY(-1px);box-shadow:0 4px 6px #0000000d}.btn-github{background:var(--text-main);color:#fff!important;border:1px solid var(--text-main);padding:.4rem 1rem;font-family:Inter,sans-serif;font-weight:600;font-size:.95rem;border-radius:8px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:6px;margin-left:1rem!important}.btn-github:hover{background:#1e293b;transform:translateY(-1px);box-shadow:0 4px 12px #0f172a33}.lucide{width:1em;height:1em;stroke-width:2.5;display:inline-block}.logo{font-size:1.5rem;color:var(--primary);display:flex;align-items:center;gap:8px;font-weight:700}.big-github-icon{width:64px;height:64px;color:var(--primary)}.hero{text-align:center;padding:3rem 2rem;margin:1rem auto 2rem;background:var(--glass-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.7);border-radius:16px;box-shadow:var(--shadow-soft)}.hero h1{font-size:3.2rem;margin-bottom:1rem;color:var(--primary);text-shadow:0 2px 10px rgba(255,255,255,.8)}.hero p{font-size:1.25rem;color:var(--text-light);font-weight:500;max-width:650px;margin:0 auto}.info{margin:2rem auto;padding:2rem}.info h2{font-size:1.8rem;margin-bottom:1rem;padding-bottom:.5rem;border-bottom:2px dashed rgba(0,0,0,.1)}.info ol{padding-left:1.5rem}.info li{margin-bottom:.8rem;color:var(--text-main);font-weight:500}.info li::marker{font-family:DotGothic16,monospace;color:var(--accent)}.app-section{margin-top:3rem}.tabs{display:flex;justify-content:center;gap:.5rem;margin-bottom:-1px;position:relative;z-index:2}.tab-btn{font-family:Inter,sans-serif;font-weight:600;font-size:1.05rem;padding:.8rem 2rem;background:rgba(255,255,255,.5);color:var(--text-light);border:1px solid var(--border-color);border-bottom:none;border-radius:12px 12px 0 0;cursor:pointer;transition:all .3s ease}.tab-btn:hover{background:#fff;color:var(--text-main)}.tab-btn.active{background:var(--panel-bg);color:var(--text-main);border-color:#fff9;border-top:4px solid var(--primary);box-shadow:0 -4px 10px #00000005}.panel-container{min-height:400px;position:relative;padding:3rem;background:var(--panel-bg)}.panel{display:none;animation:slideFadeIn .5s cubic-bezier(.25,.8,.25,1) forwards}.panel.active{display:block}@keyframes slideFadeIn{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}.panel h2{font-size:1.8rem;margin-bottom:.5rem;color:var(--text-main)}.panel p{color:var(--text-light);margin-bottom:2rem}label{display:block;margin-bottom:.5rem;font-weight:600;color:var(--text-main)}.text-input{width:100%;padding:1rem;margin-bottom:1.5rem;background:#f8fafc;border:2px solid var(--border-color);color:var(--text-main);font-family:monospace;border-radius:8px;transition:border-color .3s,background .3s}.text-input:focus{outline:none;border-color:var(--primary);background:#fff}textarea{width:100%;padding:1rem;min-height:120px;background:#f8fafc;color:var(--text-main);border:2px solid var(--border-color);border-radius:8px;font-family:monospace;margin-bottom:1.5rem;resize:vertical;transition:border-color .3s,background .3s}textarea:focus{outline:none;border-color:var(--primary);background:#fff}.input-modern-wrapper{position:relative;display:flex;align-items:center}.input-modern-wrapper .input-icon{position:absolute;left:1rem;color:var(--text-light)}.modern-input{padding-left:3rem!important;border-radius:12px!important;border:2px solid var(--border-color)!important;box-shadow:inset 0 2px 4px #00000005;font-size:1.05rem}.modern-input:focus{border-color:var(--accent)!important;box-shadow:0 0 0 4px #3b82f61a!important}.btn-primary,.btn,button[id^=runButton]{font-family:Inter,sans-serif;font-weight:700;letter-spacing:1.5px;font-size:1.1rem;padding:1rem 2rem;background-color:#8b5cf6;color:#fff;border:0;border-radius:10px;box-shadow:#6d28d9 0 8px;cursor:pointer;transition:all .3s ease;width:100%;max-width:320px;display:flex;justify-content:center;align-items:center;gap:8px;margin:1.5rem auto 0}.btn-primary:hover,.btn:hover,button[id^=runButton]:hover{box-shadow:#6d28d9 0 5px;transform:translateY(3px)}.btn-primary:active,.btn:active,button[id^=runButton]:active{background-color:#8b5cf6;box-shadow:#6d28d9 0 0;transform:translateY(8px);transition:.15s}button:disabled{background-color:#cbd5e1!important;color:#f8fafc!important;cursor:not-allowed;box-shadow:#94a3b8 0 8px!important;transform:translateY(0)!important}button:disabled:hover,button:disabled:active{box-shadow:#94a3b8 0 8px!important;transform:translateY(0)!important}.btn-home{background:var(--secondary);box-shadow:0 4px 15px #eab30833;color:var(--primary)}.btn-home:hover{background:#ca8a04;box-shadow:0 6px 20px #eab3084d;color:#fff}.upload-buttons{display:flex;gap:1.5rem;justify-content:center;margin-bottom:2rem;flex-wrap:wrap}.upload-label{background:#fff;color:var(--primary);padding:.8rem 1.5rem;border:2px solid var(--border-color);border-radius:8px;cursor:pointer;font-family:DotGothic16,monospace;font-size:1.1rem;transition:all .2s;box-shadow:0 4px 6px #00000005}.upload-label:hover{border-color:var(--primary);color:var(--primary);transform:translateY(-2px);box-shadow:0 6px 15px #0f172a1a}.drop-zone{border:2px dashed #cbd5e1;background:rgba(248,250,252,.5);padding:3rem 1rem;text-align:center;border-radius:12px;margin-bottom:1.5rem;transition:all .3s ease}.drop-zone.dragover{border-color:var(--primary);background:rgba(15,23,42,.05);transform:scale(1.02)}#fileList{list-style:none;max-height:150px;overflow-y:auto;border:1px solid var(--border-color);background:#f8fafc;padding:.8rem;border-radius:8px;margin-bottom:1rem}#fileList li{padding:.25rem .5rem;border-bottom:1px solid #e2e8f0;font-family:monospace;font-size:.9rem;color:var(--text-main)}#fileList li:last-child{border-bottom:none}#uploadStatus,.status-msg{text-align:center;color:var(--text-light);font-weight:600;margin-bottom:1rem;font-family:Inter,sans-serif;font-size:1rem;display:flex;align-items:center;justify-content:center;gap:6px}.status-msg:after{content:"";display:inline-block;width:4px;height:4px;background-color:var(--accent);border-radius:50%;margin-left:4px;animation:bounce 1.5s infinite;opacity:0}.status-msg:not(:empty):after{opacity:1}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}footer{text-align:center;padding:2rem 1.5rem;color:var(--text-main);background:var(--glass-bg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-top:1px solid rgba(255,255,255,.7);font-weight:500;margin-top:2rem}.footer-container{display:flex;flex-direction:column;align-items:center;gap:.8rem}.footer-link{display:inline-flex;align-items:center;gap:8px;padding:.6rem 1.4rem;background:rgba(15,23,42,.08);border-radius:20px;font-weight:600;color:var(--text-main);transition:all .2s ease}.footer-link:hover{background:rgba(15,23,42,.15);transform:translateY(-2px)}@media (max-width: 768px){.navbar{margin:1rem;flex-direction:column;gap:1rem}.nav-links{width:100%;justify-content:center;flex-wrap:wrap;gap:.8rem}.hide-mobile{display:none}.btn-github,.btn-share{padding:.6rem!important}.big-github-icon{width:48px;height:48px}.container{padding:1rem}.hero{padding:2rem 1rem;margin:.5rem auto 1rem}.hero h1{font-size:2rem}.info,.panel-container{padding:1.5rem 1rem}.tabs{flex-direction:column;gap:0}.tab-btn{border-radius:8px;margin-bottom:.5rem;border:1px solid var(--border-color)}.tab-btn.active{border-left:4px solid var(--primary);border-top:none}.upload-buttons{flex-direction:column;gap:.8rem}}