@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Outfit:wght@500;600;700;800&family=JetBrains+Mono:wght@600;700&display=swap";:root{--bg-primary:#0b0f19;--bg-secondary:#131c2e;--bg-card:#1a2640b3;--bg-card-hover:#233458d9;--accent-primary:#6366f1;--accent-primary-hover:#4f46e5;--accent-gold:#f59e0b;--accent-gold-glow:#f59e0b66;--accent-cyan:#06b6d4;--accent-success:#10b981;--accent-warning:#f97316;--text-main:#f8fafc;--text-muted:#94a3b8;--text-dim:#64748b;--border-color:#ffffff1a;--border-glow:#6366f180;--glass-bg:#131c2ea6;--glass-border:#ffffff1f;--glass-blur:blur(16px);--font-family:"Inter", system-ui, -apple-system, sans-serif;--font-heading:"Outfit", system-ui, sans-serif;--font-mono:"JetBrains Mono", monospace;--shadow-sm:0 4px 6px -1px #0000004d;--shadow-md:0 10px 15px -3px #0006;--shadow-glow:0 0 20px #6366f159}*{box-sizing:border-box;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;margin:0;padding:0}body{font-family:var(--font-family);background-color:var(--bg-primary);color:var(--text-main);background-image:radial-gradient(circle at 15% 15%,#6366f126 0%,#0000 40%),radial-gradient(circle at 85% 85%,#06b6d41f 0%,#0000 45%);background-attachment:fixed;min-height:100vh;overflow-x:hidden}#app{flex-direction:column;width:100%;max-width:1200px;min-height:100vh;margin:0 auto;display:flex}h1,h2,h3,h4{font-family:var(--font-heading);letter-spacing:-.02em;font-weight:700}button{font-family:var(--font-family);cursor:pointer;border:none;outline:none;transition:all .2s}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:var(--bg-card);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--accent-primary)}.badge{text-transform:uppercase;letter-spacing:.05em;border-radius:20px;align-items:center;padding:4px 10px;font-size:12px;font-weight:700;display:inline-flex}.badge-easy{color:#34d399;background:#10b98133;border:1px solid #10b98166}.badge-medium{color:#60a5fa;background:#3b82f633;border:1px solid #3b82f666}.badge-hard{color:#fbbf24;background:#f59e0b33;border:1px solid #f59e0b66}.badge-expert{color:#f87171;background:#ef444433;border:1px solid #ef444466}.badge-grandmaster{color:#c084fc;background:#a855f740;border:1px solid #a855f780;box-shadow:0 0 10px #a855f74d}.badge-custom{color:#22d3ee;background:#06b6d433;border:1px solid #06b6d466}.btn-primary{background:linear-gradient(135deg, var(--accent-primary) 0%, #4338ca 100%);color:#fff;border-radius:12px;padding:10px 20px;font-weight:600;box-shadow:0 4px 12px #6366f14d}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 16px #6366f173}.btn-secondary{color:var(--text-main);border:1px solid var(--border-color);background:#ffffff14;border-radius:12px;padding:10px 20px;font-weight:600}.btn-secondary:hover{background:#ffffff26}.btn-icon{background:var(--glass-bg);border:1px solid var(--glass-border);color:var(--text-main);border-radius:10px;justify-content:center;align-items:center;width:40px;height:40px;font-size:18px;display:flex}.btn-icon:hover{background:#ffffff26}.level-select-view{padding:30px 20px}.select-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;margin-bottom:30px;display:flex}.header-branding h1{background:linear-gradient(135deg,#fff 0%,#a5b4fc 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:32px}.header-branding p{color:var(--text-muted);margin-top:4px;font-size:14px}.header-actions{gap:12px;display:flex}.btn-action-hero{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);color:var(--text-main);border-radius:12px;padding:12px 18px;font-size:14px;font-weight:600}.btn-action-hero:hover{background:var(--bg-card-hover);border-color:var(--accent-primary);transform:translateY(-2px)}.filter-nav{-webkit-overflow-scrolling:touch;gap:10px;margin-bottom:25px;padding-bottom:10px;display:flex;overflow-x:auto}.filter-nav::-webkit-scrollbar{height:4px}.filter-tab{border:1px solid var(--border-color);color:var(--text-muted);white-space:nowrap;background:#ffffff0d;border-radius:20px;padding:8px 16px;font-size:13px;font-weight:600}.filter-tab.active,.filter-tab:hover{background:var(--accent-primary);color:#fff;border-color:var(--accent-primary)}.levels-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:20px;display:grid}.level-card{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);cursor:pointer;border-radius:16px;flex-direction:column;justify-content:space-between;min-height:150px;padding:20px;transition:all .25s;display:flex;position:relative}.level-card:hover{border-color:var(--accent-primary);box-shadow:var(--shadow-glow);transform:translateY(-4px)}.level-card.completed{border-color:#10b98166}.level-card-header{justify-content:space-between;align-items:center;display:flex}.complete-badge{color:var(--accent-success);font-size:11px;font-weight:700}.level-title{color:#fff;word-break:keep-all;overflow-wrap:break-word;margin:12px 0 8px;font-size:16px;line-height:1.4}.level-stars{margin-bottom:15px}.star{color:#fff3;font-size:16px}.star.gold{color:var(--accent-gold);text-shadow:0 0 8px var(--accent-gold-glow)}.btn-play-level{color:#fff;background:#ffffff1a;border-radius:8px;width:100%;padding:8px 0;font-size:13px;font-weight:600}.level-card:hover .btn-play-level{background:var(--accent-primary)}@media (width<=680px){.level-select-view{padding:16px 12px}.select-header{flex-direction:column;align-items:stretch;gap:14px;margin-bottom:20px}.header-branding h1{font-size:24px}.header-branding p{font-size:13px}.header-actions{flex-direction:column;gap:8px;width:100%}.btn-action-hero{text-align:center;width:100%}.levels-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px}.level-card{min-height:135px;padding:14px}.level-title{margin:8px 0 6px;font-size:14px}}.game-view{flex-direction:column;gap:20px;padding:20px;display:flex}.game-header{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:16px;justify-content:space-between;align-items:center;padding:12px 20px;display:flex}.btn-back{color:var(--text-muted);background:0 0;font-size:14px;font-weight:600}.btn-back:hover{color:#fff}.game-title-box{align-items:center;gap:12px;min-width:0;display:flex}.game-title-box h2{white-space:nowrap;text-overflow:ellipsis;margin:0;font-size:18px;overflow:hidden}.game-actions{align-items:center;gap:12px;display:flex}.timer-box{font-family:var(--font-mono);color:var(--accent-cyan);background:#0000004d;border:1px solid #06b6d44d;border-radius:10px;padding:6px 14px;font-size:14px}@media (width<=680px){.game-view{gap:12px;padding:10px}.game-header{flex-wrap:wrap;gap:10px;padding:10px 14px}.btn-back{order:1}.game-actions{order:2;gap:8px}.game-title-box{border-top:1px solid #ffffff14;order:3;justify-content:center;width:100%;padding-top:8px}.game-title-box h2{white-space:normal;text-align:center;word-break:keep-all;overflow-wrap:break-word;font-size:16px}.btn-print{display:none}.diagram-section{min-height:280px;padding:12px}.control-section{padding:14px}.numpad-btn{height:48px;font-size:18px}}.game-main{grid-template-columns:1fr 320px;gap:25px;display:grid}@media (width<=850px){.game-main{grid-template-columns:1fr}}.diagram-section{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:20px;justify-content:center;align-items:center;min-height:480px;padding:20px;display:flex}.svg-container{width:100%;max-width:600px}.control-section{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:20px;flex-direction:column;justify-content:center;padding:20px;display:flex}.numpad-status-banner{border-radius:10px;margin-bottom:14px;padding:10px 14px;font-size:13px;line-height:1.4;transition:all .3s}.numpad-status-banner.answer-active{color:#a5b4fc;background:#6366f126;border:1px solid #6366f166}.numpad-status-banner.memo-active{color:#fbbf24;background:#f59e0b2e;border:1px solid #f59e0b80;box-shadow:0 0 12px #f59e0b33}.target-type-selector{align-items:center;gap:6px;margin-bottom:14px;display:flex}.target-selector-label{color:var(--text-muted);white-space:nowrap;font-size:12px;font-weight:600}.target-tab-btn{border:1px solid var(--border-color);color:var(--text-muted);white-space:nowrap;background:#ffffff0f;border-radius:8px;flex:1;padding:6px 4px;font-size:11px;font-weight:600;transition:all .2s}.target-tab-btn:hover{color:#fff;background:#ffffff24}.target-tab-btn.active{color:#fff;border-color:var(--accent-primary);background:#6366f140;box-shadow:0 0 10px #6366f140}.numpad-grid{grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:15px;display:grid}.numpad-btn{border:1px solid var(--border-color);color:#fff;height:56px;font-size:20px;font-weight:700;font-family:var(--font-mono);background:#ffffff14;border-radius:12px}.numpad-btn:hover{background:#ffffff2e}.numpad-btn:active{transform:scale(.95)}.btn-del{color:var(--accent-warning)}.btn-submit{background:var(--accent-primary);color:#fff}.btn-submit:hover{background:var(--accent-primary-hover)}.numpad-toolbar{gap:10px;display:flex}.tool-btn{border:1px solid var(--border-color);color:var(--text-muted);background:#ffffff0f;border-radius:10px;flex:1;justify-content:center;align-items:center;gap:6px;padding:10px;font-size:12px;font-weight:600;display:flex}.tool-btn:hover{color:#fff;background:#ffffff1f}.tool-btn.active{color:var(--accent-gold);border-color:var(--accent-gold);background:#f59e0b33}.modal-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.btn-close-icon{color:#f87171;cursor:pointer;background:#ef444426;border:1px solid #ef444466;border-radius:20px;align-items:center;gap:4px;padding:6px 14px;font-size:13px;font-weight:700;transition:all .2s;display:inline-flex}.btn-close-icon:hover{color:#fff;background:#ef444459;border-color:#ef4444;transform:scale(1.05)}#hint-modal-container,#victory-modal-container{display:none}#hint-modal-container.open,#victory-modal-container.open{display:block}.modal-backdrop{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:100;background:#000000bf;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.hint-modal-backdrop{z-index:100;pointer-events:none;background:#0000001a;justify-content:center;align-items:flex-end;padding:24px;display:flex;position:fixed;inset:0;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}.hint-card{pointer-events:auto;border:2px solid var(--accent-cyan);background:#1e293b;border-radius:20px;width:100%;max-width:540px;padding:20px 24px;animation:.3s cubic-bezier(.16,1,.3,1) slideUpHint;box-shadow:0 10px 30px #0009,0 0 25px #06b6d459}@keyframes slideUpHint{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}.modal-card{border:1px solid var(--glass-border);width:100%;max-width:440px;box-shadow:var(--shadow-md);background:#1e293b;border-radius:20px;padding:30px}.hint-badge{color:var(--accent-primary);background:#6366f133;border-radius:6px;margin-bottom:12px;padding:4px 10px;font-size:12px;font-weight:700;display:inline-block}.hint-explanation{color:#f1f5f9;margin-bottom:20px;font-size:16px;line-height:1.6}.hint-nav{justify-content:space-between;display:flex}.victory-card{text-align:center}.victory-header h2{color:var(--accent-gold);margin-bottom:4px;font-size:28px}.stars-display{margin:20px 0;font-size:40px}.victory-stats{background:#0003;border-radius:12px;justify-content:space-around;margin-bottom:25px;padding:15px;display:flex}.stat-item{flex-direction:column;display:flex}.stat-label{color:var(--text-muted);font-size:12px}.stat-value{color:#fff;font-size:18px;font-weight:700;font-family:var(--font-mono)}.modal-footer{gap:12px;display:flex}.modal-footer button{flex:1}.editor-view{padding:20px}.editor-header{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.editor-layout{grid-template-columns:320px 1fr;gap:20px;display:grid}@media (width<=800px){.editor-layout{grid-template-columns:1fr}}.editor-sidebar{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:16px;flex-direction:column;gap:16px;padding:20px;display:flex}.form-group{flex-direction:column;gap:6px;display:flex}.form-group label{color:var(--text-muted);font-size:13px}.form-group input,.form-group select{border:1px solid var(--border-color);color:#fff;background:#0000004d;border-radius:8px;padding:10px}.editor-preview{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:16px;padding:20px}.editor-svg{width:100%;height:400px}.maze-svg{filter:drop-shadow(0 10px 20px #00000080);width:100%;height:auto}.rect-group{cursor:pointer;transition:transform .15s}.maze-rect{fill:#1e293b;stroke:#475569;stroke-width:2.5px;transition:all .2s}.rect-group:hover .maze-rect{fill:#2d3748;stroke:#64748b}.maze-rect.active-rect{filter:url(#glow);fill:#6366f140!important;stroke:var(--accent-primary)!important;stroke-width:3.5px!important}.maze-rect.highlighted-rect{animation:1.5s infinite alternate pulseHighlight;fill:#06b6d440!important;stroke:var(--accent-cyan)!important;stroke-width:3.5px!important}.maze-rect.question-rect{stroke-dasharray:6 3;animation:20s linear infinite strokeDash;fill:url(#questionGrad)!important;stroke:var(--accent-gold)!important;stroke-width:3.5px!important}@keyframes strokeDash{to{stroke-dashoffset:-100px}}@keyframes pulseHighlight{0%{stroke-opacity:.6}to{stroke-opacity:1}}.area-label{font-family:var(--font-heading);fill:#f8fafc;pointer-events:none;font-size:20px;font-weight:700}.edge-label{font-family:var(--font-mono);fill:#cbd5e1;pointer-events:none;font-size:13px;font-weight:600}.question-label{text-shadow:0 0 10px var(--accent-gold-glow);fill:var(--accent-gold)!important;font-size:28px!important;font-weight:800!important}.note-label{font-family:var(--font-mono);fill:var(--accent-gold);pointer-events:none;font-size:14px;font-weight:700}.edge-bg{fill:#0f172a;stroke:#334155;stroke-width:1px;cursor:pointer;transition:all .2s}.edge-group:hover .edge-bg{stroke:var(--accent-cyan)}.edge-bg.active-edge-bg{filter:url(#glow);fill:#6366f14d!important;stroke:var(--accent-primary)!important;stroke-width:2px!important}.edge-bg.note-edge-bg{fill:#f59e0b40!important;stroke:var(--accent-gold)!important;stroke-width:1.5px!important}.note-edge-label{fill:var(--accent-gold)!important;font-weight:700!important}.placeholder-edge-bg{opacity:.35;stroke-dasharray:3 3}.edge-group:hover .placeholder-edge-bg{opacity:.9;stroke:var(--accent-cyan)!important}.placeholder-label{fill:#94a3b8!important;font-size:11px!important}.hint-focus-bg{fill:#06b6d4f2;stroke:#0891b2;stroke-width:1px}.hint-focus-label{font-family:var(--font-family);pointer-events:none;fill:#fff!important;font-size:10px!important;font-weight:700!important}