:root{--primary: #8b5cf6;--primary-dark: #7c3aed;--primary-hover: var(--primary-dark);--bg-dark: #0f0f1a;--bg-card: rgba(30, 30, 50, .8);--glass-bg: rgba(40, 40, 70, .6);--glass-border: rgba(255, 255, 255, .1);--text: #ffffff;--text-muted: rgba(255, 255, 255, .6)}.splash-screen{position:fixed;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,#0f0f1a,#1a1a2e,#16213e);display:flex;align-items:center;justify-content:center;z-index:9999;transition:opacity .5s ease,visibility .5s ease}.splash-screen.hidden{opacity:0;visibility:hidden}.splash-content{text-align:center;display:flex;flex-direction:column;align-items:center;gap:16px}.splash-icon{color:var(--primary);animation:splashBounce 1s ease-in-out infinite}.splash-icon svg{filter:drop-shadow(0 0 20px var(--primary))}@keyframes splashBounce{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-15px) scale(1.1)}}.splash-title{font-size:2rem;font-weight:700;background:linear-gradient(135deg,var(--primary),#fff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.splash-loader{width:200px;height:4px;background:#ffffff1a;border-radius:4px;overflow:hidden;margin-top:24px}.splash-bar{height:100%;width:0%;background:linear-gradient(90deg,var(--primary),var(--primary-dark));border-radius:4px;animation:splashLoad 1.5s ease-out forwards}@keyframes splashLoad{0%{width:0%}to{width:100%}}*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}html{scroll-behavior:smooth}body{font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;min-height:100vh;min-height:100dvh;background:linear-gradient(135deg,#0f0f1a,#1a1a2e,#16213e);display:flex;align-items:center;justify-content:center;padding:16px;overflow-x:hidden;color:var(--text)}@supports (padding: env(safe-area-inset-bottom)){body{padding-bottom:env(safe-area-inset-bottom);padding-top:env(safe-area-inset-top)}}.background-shapes{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:-1;overflow:hidden}.shape{position:absolute;border-radius:50%;filter:blur(80px);animation:float 10s ease-in-out infinite;opacity:.5}.shape-1{width:350px;height:350px;background:var(--primary);top:-100px;left:-100px;animation-delay:0s}.shape-2{width:280px;height:280px;background:#ec489980;bottom:-50px;right:-50px;animation-delay:3s}.shape-3{width:200px;height:200px;background:#22d3ee66;top:50%;left:50%;transform:translate(-50%,-50%);animation-delay:6s}@keyframes float{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-20px) scale(1.03)}}.container{width:100%;max-width:480px;display:flex;flex-direction:column;align-items:center;gap:24px;transition:max-width .3s ease}@media(min-width:768px){.container{max-width:900px}.option-card{width:300px;min-height:280px;display:flex;flex-direction:column;justify-content:center}}.site-header{text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px}.site-header .logo-icon{font-size:3rem;animation:bounce 2s ease-in-out infinite}.site-header h1{font-size:2.5rem;font-weight:700;background:linear-gradient(135deg,var(--primary),#fff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.site-header .tagline{color:var(--text-muted);font-size:1rem;margin-top:4px}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.site-footer{position:fixed;bottom:0;left:0;width:100%;text-align:center;padding:12px 16px;background:#0000004d;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-top:1px solid rgba(255,255,255,.05)}.site-footer p{color:var(--text-muted);font-size:.75rem;margin:0}.view-section{width:100%;animation:fadeIn .3s ease}.view-section.hidden{display:none}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.option-cards{display:flex;gap:20px;flex-wrap:wrap;justify-content:center}.option-card{background:var(--glass-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:20px;padding:32px 24px;width:260px;text-align:center;cursor:pointer;transition:all .3s ease}.option-card:hover{transform:translateY(-8px);border-color:var(--primary);box-shadow:0 20px 40px #0000004d}.option-icon{color:var(--primary);margin-bottom:16px}.option-card h3{font-size:1.1rem;font-weight:600;margin-bottom:8px}.option-desc{font-size:.85rem;color:var(--text-muted);margin-bottom:16px;line-height:1.5}.option-badge{display:inline-block;padding:6px 12px;background:rgba(var(--primary),.2);background:linear-gradient(135deg,#8b5cf633,#6366f133);border:1px solid var(--primary);border-radius:20px;font-size:.75rem;font-weight:500;color:var(--primary)}.option-badge.ai{background:linear-gradient(135deg,#10b98133,#06b6d433);border-color:#10b981;color:#10b981}.back-btn{background:transparent;border:none;color:var(--text-muted);font-size:.9rem;cursor:pointer;padding:8px 0;margin-bottom:16px;transition:color .2s}.back-btn:hover{color:var(--text)}.form-title{font-size:1.5rem;font-weight:600;margin-bottom:8px;text-align:center}.form-subtitle{color:var(--text-muted);font-size:.9rem;margin-bottom:24px;text-align:center}.upload-dropzone{border:2px dashed var(--glass-border);border-radius:16px;padding:40px 24px;text-align:center;cursor:pointer;transition:all .3s ease;margin-bottom:20px;color:var(--text-muted)}.upload-dropzone:hover,.upload-dropzone.dragover{border-color:var(--primary);background:#8b5cf60d}.upload-dropzone svg{margin-bottom:12px;opacity:.6}.upload-dropzone p{font-size:1rem;margin-bottom:4px}.upload-dropzone span{font-size:.8rem;opacity:.6}.file-name-display{background:#8b5cf61a;border:1px solid var(--primary);border-radius:8px;padding:12px 16px;margin-bottom:20px;display:flex;align-items:center;gap:8px;font-size:.9rem}.file-name-display.hidden{display:none}.modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#000c;display:flex;align-items:center;justify-content:center;z-index:3000;padding:20px}.modal.hidden{display:none}.modal-content{max-width:400px;text-align:center}.modal-icon{font-size:4rem;margin-bottom:16px}.modal-content h2{font-size:1.8rem;margin-bottom:16px;background:linear-gradient(135deg,var(--primary),#fff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.modal-content p{color:var(--text-muted);line-height:1.6;margin-bottom:12px}.modal-subtitle{font-size:.9rem;opacity:.7}.modal-content .btn-primary{margin-top:16px}.glass-card{background:var(--glass-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:24px;padding:40px;box-shadow:0 25px 50px -12px #00000040;transform-style:preserve-3d;transition:transform .3s ease,box-shadow .3s ease}.glass-card:hover{transform:translateY(-5px) rotateX(2deg);box-shadow:0 35px 60px -15px #0000004d}.logo{display:flex;align-items:center;gap:12px;margin-bottom:8px}.logo-icon{font-size:2rem;animation:bounce 2s infinite}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}.logo h1{font-size:1.75rem;font-weight:700;color:var(--text);letter-spacing:-.5px}.tagline{color:var(--text-muted);margin-bottom:32px;font-size:.95rem}.input-group{margin-bottom:20px}.input-group label{display:block;color:var(--text);font-size:.875rem;font-weight:500;margin-bottom:8px}.input-group input{width:100%;padding:14px 16px;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:12px;color:var(--text);font-size:1rem;font-family:inherit;transition:all .3s ease}.input-group input::placeholder{color:#fff6}.input-group input:focus{outline:none;border-color:var(--primary);background:#ffffff26;box-shadow:0 0 0 4px #6366f133}.btn-primary{width:100%;padding:16px;background:var(--primary);color:#fff;border:none;border-radius:12px;font-size:1rem;font-weight:600;font-family:inherit;cursor:pointer;transition:all .3s ease;transform-style:preserve-3d}.btn-primary:hover{background:var(--primary-hover);transform:translateY(-2px) scale(1.02);box-shadow:0 10px 30px -5px #6366f180}.btn-primary:active{transform:translateY(0) scale(.98)}.btn-loader{display:inline-block;width:20px;height:20px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.download-section{margin-top:24px;padding-top:24px;border-top:1px solid var(--glass-border);text-align:center}.download-section p{color:var(--text);margin-bottom:16px;font-weight:500}.btn-secondary{padding:14px 28px;background:#fff3;color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:12px;font-size:1rem;font-weight:600;font-family:inherit;cursor:pointer;transition:all .3s ease}.btn-secondary:hover{background:#ffffff4d;transform:translateY(-2px)}@media(max-width:480px){.glass-card{padding:28px 20px}.logo h1{font-size:1.5rem}}.button-group{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.preview-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#000c;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:1000;display:flex;align-items:center;justify-content:center;padding:20px;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.preview-container{background:#1a1a2e;border-radius:16px;width:100%;max-width:900px;max-height:90vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 25px 50px #00000080}.preview-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;background:#16213e;border-bottom:1px solid #2a2a4a}.preview-header h2{color:#fff;font-size:1.25rem;font-weight:600}.close-btn{background:#ffffff1a;border:none;color:#fff;width:36px;height:36px;border-radius:8px;font-size:1.25rem;cursor:pointer;transition:all .2s}.close-btn:hover{background:#e74c3c}.lab-tabs{display:flex;background:#16213e;padding:0 24px;gap:8px;overflow-x:auto;flex-shrink:0;border-bottom:1px solid #2a2a4a}.tab-btn{padding:12px 20px;background:transparent;border:none;color:#fff9;font-family:inherit;font-size:.875rem;font-weight:500;cursor:pointer;border-bottom:2px solid transparent;transition:all .2s;white-space:nowrap}.tab-btn:hover{color:#fff}.tab-btn.active{color:#fff;border-bottom-color:var(--primary)}.preview-content{flex:1;overflow-y:auto;padding:24px;background:#0f0f23;color:#fff}.preview-content h3{font-size:1.5rem;margin-bottom:16px;color:#a5b4fc}.preview-content h4{font-size:1.1rem;margin:24px 0 12px;color:#818cf8}.preview-content p{line-height:1.7;margin-bottom:16px;color:#d1d5db}.preview-content .student-info{background:#6366f11a;padding:16px;border-radius:8px;margin-bottom:24px;border-left:3px solid var(--primary)}.preview-content .student-info p{margin:4px 0;font-size:.9rem}.vscode-preview-frame{background:#1e1e1e;border-radius:8px;overflow:hidden;margin:16px 0;box-shadow:0 10px 30px #0000004d}.preview-footer{display:flex;gap:16px;padding:20px 24px;background:#16213e;border-top:1px solid #2a2a4a;justify-content:space-between;flex-wrap:wrap}.preview-footer .edit-controls,.preview-footer .download-controls{display:flex;gap:12px}.preview-footer .btn-primary,.preview-footer .btn-secondary,.preview-footer .btn-success,.preview-footer .btn-warning{width:auto;padding:12px 24px;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:all .3s ease}.btn-success{background:linear-gradient(135deg,#10b981,#059669);color:#fff}.btn-success:hover{transform:translateY(-2px);box-shadow:0 4px 12px #10b98166}.btn-warning{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff}.btn-warning:hover{transform:translateY(-2px);box-shadow:0 4px 12px #f59e0b66}.editable-field{background:#ffffff0d;border:1px dashed rgba(255,255,255,.2);border-radius:6px;padding:8px 12px;margin:4px 0;outline:none;transition:all .2s ease}.editable-field:focus{background:#ffffff1a;border-color:#4ecdc4;box-shadow:0 0 0 3px #4ecdc433}.editable-code{font-family:Consolas,Courier New,monospace;font-size:12px;background:#1e1e1e;color:#d4d4d4;border:1px solid #3c3c3c;border-radius:6px;padding:12px;width:100%;min-height:120px;resize:vertical}.editable-code:focus{border-color:#4ecdc4;box-shadow:0 0 0 3px #4ecdc433}.screenshot-container{position:relative;display:inline-block;margin:8px 0}.screenshot-container img{max-width:100%;border-radius:8px;border:2px solid transparent;transition:border-color .2s}.screenshot-container:hover img{border-color:#4ecdc4}.screenshot-overlay{position:absolute;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s;border-radius:8px;cursor:pointer}.screenshot-container:hover .screenshot-overlay{opacity:1}.screenshot-overlay span{color:#fff;font-weight:600;font-size:14px}.toast-notification{position:fixed;bottom:30px;left:50%;transform:translate(-50%);background:#10b981;color:#fff;padding:12px 24px;border-radius:8px;font-weight:600;z-index:10000;animation:slideUp .3s ease}@keyframes slideUp{0%{opacity:0;transform:translate(-50%,20px)}to{opacity:1;transform:translate(-50%)}}@media(max-width:600px){.preview-container{max-height:100vh;border-radius:0}.lab-tabs{padding:0 12px}.tab-btn{padding:10px 14px;font-size:.8rem}.preview-content{padding:16px}}.simulator-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000e6;z-index:2000;display:flex;align-items:center;justify-content:center;padding:20px}#simulator-container{width:100%;height:100%;display:flex;align-items:center;justify-content:center}@media(max-width:768px){.simulator-modal{padding:0}}@media(max-width:768px){.btn-primary,.btn-secondary{min-height:48px;font-size:1rem;padding:14px 24px}.input-group input{min-height:48px;font-size:16px}.glass-card{padding:24px 20px;border-radius:16px}.logo h1{font-size:1.5rem}.tagline{font-size:.9rem}}@media(max-width:400px){body{padding:12px}.glass-card{padding:20px 16px}.btn-primary,.btn-secondary{width:100%;padding:16px}.button-group{flex-direction:column;gap:12px}}@media(max-height:500px)and (orientation:landscape){body{padding:8px}.glass-card{padding:16px;max-height:100vh;overflow-y:auto}.simulator-modal{padding:0}}@media(display-mode:standalone){body{padding-top:env(safe-area-inset-top)}}@media(prefers-contrast:high){.glass-card{border:2px solid var(--primary)}.btn-primary{border:2px solid white}}@media(prefers-reduced-motion:reduce){.shape,.glass-card,.btn-primary,.btn-secondary{animation:none;transition:none}}@media print{.background-shapes,.simulator-modal,.preview-modal{display:none!important}}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000d9;display:flex;align-items:center;justify-content:center;z-index:4000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);padding:20px}.modal-overlay.hidden{display:none}.modal-card{background:var(--bg-card);background:linear-gradient(135deg,#1e1e32f2,#141423fa);border:1px solid var(--glass-border);border-radius:16px;max-width:480px;width:100%;box-shadow:0 25px 50px -12px #00000080;overflow:hidden;animation:modalSlideUp .3s ease-out}@keyframes modalSlideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.modal-header{padding:24px;border-bottom:1px solid rgba(255,255,255,.1);display:flex;justify-content:space-between;align-items:center}.modal-header h2{font-size:1.4rem;color:#fff}.close-modal{background:none;border:none;color:var(--text-muted);font-size:2rem;cursor:pointer;line-height:1}.close-modal:hover{color:#fff}.modal-body{padding:24px}.payment-desc{margin-bottom:24px;color:var(--text-muted);line-height:1.5}.payment-details{background:#ffffff0d;border-radius:12px;padding:16px;margin-bottom:24px}.detail-row{display:flex;justify-content:space-between;margin-bottom:8px;font-size:.95rem}.detail-row:last-child{margin-bottom:0;margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.1);font-weight:600}.price-tag{color:var(--primary);font-weight:700}.highlight-number{color:#10b981;font-family:monospace;font-size:1.1em;letter-spacing:1px}.error-msg{color:#ef4444;background:#ef44441a;padding:10px;border-radius:8px;font-size:.9rem;margin-top:8px;display:block}.error-msg.hidden{display:none}.payment-footer{text-align:center;margin-top:16px;font-size:.8rem;color:var(--text-muted)}.loading-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#0f0f1ae6;z-index:5000;display:flex;align-items:center;justify-content:center;flex-direction:column}.loading-overlay.hidden{display:none}.loading-content{text-align:center}.ai-orb{width:80px;height:80px;border-radius:50%;background:radial-gradient(circle at 30% 30%,var(--primary-dark),#000);box-shadow:0 0 30px var(--primary);margin:0 auto 24px;animation:orbPulse 2s ease-in-out infinite}@keyframes orbPulse{0%{transform:scale(1);box-shadow:0 0 30px var(--primary)}50%{transform:scale(1.1);box-shadow:0 0 60px var(--primary),0 0 20px #fff}to{transform:scale(1);box-shadow:0 0 30px var(--primary)}}.history-modal-card{max-width:600px}.history-list-container{display:flex;flex-direction:column;gap:16px;max-height:50vh;overflow-y:auto;padding-right:6px;margin-top:10px}.history-list-container::-webkit-scrollbar{width:6px}.history-list-container::-webkit-scrollbar-track{background:#ffffff05;border-radius:4px}.history-list-container::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:4px}.history-list-container::-webkit-scrollbar-thumb:hover{background:var(--primary)}.history-item{background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:18px;display:flex;flex-direction:column;gap:12px;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.history-item:hover{background:#ffffff12;border-color:#8b5cf666;transform:translateY(-2px);box-shadow:0 10px 20px #0003}.history-item:before{content:"";position:absolute;top:0;left:0;width:4px;height:100%;background:var(--primary);opacity:.7}.history-item.paid:before{background:#10b981}.history-item-header{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.history-item-title{font-size:1.1rem;font-weight:600;color:#fff;line-height:1.4;word-break:break-word}.history-item-date{font-size:.75rem;color:var(--text-muted);white-space:nowrap}.history-item-details{display:grid;grid-template-columns:1fr 1fr;gap:8px;font-size:.82rem;color:#ffffffb3;background:#0003;padding:10px 12px;border-radius:8px;border:1px solid rgba(255,255,255,.03)}.history-detail-span{display:flex;align-items:center;gap:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.history-item-actions{display:flex;justify-content:space-between;align-items:center;margin-top:4px}.history-badge-container{display:flex;align-items:center;gap:8px}.history-lock-badge{display:flex;align-items:center;gap:4px;padding:4px 10px;border-radius:12px;font-size:.75rem;font-weight:600}.history-lock-badge.locked{background:#f59e0b26;border:1px solid rgba(245,158,11,.3);color:#f59e0b}.history-lock-badge.unlocked{background:#10b98126;border:1px solid rgba(16,185,129,.3);color:#10b981}.history-action-buttons{display:flex;gap:8px}.btn-revisit{background:var(--primary);color:#fff;border:none;border-radius:8px;padding:8px 16px;font-size:.85rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:6px;transition:all .2s ease}.btn-revisit:hover{background:var(--primary-hover);transform:scale(1.03)}.btn-delete-history{background:#ef44441a;color:#ef4444;border:1px solid rgba(239,68,68,.2);border-radius:8px;width:34px;height:34px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease}.btn-delete-history:hover{background:#ef444433;border-color:#ef4444;color:#fff;transform:scale(1.05)}.history-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;text-align:center;gap:12px}.history-empty-icon{font-size:3rem;animation:float 6s ease-in-out infinite}.history-empty-title{font-size:1.1rem;font-weight:600;color:#fff}.history-empty-desc{font-size:.85rem;color:var(--text-muted);max-width:280px;line-height:1.5}.btn-warning{background:#f59e0b26;border:1px solid rgba(245,158,11,.3);color:#f59e0b;cursor:pointer;transition:all .2s ease}.btn-warning:hover{background:#f59e0b40;border-color:#f59e0b;color:#fff}
