@import "https://fonts.googleapis.com/css2?family=Geist+Mono:wght@400;500;600&family=Geist:wght@300;400;500;600&display=swap";*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--tg-bg:var(--tg-theme-bg-color,#0f0f0f);--tg-surface:var(--tg-theme-secondary-bg-color,#1a1a1a);--tg-text:var(--tg-theme-text-color,#fff);--tg-hint:var(--tg-theme-hint-color,#6b7280);--tg-accent:var(--tg-theme-button-color,#3b82f6);--tg-accent-text:var(--tg-theme-button-text-color,#fff);--tg-link:var(--tg-theme-link-color,#60a5fa);--c-primary:#3b82f6;--c-primary-glow:#3b82f633;--c-success:#22c55e;--c-success-glow:#22c55e33;--c-danger:#ef4444;--c-danger-glow:#ef444433;--border:#ffffff14;--border-focus:#fff3;--radius:12px;--radius-sm:8px;--radius-xs:6px}html,body,#root{width:100%;height:100%;overflow-x:hidden}body{background:var(--tg-bg);color:var(--tg-text);-webkit-font-smoothing:antialiased;overscroll-behavior:none;font-family:Geist,-apple-system,sans-serif;font-size:14px;line-height:1.5}.app{min-height:100vh;padding:0 0 env(safe-area-inset-bottom);flex-direction:column;display:flex;position:relative}.header{align-items:center;gap:10px;padding:16px 16px 0;display:flex}.header-icon{background:var(--c-primary-glow);border:1px solid #3b82f64d;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;font-size:16px;display:flex}.header-text h1{color:var(--tg-text);letter-spacing:-.01em;font-size:15px;font-weight:600}.header-text p{color:var(--tg-hint);font-size:11px;font-weight:400}.scroll-area{-webkit-overflow-scrolling:touch;flex-direction:column;flex:1;gap:12px;padding:14px 16px 10px;display:flex;overflow-y:auto}.section-label{letter-spacing:.1em;text-transform:uppercase;color:var(--tg-hint);margin-bottom:6px;padding:0 2px;font-size:10px;font-weight:600}.rows-container{flex-direction:column;gap:6px;display:flex}.btn-row{background:var(--tg-surface);border:1px solid var(--border);border-radius:var(--radius);flex-direction:column;gap:8px;padding:10px;transition:border-color .2s;display:flex}.btn-row:focus-within{border-color:var(--border-focus)}.row-header{justify-content:space-between;align-items:center;margin-bottom:2px;display:flex}.row-label{color:var(--tg-hint);letter-spacing:.05em;text-transform:uppercase;font-size:10px;font-weight:500}.row-actions{align-items:center;gap:4px;display:flex}.icon-btn{border-radius:var(--radius-xs);border:1px solid var(--border);width:24px;height:24px;color:var(--tg-hint);cursor:pointer;background:0 0;flex-shrink:0;justify-content:center;align-items:center;font-size:14px;transition:all .15s;display:flex}.icon-btn:hover:not(:disabled){border-color:var(--border-focus);color:var(--tg-text);background:#ffffff0d}.icon-btn:disabled{opacity:.3;cursor:not-allowed}.icon-btn.del:hover:not(:disabled){border-color:var(--c-danger);color:var(--c-danger);background:var(--c-danger-glow)}.btns-in-row{gap:6px;display:flex}.btn-card{border:1px solid var(--border);border-radius:var(--radius-sm);background:#ffffff08;flex-direction:column;flex:1;gap:6px;min-width:0;padding:8px;display:flex;position:relative}.btn-card-del{width:16px;height:16px;color:var(--tg-hint);cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:10px;line-height:1;transition:all .15s;display:flex;position:absolute;top:4px;right:4px}.btn-card-del:hover{background:var(--c-danger-glow);color:var(--c-danger)}.field-input{border:1px solid var(--border);border-radius:var(--radius-xs);width:100%;height:30px;color:var(--tg-text);background:#0000004d;outline:none;padding:0 8px;font-family:Geist,sans-serif;font-size:12px;transition:border-color .15s}.field-input:focus{border-color:var(--border-focus)}.field-input::placeholder{color:var(--tg-hint);font-size:11px}.field-input.url-input{font-family:Geist Mono,monospace;font-size:11px}.btn-meta{align-items:center;gap:5px;min-width:0;display:flex;overflow:hidden}.type-toggle{border:1px solid var(--border);border-radius:var(--radius-xs);background:#0000004d;flex-shrink:0;width:fit-content;min-width:0;display:flex;overflow:hidden}.type-btn{cursor:pointer;height:22px;color:var(--tg-hint);letter-spacing:.03em;text-overflow:ellipsis;background:0 0;border:none;min-width:0;padding:0 4px;font-family:Geist,sans-serif;font-size:10px;font-weight:500;transition:all .15s;overflow:hidden}.type-btn.active{color:var(--tg-text);background:#ffffff1a}.color-pills{gap:4px;margin-left:0;display:flex}.color-pill{cursor:pointer;border:2px solid #0000;border-radius:50%;flex-shrink:0;width:18px;height:18px;transition:transform .15s,box-shadow .15s}.color-pill:hover{transform:scale(1.2)}.color-pill.sel{border-color:#fffc;box-shadow:0 0 0 2px #ffffff26}.color-pill.primary{background:var(--c-primary)}.color-pill.success{background:var(--c-success)}.color-pill.danger{background:var(--c-danger)}.color-pill.none{border:1.5px solid var(--border-focus);background:0 0;position:relative}.color-pill.none:after{content:"";background:repeating-linear-gradient(45deg,#0000,#0000 2px,#ffffff26 2px 3px);border-radius:50%;position:absolute;inset:2px}.color-pill.none.sel{border-color:#fffc}.add-row-btn{border:1px dashed var(--border);border-radius:var(--radius);width:100%;height:36px;color:var(--tg-hint);cursor:pointer;background:0 0;justify-content:center;align-items:center;gap:6px;font-family:Geist,sans-serif;font-size:12px;transition:all .15s;display:flex}.add-row-btn:hover:not(:disabled){border-color:var(--border-focus);color:var(--tg-text);background:#ffffff08}.add-row-btn:disabled{opacity:.3;cursor:not-allowed}.preview-section{background:var(--tg-surface);border:1px solid var(--border);border-radius:var(--radius);padding:12px}.preview-bubble-wrap{flex-direction:column;gap:4px;display:flex}.preview-row{gap:4px;display:flex}.preview-btn{border-radius:var(--radius-xs);text-overflow:ellipsis;white-space:nowrap;cursor:default;flex:1;justify-content:center;align-items:center;gap:5px;height:32px;padding:0 8px;font-family:Geist,sans-serif;font-size:12px;font-weight:500;transition:opacity .15s;display:flex;overflow:hidden}.preview-btn.primary{background:var(--c-primary);color:#fff}.preview-btn.success{background:var(--c-success);color:#fff}.preview-btn.danger{background:var(--c-danger);color:#fff}.preview-btn.none{color:var(--tg-text);border:1px solid var(--border-focus);background:#ffffff14}.preview-btn .type-badge{opacity:.7;text-transform:uppercase;background:#0003;border-radius:3px;flex-shrink:0;padding:1px 4px;font-family:Geist Mono,monospace;font-size:9px}.preview-empty{text-align:center;color:var(--tg-hint);padding:12px 0;font-size:12px}.footer{padding:10px 16px calc(10px + env(safe-area-inset-bottom));border-top:1px solid var(--border);background:var(--tg-bg)}.generate-btn{border-radius:var(--radius);background:var(--tg-accent,var(--c-primary));width:100%;height:48px;color:var(--tg-accent-text,#fff);cursor:pointer;letter-spacing:-.01em;border:none;justify-content:center;align-items:center;gap:8px;font-family:Geist,sans-serif;font-size:15px;font-weight:600;transition:opacity .2s,transform .1s;display:flex}.generate-btn:hover:not(:disabled){opacity:.9}.generate-btn:active:not(:disabled){transform:scale(.98)}.generate-btn:disabled{opacity:.4;cursor:not-allowed}@keyframes slideIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.btn-row{animation:.2s both fadeIn}@keyframes pulse-glow{0%,to{box-shadow:0 0 0 0 var(--c-primary-glow)}50%{box-shadow:0 0 0 6px #0000}}.generate-btn:not(:disabled){animation:2.5s ease-in-out infinite pulse-glow}::-webkit-scrollbar{width:3px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}.toast{border:1px solid var(--border);color:var(--tg-text);opacity:0;pointer-events:none;white-space:nowrap;z-index:999;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#1e1e1ef2;border-radius:20px;padding:8px 16px;font-size:13px;font-weight:500;transition:all .25s;position:fixed;bottom:80px;left:50%;transform:translate(-50%)translateY(10px)}.toast.show{opacity:1;transform:translate(-50%)translateY(0)}.btn-row,.btn-card{touch-action:none}.btns-in-row{overflow:visible}.btn-card{flex:1 1 0;min-width:0;transition:flex .2s}
