@import"https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap";:root{--font-apple: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "SF Pro Rounded", "Helvetica Neue", sans-serif;--font-mono: "SF Mono", "JetBrains Mono", Menlo, Monaco, Consolas, monospace;--apple-bg: #000000;--apple-secondary-bg: #1c1c1e;--apple-tertiary-bg: #2c2c2e;--surface-sidebar: rgba(28, 28, 30, .75);--surface-header: rgba(28, 28, 30, .85);--surface-card: rgba(44, 44, 46, .65);--surface-card-hover: rgba(58, 58, 60, .8);--surface-modal: rgba(28, 28, 30, .92);--material-sidebar: var(--surface-sidebar);--material-header: var(--surface-header);--material-card: var(--surface-card);--material-card-hover: var(--surface-card-hover);--material-modal: var(--surface-modal);--apple-blue: #007aff;--apple-blue-hover: #0062cc;--apple-blue-glow: rgba(0, 122, 255, .35);--apple-indigo: #5856d6;--apple-purple: #af52de;--apple-pink: #ff2d55;--apple-green: #34c759;--apple-orange: #ff9500;--apple-yellow: #ffcc00;--apple-teal: #30b0c7;--apple-label-primary: #ffffff;--apple-label-secondary: #8e8e93;--apple-label-tertiary: #636366;--apple-label-quaternary: #48484a;--apple-separator: rgba(255, 255, 255, .1);--apple-separator-subtle: rgba(255, 255, 255, .06);--apple-border-highlight: rgba(255, 255, 255, .15);--card-box-shadow: 0 4px 16px rgba(0, 0, 0, .2);--card-box-shadow-hover: 0 12px 30px rgba(0, 0, 0, .4);--preview-box-bg: rgba(0, 0, 0, .4);--preview-box-text: #a7f3d0;--radius-sf-sm: 8px;--radius-sf-md: 12px;--radius-sf-lg: 16px;--radius-sf-xl: 22px;--radius-sf-capsule: 9999px;--btn-primary-text: #ffffff;--ease-apple-spring: cubic-bezier(.16, 1, .3, 1);--ease-apple-in-out: cubic-bezier(.4, 0, .2, 1);--bg-card: #242426;--bg-hover: #2c2c2e;--bg-input: #121214;--text-primary: #ffffff;--text-secondary: #a1a1a6;--text-tertiary: #636366;--border-color: rgba(255, 255, 255, .12);--accent-color: #007aff}[data-theme=light]{--apple-bg: #f2f2f7;--apple-secondary-bg: #ffffff;--apple-tertiary-bg: #e5e5ea;--surface-sidebar: rgba(242, 242, 247, .85);--surface-header: rgba(255, 255, 255, .85);--surface-card: rgba(255, 255, 255, .85);--surface-card-hover: rgba(255, 255, 255, 1);--surface-modal: rgba(255, 255, 255, .98);--material-sidebar: var(--surface-sidebar);--material-header: var(--surface-header);--material-card: var(--surface-card);--material-card-hover: var(--surface-card-hover);--material-modal: var(--surface-modal);--apple-label-primary: #1c1c1e;--apple-label-secondary: #6c6c70;--apple-label-tertiary: #8e8e93;--apple-label-quaternary: #aeaeb2;--apple-separator: rgba(0, 0, 0, .08);--apple-separator-subtle: rgba(0, 0, 0, .04);--apple-border-highlight: rgba(0, 0, 0, .12);--card-box-shadow: 0 4px 16px rgba(0, 0, 0, .06);--card-box-shadow-hover: 0 12px 30px rgba(0, 0, 0, .12);--preview-box-bg: rgba(0, 0, 0, .04);--preview-box-text: #0f766e;--bg-card: #f8f8fa;--bg-hover: #e5e5ea;--bg-input: #ffffff;--text-primary: #1c1c1e;--text-secondary: #6c6c70;--text-tertiary: #8e8e93;--border-color: rgba(0, 0, 0, .1);--accent-color: #007aff}*{box-sizing:border-box;margin:0;padding:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-apple);background-color:var(--apple-bg);color:var(--apple-label-primary);min-height:100vh;overflow-x:hidden;letter-spacing:-.01em;transition:background-color .3s ease,color .3s ease}[data-theme=dark] body{background-image:radial-gradient(ellipse at 20% 0%,rgba(0,122,255,.15) 0%,transparent 60%),radial-gradient(ellipse at 80% 100%,rgba(88,86,214,.12) 0%,transparent 60%);background-attachment:fixed}[data-theme=light] body{background-image:radial-gradient(ellipse at 20% 0%,rgba(0,122,255,.08) 0%,transparent 60%),radial-gradient(ellipse at 80% 100%,rgba(88,86,214,.06) 0%,transparent 60%);background-attachment:fixed}::-webkit-scrollbar{width:7px;height:7px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--apple-label-secondary);border-radius:99px;opacity:.3}.app-layout{display:flex;flex-direction:column;min-height:100vh}.app-header{height:54px;padding:0 1.25rem;background:var(--material-header);backdrop-filter:blur(25px) saturate(190%);-webkit-backdrop-filter:blur(25px) saturate(190%);border-bottom:1px solid var(--apple-separator);display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:50;transition:background .3s ease,border-color .3s ease}.brand-logo{display:flex;align-items:center;gap:.6rem;font-weight:600;font-size:1.05rem;color:var(--apple-label-primary);text-decoration:none;letter-spacing:-.02em}.brand-icon{width:28px;height:28px;border-radius:var(--radius-sf-sm);background:transparent;display:flex;align-items:center;justify-content:center;box-shadow:0 3px 10px #8b5cf666}.main-wrapper{display:flex;flex:1;max-width:1600px;margin:0 auto;width:100%}.sidebar{width:260px;padding:1.25rem 1rem;border-right:1px solid var(--apple-separator);display:flex;flex-direction:column;gap:1.25rem;flex-shrink:0;background:var(--material-sidebar);backdrop-filter:blur(30px) saturate(180%);-webkit-backdrop-filter:blur(30px) saturate(180%);transition:background .3s ease,border-color .3s ease}.sidebar-section-title{font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--apple-label-secondary);padding:0 .5rem;margin-bottom:.4rem}.sidebar-manage-btn{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;font-size:.72rem;font-weight:500;color:var(--apple-label-secondary);background:transparent;border:1px solid transparent;border-radius:var(--radius-sf-capsule);cursor:pointer;transition:all .2s var(--ease-apple-spring)}.sidebar-manage-btn:hover{background:var(--apple-blue);color:#fff;border-color:var(--apple-blue);box-shadow:0 2px 8px var(--apple-blue-glow);transform:translateY(-1px)}.sidebar-manage-btn:active{transform:translateY(0)}.nav-item{display:flex;align-items:center;justify-content:space-between;padding:.55rem .75rem;border-radius:var(--radius-sf-md);color:var(--apple-label-primary);background:transparent;border:none;cursor:pointer;font-size:.88rem;font-weight:400;transition:all .15s var(--ease-apple-spring);width:100%;text-align:left}.nav-item:hover{background:var(--apple-separator)}.nav-item.active{color:#fff;background:var(--apple-blue);font-weight:500;box-shadow:0 2px 10px var(--apple-blue-glow)}.nav-badge{font-size:.75rem;font-weight:500;padding:2px 7px;border-radius:99px;background:var(--apple-separator);color:var(--apple-label-secondary)}.nav-item.active .nav-badge{background:#ffffff40;color:#fff}.btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;padding:.6rem 1.1rem;border-radius:var(--radius-sf-md);background:var(--apple-blue);color:var(--btn-primary-text, #ffffff);font-size:.88rem;font-weight:500;border:none;cursor:pointer;box-shadow:0 2px 8px var(--apple-blue-glow);transition:transform .15s var(--ease-apple-spring),background-color .15s ease;white-space:nowrap}.btn-primary:hover{background:var(--apple-blue-hover)}.btn-primary:active{transform:scale(.97)}.btn-ai-gradient{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;padding:.6rem 1.1rem;border-radius:var(--radius-sf-md);background:linear-gradient(135deg,#a855f7,#3b82f6);color:#fff;font-size:.88rem;font-weight:500;border:none;cursor:pointer;box-shadow:0 2px 8px #a855f74d;transition:transform .15s var(--ease-apple-spring),filter .15s ease,box-shadow .15s ease;white-space:nowrap}.btn-ai-gradient:hover{filter:brightness(1.08);box-shadow:0 4px 14px #a855f766}.btn-ai-gradient:active{transform:scale(.97)}.btn-secondary{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;padding:.55rem .9rem;border-radius:var(--radius-sf-md);background:var(--apple-separator);color:var(--apple-label-primary);font-size:.85rem;font-weight:400;border:1px solid var(--apple-separator);cursor:pointer;transition:background-color .15s ease,transform .15s var(--ease-apple-spring);white-space:nowrap}.btn-secondary:hover{background:var(--apple-border-highlight)}.btn-secondary:active{transform:scale(.97)}.content-area{flex:1;padding:1.75rem 2rem;display:flex;flex-direction:column;gap:1.25rem;min-width:0}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}.search-bar-wrapper{position:relative;flex:1;min-width:260px}.search-input{width:100%;padding:.6rem 1rem .6rem 2.4rem;border-radius:var(--radius-sf-capsule);background:var(--apple-tertiary-bg);border:1px solid var(--apple-separator);color:var(--apple-label-primary);font-size:.9rem;font-family:inherit;outline:none;transition:all .2s var(--ease-apple-spring)}.search-input:focus{border-color:var(--apple-blue);box-shadow:0 0 0 3px #007aff40;background:var(--material-card)}.search-icon{position:absolute;left:.85rem;top:50%;transform:translateY(-50%);color:var(--apple-label-secondary);pointer-events:none}.templates-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:1.25rem}.template-card{background:var(--material-card);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid var(--apple-separator);border-radius:var(--radius-sf-lg);padding:1.25rem;display:flex;flex-direction:column;justify-content:space-between;gap:1rem;transition:all .25s var(--ease-apple-spring);position:relative;overflow:hidden;box-shadow:var(--card-box-shadow)}.template-card:hover{background:var(--material-card-hover);border-color:var(--apple-border-highlight);transform:translateY(-3px) scale(1.005);box-shadow:var(--card-box-shadow-hover)}.template-card-header{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem}.template-title{font-size:1.05rem;font-weight:600;color:var(--apple-label-primary);line-height:1.3;letter-spacing:-.01em}.template-desc{font-size:.83rem;color:var(--apple-label-secondary);line-height:1.4;margin-top:.3rem}.badge-storage{display:inline-flex;align-items:center;gap:4px;font-size:.68rem;font-weight:600;padding:3px 8px;border-radius:99px;text-transform:uppercase;letter-spacing:.02em}.badge-storage.local{background:#34c75926;color:var(--apple-green);border:1px solid rgba(52,199,89,.3)}.badge-storage.cloud{background:#007aff26;color:var(--apple-blue);border:1px solid rgba(0,122,255,.3)}.template-preview-box{background:var(--preview-box-bg);border-radius:var(--radius-sf-md);padding:.75rem;font-family:var(--font-mono);font-size:.8rem;color:var(--preview-box-text);max-height:100px;overflow:hidden;text-overflow:ellipsis;white-space:pre-wrap;border:1px solid var(--apple-separator)}.template-tags{display:flex;flex-wrap:wrap;gap:.4rem}.tag-item{font-size:.72rem;padding:2px 8px;border-radius:var(--radius-sf-sm);background:var(--apple-separator);color:var(--apple-label-secondary);border:1px solid var(--apple-separator-subtle)}.template-footer{display:flex;align-items:center;justify-content:space-between;padding-top:.75rem;border-top:1px solid var(--apple-separator-subtle)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000ad;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:1.5rem;overscroll-behavior:contain}.modal-container,.modal-content{background:var(--apple-secondary-bg);border:1px solid var(--apple-border-highlight);border-radius:var(--radius-sf-xl);width:100%;max-width:680px;max-height:90vh;display:flex;flex-direction:column;box-shadow:0 30px 60px #0006,0 0 0 1px #ffffff14;animation:appleSheetIn .25s var(--ease-apple-spring);overflow:hidden;overscroll-behavior:contain;color:var(--apple-label-primary)}.modal-container form,.modal-content form{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden}@keyframes appleSheetIn{0%{opacity:0;transform:scale(.96) translateY(12px)}to{opacity:1;transform:scale(1) translateY(0)}}.modal-header{padding:1.1rem 1.5rem;border-bottom:1px solid var(--apple-separator);display:flex;align-items:center;justify-content:space-between}.modal-title{font-size:1.15rem;font-weight:600;letter-spacing:-.01em}.modal-body{padding:1.5rem;overflow-y:auto;display:flex;flex-direction:column;gap:1.25rem;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}.modal-footer{padding:1.1rem 1.5rem;border-top:1px solid var(--apple-separator);display:flex;align-items:center;justify-content:flex-end;gap:.75rem;background:var(--apple-separator-subtle)}.icon-btn{background:transparent;border:none;color:var(--apple-label-secondary);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:.4rem;border-radius:var(--radius-sf-md);transition:background .15s ease,color .15s ease}.icon-btn:hover{background:var(--apple-separator);color:var(--apple-label-primary)}.form-group{display:flex;flex-direction:column;gap:.4rem}.form-label{font-size:.83rem;font-weight:500;color:var(--apple-label-secondary)}.form-input,.form-textarea,.form-select{width:100%;padding:.65rem .9rem;border-radius:var(--radius-sf-md);background:var(--apple-tertiary-bg);border:1px solid var(--apple-separator);color:var(--apple-label-primary);font-family:inherit;font-size:.9rem;outline:none;transition:border-color .2s ease,box-shadow .2s ease}.form-input:focus,.form-textarea:focus,.form-select:focus{border-color:var(--apple-blue);box-shadow:0 0 0 3px #007aff40}.form-textarea{min-height:120px;resize:vertical;font-family:var(--font-mono)}.desktop-only-toolbar{display:flex;align-items:center;gap:.65rem}.mobile-only-header-controls{display:none}.editor-form-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem}@media (max-width: 900px){.main-wrapper{flex-direction:column}.sidebar{width:100%;border-right:none;border-bottom:1px solid var(--apple-separator);padding:1rem}.content-area{padding:1rem}}@media (max-width: 640px){.hide-on-mobile,.desktop-only-toolbar{display:none!important}.btn-primary,.btn-secondary,.btn-ai-gradient{white-space:nowrap!important;font-size:.82rem!important;padding:.4rem .7rem!important}.nav-item{white-space:nowrap!important;border-radius:99px!important;padding:.35rem .75rem!important;font-size:.8rem!important}.sidebar{padding:.65rem .85rem!important;gap:.5rem!important}.sidebar-section-title{display:none!important}.sidebar>div>div{flex-direction:row!important;overflow-x:auto!important;white-space:nowrap!important;padding-bottom:.3rem!important;-webkit-overflow-scrolling:touch;gap:.4rem!important}.mobile-only-header-controls{display:flex!important;align-items:center;gap:.5rem}.app-header{height:54px;padding:0 .85rem}.modal-overlay{padding:.5rem!important;align-items:center!important;justify-content:center!important;height:100vh!important;height:100dvh!important;max-height:100dvh!important;overscroll-behavior:none!important}.modal-container{max-height:calc(100vh - 1rem)!important;max-height:calc(100dvh - 1rem)!important;height:auto!important;border-radius:var(--radius-sf-lg)!important;width:100%!important;margin:0!important;display:flex!important;flex-direction:column!important;overflow:hidden!important;overscroll-behavior:none!important}.modal-header{padding:.85rem 1rem!important;flex-shrink:0!important}.modal-body{padding:1rem!important;flex:1 1 auto!important;min-height:0!important;max-height:100%!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch!important;overscroll-behavior:contain!important;touch-action:pan-y!important}.modal-footer{padding:.85rem 1rem!important;flex-shrink:0!important}.prompt-modal-footer{flex-direction:column!important;align-items:stretch!important;gap:.75rem!important}.prompt-modal-footer>div{width:100%!important;justify-content:space-between!important}.prompt-modal-footer a,.prompt-modal-footer button{flex:1;justify-content:center;text-align:center}.editor-form-grid{grid-template-columns:1fr!important}.form-input,.form-textarea,.form-select{font-size:16px!important}}.bulk-action-bar{position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%);z-index:90;background:var(--material-modal);backdrop-filter:blur(30px) saturate(200%);-webkit-backdrop-filter:blur(30px) saturate(200%);border:1px solid var(--apple-border-highlight);border-radius:var(--radius-sf-xl);padding:.75rem 1.25rem;display:flex;align-items:center;gap:1rem;box-shadow:0 20px 50px #00000059;animation:bulkBarIn .25s var(--ease-apple-spring);max-width:95vw;flex-wrap:wrap;justify-content:center}@keyframes bulkBarIn{0%{opacity:0;transform:translate(-50%,20px)}to{opacity:1;transform:translate(-50%)}}@media (max-width: 640px){.bulk-action-bar{bottom:.75rem;padding:.6rem .85rem;gap:.5rem;border-radius:var(--radius-sf-lg)}}.variable-tips-banner{background:var(--preview-box-bg);border:1px solid var(--apple-blue-glow);border-radius:var(--radius-sf-md);padding:.75rem .9rem;margin-bottom:.75rem;animation:tipsSlideDown .2s var(--ease-apple-spring)}@keyframes tipsSlideDown{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.drag-handle{cursor:grab;padding:.25rem;border-radius:6px;color:var(--apple-label-tertiary);transition:all .15s ease;display:inline-flex;align-items:center;justify-content:center}.drag-handle:hover{color:var(--apple-blue);background:var(--apple-separator)}.drag-handle:active{cursor:grabbing}.template-card{transition:transform .25s cubic-bezier(.16,1,.3,1),box-shadow .2s ease,border-color .2s ease,opacity .2s ease}.template-card.dragging{opacity:.25!important;border:2px dashed #6366f1!important;box-shadow:none!important;transform:scale(.96)}.template-card.just-dropped{animation:dropBounce .5s cubic-bezier(.175,.885,.32,1.275);border-color:#6366f1!important;box-shadow:0 0 0 3px #6366f180,0 12px 30px #6366f14d!important}@keyframes dropBounce{0%{transform:scale(.95)}50%{transform:scale(1.03)}to{transform:scale(1)}}.toast-container{box-shadow:0 10px 30px #0000004d;backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%)}.sync-badge-cloud{position:relative;overflow:visible}.sync-badge-cloud:before{content:"";position:absolute;top:-2px;right:-2px;bottom:-2px;left:-2px;border-radius:14px;background:linear-gradient(135deg,#6366f166,#8b5cf666);animation:cloudBadgePulse 2.5s ease-in-out infinite;z-index:-1;opacity:0}@keyframes cloudBadgePulse{0%,to{opacity:0;transform:scale(1)}50%{opacity:1;transform:scale(1.08)}}@keyframes syncPulse{0%,to{opacity:1;box-shadow:0 0 #818cf866}50%{opacity:.85;box-shadow:0 0 0 4px #818cf800}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-spin{animation:spin 1s linear infinite}.profile-select-dropdown{-moz-appearance:none;appearance:none;-webkit-appearance:none;background:transparent;border:none;font-size:.78rem;font-weight:600;color:var(--apple-label-primary);cursor:pointer;outline:none}.profile-select-dropdown option{background:var(--apple-secondary-bg);color:var(--apple-label-primary)}.header-dropdown-overlay{position:fixed;right:0;bottom:0;left:0;top:56px;background:transparent;z-index:9999;padding:.5rem 1.25rem;display:flex;justify-content:flex-end;align-items:flex-start;box-sizing:border-box}.header-dropdown-card{background:var(--apple-secondary-bg);backdrop-filter:blur(30px) saturate(200%);-webkit-backdrop-filter:blur(30px) saturate(200%);border:1px solid var(--apple-separator);border-radius:var(--radius-sf-lg);padding:.85rem;width:100%;max-width:300px;display:flex;flex-direction:column;gap:.65rem;box-shadow:0 12px 36px #00000038,0 0 0 1px var(--apple-separator-subtle);animation:headerMenuSlideDown .16s cubic-bezier(.16,1,.3,1);box-sizing:border-box}@keyframes headerMenuSlideDown{0%{opacity:0;transform:translateY(-8px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}.dropdown-user-info{display:flex;align-items:center;gap:.75rem;padding-bottom:.75rem;border-bottom:1px solid var(--apple-separator);box-sizing:border-box}.dropdown-user-avatar{width:38px;height:38px;border-radius:50%;border:2px solid var(--apple-blue);flex-shrink:0;object-fit:cover}.dropdown-user-name{font-weight:600;font-size:.9rem;color:var(--apple-label-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dropdown-user-email{font-size:.75rem;color:var(--apple-label-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dropdown-menu-list{display:flex;flex-direction:column;gap:.35rem;width:100%;box-sizing:border-box}.dropdown-menu-item{display:flex;align-items:center;gap:.65rem;width:100%;padding:.6rem .85rem;border-radius:var(--radius-sf-md);background:var(--apple-tertiary-bg);border:1px solid var(--apple-separator);color:var(--apple-label-primary);font-size:.84rem;font-weight:500;cursor:pointer;text-align:left;transition:background-color .15s ease,transform .1s ease,border-color .15s ease;box-sizing:border-box;text-decoration:none}.dropdown-menu-item:hover{background:var(--apple-fill-secondary);border-color:var(--apple-separator-subtle)}.dropdown-menu-item:active{transform:scale(.98)}.dropdown-menu-item.info-only{background:transparent;border:none;cursor:default;padding:.35rem .85rem;font-size:.78rem;color:var(--apple-label-secondary)}.dropdown-menu-item.info-only:hover{background:transparent}.dropdown-menu-item.danger{color:#ef4444;background:#ef444414;border-color:#ef444433}.dropdown-menu-item.danger:hover{background:#ef444429;border-color:#ef444459}