:root{--red-primary: #FF3B30;--red-dark: #D70015;--red-light: #FF6961;--bg-primary: #F2F2F7;--bg-secondary: #FFFFFF;--bg-tertiary: #E5E5EA;--ios-black: #000000;--ios-gray-dark: #1C1C1E;--ios-gray: #8E8E93;--ios-gray-light: #AEAEB2;--ios-white: #FFFFFF;--glass-bg: #FFFFFF;--glass-bg-light: #FFFFFF;--glass-bg-dark: #1C1C1E;--glass-border: rgba(0, 0, 0, .1);--glass-border-light: rgba(0, 0, 0, .05);--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 4px 12px rgba(0, 0, 0, .08);--shadow-lg: 0 12px 24px rgba(0, 0, 0, .12);--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 20px;--radius-2xl: 24px;--radius-full: 9999px;--font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-size-sm: 13px;--font-size-md: 15px;--font-size-lg: 17px;--font-size-xl: 20px;--transition-base: .2s ease-in-out}.glass{background:var(--bg-secondary);border-bottom:1px solid var(--glass-border);box-shadow:var(--shadow-sm)}.glass-light{background:var(--bg-secondary);border:1px solid var(--glass-border);box-shadow:var(--shadow-md)}.glass-dark{background:var(--ios-gray-dark);color:var(--ios-white)}.ios-button{font-family:var(--font-family);font-size:var(--font-size-md);font-weight:600;padding:10px 20px;border-radius:var(--radius-full);border:none;cursor:pointer;transition:all var(--transition-base);display:inline-flex;align-items:center;justify-content:center;text-decoration:none;white-space:nowrap}.ios-button-primary{background:var(--red-primary);color:var(--ios-white);box-shadow:0 2px 8px #ff3b304d}.ios-button-primary:hover{background:var(--red-dark);transform:translateY(-1px);box-shadow:0 4px 12px #ff3b3066}.ios-button-secondary{background:var(--bg-tertiary);color:var(--ios-black)}.ios-button-secondary:hover{background:#d1d1d6}.ios-button-ghost{background:transparent;color:var(--ios-black);border:1px solid transparent}.ios-button-ghost:hover{background:#0000000d}.ios-button-ghost-dark{background:transparent;color:var(--ios-black)}.ios-card{background:var(--bg-secondary);border-radius:var(--radius-xl);padding:var(--spacing-lg);box-shadow:var(--shadow-md);border:1px solid var(--glass-border)}.ios-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.ios-input{font-family:var(--font-family);font-size:var(--font-size-md);padding:12px 16px;border-radius:var(--radius-md);border:1px solid #C6C6C8;background:#fff;color:var(--ios-black);transition:all var(--transition-base);width:100%;box-sizing:border-box}.ios-input:focus{outline:none;border-color:var(--red-primary);box-shadow:0 0 0 3px #ff3b301a}.preview-content{position:relative;flex:1;width:100%;height:100%;overflow:hidden}.preview-loading-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#ffffff1a;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:10;opacity:0;pointer-events:none;transition:opacity .3s ease}.preview-loading-overlay.visible{opacity:1;pointer-events:all}.preview-loading-overlay .spinner{width:40px;height:40px;border:4px solid rgba(0,122,255,.1);border-left-color:var(--ios-blue);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:16px}.preview-loading-overlay .loading-text{font-size:14px;font-weight:500;color:var(--ios-text-primary);text-shadow:0 2px 4px rgba(0,0,0,.1)}.ios-modal-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background:#0006;z-index:1000;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(4px)}.ios-modal{background:var(--bg-secondary);border-radius:var(--radius-2xl);padding:var(--spacing-xl);max-width:500px;width:90%;box-shadow:var(--shadow-lg);animation:slideUp .3s cubic-bezier(.16,1,.3,1)}.text-white{color:var(--ios-white)}.text-gray{color:var(--ios-gray)}@keyframes slideUp{0%{opacity:0;transform:translateY(20px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.ios-spinner{width:32px;height:32px;border:3px solid #E5E5EA;border-top-color:var(--red-primary);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.ios-loader{width:48px;height:48px;border-radius:50%;position:relative;animation:rotate 1s linear infinite}.ios-loader:before{content:"";box-sizing:border-box;position:absolute;inset:0;border-radius:50%;border:5px solid #E5E5EA;animation:prixClipFix 2s linear infinite}.ios-loader:after{content:"";box-sizing:border-box;position:absolute;inset:0;border-radius:50%;border:5px solid var(--red-primary);animation:prixClipFix 2s linear infinite reverse}@keyframes rotate{to{transform:rotate(360deg)}}@keyframes prixClipFix{0%{clip-path:polygon(50% 50%,0 0,0 0,0 0,0 0,0 0)}25%{clip-path:polygon(50% 50%,0 0,100% 0,100% 0,100% 0,100% 0)}50%{clip-path:polygon(50% 50%,0 0,100% 0,100% 100%,100% 100%,100% 100%)}75%{clip-path:polygon(50% 50%,0 0,100% 0,100% 100%,0 100%,0 100%)}to{clip-path:polygon(50% 50%,0 0,100% 0,100% 100%,0 100%,0 0)}}.btn-upgrade{background:linear-gradient(135deg,gold,orange);color:#1a1a1a;border:none;font-weight:700;text-transform:uppercase;letter-spacing:.5px;font-size:12px;padding:8px 16px;border-radius:var(--radius-full);cursor:pointer;transition:all .2s;box-shadow:0 4px 12px #ffa5004d;display:inline-flex;align-items:center;gap:6px;text-decoration:none;white-space:nowrap}.btn-upgrade:hover{transform:translateY(-2px);box-shadow:0 6px 16px #ffa50066;filter:brightness(1.05)}.btn-upgrade:before{content:"";display:flex;flex-direction:row;flex-shrink:0;width:14px;height:14px;margin-right:6px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%231a1a1a'%3E%3Cpath d='M12 1l3.22 6.636 7.28.96-5.34 5.12 1.34 7.284L12 17.77 5.5 21l1.34-7.284-5.34-5.12 7.28-.96L12 1z'/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat}@media(max-width:568px){.btn-upgrade{font-size:0;padding:8px;width:36px;height:36px;justify-content:center}.btn-upgrade:before{width:16px;height:16px;margin:0}}*{box-sizing:border-box}body{margin:0;font-family:var(--font-family);color:var(--ios-black)}.user-dropdown{position:relative;display:inline-block;min-width:120px}.dropdown-toggle{display:flex;align-items:center;gap:8px;cursor:pointer;padding:6px 12px;border-radius:var(--radius-full);transition:background-color .2s;user-select:none;min-width:100px;min-height:34px}.dropdown-toggle:hover{background-color:var(--bg-tertiary)}.dropdown-toggle .user-email{color:var(--ios-gray-dark);font-size:14px;font-weight:500;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dropdown-toggle .chevron{font-size:10px;color:var(--ios-gray);transition:transform .2s;flex-shrink:0}.user-dropdown.active .dropdown-toggle .chevron{transform:rotate(180deg)}.dropdown-menu{position:absolute;top:100%;right:0;margin-top:8px;background:var(--bg-secondary);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);border:1px solid var(--glass-border);min-width:200px;opacity:0;visibility:hidden;transform:translateY(-10px);transition:all .2s cubic-bezier(.16,1,.3,1);z-index:1000;padding:6px;display:flex;flex-direction:column}.user-dropdown.active .dropdown-menu{opacity:1;visibility:visible;transform:translateY(0)}.dropdown-item{padding:10px 12px;border-radius:var(--radius-md);color:var(--ios-black);font-size:14px;text-decoration:none;display:flex;align-items:center;gap:10px;cursor:pointer;transition:background-color .2s;border:none;background:none;width:100%;text-align:left}.dropdown-item:hover{background-color:var(--bg-tertiary)}.dropdown-item.danger{color:var(--red-primary)}.dropdown-item.danger:hover{background-color:#ff3b301a}.dropdown-divider{height:1px;background-color:var(--glass-border);margin:4px 0}@keyframes highlightPulse{0%{border-color:#ff3b3000;box-shadow:0 0 #ff3b3000}50%{border-color:var(--red-primary);box-shadow:0 0 0 4px #ff3b304d}to{border-color:#ff3b3000;box-shadow:0 0 #ff3b3000}}.highlight-pulse{animation:highlightPulse 2s ease-in-out}.preview-toggle-handle{position:fixed;right:0;top:50%;transform:translateY(-50%);background:var(--bg-secondary);border:1px solid var(--glass-border);border-right:none;border-radius:12px 0 0 12px;padding:12px 8px;cursor:pointer;box-shadow:-2px 0 8px #0000001a;z-index:90;transition:all .2s;display:flex;align-items:center;justify-content:center;color:var(--ios-gray-dark)}.preview-toggle-handle:hover{background:var(--bg-tertiary);padding-right:12px}.preview-toggle-handle.hidden{display:none}.toolbar-animate{opacity:0;transform:translateY(16px);transition:opacity .6s cubic-bezier(.22,1,.36,1),transform .6s cubic-bezier(.22,1,.36,1)}.toolbar-animate.toolbar-visible{opacity:1;transform:translateY(0)}.toolbar-animate[data-toolbar-index="0"]{transition-delay:0ms}.toolbar-animate[data-toolbar-index="1"]{transition-delay:80ms}.toolbar-animate[data-toolbar-index="2"]{transition-delay:.16s}.toolbar-animate[data-toolbar-index="3"]{transition-delay:.24s}.toolbar-animate[data-toolbar-index="4"]{transition-delay:.32s}.toolbar-animate[data-toolbar-index="5"]{transition-delay:.4s}.toolbar-animate[data-toolbar-index="6"]{transition-delay:.48s}.toolbar-animate[data-toolbar-index="7"]{transition-delay:.56s}.toolbar-animate[data-toolbar-index="8"]{transition-delay:.64s}.toolbar-animate[data-toolbar-index="9"]{transition-delay:.72s}.header-toolbar{display:flex;align-items:center;gap:12px;min-height:40px}.btn-fixed-sm{min-width:80px;min-height:36px}.btn-fixed-md{min-width:100px;min-height:40px}.btn-fixed-lg{min-width:120px;min-height:44px}.btn-icon-fixed{width:40px;height:40px;min-width:40px;min-height:40px;flex-shrink:0}@keyframes toolbarScaleIn{0%{opacity:0;transform:scale(.92) translateY(8px)}to{opacity:1;transform:scale(1) translateY(0)}}.toolbar-scale-animate{animation:toolbarScaleIn .5s cubic-bezier(.22,1,.36,1) forwards;animation-play-state:paused}.toolbar-scale-animate.toolbar-visible{animation-play-state:running}@keyframes toolbarGroupEntrance{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.toolbar-group-animate{opacity:0}.toolbar-group-animate.toolbar-visible{animation:toolbarGroupEntrance .65s cubic-bezier(.22,1,.36,1) forwards}.toolbar-group-animate[data-group="1"]{animation-delay:0ms}.toolbar-group-animate[data-group="2"]{animation-delay:.12s}.toolbar-group-animate[data-group="3"]{animation-delay:.24s}