@import"https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700&display=swap";:root{--editor-bg: #1E1F22;--sidebar-bg: #2B2D30;--toolbar-bg: #2B2D30;--border-color: #43454A;--text-primary: #BCBEC4;--text-secondary: #868A91;--keyword: #CF8E6D;--string: #6AAB73;--comment: #7A7E85;--function: #56A8F5;--variable: #C77DBB;--number: #2AACB8;--operator: #BCBEC4;--tag: #E8BF6A;--attribute: #BCBEC4;--accent-blue: #2675F0;--accent-orange: #E55765;--accent-green: #5F9B4D;--accent-purple: #9B7ECA;--error-red: #E55765;--error-bg: #3D2B2E;--success-green: #5F9B4D;--success-bg: #2B362E}.app{min-height:100vh;display:flex;justify-content:center;align-items:flex-start;background:var(--sidebar-bg);font-family:JetBrains Mono,SF Mono,Consolas,monospace;padding:40px 20px}.editor-container{background:var(--editor-bg);border-radius:12px;box-shadow:0 4px 24px #00000080;max-width:1000px;width:100%;overflow:hidden;border:1px solid var(--border-color)}.editor-header{background:var(--toolbar-bg);border-bottom:1px solid var(--border-color);padding:0;display:flex;height:40px}.tab{padding:8px 16px;display:flex;align-items:center;gap:8px;color:var(--text-secondary);font-size:13px;cursor:pointer;transition:all .15s ease;position:relative;border-right:none}.tab.active{background:var(--editor-bg);color:var(--text-primary)}.tab.active:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--accent-blue)}.tab-icon{font-size:14px;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.1);opacity:.8}}.tab-name{font-weight:500}.editor-content{padding:20px 0;min-height:400px}.code-line{display:flex;padding:2px 0;transition:background .15s;position:relative}.code-line:hover{background:#ffffff05}.code-line.highlight{background:#2675f01f;border-left:3px solid var(--accent-blue)}.code-line.empty{min-height:20px}.line-number{width:50px;text-align:right;padding-right:20px;color:var(--text-secondary);-webkit-user-select:none;user-select:none;font-size:13px;font-weight:400}.code{color:var(--text-primary);font-size:14px;line-height:1.6;flex:1}.keyword{color:var(--keyword);font-weight:600}.string{color:var(--string)}.comment{color:var(--comment);font-style:italic}.function{color:var(--function);font-weight:500}.variable{color:var(--variable)}.number{color:var(--number)}.operator{color:var(--operator)}.tag{color:var(--tag)}.attribute{color:var(--attribute)}.punctuation{color:var(--text-primary)}.indent{white-space:pre}.question-container{margin:40px 0 30px;padding:30px 20px;text-align:center;background:#2675f014;border-left:3px solid var(--accent-blue);border-right:3px solid var(--accent-blue);border-radius:4px}.question-text{font-size:28px;color:var(--function);font-weight:600;letter-spacing:.3px}.buttons{display:flex;gap:15px;justify-content:center;padding:0 20px 20px;flex-wrap:wrap}.btn{display:flex;align-items:center;gap:8px;padding:10px 28px;font-size:14px;font-weight:600;border:1.5px solid;border-radius:8px;cursor:pointer;transition:all .15s ease;font-family:JetBrains Mono,monospace;min-width:120px;justify-content:center}.btn-icon{font-size:18px;font-weight:700}.btn-yes{background:#5f9b4d26;color:var(--accent-green);border-color:var(--accent-green)}.btn-yes:hover{background:var(--accent-green);color:#fff;box-shadow:0 2px 8px #5f9b4d66;transform:translateY(-1px)}.btn-no{background:#e5576526;color:var(--accent-orange);border-color:var(--accent-orange)}.btn-no:hover{background:var(--accent-orange);color:#fff;box-shadow:0 2px 8px #e5576566;transform:translateY(-1px)}.btn:active{transform:translateY(0)}.editor-footer{background:var(--toolbar-bg);border-top:1px solid var(--border-color);padding:4px 12px;display:flex;justify-content:space-between;font-size:11px;color:var(--text-secondary);transition:all .3s;height:28px;align-items:center}.editor-footer.has-error{background:var(--error-bg);border-top:2px solid var(--error-red)}.footer-left{display:flex;gap:10px}.footer-item{display:flex;align-items:center;gap:6px;padding:0 8px}.footer-icon{font-size:13px}.footer-error{display:flex;align-items:center;gap:10px;color:var(--error-red);font-weight:600;animation:slideInRight .3s ease-out}@keyframes slideInRight{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}.error-count{padding:2px 8px;background:#e5576533;border-radius:6px}.error-location{color:var(--text-secondary)}.editor-container.has-error{animation:shake .5s}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-5px)}20%,40%,60%,80%{transform:translate(5px)}}.tab-error{color:var(--accent-orange);animation:blink 1s infinite;margin-left:auto}@keyframes blink{0%,50%,to{opacity:1}25%,75%{opacity:.3}}.code-line.error-line{background:#e5576514;border-left:3px solid var(--error-red);animation:errorPulse 2s ease-in-out infinite}@keyframes errorPulse{0%,to{background:#e5576514}50%{background:#e557651f}}.error-underline{position:relative;border-bottom:2px wavy var(--error-red);text-decoration:underline wavy var(--error-red);text-decoration-skip-ink:none;animation:wiggle .3s}@keyframes wiggle{0%,to{transform:translateY(0)}25%{transform:translateY(-2px)}75%{transform:translateY(2px)}}.error-tooltip{position:absolute;top:100%;left:50px;margin-top:8px;background:var(--error-bg);border:1px solid var(--error-red);border-radius:8px;padding:12px;min-width:300px;max-width:500px;z-index:1000;box-shadow:0 8px 24px #0009;animation:fadeIn .3s ease-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.error-tooltip-header{display:flex;align-items:center;gap:8px;color:var(--error-red);font-weight:600;font-size:13px;margin-bottom:8px}.error-tooltip-message{color:var(--text-primary);font-size:12px;line-height:1.5}.error-panel{background:var(--editor-bg);border-top:2px solid var(--error-red);animation:slideUp .4s ease-out;overflow:hidden}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.error-panel-header{background:var(--toolbar-bg);border-bottom:1px solid var(--border-color);padding:6px 12px;display:flex;gap:5px;height:36px;align-items:center}.error-panel-tab{display:flex;align-items:center;gap:8px;padding:5px 10px;font-size:12px;color:var(--text-secondary);cursor:pointer;border-radius:6px;transition:all .15s}.error-panel-tab.active{background:#e5576526;color:var(--error-red)}.error-badge{background:var(--error-red);color:#fff;padding:2px 6px;border-radius:10px;font-size:10px;font-weight:700}.error-panel-content{padding:12px}.error-item{display:flex;align-items:flex-start;gap:10px;padding:8px;background:#e557650d;border-left:3px solid var(--error-red);border-radius:6px;margin-bottom:8px;font-size:12px}.error-severity{font-size:14px;flex-shrink:0}.error-file{color:var(--function);font-weight:600;flex-shrink:0}.error-position{color:var(--text-secondary);flex-shrink:0}.error-message{color:var(--text-primary);line-height:1.5;flex:1}.error-message strong{color:var(--error-red)}.error-hint{display:flex;align-items:flex-start;gap:8px;padding:10px;background:#2675f014;border-left:3px solid var(--accent-blue);border-radius:6px;font-size:12px;color:var(--text-primary)}.error-hint strong{color:var(--accent-blue)}.error-icon{flex-shrink:0}.editor-container.has-success{animation:success-glow 1s ease-out}@keyframes success-glow{0%{box-shadow:0 4px 24px #00000080}50%{box-shadow:0 4px 24px #5f9b4d80,0 0 32px #5f9b4d33}to{box-shadow:0 4px 24px #00000080}}.tab-success{color:var(--accent-green);animation:success-bounce .5s ease-out;margin-left:auto;font-size:16px;font-weight:700}@keyframes success-bounce{0%{transform:scale(0) rotate(-180deg);opacity:0}50%{transform:scale(1.3) rotate(0)}to{transform:scale(1) rotate(0);opacity:1}}.code-line.success-line{background:#5f9b4d14;border-left:3px solid var(--accent-green);animation:success-fade-in .5s ease-out}@keyframes success-fade-in{0%{background:#5f9b4d33}to{background:#5f9b4d14}}.success-highlight{background:#5f9b4d26;padding:2px 4px;border-radius:4px;animation:success-highlight-pulse 1s ease-out}@keyframes success-highlight-pulse{0%{background:#5f9b4d4d}to{background:#5f9b4d26}}.editor-footer.has-success{background:var(--success-bg);border-top:2px solid var(--accent-green)}.footer-success{display:flex;align-items:center;gap:12px;color:var(--accent-green);font-weight:600;animation:slideInRight .5s ease-out}.success-icon{font-size:16px;font-weight:700;animation:success-spin .6s ease-out}@keyframes success-spin{0%{transform:rotate(-360deg) scale(0)}to{transform:rotate(0) scale(1)}}.success-message{padding:3px 10px;background:#5f9b4d26;border-radius:6px}.success-time{color:#999;font-size:11px;font-weight:400}.success-panel{background:var(--editor-bg);border-top:2px solid var(--accent-green);animation:slideUp .5s ease-out;overflow:hidden}.success-panel-header{background:var(--toolbar-bg);border-bottom:1px solid var(--border-color);padding:6px 12px;display:flex;justify-content:space-between;align-items:center;height:36px}.success-panel-tab{display:flex;align-items:center;gap:8px;padding:5px 10px;font-size:12px;color:var(--accent-green);cursor:pointer;border-radius:6px;background:#5f9b4d1f;font-weight:600}.success-panel-actions{display:flex;gap:10px;font-size:11px}.panel-action{color:var(--accent-green);display:flex;align-items:center;gap:5px}.success-panel-content{padding:12px;background:var(--editor-bg)}.console-output{font-family:JetBrains Mono,Consolas,monospace;font-size:12px;line-height:1.6}.console-line{display:flex;gap:10px;padding:3px 0;color:var(--text-primary);animation:console-line-appear .3s ease-out;animation-fill-mode:both}.console-line:nth-child(1){animation-delay:.1s}.console-line:nth-child(2){animation-delay:.2s}.console-line:nth-child(3){animation-delay:.3s}.console-line:nth-child(4){animation-delay:.4s}.console-line:nth-child(5){animation-delay:.5s}.console-output-box{animation-delay:.6s}.console-line:nth-last-child(1){animation-delay:.7s}@keyframes console-line-appear{0%{opacity:0;transform:translate(-10px)}to{opacity:1;transform:translate(0)}}.console-line.success{color:var(--accent-green)}.console-time{color:var(--text-secondary);flex-shrink:0;-webkit-user-select:none;user-select:none}.console-text{color:var(--text-primary)}.console-text.bold{font-weight:600;color:var(--accent-green)}.console-output-box{margin:15px 0;padding:15px;background:#5f9b4d14;border:1px solid var(--accent-green);border-radius:8px;animation:console-line-appear .5s ease-out;animation-fill-mode:both}.ascii-art{color:var(--accent-green);font-size:11px;line-height:1.4;white-space:pre;font-weight:600;text-align:center;letter-spacing:.5px}@media (max-width: 768px){.app{padding:10px}.editor-content{min-height:300px}.line-number{width:35px;padding-right:10px;font-size:11px}.code{font-size:12px}.question-text{font-size:22px}.btn{padding:10px 20px;font-size:14px;min-width:100px}.tab{padding:8px 12px;font-size:12px}.editor-footer{font-size:11px;flex-direction:column;gap:8px}.footer-error{justify-content:center}.footer-success{justify-content:center;flex-wrap:wrap}.error-tooltip{min-width:200px;left:35px}.error-panel-content{padding:8px}.error-item{flex-wrap:wrap}.success-panel-content{padding:8px}.console-output{font-size:11px}.ascii-art{font-size:9px}}@media (max-width: 480px){.question-text{font-size:18px}.code-line{font-size:11px}.buttons{flex-direction:column;gap:10px}.btn{width:100%}}.popup-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000bf;display:flex;justify-content:center;align-items:center;z-index:9999;animation:fadeInOverlay .3s ease-out;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}@keyframes fadeInOverlay{0%{opacity:0}to{opacity:1}}.popup-content{background:var(--editor-bg);border:2px solid var(--error-red);border-radius:12px;padding:30px;max-width:500px;width:90%;box-shadow:0 12px 48px #000c,0 0 20px #e557654d;position:relative;animation:popupBounce .5s cubic-bezier(.68,-.55,.265,1.55)}@keyframes popupBounce{0%{transform:scale(.3) translateY(-50px);opacity:0}50%{transform:scale(1.05)}to{transform:scale(1) translateY(0);opacity:1}}.popup-header{display:flex;align-items:center;gap:15px;margin-bottom:20px}.popup-icon{font-size:36px;animation:shake-popup .5s ease-in-out;flex-shrink:0}@keyframes shake-popup{0%,to{transform:rotate(0)}25%{transform:rotate(-15deg)}50%{transform:rotate(15deg)}75%{transform:rotate(-10deg)}}.popup-title{color:var(--error-red);font-size:18px;font-weight:600;line-height:1.4}.popup-close-btn{position:absolute;top:15px;right:15px;background:#e5576526;border:1.5px solid var(--error-red);color:var(--error-red);width:32px;height:32px;border-radius:6px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:18px;font-weight:700;transition:all .15s ease;font-family:JetBrains Mono,monospace}.popup-close-btn:hover{background:var(--error-red);color:#fff;transform:rotate(90deg);box-shadow:0 2px 8px #e5576566}.popup-close-btn:active{transform:rotate(90deg) scale(.95)}@media (max-width: 768px){.popup-content{padding:25px;max-width:400px}.popup-title{font-size:16px}.popup-icon{font-size:32px}}@media (max-width: 480px){.popup-content{padding:20px;max-width:calc(100% - 20px)}.popup-title{font-size:15px}.popup-icon{font-size:28px}.popup-close-btn{width:28px;height:28px;font-size:16px}}.success-overlay{background:#000c}.success-popup{border-color:#ff69b4;box-shadow:0 12px 48px #000c,0 0 30px #ff69b466;padding:50px 45px;text-align:center;max-width:600px;position:relative;overflow:visible}.success-popup-image{margin:0 auto 30px;width:240px;height:240px;border-radius:50%;overflow:hidden;border:5px solid #FF69B4;box-shadow:0 8px 24px #ff69b44d;animation:imageZoom .6s ease-out}@keyframes imageZoom{0%{transform:scale(0) rotate(-180deg);opacity:0}50%{transform:scale(1.1) rotate(0)}to{transform:scale(1) rotate(0);opacity:1}}.success-popup-image img{width:100%;height:100%;object-fit:cover;animation:imagePulse 2s ease-in-out infinite}@keyframes imagePulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.success-popup-text{color:#ff69b4;font-size:30px;font-weight:700;line-height:1.4;animation:textBounce .8s ease-out;text-shadow:0 2px 10px rgba(255,105,180,.3)}@keyframes textBounce{0%{transform:translateY(30px);opacity:0}60%{transform:translateY(-10px)}80%{transform:translateY(5px)}to{transform:translateY(0);opacity:1}}.success-close-btn{background:#ff69b426;border-color:#ff69b4;color:#ff69b4}.success-close-btn:hover{background:#ff69b4;color:#fff;box-shadow:0 2px 8px #ff69b480}.floating-hearts{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:-1}.heart{position:absolute;font-size:36px;opacity:0;animation:floatHeart 3s ease-in-out infinite}@keyframes floatHeart{0%{opacity:0;transform:translateY(0) rotate(0) scale(.5)}10%{opacity:1}90%{opacity:1}to{opacity:0;transform:translateY(-200px) rotate(360deg) scale(1)}}.heart-1{left:-40px;top:20%;animation-delay:0s;animation-duration:3.5s}.heart-2{right:-40px;top:30%;animation-delay:.5s;animation-duration:4s}.heart-3{left:-30px;top:50%;animation-delay:1s;animation-duration:3.2s}.heart-4{right:-30px;top:60%;animation-delay:1.5s;animation-duration:3.8s}.heart-5{left:10%;bottom:-40px;animation-delay:.3s;animation-duration:3.6s}.heart-6{right:10%;bottom:-40px;animation-delay:.8s;animation-duration:3.3s}.heart-7{left:-35px;top:70%;animation-delay:2s;animation-duration:3.7s}.heart-8{right:-35px;top:15%;animation-delay:2.5s;animation-duration:3.4s}@media (max-width: 768px){.success-popup{padding:35px 30px;max-width:400px}.success-popup-image{width:150px;height:150px}.success-popup-text{font-size:20px}.heart{font-size:24px}}@media (max-width: 480px){.success-popup{padding:30px 25px;max-width:calc(100% - 20px)}.success-popup-image{width:120px;height:120px;border-width:3px}.success-popup-text{font-size:18px}.heart{font-size:20px}}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:JetBrains Mono,SF Mono,Consolas,Monaco,monospace;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#2b2d30}
