:root{--background-color: #0d0d0d;--max-scale: 18;--attraction-strength: .02;--repulsion-strength: .5;--damping: .9;--repulsion-margin: 50px}*{box-sizing:border-box}body{margin:0;padding:0;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app{height:100vh;width:100vw;background-color:var(--background-color);overflow:hidden;position:relative}.app-shape{position:absolute;background-color:#fff;will-change:transform;transform-origin:center center;transform:translateZ(0);backface-visibility:hidden;transform-style:preserve-3d;image-rendering:auto;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.shape-circle{border-radius:50%}.shape-square{border-radius:22%}.shape-triangle{background-color:transparent;width:0;height:0}*{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}.card-modal-content,.customization-modal-content,.card-modal-scrollable,.customization-modal-scrollable{-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text;-webkit-touch-callout:default;touch-action:pan-y;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}.card-modal-input,.card-modal-textarea,.customization-modal-input{-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text;-webkit-touch-callout:default;touch-action:manipulation}.app-shape{transform:translateZ(0);-webkit-transform:translateZ(0)}.card-element{transition:none;animation:none;transform-origin:center center;position:absolute;z-index:auto}.card-element *,.card-element *:before,.card-element *:after{transition:none;animation:none}.app-shape{transition:none;animation:none;transform-origin:center center}.auth-container{display:flex;justify-content:center;align-items:center;min-height:100vh;background-color:var(--background-color);padding:20px;-webkit-user-select:text;user-select:text}.auth-card{background:#1a1a1af2;border-radius:16px;padding:2.5rem;max-width:400px;width:100%;box-shadow:0 4px 20px #00000080;border:1px solid rgba(255,255,255,.1)}.auth-header{text-align:center;margin-bottom:2rem}.auth-header h1{color:#fff;font-size:32px;font-weight:300;margin:0 0 8px;letter-spacing:-1px}.auth-header p{color:#888;font-size:16px;margin:0;line-height:1.4;font-weight:400}.auth-quick-start{display:flex;flex-direction:column;gap:1rem}.auth-primary-button{background:#667eea;color:#fff;border:none;border-radius:12px;padding:16px 24px;font-size:16px;font-weight:500;cursor:pointer;transition:all .2s ease;width:100%}.auth-primary-button:hover{background:#5a67d8;transform:translateY(-1px)}.auth-divider{display:flex;align-items:center;text-align:center;margin:.5rem 0}.auth-divider:before,.auth-divider:after{content:"";flex:1;height:1px;background:#fff3}.auth-divider span{padding:0 1rem;color:#666;font-size:14px}.auth-secondary-button{background:transparent;color:#ccc;border:1px solid rgba(255,255,255,.2);border-radius:12px;padding:14px 24px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;width:100%}.auth-secondary-button:hover{border-color:#667eea;color:#667eea}.auth-note{font-size:13px;color:#666;text-align:center;margin:.5rem 0 0;line-height:1.4}.auth-form-container{display:flex;flex-direction:column;gap:1rem}.auth-back-button{background:none;border:none;color:#667eea;font-size:14px;cursor:pointer;padding:8px 0;text-align:left;transition:color .2s ease}.auth-back-button:hover{color:#5a67d8}.auth-form{width:100%}.loading{display:flex;justify-content:center;align-items:center;height:100vh;background:var(--background-color);color:#fff;font-size:18px;font-weight:500}.dev-navbar{position:fixed;top:20px;right:20px;z-index:10000;-webkit-user-select:text;user-select:text}.dev-navbar-content{position:relative}.dev-navbar-toggle{width:48px;height:48px;border-radius:12px;border:none;background:#ffffff26;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.2);color:#fff;font-size:18px;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 32px #0003}.dev-navbar-toggle:hover{background:#ffffff40;transform:translateY(-2px);box-shadow:0 12px 40px #0000004d}.dev-navbar-toggle:active{transform:translateY(0)}.dev-navbar-expanded{position:absolute;top:56px;right:0;min-width:280px;background:#000000d9;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-radius:16px;border:1px solid rgba(255,255,255,.1);padding:20px;box-shadow:0 16px 64px #0006;animation:devNavbarSlideIn .3s ease-out}@keyframes devNavbarSlideIn{0%{opacity:0;transform:translateY(-10px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.dev-navbar-section{margin-bottom:16px}.dev-navbar-section:last-child{margin-bottom:0}.dev-navbar-section h4{color:#fff;font-size:14px;font-weight:600;margin:0 0 8px;padding-bottom:4px;border-bottom:1px solid rgba(255,255,255,.1)}.dev-info-item{display:flex;justify-content:space-between;align-items:center;padding:4px 0;font-size:12px}.dev-info-label{color:#ffffffb3;font-weight:500}.dev-info-value{color:#fff;font-weight:400;font-family:Monaco,Menlo,Ubuntu Mono,monospace;background:#ffffff1a;padding:2px 6px;border-radius:4px;font-size:11px}.dev-navbar-actions{margin-top:16px;padding-top:16px;border-top:1px solid rgba(255,255,255,.1)}.dev-logout-btn{width:100%;padding:10px 16px;background:linear-gradient(135deg,#ff6b6b,#ee5a52);border:none;border-radius:8px;color:#fff;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 16px #ff6b6b4d}.dev-logout-btn:hover{background:linear-gradient(135deg,#ff5252,#e53e3e);transform:translateY(-1px);box-shadow:0 6px 20px #ff6b6b66}.dev-logout-btn:active{transform:translateY(0)}@media (max-width: 480px){.auth-card{margin:10px;padding:2rem;border-radius:12px}.auth-header h1{font-size:28px}.auth-header p{font-size:14px}.auth-primary-button{padding:14px 20px;font-size:15px}.auth-secondary-button{padding:12px 20px}.dev-navbar{top:16px;right:16px}.dev-navbar-expanded{min-width:260px;right:-16px}}.grid-manager{padding:1rem;max-width:350px;max-height:70vh;overflow-y:auto}.grid-manager-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;padding-bottom:.5rem;border-bottom:1px solid rgba(255,255,255,.1)}.grid-manager-header h4{margin:0;color:#fff;font-size:1.1rem;font-weight:600}.grid-manager-status{display:flex;gap:.5rem;font-size:.8rem}.status-saving,.status-loading{color:#fffc;font-size:.75rem}.grid-manager-section{margin-bottom:1.5rem}.grid-save-button{width:100%;padding:.75rem 1rem;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:12px;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #667eea40}.grid-save-button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 20px #667eea59}.grid-save-button:disabled{opacity:.6;cursor:not-allowed}.grid-save-dialog{margin-top:.75rem;padding:1rem;background:#ffffff0d;border-radius:12px;border:1px solid rgba(255,255,255,.1)}.grid-save-dialog input{width:100%;padding:.6rem;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:8px;color:#fff;font-size:.9rem;margin-bottom:.75rem}.grid-save-dialog input::placeholder{color:#ffffff80}.grid-save-dialog input:focus{outline:none;border-color:#667eea80;background:#ffffff26}.grid-save-actions{display:flex;gap:.5rem;justify-content:flex-end}.grid-save-actions button{padding:.5rem 1rem;border:none;border-radius:8px;font-size:.8rem;cursor:pointer;transition:all .2s ease}.grid-save-actions button:first-child{background:#ffffff1a;color:#fffc}.grid-save-actions button:last-child{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.grid-save-actions button:hover{transform:translateY(-1px)}.grid-save-actions button:disabled{opacity:.5;cursor:not-allowed;transform:none}.grid-manager-section h5{margin:0 0 .75rem;color:#ffffffe6;font-size:.9rem;font-weight:500}.grid-list{display:flex;flex-direction:column;gap:.5rem}.grid-item{position:relative;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:.75rem;transition:all .3s ease;cursor:pointer}.grid-item:hover{background:#ffffff14;border-color:#fff3;transform:translateY(-1px)}.grid-item.active{background:#667eea26;border-color:#667eea4d}.grid-item-info{flex:1}.grid-item-name{display:flex;align-items:center;gap:.5rem;color:#fff;font-size:.9rem;font-weight:500;margin-bottom:.25rem}.active-indicator{color:#4ade80;font-size:.8rem}.grid-item-meta{display:flex;gap:1rem;color:#fff9;font-size:.75rem}.grid-item-actions{position:absolute;top:.75rem;right:.75rem}.grid-delete-btn{background:none;border:none;font-size:.9rem;cursor:pointer;padding:.25rem;border-radius:6px;transition:all .2s ease;opacity:.6}.grid-delete-btn:hover{opacity:1;background:#ef444433}.grid-delete-confirm{position:absolute;top:0;left:0;right:0;bottom:0;background:#000000e6;border-radius:12px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;z-index:10}.grid-delete-confirm p{color:#fff;margin:0 0 1rem;font-size:.9rem}.grid-delete-actions{display:flex;gap:.5rem}.grid-delete-actions button{padding:.4rem .8rem;border:none;border-radius:6px;font-size:.8rem;cursor:pointer;transition:all .2s ease}.grid-delete-actions button:first-child{background:#ffffff1a;color:#fffc}.delete-confirm{background:linear-gradient(135deg,#ef4444,#dc2626)!important;color:#fff!important}.grid-manager-empty{text-align:center;padding:2rem 1rem;color:#fff9}.grid-manager-empty p{margin:.5rem 0;font-size:.9rem}.grid-manager-disabled{padding:1rem;text-align:center;color:#fff9}.grid-manager-disabled p{margin:0;font-size:.9rem}.mobile-grid-slider{position:fixed;bottom:30px;left:50%;transform:translate(-50%);z-index:1000;pointer-events:none;user-select:none;-webkit-user-select:none}.navigation-controls{display:flex;align-items:center;gap:12px;pointer-events:all}.slider-container{background:#ffffff14;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.12);border-radius:30px;padding:20px 40px;cursor:grab;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 12px 40px #0000001f,0 4px 12px #00000014,inset 0 1px #ffffff1a;animation:slideUpMinimal .4s cubic-bezier(.4,0,.2,1);min-width:240px;max-width:90vw;position:relative}.slider-container.dragging{cursor:grabbing}.slider-container[data-swipe-direction=left]:before{content:"←";position:absolute;left:15px;top:50%;transform:translateY(-50%);font-size:20px;color:#ffffffb3;opacity:1;transition:opacity .2s ease}.slider-container[data-swipe-direction=right]:before{content:"→";position:absolute;right:15px;top:50%;transform:translateY(-50%);font-size:20px;color:#ffffffb3;opacity:1;transition:opacity .2s ease}@keyframes slideUpMinimal{0%{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.slider-main{display:flex;align-items:center;justify-content:center;position:relative;min-height:40px}.mobile-dev-btn{background:#ffffff14;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.12);border-radius:30px;width:60px;height:60px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);font-size:18px;flex-shrink:0;position:relative;z-index:10;box-shadow:0 12px 40px #0000001f,0 4px 12px #00000014,inset 0 1px #ffffff1a;animation:slideUpMinimal .4s cubic-bezier(.4,0,.2,1)}.mobile-dev-btn:hover{background:#ffffff1f;border-color:#fff3;transform:scale(1.05)}.mobile-dev-btn:active{transform:scale(.95);background:#ffffff26}.slider-dots{display:flex;align-items:center;justify-content:center;gap:20px;position:relative;flex:1;min-width:120px}.slider-dot{width:16px;height:16px;border-radius:50%;background:#ffffff40;transition:all .4s cubic-bezier(.4,0,.2,1);cursor:pointer;position:relative;overflow:hidden;flex-shrink:0}.slider-dot:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:#fff9;border-radius:50%;transform:scale(0);transition:transform .4s cubic-bezier(.4,0,.2,1)}.slider-dot.active{background:#fff6;transform:scale(1.4);box-shadow:0 0 20px #ffffff4d,0 0 40px #ffffff1a}.slider-dot.active:before{transform:scale(1)}.slider-dot:hover:not(.active){background:#ffffff59;transform:scale(1.2)}.single-grid-indicator{text-align:center;flex:1}.single-grid-indicator .grid-name{font-size:16px;font-weight:600;color:#ffffffe6;text-shadow:0 1px 2px rgba(0,0,0,.3)}.mobile-dev-dialog{position:absolute;bottom:80px;left:50%;transform:translate(-50%);background:#ffffff14;backdrop-filter:blur(25px);-webkit-backdrop-filter:blur(25px);border:1px solid rgba(255,255,255,.12);border-radius:24px;padding:20px;max-height:60vh;min-width:300px;max-width:90vw;overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none;box-shadow:0 12px 40px #00000026,0 4px 12px #0000001a,inset 0 1px #ffffff1a;animation:slideUpMinimal .3s cubic-bezier(.4,0,.2,1);z-index:5}.mobile-dev-dialog::-webkit-scrollbar{display:none}.mobile-dev-dialog .dev-section{margin-bottom:20px}.mobile-dev-dialog .dev-section h4{font-size:14px;font-weight:600;color:#ffffffe6;margin:0 0 12px;text-shadow:0 1px 2px rgba(0,0,0,.3)}.mobile-dev-dialog .dev-info{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.mobile-dev-dialog .dev-label{font-size:12px;color:#ffffffb3;font-weight:500}.mobile-dev-dialog .dev-value{font-size:12px;color:#ffffffe6;font-weight:600;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mobile-dev-dialog .dev-actions{margin-top:20px;text-align:center}.mobile-logout-btn{background:#dc354533;border:1px solid rgba(220,53,69,.3);border-radius:16px;padding:10px 20px;color:#ffffffe6;font-size:12px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.mobile-logout-btn:hover{background:#dc35454d;border-color:#dc354580;transform:translateY(-1px)}.mobile-dev-dialog .grid-manager{background:transparent;border:none;padding:0;margin:0}.mobile-dev-dialog .grid-manager-header h4{font-size:14px;margin-bottom:12px}.mobile-dev-dialog .grid-save-button{background:#4a90e233;border:1px solid rgba(74,144,226,.3);border-radius:12px;padding:8px 16px;color:#ffffffe6;font-size:11px;font-weight:600;cursor:pointer;transition:all .3s ease;width:100%}.mobile-dev-dialog .grid-save-button:hover{background:#4a90e24d;border-color:#4a90e280}.mobile-dev-dialog .grid-list{max-height:200px;overflow-y:auto;margin-top:12px}.mobile-dev-dialog .grid-item{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:8px;margin-bottom:8px;font-size:11px}.swipe-hint{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none;opacity:0;animation:swipeHint 3s ease-in-out 1s 1}.swipe-line{width:60px;height:3px;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.4) 20%,rgba(255,255,255,.8) 50%,rgba(255,255,255,.4) 80%,transparent 100%);border-radius:2px;position:relative}.swipe-line:after{content:"";position:absolute;top:-1px;right:-6px;width:0;height:0;border-left:6px solid rgba(255,255,255,.6);border-top:3px solid transparent;border-bottom:3px solid transparent}@keyframes swipeHint{0%,90%,to{opacity:0;transform:translate(-50%,-50%) translate(0)}10%,80%{opacity:1}20%,70%{transform:translate(-50%,-50%) translate(-12px)}40%,50%{transform:translate(-50%,-50%) translate(12px)}}@media (max-width: 480px){.mobile-grid-slider{bottom:25px}.navigation-controls{gap:10px}.slider-container{padding:18px 32px;border-radius:28px;min-width:200px}.mobile-dev-btn{width:50px;height:50px;font-size:16px;border-radius:25px}.slider-dots{gap:18px;min-width:100px}.slider-dot{width:14px;height:14px}.mobile-dev-dialog{padding:16px;min-width:280px;bottom:70px}.single-grid-indicator .grid-name{font-size:14px}}@media (prefers-color-scheme: dark){.slider-container{background:#00000040;border-color:#ffffff14;box-shadow:0 12px 40px #00000040,0 4px 12px #00000026,inset 0 1px #ffffff0d}.mobile-dev-btn{background:#ffffff0d;border-color:#ffffff1a}.mobile-dev-btn:hover{background:#ffffff1a;border-color:#fff3}.mobile-dev-btn:active{background:#ffffff26}.slider-dot{background:#fff3}.slider-dot.active{background:#ffffff80;box-shadow:0 0 20px #fff3,0 0 40px #ffffff0d}.slider-dot:hover:not(.active){background:#ffffff4d}.mobile-dev-dialog{background:#00000040;border-color:#ffffff14}}@media (min-resolution: 2dppx){.slider-container{backdrop-filter:blur(25px);-webkit-backdrop-filter:blur(25px)}}.mobile-grid-navigation,.mobile-grid-nav-container,.grid-indicators,.indicator-dot,.grid-scroll-container,.grid-items-wrapper,.grid-item,.grid-item-preview,.grid-dots,.grid-dot,.grid-item-info,.grid-name,.grid-date,.active-indicator,.grid-counter{display:none!important}@media (max-width: 768px){.dev-navbar{display:none}}.card-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000bf;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:2000;padding:20px;animation:modalOverlayFadeIn .3s cubic-bezier(.4,0,.2,1)}@keyframes modalOverlayFadeIn{0%{opacity:0;backdrop-filter:blur(0px);-webkit-backdrop-filter:blur(0px)}to{opacity:1;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}}.card-modal-content{background:#1a1a1abf;backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px);border:1px solid rgba(255,255,255,.15);border-radius:24px;padding:28px;width:100%;max-width:480px;max-height:85vh;overflow-y:auto;box-shadow:0 25px 80px #0006,0 8px 32px #0003,inset 0 1px #ffffff1a;animation:modalContentSlideIn .4s cubic-bezier(.4,0,.2,1);scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.2) transparent;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}.card-modal-content::-webkit-scrollbar{width:6px}.card-modal-content::-webkit-scrollbar-track{background:transparent}.card-modal-content::-webkit-scrollbar-thumb{background:#fff3;border-radius:3px}.card-modal-content::-webkit-scrollbar-thumb:hover{background:#ffffff4d}@keyframes modalContentSlideIn{0%{opacity:0;transform:translateY(30px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.card-modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px;padding-bottom:16px;border-bottom:1px solid rgba(255,255,255,.1)}.card-modal-title{font-size:24px;font-weight:600;color:#fffffff2;margin:0;text-shadow:0 1px 2px rgba(0,0,0,.3)}.card-modal-close{background:#ffffff14;border:1px solid rgba(255,255,255,.12);border-radius:12px;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#ffffffb3;font-size:20px;font-weight:300;transition:all .3s cubic-bezier(.4,0,.2,1);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.card-modal-close:hover{background:#ffffff26;border-color:#fff3;color:#ffffffe6;transform:scale(1.05)}.card-modal-close:active{transform:scale(.95)}.card-modal-section{margin-bottom:20px}.card-modal-section:last-of-type{margin-bottom:0}.card-modal-label{display:block;font-weight:600;font-size:14px;color:#ffffffe6;margin-bottom:8px;text-shadow:0 1px 2px rgba(0,0,0,.2)}.card-modal-input{width:100%;padding:16px 20px;background:#ffffff14;border:1px solid rgba(255,255,255,.12);border-radius:16px;color:#fffffff2;font-size:16px;font-family:inherit;transition:all .3s cubic-bezier(.4,0,.2,1);box-sizing:border-box;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.card-modal-input::placeholder{color:#fff6}.card-modal-input:focus{outline:none;background:#ffffff1f;border-color:#667eea99;box-shadow:0 0 0 3px #667eea1a,0 4px 16px #667eea26;transform:translateY(-1px)}.card-modal-textarea{min-height:120px;resize:vertical;font-family:inherit;line-height:1.5}.card-modal-icon-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-top:8px}.card-modal-icon-btn{padding:12px;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);border-radius:12px;cursor:pointer;font-size:18px;text-align:center;transition:all .2s cubic-bezier(.4,0,.2,1);min-height:48px;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);position:relative;overflow:hidden}.card-modal-icon-btn:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,#667eea1a,#764ba21a);opacity:0;transition:opacity .3s ease}.card-modal-icon-btn:hover{background:#ffffff26;border-color:#ffffff40;transform:translateY(-2px);box-shadow:0 8px 24px #0003}.card-modal-icon-btn:hover:before{opacity:1}.card-modal-icon-btn.selected{background:#667eea33;border-color:#667eea66;box-shadow:0 0 0 2px #667eea33,0 8px 24px #667eea26}.card-modal-icon-btn.selected:before{opacity:1}.card-modal-display-modes{display:flex;gap:2px;margin-top:8px;background:#ffffff0f;padding:3px;border-radius:14px;border:1px solid rgba(255,255,255,.1)}.card-modal-display-btn{flex:1;padding:10px 16px;background:transparent;border:none;border-radius:11px;cursor:pointer;text-align:center;transition:all .2s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.card-modal-display-btn:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,#667eea1a,#764ba21a);opacity:0;transition:opacity .3s ease}.card-modal-display-btn:hover{background:#ffffff26;border-color:#ffffff40;transform:translateY(-2px)}.card-modal-display-btn:hover:before{opacity:1}.card-modal-display-btn.selected{background:#ffffff26;box-shadow:0 1px 3px #0003}.card-modal-display-btn.selected:before{opacity:1}.card-modal-display-label{font-weight:600;font-size:13px;color:#ffffffe6;margin-bottom:2px}.card-modal-display-desc{font-size:11px;color:#fff9;line-height:1.2}.card-modal-preview{background:#ffffff0d;border:1px dashed rgba(255,255,255,.2);border-radius:16px;padding:20px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.card-modal-preview-title{font-size:16px;font-weight:600;color:#ffffffe6;margin-bottom:8px;display:flex;align-items:center;gap:8px}.card-modal-preview-content{font-size:14px;color:#ffffffb3;line-height:1.4}.card-modal-scrollable{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}.card-modal-actions{display:flex;gap:16px;justify-content:flex-end;margin-top:32px;padding-top:20px;border-top:1px solid rgba(255,255,255,.1);flex-shrink:0}.card-modal-btn{padding:12px 24px;border-radius:12px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);position:relative;overflow:hidden;min-width:100px;display:flex;align-items:center;justify-content:center}.card-modal-btn:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,#ffffff1a,#ffffff0d);opacity:0;transition:opacity .3s ease}.card-modal-btn:hover:before{opacity:1}.card-modal-btn.secondary{background:#ffffff14;border:1px solid rgba(255,255,255,.15);color:#ffffffe6}.card-modal-btn.secondary:hover{background:#ffffff26;border-color:#ffffff40;transform:translateY(-2px);box-shadow:0 8px 24px #0003}.card-modal-btn.primary{background:linear-gradient(135deg,#667eea,#764ba2);border:1px solid rgba(102,126,234,.3);color:#fff;box-shadow:0 4px 16px #667eea40}.card-modal-btn.primary:hover:not(:disabled){background:linear-gradient(135deg,#5a67d8,#6c5ce7);transform:translateY(-2px);box-shadow:0 8px 32px #667eea59}.card-modal-btn.primary:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}.card-modal-btn:active{transform:translateY(0)!important}@media (max-width: 768px){.card-modal-overlay{padding:20px 16px;align-items:flex-start}.card-modal-content{padding:20px;border-radius:20px;max-height:calc(100vh - 40px);min-height:auto;display:flex;flex-direction:column;overflow:hidden}.card-modal-title{font-size:20px}.card-modal-close{width:44px;height:44px;font-size:22px}.card-modal-input{padding:18px 20px;font-size:16px}.card-modal-textarea{min-height:100px}.card-modal-icon-grid{grid-template-columns:repeat(4,1fr);gap:10px}.card-modal-icon-btn{padding:14px 8px;min-height:56px;font-size:20px}.card-modal-display-modes{flex-direction:column}.card-modal-display-btn{padding:18px 16px}.card-modal-actions{flex-direction:column-reverse;gap:12px;flex-shrink:0;background:#1a1a1ad9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);margin:auto -20px -20px;padding:24px 20px 20px;border-bottom-left-radius:20px;border-bottom-right-radius:20px}.card-modal-btn{width:100%;padding:14px 20px;font-size:14px}.card-modal-scrollable{max-height:calc(100vh - 200px);padding-bottom:20px}}@media (max-width: 480px){.card-modal-overlay{padding:20px 12px 12px}.card-modal-content{padding:20px;border-radius:16px;max-height:calc(100vh - 40px)}.card-modal-header,.card-modal-section{margin-bottom:20px}.card-modal-icon-grid{grid-template-columns:repeat(4,1fr)}}.customization-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000bf;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:2000;padding:20px;animation:modalOverlayFadeIn .3s cubic-bezier(.4,0,.2,1)}.customization-modal-content{background:#1a1a1abf;backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px);border:1px solid rgba(255,255,255,.15);border-radius:24px;padding:28px;width:100%;max-width:480px;max-height:85vh;overflow-y:auto;box-shadow:0 25px 80px #0006,0 8px 32px #0003,inset 0 1px #ffffff1a;animation:modalContentSlideIn .4s cubic-bezier(.4,0,.2,1);scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.2) transparent;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;display:flex;flex-direction:column}.customization-modal-content::-webkit-scrollbar{width:6px}.customization-modal-content::-webkit-scrollbar-track{background:transparent}.customization-modal-content::-webkit-scrollbar-thumb{background:#fff3;border-radius:3px}.customization-modal-content::-webkit-scrollbar-thumb:hover{background:#ffffff4d}.customization-modal-scrollable{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}.customization-modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px;padding-bottom:16px;border-bottom:1px solid rgba(255,255,255,.1)}.customization-modal-title{font-size:24px;font-weight:600;color:#fffffff2;margin:0;text-shadow:0 1px 2px rgba(0,0,0,.3)}.customization-modal-close{background:#ffffff14;border:1px solid rgba(255,255,255,.12);border-radius:12px;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#ffffffb3;font-size:20px;font-weight:300;transition:all .3s cubic-bezier(.4,0,.2,1);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.customization-modal-close:hover{background:#ffffff26;border-color:#fff3;color:#ffffffe6;transform:scale(1.05)}.customization-modal-close:active{transform:scale(.95)}.customization-modal-section{margin-bottom:20px}.customization-modal-section:last-of-type{margin-bottom:0}.customization-modal-label{display:block;font-weight:600;font-size:14px;color:#ffffffe6;margin-bottom:8px;text-shadow:0 1px 2px rgba(0,0,0,.2)}.customization-modal-icon-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:8px}.customization-modal-icon-btn{padding:12px;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);border-radius:12px;cursor:pointer;font-size:18px;text-align:center;transition:all .2s cubic-bezier(.4,0,.2,1);min-height:48px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.customization-modal-icon-btn:hover{background:#ffffff1a;border-color:#fff3;transform:translateY(-1px)}.customization-modal-icon-btn.selected{background:#ffffff26;box-shadow:0 1px 3px #0003}.customization-modal-input{width:100%;padding:16px 20px;background:#ffffff14;border:1px solid rgba(255,255,255,.12);border-radius:16px;color:#fffffff2;font-size:16px;font-family:inherit;transition:all .3s cubic-bezier(.4,0,.2,1);box-sizing:border-box;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.customization-modal-input::placeholder{color:#fff6}.customization-modal-input:focus{outline:none;background:#ffffff1f;border-color:#667eea99;box-shadow:0 0 0 3px #667eea1a,0 4px 16px #667eea26;transform:translateY(-1px)}.customization-modal-grid{display:flex;gap:2px;margin-top:8px;background:#ffffff0f;padding:3px;border-radius:14px;border:1px solid rgba(255,255,255,.1)}.customization-modal-color-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:8px}.customization-modal-option-btn{flex:1;padding:10px 16px;background:transparent;border:none;border-radius:11px;cursor:pointer;font-size:14px;color:#ffffffe6;text-align:center;transition:all .2s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;font-weight:500}.customization-modal-option-btn:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,#667eea1a,#764ba21a);opacity:0;transition:opacity .3s ease}.customization-modal-option-btn:hover{background:#ffffff26;border-color:#ffffff40;transform:translateY(-2px);box-shadow:0 8px 24px #0003}.customization-modal-option-btn:hover:before{opacity:1}.customization-modal-option-btn.selected{background:#ffffff26;box-shadow:0 1px 3px #0003}.customization-modal-option-btn.selected:before{opacity:1}.customization-modal-color-btn{width:48px;height:48px;border-radius:12px;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;border:2px solid transparent}.customization-modal-color-btn:hover{transform:translateY(-2px) scale(1.05);box-shadow:0 8px 24px #0000004d}.customization-modal-color-btn.selected{border-color:#fffc;transform:scale(1.05);box-shadow:0 2px 8px #0000004d}.customization-modal-preview{display:flex;justify-content:center;margin-bottom:20px}.customization-modal-preview-element{display:flex;align-items:center;justify-content:center;width:80px;height:80px;font-weight:700;color:#fff;position:relative;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:2px solid rgba(255,255,255,.2);box-shadow:0 8px 24px #0003}.customization-modal-actions{display:flex;gap:16px;justify-content:flex-end;margin-top:32px;padding-top:20px;border-top:1px solid rgba(255,255,255,.1);flex-shrink:0}.customization-modal-btn{padding:12px 24px;border-radius:12px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);position:relative;overflow:hidden;min-width:100px;display:flex;align-items:center;justify-content:center}.customization-modal-btn:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,#ffffff1a,#ffffff0d);opacity:0;transition:opacity .3s ease}.customization-modal-btn:hover:before{opacity:1}.customization-modal-btn.secondary{background:#ffffff14;border:1px solid rgba(255,255,255,.15);color:#ffffffe6}.customization-modal-btn.secondary:hover{background:#ffffff26;border-color:#ffffff40;transform:translateY(-2px);box-shadow:0 8px 24px #0003}.customization-modal-btn.primary{background:linear-gradient(135deg,#667eea,#764ba2);border:1px solid rgba(102,126,234,.3);color:#fff;box-shadow:0 4px 16px #667eea40}.customization-modal-btn.primary:hover{background:linear-gradient(135deg,#5a67d8,#6c5ce7);transform:translateY(-2px);box-shadow:0 8px 32px #667eea59}.customization-modal-btn:active{transform:translateY(0)!important}@media (max-width: 768px){.customization-modal-overlay{padding:20px 16px;align-items:flex-start}.customization-modal-content{padding:20px;border-radius:20px;max-height:calc(100vh - 40px);min-height:auto;display:flex;flex-direction:column;overflow:hidden}.customization-modal-title{font-size:20px}.customization-modal-close{width:44px;height:44px;font-size:22px}.customization-modal-input{padding:18px 20px;font-size:16px}.customization-modal-grid{grid-template-columns:repeat(auto-fit,minmax(70px,1fr));gap:16px}.customization-modal-color-grid{gap:16px}.customization-modal-color-btn{width:56px;height:56px}.customization-modal-option-btn{padding:18px 16px;font-size:14px}.customization-modal-actions{flex-direction:column-reverse;gap:12px;flex-shrink:0;background:#1a1a1ae6;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);margin:auto -20px -20px;padding:24px 20px 20px;border-bottom-left-radius:20px;border-bottom-right-radius:20px;box-shadow:0 -4px 20px #0000004d}.customization-modal-btn{width:100%;padding:14px 20px;font-size:14px}.customization-modal-scrollable{max-height:calc(100vh - 200px);overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;flex:1;padding-bottom:24px;margin-bottom:8px}}@media (max-width: 480px){.customization-modal-overlay{padding:20px 12px 12px}.customization-modal-content{padding:20px;border-radius:16px;max-height:calc(100vh - 40px)}.customization-modal-header,.customization-modal-section{margin-bottom:20px}.customization-modal-grid{flex-wrap:wrap}.customization-modal-icon-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.customization-modal-color-grid{grid-template-columns:repeat(4,1fr)}}.color-picker-container{display:flex;flex-direction:column;gap:16px;margin-top:8px}.color-preview{display:flex;align-items:center;justify-content:center;height:60px;border-radius:16px;border:1px solid rgba(255,255,255,.15);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);position:relative;overflow:hidden;box-shadow:0 4px 16px #0003}.color-value{color:#ffffffe6;font-size:12px;font-weight:600;text-shadow:0 1px 2px rgba(0,0,0,.5);background:#0000004d;padding:4px 8px;border-radius:8px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.color-slider-group{display:flex;flex-direction:column;gap:6px}.color-slider-label{font-size:12px;font-weight:500;color:#fffc;text-transform:uppercase;letter-spacing:.5px}.color-slider-wrapper{position:relative}.color-slider{width:100%;height:8px;border-radius:4px;outline:none;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;transition:all .2s ease}.color-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:#fffffff2;border:2px solid rgba(0,0,0,.1);cursor:pointer;box-shadow:0 2px 8px #0000004d;transition:all .2s ease}.color-slider::-webkit-slider-thumb:hover{transform:scale(1.1);box-shadow:0 4px 12px #0006}.color-slider::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:#fffffff2;border:2px solid rgba(0,0,0,.1);cursor:pointer;box-shadow:0 2px 8px #0000004d;transition:all .2s ease}.color-slider::-moz-range-thumb:hover{transform:scale(1.1);box-shadow:0 4px 12px #0006}.hue-slider{background:linear-gradient(to right,red,#ff0,#0f0,#0ff,#00f,#f0f,red)!important}@media (max-width: 768px){.color-preview{height:50px}.color-slider{height:10px}.color-slider::-webkit-slider-thumb{width:24px;height:24px}.color-slider::-moz-range-thumb{width:24px;height:24px}.color-slider-label,.color-value{font-size:11px}}