:root{--bg: #0a0a0f;--surface: #13131a;--border: #2a2a38;--accent: #c8f135;--text: #f0f0f5;--text-dim: #4a4a6a;--radius: 12px;--font-display: ui-rounded, system-ui, sans-serif;--font-body: ui-sans-serif, system-ui, sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-body);background:var(--bg);color:var(--text);min-height:100vh;display:flex;flex-direction:column}h1,h2,h3{font-family:var(--font-display)}a{color:var(--accent);text-decoration:none}footer{margin-top:auto;border-top:1px solid var(--border);padding:2rem 1.5rem;background:var(--surface)}.footer-inner{max-width:900px;margin:0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.75rem;text-align:center}.footer-copy{font-size:.8rem;color:var(--text-dim)}.container{max-width:900px;margin:0 auto;padding:0 1.5rem}header[data-astro-cid-3ef6ksr2]{position:sticky;top:0;z-index:100;background:#0a0a0fd9;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border)}.header-inner[data-astro-cid-3ef6ksr2]{max-width:900px;margin:0 auto;padding:0 1.5rem;height:64px;display:flex;align-items:center;justify-content:space-between}.brand[data-astro-cid-3ef6ksr2]{display:flex;align-items:center;gap:.75rem;text-decoration:none;flex-shrink:0}.brand-logo[data-astro-cid-3ef6ksr2]{height:36px;width:auto;display:block;border-radius:8px}.brand-text[data-astro-cid-3ef6ksr2]{font-family:var(--font-display);font-size:1.1rem;color:var(--text);letter-spacing:-.02em;line-height:1;white-space:nowrap;transition:opacity .2s ease}.brand-text[data-astro-cid-3ef6ksr2] strong[data-astro-cid-3ef6ksr2]{color:var(--accent);font-weight:800}.brand[data-astro-cid-3ef6ksr2]:hover{opacity:.85}.header-actions[data-astro-cid-3ef6ksr2]{display:flex;align-items:center;gap:.625rem;flex-shrink:0}.lang-switcher[data-astro-cid-3ef6ksr2]{position:relative}.lang-btn[data-astro-cid-3ef6ksr2]{display:flex;align-items:center;gap:.35rem;background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:.4rem .65rem;color:var(--text-dim);cursor:pointer;transition:border-color .2s ease,color .2s ease;font-family:inherit;white-space:nowrap}.lang-btn[data-astro-cid-3ef6ksr2]:hover{border-color:var(--accent);color:var(--text)}.lang-current[data-astro-cid-3ef6ksr2]{font-size:.72rem;font-weight:700;letter-spacing:.06em}.lang-chevron[data-astro-cid-3ef6ksr2]{transition:transform .2s ease;opacity:.6}.lang-btn[data-astro-cid-3ef6ksr2][aria-expanded=true] .lang-chevron[data-astro-cid-3ef6ksr2]{transform:rotate(180deg)}.lang-dropdown[data-astro-cid-3ef6ksr2]{display:none;position:absolute;top:calc(100% + 8px);right:0;min-width:175px;background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:.375rem;box-shadow:0 16px 40px #00000080;z-index:200;opacity:0;transform:translateY(-6px);transition:opacity .15s ease,transform .15s ease}.lang-dropdown[data-astro-cid-3ef6ksr2].is-open{display:block;opacity:1;transform:translateY(0)}.lang-option[data-astro-cid-3ef6ksr2]{display:flex;align-items:center;gap:.6rem;padding:.5rem .625rem;border-radius:7px;text-decoration:none;color:var(--text-dim);font-size:.875rem;transition:background .15s ease,color .15s ease;cursor:pointer}.lang-option[data-astro-cid-3ef6ksr2]:hover{background:#c8f13512;color:var(--text)}.lang-option[data-astro-cid-3ef6ksr2].is-active{color:var(--accent);background:#c8f1351a}.lang-flag[data-astro-cid-3ef6ksr2]{font-size:1rem;line-height:1;flex-shrink:0}.lang-label[data-astro-cid-3ef6ksr2]{flex:1;font-weight:500}.lang-code[data-astro-cid-3ef6ksr2]{font-size:.65rem;font-weight:700;letter-spacing:.06em;opacity:.45}.play-btn[data-astro-cid-3ef6ksr2]{display:flex;align-items:center;gap:.5rem;background:var(--accent);color:var(--bg);border-radius:8px;padding:.4rem .875rem .4rem .75rem;text-decoration:none;transition:all .2s ease;white-space:nowrap}.play-btn[data-astro-cid-3ef6ksr2]:hover{transform:translateY(-1px);filter:brightness(1.1)}.play-text[data-astro-cid-3ef6ksr2]{display:flex;flex-direction:column;line-height:1.15}.play-label[data-astro-cid-3ef6ksr2]{font-size:.55rem;text-transform:uppercase;letter-spacing:.05em;opacity:.7}.play-store[data-astro-cid-3ef6ksr2]{font-size:.78rem;font-weight:700;font-family:var(--font-display);letter-spacing:-.01em}@media(max-width:480px){.play-text[data-astro-cid-3ef6ksr2]{display:none}.play-btn[data-astro-cid-3ef6ksr2]{padding:.5rem}.lang-current[data-astro-cid-3ef6ksr2]{display:none}}.fav-app{--fa-accent: #FF3D00;--fa-accent2: #FFD600;--fa-bg: #0A0A0A;--fa-surface: #141414;--fa-surface2: #1E1E1E;--fa-border: #2A2A2A;--fa-text: #F5F5F0;--fa-dim: #888880;--fa-radius: 12px;font-family:inherit;color:var(--fa-text)}.upload-zone{border:1.5px dashed var(--fa-border);border-radius:var(--fa-radius);background:var(--fa-surface);min-height:260px;display:flex;align-items:center;justify-content:center;transition:border-color .2s,background .2s;cursor:pointer}.upload-zone:hover,.upload-zone.drag-over{border-color:var(--fa-accent);background:#ff3d000a}.upload-inner{display:flex;flex-direction:column;align-items:center;gap:.75rem;padding:2rem;text-align:center;color:var(--fa-dim)}.upload-icon{opacity:.5;transition:opacity .2s}.upload-zone:hover .upload-icon{opacity:.85}.upload-title{font-size:1.05rem;font-weight:600;color:var(--fa-text);margin:0}.upload-sub{font-size:.82rem;margin:0}.upload-btn{margin-top:.25rem;padding:.5rem 1.25rem;background:var(--fa-accent);color:#fff;border:none;border-radius:8px;font-size:.85rem;font-weight:700;cursor:pointer;transition:opacity .15s,transform .15s;font-family:inherit}.upload-btn:hover{opacity:.88;transform:translateY(-1px)}.editor-panel{display:grid;grid-template-columns:auto 1fr;gap:2rem;padding:1.5rem;background:var(--fa-surface);border:1px solid var(--fa-border);border-radius:var(--fa-radius)}.preview-col{display:flex;flex-direction:column;gap:1rem;align-items:center}.preview-card{display:flex;flex-direction:column;align-items:center;gap:.6rem}.preview-label{font-size:.72rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--fa-dim)}#previewCanvas{width:160px;height:160px;border-radius:12px;border:1px solid var(--fa-border);background-image:repeating-conic-gradient(#1e1e1e 0% 25%,#2a2a2a 0% 50%);background-size:12px 12px;display:block;image-rendering:pixelated}.change-btn{background:transparent;border:1px solid var(--fa-border);border-radius:6px;padding:.3rem .75rem;font-size:.75rem;color:var(--fa-dim);cursor:pointer;font-family:inherit;transition:all .15s}.change-btn:hover{border-color:var(--fa-text);color:var(--fa-text)}.icon-previews{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center;max-width:200px}.icon-preview-item{display:flex;flex-direction:column;align-items:center;gap:.3rem}.icon-thumb{display:block;border:1px solid var(--fa-border);border-radius:4px;background-image:repeating-conic-gradient(#1e1e1e 0% 25%,#2a2a2a 0% 50%);background-size:8px 8px;image-rendering:pixelated}.icon-preview-item span{font-size:.6rem;color:var(--fa-dim);line-height:1}.controls-col{display:flex;flex-direction:column;gap:1.4rem;justify-content:center}.control-group{display:flex;flex-direction:column;gap:.6rem}.control-label{font-size:.78rem;font-weight:600;color:var(--fa-dim);text-transform:uppercase;letter-spacing:.08em;display:flex;justify-content:space-between;align-items:center}.control-value{font-size:.72rem;color:var(--fa-accent);font-weight:700}.bg-options{display:flex;gap:.5rem;flex-wrap:wrap}.bg-btn{display:flex;align-items:center;gap:.4rem;padding:.35rem .65rem;background:var(--fa-surface2);border:1px solid var(--fa-border);border-radius:7px;font-size:.78rem;color:var(--fa-dim);cursor:pointer;font-family:inherit;transition:all .15s}.bg-btn:hover{border-color:var(--fa-text);color:var(--fa-text)}.bg-btn.active{border-color:var(--fa-accent);color:var(--fa-accent);background:#ff3d0014}.bg-swatch{width:14px;height:14px;border-radius:3px;border:1px solid rgba(255,255,255,.1);flex-shrink:0}.transparent-swatch{background-image:repeating-conic-gradient(#555 0% 25%,#888 0% 50%);background-size:6px 6px}.range-input{-webkit-appearance:none;appearance:none;width:100%;height:4px;background:var(--fa-border);border-radius:4px;outline:none;cursor:pointer}.range-input::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;background:var(--fa-accent);border-radius:50%;cursor:pointer;transition:transform .1s;border:2px solid var(--fa-bg)}.range-input::-webkit-slider-thumb:hover{transform:scale(1.2)}.range-input::-moz-range-thumb{width:16px;height:16px;background:var(--fa-accent);border-radius:50%;cursor:pointer;border:2px solid var(--fa-bg)}.generate-btn{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1.5rem;background:var(--fa-accent);color:#fff;border:none;border-radius:10px;font-size:.95rem;font-weight:700;cursor:pointer;font-family:inherit;transition:opacity .15s,transform .15s;letter-spacing:-.01em}.generate-btn:hover{opacity:.9;transform:translateY(-1px)}.generate-btn:active{transform:translateY(0)}.generate-note{font-size:.75rem;color:var(--fa-dim);margin:-.5rem 0 0;text-align:center}.guide-section{margin-top:4rem;display:flex;flex-direction:column;gap:3.5rem;padding-top:2rem;border-top:1px solid var(--fa-border)}.guide-header{text-align:center}.guide-title{font-size:1.6rem;font-weight:800;letter-spacing:-.04em;margin:0 0 .5rem}.guide-sub{font-size:.9rem;color:var(--fa-dim);margin:0}.guide-sub code{background:var(--fa-surface2);border:1px solid var(--fa-border);border-radius:4px;padding:.1rem .4rem;font-size:.82rem;color:var(--fa-accent2)}.code-block{background:var(--fa-bg);border:1px solid var(--fa-border);border-radius:var(--fa-radius);overflow:hidden}.code-toolbar{display:flex;justify-content:space-between;align-items:center;padding:.6rem 1rem;border-bottom:1px solid var(--fa-border);background:var(--fa-surface2)}.code-lang{font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--fa-dim)}.copy-code-btn{display:flex;align-items:center;gap:.35rem;background:transparent;border:1px solid var(--fa-border);border-radius:6px;padding:.25rem .65rem;font-size:.75rem;color:var(--fa-dim);cursor:pointer;font-family:inherit;transition:all .15s}.copy-code-btn:hover{border-color:var(--fa-accent);color:var(--fa-accent)}.code-pre{margin:0;padding:1.25rem 1.5rem;overflow-x:auto;font-size:.82rem;line-height:1.7;color:var(--fa-text);font-family:Courier New,Courier,monospace}.code-pre code{color:var(--fa-accent2)}.steps-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.25rem}.step-card{background:var(--fa-surface);border:1px solid var(--fa-border);border-radius:var(--fa-radius);padding:1.5rem;display:flex;flex-direction:column;gap:.75rem;transition:border-color .2s,transform .2s}.step-card:hover{border-color:var(--fa-accent);transform:translateY(-3px)}.step-num{font-size:.7rem;font-weight:700;color:var(--fa-accent);letter-spacing:.12em}.step-title{font-size:1rem;font-weight:700;letter-spacing:-.02em;margin:0}.step-desc{font-size:.82rem;color:var(--fa-dim);line-height:1.65;margin:0}.step-desc code{background:var(--fa-surface2);border:1px solid var(--fa-border);border-radius:3px;padding:.05rem .35rem;font-size:.78rem;color:var(--fa-accent2)}.files-table{border:1px solid var(--fa-border);border-radius:var(--fa-radius);overflow:hidden}.files-row{display:grid;grid-template-columns:240px 1fr;gap:1rem;padding:.85rem 1.25rem;border-bottom:1px solid var(--fa-border);font-size:.85rem;color:var(--fa-dim);transition:background .12s}.files-row:last-child{border-bottom:none}.files-row:not(.files-header):hover{background:var(--fa-surface2)}.files-header{background:var(--fa-surface2);font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--fa-dim)}.file-name{font-family:Courier New,Courier,monospace;font-size:.8rem;color:var(--fa-accent2)}.fav-toast{position:fixed;bottom:2rem;right:2rem;background:var(--fa-accent);color:#fff;font-size:.82rem;font-weight:700;padding:.6rem 1.1rem;border-radius:8px;z-index:9999;opacity:0;transform:translateY(8px);transition:opacity .2s,transform .2s;pointer-events:none}.fav-toast.show{opacity:1;transform:translateY(0)}@media(max-width:640px){.editor-panel{grid-template-columns:1fr;padding:1rem}.preview-col{flex-direction:row;flex-wrap:wrap;justify-content:center}.icon-previews{max-width:none}.files-row{grid-template-columns:1fr;gap:.2rem}.files-row>span:first-child{color:var(--fa-accent2)}}