@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap";:root{--font-sans:"Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono:"JetBrains Mono", monospace;--bg-dark:#090a0f;--bg-card:#11131cb3;--bg-card-hover:#191c29d9;--border-color:#ffffff14;--border-focus:#6366f166;--text-primary:#f3f4f6;--text-secondary:#9ca3af;--text-muted:#6b7280;--primary:#6366f1;--primary-hover:#4f46e5;--primary-glow:#6366f126;--success:#10b981;--error:#ef4444;--warning:#f59e0b}[data-theme=light]{--bg-dark:#eef2f7;--bg-card:#ffffffb8;--bg-card-hover:#ffffffeb;--border-color:#0000001a;--text-primary:#111827;--text-secondary:#374151;--text-muted:#6b7280;--primary:#5254cc;--primary-hover:#4338ca;--primary-glow:#5254cc24}[data-theme=light] body{background-image:radial-gradient(at 0 0,#6366f114 0,#0000 50%),radial-gradient(at 100% 100%,#ec48990d 0,#0000 50%)}[data-theme=light] ::-webkit-scrollbar-track{background:#0000000a}[data-theme=light] ::-webkit-scrollbar-thumb{background:#00000029}[data-theme=light] ::-webkit-scrollbar-thumb:hover{background:#00000047}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-dark);color:var(--text-primary);font-family:var(--font-sans);background-image:radial-gradient(at 0 0,#6366f10d 0,#0000 50%),radial-gradient(at 100% 100%,#ec489908 0,#0000 50%);min-height:100vh;margin:0;overflow-x:hidden}#root{flex-direction:column;min-height:100vh;display:flex}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#0003}::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#fff3}.glass{background:var(--bg-card);-webkit-backdrop-filter:blur(12px);border:1px solid var(--border-color)}.app-container{flex-direction:column;gap:24px;width:100%;max-width:1600px;min-height:100vh;margin:0 auto;padding:24px;display:flex}.app-header{border:1px solid var(--border-color);border-radius:16px;justify-content:space-between;align-items:center;padding:16px 24px;display:flex}.brand{align-items:center;gap:12px;display:flex}.brand-icon{color:var(--primary);filter:drop-shadow(0 0 8px var(--primary))}.brand h1{letter-spacing:-.5px;background:linear-gradient(135deg,#fff 0%,#a5b4fc 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin:0;font-size:28px;font-weight:700}.brand p{color:var(--text-secondary);font-size:14px}.header-links{gap:16px;display:flex}.badge{background:var(--primary-glow);border:1px solid var(--primary);color:var(--primary);letter-spacing:.5px;text-transform:uppercase;border-radius:20px;padding:4px 10px;font-size:12px;font-weight:600}.main-layout{flex-grow:1;grid-template-columns:380px 1fr;align-items:start;gap:24px;display:grid}@media (width<=1024px){.main-layout{grid-template-columns:1fr}}.sidebar{border-radius:20px;flex-direction:column;gap:24px;max-height:calc(100vh - 140px);padding:24px;display:flex;overflow-y:auto;box-shadow:0 10px 30px #0003}@media (width<=1024px){.sidebar{max-height:none}}.section-title{text-transform:uppercase;letter-spacing:1.5px;color:var(--primary);align-items:center;gap:8px;margin-bottom:12px;font-size:13px;font-weight:700;display:flex}.control-group{border-bottom:1px solid var(--border-color);flex-direction:column;gap:16px;padding-bottom:20px;display:flex}.control-group:last-child{border-bottom:none;padding-bottom:0}.input-container{flex-direction:column;gap:6px;display:flex}.input-container label{color:var(--text-secondary);justify-content:space-between;font-size:14px;font-weight:500;display:flex}.label-val{font-family:var(--font-mono);color:var(--text-primary);font-size:13px}.select-input{border:1px solid var(--border-color);color:var(--text-primary);font-family:var(--font-sans);cursor:pointer;background:#0003;border-radius:8px;outline:none;padding:10px 12px;font-size:14px;transition:all .2s}.select-input:focus{border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-glow)}.range-input{-webkit-appearance:none;background:#ffffff1a;border-radius:3px;outline:none;width:100%;height:6px;margin:8px 0}.range-input::-webkit-slider-thumb{appearance:none;background:var(--primary);cursor:pointer;border-radius:50%;width:18px;height:18px;transition:transform .1s}.range-input::-webkit-slider-thumb:hover{transform:scale(1.2)}.color-picker-grid{grid-template-columns:repeat(2,1fr);gap:12px;display:grid}.color-input-wrap{border:1px solid var(--border-color);color:var(--text-secondary);background:#00000026;border-radius:8px;align-items:center;gap:8px;padding:6px 10px;font-size:12px;display:flex}.color-input-wrap input[type=color]{-webkit-appearance:none;cursor:pointer;background:0 0;border:none;border-radius:4px;width:24px;height:24px}.color-input-wrap input[type=color]::-webkit-color-swatch-wrapper{padding:0}.color-input-wrap input[type=color]::-webkit-color-swatch{border:1px solid #ffffff1a;border-radius:4px}.toggle-wrap{cursor:pointer;justify-content:space-between;align-items:center;padding:6px 0;display:flex}.toggle-label{color:var(--text-secondary);font-size:14px;font-weight:500}.switch{width:44px;height:22px;display:inline-block;position:relative}.switch input{opacity:0;width:0;height:0}.slider{cursor:pointer;background-color:#ffffff1a;border-radius:34px;transition:all .3s;position:absolute;inset:0}.slider:before{content:"";background-color:#fff;border-radius:50%;width:16px;height:16px;transition:all .3s;position:absolute;bottom:3px;left:3px}input:checked+.slider{background-color:var(--primary)}input:checked+.slider:before{transform:translate(22px)}.preset-grid{grid-template-columns:repeat(2,1fr);gap:8px;display:grid}.preset-btn{border:1px solid var(--border-color);color:var(--text-primary);cursor:pointer;background:#ffffff08;border-radius:8px;flex-direction:column;align-items:flex-start;gap:6px;padding:8px;font-size:12px;font-weight:500;transition:all .2s;display:flex}.preset-btn:hover{border-color:var(--text-secondary);background:#ffffff14}.preset-btn.active{border-color:var(--primary);background:var(--primary-glow)}.preset-dots{gap:4px;display:flex}.preset-dot{border:1px solid #fff3;border-radius:50%;width:10px;height:10px}.icon-section-hint{color:var(--text-muted);margin:-8px 0 4px;font-size:12px}.icon-grid{flex-wrap:wrap;gap:6px;display:flex}.icon-btn{border:1px solid var(--border-color);cursor:pointer;background:#00000026;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:38px;height:38px;padding:0;transition:all .15s;display:flex}.icon-btn:hover:not(:disabled){border-color:var(--text-secondary);background:#ffffff1a;transform:scale(1.08)}.icon-btn.active{border-color:var(--primary);background:var(--primary-glow);box-shadow:0 0 0 2px var(--primary-glow)}.icon-btn:disabled{opacity:.45;cursor:not-allowed}.icon-none-dot{border:1px solid #ffffff26;border-radius:3px;width:14px;height:14px;display:block}.btn{cursor:pointer;font-size:14px;font-weight:600;font-family:var(--font-sans);border:none;border-radius:10px;justify-content:center;align-items:center;gap:8px;padding:12px 16px;transition:all .2s;display:inline-flex}.btn-primary{background:var(--primary);color:#fff;box-shadow:0 4px 12px var(--primary-glow)}.btn-primary:hover:not(:disabled){background:var(--primary-hover);box-shadow:0 6px 16px var(--primary-glow);transform:translateY(-1px)}.btn-secondary{border:1px solid var(--border-color);color:var(--text-primary);background:#ffffff0f}.btn-secondary:hover:not(:disabled){border-color:var(--text-secondary);background:#ffffff1f}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-pulse{animation:2s infinite pulse}@keyframes pulse{0%{box-shadow:0 0 #6366f180}70%{box-shadow:0 0 0 10px #6366f100}to{box-shadow:0 0 #6366f100}}.display-area{flex-direction:column;align-items:center;gap:20px;display:flex}.canvas-card{border-radius:24px;justify-content:center;align-items:center;width:100%;min-height:500px;padding:30px;display:flex;position:relative;overflow:hidden;box-shadow:0 10px 40px #0000004d}.canvas-wrapper{aspect-ratio:1;justify-content:center;align-items:center;width:100%;max-width:600px;display:flex;position:relative}.maze-canvas{object-fit:contain;background-color:#0000;border-radius:12px;width:100%;height:100%}.canvas-controls-bar{border-radius:14px;justify-content:space-between;align-items:center;width:100%;padding:12px 24px;display:flex}@media (width<=640px){.canvas-controls-bar{flex-direction:column;gap:16px}}.canvas-stats{color:var(--text-secondary);gap:24px;font-size:14px;display:flex}.stat-item{flex-direction:column;display:flex}.stat-val{font-family:var(--font-mono);color:var(--text-primary);font-size:16px;font-weight:600}.actions-row{gap:12px;display:flex}.style-preset-grid{grid-template-columns:repeat(4,1fr);gap:6px;display:grid}.style-preset-btn{border:1px solid var(--border-color);color:var(--text-primary);cursor:pointer;text-align:center;background:#ffffff08;border-radius:8px;flex-direction:column;align-items:center;gap:3px;padding:7px 4px;font-size:11px;font-weight:500;line-height:1.2;transition:all .2s;display:flex}.style-preset-btn:hover:not(:disabled){border-color:var(--text-secondary);background:#ffffff14}.style-preset-btn.active{border-color:var(--primary);background:var(--primary-glow)}.style-preset-btn.dimmed{opacity:.45}.style-preset-emoji{font-size:16px;line-height:1}.algo-locked-hint{color:var(--text-muted);border:1px solid var(--border-color);background:#00000026;border-radius:8px;padding:10px 12px;font-size:13px;font-style:italic}.param-hint{color:var(--text-muted);margin:0;font-size:11px;line-height:1.4}[data-theme=light] .select-input{background:#fffc;border-color:#0000001f}[data-theme=light] .range-input{background:#0000001f}[data-theme=light] .range-input::-webkit-slider-thumb{box-shadow:0 1px 4px #0003}[data-theme=light] .color-input-wrap{background:#ffffffb3;border-color:#0000001f}[data-theme=light] .btn-secondary{background:#0000000d;border-color:#0000001f}[data-theme=light] .btn-secondary:hover:not(:disabled){background:#0000001a}[data-theme=light] .preset-btn,[data-theme=light] .style-preset-btn{background:#ffffff8c;border-color:#0000001a}[data-theme=light] .preset-btn:hover:not(:disabled),[data-theme=light] .style-preset-btn:hover:not(:disabled){background:#ffffffd9;border-color:#0003}[data-theme=light] .icon-btn{background:#ffffffb3;border-color:#0000001f}[data-theme=light] .icon-btn:hover:not(:disabled){background:#fffffff2;border-color:#00000040}[data-theme=light] .algo-locked-hint{background:#0000000a;border-color:#0000001a}[data-theme=light] .brand h1{background:linear-gradient(135deg,#1e1b4b 0%,#5254cc 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text}[data-theme=light] .theme-toggle{color:var(--text-secondary)}.theme-toggle{border:1px solid var(--border-color);color:var(--text-secondary);cursor:pointer;font-size:13px;font-weight:500;font-family:var(--font-sans);white-space:nowrap;background:0 0;border-radius:8px;align-items:center;gap:6px;padding:8px 10px;transition:all .2s;display:flex}.theme-toggle:hover{background:var(--primary-glow);border-color:var(--primary);color:var(--primary)}.modal-backdrop{-webkit-backdrop-filter:blur(4px);z-index:100;background:#0000008c;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.modal-card{border-radius:20px;flex-direction:column;gap:18px;width:100%;max-width:420px;padding:28px;display:flex;box-shadow:0 24px 60px #0006}.modal-header{justify-content:space-between;align-items:center;display:flex}.modal-close{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:6px;padding:4px;transition:color .15s;display:flex}.modal-close:hover{color:var(--text-primary)}.modal-desc{color:var(--text-secondary);margin:0;font-size:14px;line-height:1.6}.modal-count-row{justify-content:space-between;align-items:baseline;display:flex}.modal-count-label{color:var(--text-secondary);font-size:14px;font-weight:500}.modal-count-val{font-size:36px;font-weight:700;font-family:var(--font-mono);color:var(--primary);line-height:1}.modal-count-hints{color:var(--text-muted);justify-content:space-between;font-size:12px;display:flex}.modal-format-row{justify-content:space-between;align-items:center;margin-top:16px;display:flex}.modal-format-btns{gap:6px;display:flex}.modal-format-btn{border:1px solid var(--border-color);color:var(--text-secondary);font-size:13px;font-family:var(--font-sans);cursor:pointer;background:0 0;border-radius:8px;padding:5px 14px;transition:all .15s}.modal-format-btn:hover{border-color:var(--primary);color:var(--text-primary)}.modal-format-btn.active{background:var(--primary-glow);border-color:var(--primary);color:var(--primary);font-weight:600}.modal-footer{justify-content:flex-end;gap:12px;padding-top:4px;display:flex}[data-theme=light] .modal-backdrop{background:#0000004d}
