body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}i{cursor:pointer}.App{text-align:center}.App-logo{height:40vmin;pointer-events:none}@media (prefers-reduced-motion:no-preference){.App-logo{animation:App-logo-spin 20s linear infinite}}.App-header{align-items:center;background-color:#282c34;color:#fff;display:flex;flex-direction:column;font-size:calc(10px + 2vmin);justify-content:center;min-height:100vh}.App-link{color:#61dafb}@keyframes App-logo-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.add-note-container{background:#0000;min-height:100vh;padding:var(--spacing-xl)}.add-note-content{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:linear-gradient(145deg,#8b5cf60d,#ec48990d);border:1px solid #ffffff1a;border-radius:var(--radius-lg);box-shadow:0 0 30px #8b5cf61a;margin:0 auto;max-width:800px;padding:2rem}.add-note-content h1{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#fff,#e2e8f0);-webkit-background-clip:text;color:#fff;font-size:1.8rem;font-weight:600;margin-bottom:2rem;text-shadow:0 2px 4px #0000001a}.note-form{gap:1.5rem}.form-group,.note-form{display:flex;flex-direction:column}.form-group{gap:.75rem}.form-label{align-items:center;display:flex;gap:.5rem}.form-input{-webkit-appearance:none;appearance:none;background-color:#1a1a2e!important;border:1px solid #8b5cf633;padding:1rem}.form-input:hover{background-color:#1f1f35!important;border-color:#8b5cf64d}.form-input:focus{background-color:#24243b!important;border-color:var(--accent-purple);box-shadow:0 0 0 1px #8b5cf64d}.form-input:-webkit-autofill,.form-input:-webkit-autofill:focus,.form-input:-webkit-autofill:hover{-webkit-text-fill-color:var(--text-primary);-webkit-box-shadow:inset 0 0 0 1000px #1a1a2e;-webkit-transition:background-color 5000s ease-in-out 0s;transition:background-color 5000s ease-in-out 0s}textarea.form-input::-webkit-scrollbar-track{background:#8b5cf60d}textarea.form-input::-webkit-scrollbar-thumb{background:#8b5cf633}textarea.form-input::-webkit-scrollbar-thumb:hover{background:#8b5cf64d}.submit-button{background:linear-gradient(135deg,#8b5cf6e6,#ec4899e6);border:none;border-radius:var(--radius-full);color:#fff;cursor:pointer;font-size:1rem;font-weight:600;margin-top:1.5rem;overflow:hidden;padding:1rem;position:relative;transition:all .3s ease;width:100%}.submit-button:before{background:linear-gradient(135deg,#9333eae6,#f472b6e6);content:"";height:100%;left:0;opacity:0;position:absolute;top:0;transition:opacity .3s ease;width:100%}.submit-button:hover:before{opacity:1}.submit-button span{position:relative;z-index:1}.submit-button:hover{box-shadow:0 4px 20px #8b5cf64d;transform:translateY(-2px)}.button-disabled{background:var(--text-tertiary);cursor:not-allowed;opacity:.6}@media (max-width:768px){.add-note-container{padding:1rem}.add-note-content{padding:1.5rem}}.notes-flex-container{background:linear-gradient(145deg,#140a1ef2,#3c1432f2);display:flex;height:100vh;left:0;margin:0;overflow:hidden;padding:0;position:fixed;top:0;width:100vw}.add-note-section{background:#1c112399;border-right:1px solid #ec48991a;flex:2 1;padding:2.5rem}.add-note-section,.all-notes-section{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);height:calc(100vh - var(--header-height));margin-top:var(--header-height);overflow-y:auto}.all-notes-section{background:#190f1e66;flex:1 1;padding:2rem}.all-notes-section h2{-webkit-text-fill-color:#0000;background:var(--gradient-primary);-webkit-background-clip:text;font-size:1.8rem;font-weight:600;margin-bottom:1.5rem}.note-form{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#23142d66;border:1px solid #ec48991a;border-radius:var(--radius-lg);padding:var(--spacing-xl)}.form-group{margin-bottom:var(--spacing-lg)}.form-label{color:var(--text-secondary);font-size:.95rem;margin-bottom:var(--spacing-sm)}.form-input{background:#23142d99;border:1px solid #ec489926;border-radius:var(--radius-lg);box-shadow:inset 0 1px 2px #0000001a;color:var(--text-primary);font-size:1rem;padding:1rem 1.25rem}.form-input:hover{background:#281932b3;border-color:#ec489940}.form-input:focus{background:#2d1e37cc;border-color:#ec489966;box-shadow:0 0 0 3px #ec48991a}.form-input::placeholder{color:#ffffff4d}textarea.form-input{line-height:1.6;min-height:200px;padding:1.25rem;resize:vertical}textarea.form-input::-webkit-scrollbar{width:8px}textarea.form-input::-webkit-scrollbar-track{background:#23142d4d;border-radius:4px}textarea.form-input::-webkit-scrollbar-thumb{background:#ec489933;border-radius:4px}textarea.form-input::-webkit-scrollbar-thumb:hover{background:#ec48994d}input:-webkit-autofill,input:-webkit-autofill:focus,input:-webkit-autofill:hover,textarea:-webkit-autofill,textarea:-webkit-autofill:focus,textarea:-webkit-autofill:hover{-webkit-text-fill-color:var(--text-primary);-webkit-box-shadow:inset 0 0 0 1000px #23142d99;-webkit-transition:background-color 5000s ease-in-out 0s;transition:background-color 5000s ease-in-out 0s}.note-card{background:#23142d99;border:1px solid #ec48991a;border-radius:var(--radius-lg);padding:1.5rem;transition:all .2s ease}.note-card:hover{background:#281932cc;border-color:#ec489933;box-shadow:0 4px 20px #ec48991a;transform:translateY(-2px)}.note-title{color:var(--text-primary);font-size:1.2rem;margin-bottom:var(--spacing-sm)}.note-description{color:var(--text-secondary);line-height:1.5;margin-bottom:var(--spacing-md)}.note-actions{display:flex;gap:var(--spacing-sm);justify-content:flex-end}.action-button{background:#0000;border-radius:var(--radius-md);color:var(--text-secondary);padding:var(--spacing-sm);transition:var(--transition-all)}.action-button:hover{background:#ffffff1a;color:var(--text-primary)}.action-button.delete{color:var(--accent-error)}.action-button.delete:hover{background:#ef44441a}.empty-state{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#23142d66;border:1px solid #ec48991a;border-radius:var(--radius-lg);color:var(--text-secondary);padding:var(--spacing-xl);text-align:center}.empty-state svg{height:120px;margin-bottom:var(--spacing-lg);opacity:.5;width:120px}.empty-state h2{-webkit-text-fill-color:#0000;background:var(--gradient-primary);-webkit-background-clip:text;font-size:1.5rem}.empty-state p{color:var(--text-secondary)}@media (max-width:768px){.notes-flex-container{flex-direction:column}.add-note-section,.all-notes-section{flex:none;height:auto;max-height:50vh;width:100%}}.notes-grid{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));padding:1rem 0}.note-item{background:#ffffff0d;border:1px solid #ffffff1a;border-radius:12px;margin-bottom:1rem;padding:1.5rem;transition:all .2s ease}.note-item:hover{background:#ffffff14;transform:translateY(-2px)}.section-title{-webkit-text-fill-color:#0000;background:var(--gradient-primary);-webkit-background-clip:text;font-size:1.8rem;font-weight:700;margin-bottom:1.5rem}.editor-container{background:#ffffff0d;border:1px solid #ffffff1a;border-radius:12px;margin-top:1rem;min-height:400px;padding:1rem}.save-button{background:linear-gradient(45deg,#3182ce,#4299e1);color:#fff}.save-button:hover{background:linear-gradient(45deg,#2c5282,#3182ce);box-shadow:0 4px 12px #4299e140;transform:translateY(-1px)}body{background-color:#f4f4f4;margin:0;padding:0}input,textarea{border:1px solid #e0e0e0;border-radius:6px;font-size:.95rem;margin-bottom:1rem;padding:.75rem;width:100%}.submit-button,button[type=submit]{background:linear-gradient(135deg,#8b5cf6e6,#ec4899e6);border:none;border-radius:var(--radius-full);color:#fff;cursor:pointer;font-size:1rem;font-weight:600;margin-top:1.5rem;padding:1rem;transition:all .3s ease;width:100%}.submit-button:hover,button[type=submit]:hover{background:linear-gradient(135deg,#9333eae6,#f472b6e6);box-shadow:0 4px 20px #8b5cf64d;transform:translateY(-2px)}.empty-state-image{align-items:center;display:flex;height:200px;justify-content:center;width:200px}.empty-state-image svg{height:100%;width:100%}.empty-state p{margin-bottom:1.5rem}.add-note-section::-webkit-scrollbar,.all-notes-section::-webkit-scrollbar{width:8px}.add-note-section::-webkit-scrollbar-track,.all-notes-section::-webkit-scrollbar-track{background:#8b5cf60d}.add-note-section::-webkit-scrollbar-thumb,.all-notes-section::-webkit-scrollbar-thumb{background:#ec489933;border-radius:4px}.add-note-section::-webkit-scrollbar-thumb:hover,.all-notes-section::-webkit-scrollbar-thumb:hover{background:#ec48994d}.modal-overlay{align-items:center;animation:fadeIn .2s ease-out;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#140a1ef2;bottom:0;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:1000}.modal-content{animation:slideUp .3s ease-out;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#23142df2;border:1px solid #ffffff1a;border-radius:24px;box-shadow:0 20px 40px #0006;max-width:500px;padding:2.5rem;position:relative;width:90%}.modal-content h3{color:#fff;font-size:1.8rem;font-weight:700;letter-spacing:-.02em;margin-bottom:1rem}.modal-content p{color:#fffc;font-size:1.1rem;line-height:1.6;margin-bottom:2rem}.modal-buttons{display:flex;gap:1rem;justify-content:flex-end}.modal-btn{border:none;border-radius:12px;cursor:pointer;font-size:1rem;font-weight:500;padding:.75rem 1.75rem;transition:all .2s ease}.cancel-btn{color:#fff}.cancel-btn:hover{background:#ffffff26;transform:translateY(-1px)}.confirm-btn{background:linear-gradient(135deg,#8b5cf6,#ec4899);color:#fff}.confirm-btn:hover{background:linear-gradient(135deg,#9333ea,#f472b6);box-shadow:0 4px 12px #8b5cf640;transform:translateY(-1px)}.modal-close{align-items:center;background:#ffffff1a;border:none;border-radius:12px;color:#fff9;cursor:pointer;display:flex;justify-content:center;padding:.5rem;position:absolute;right:1.5rem;top:1.5rem;transition:all .2s ease}.modal-close:hover{background:#ffffff26;color:#fff;transform:translateY(-1px)}.modal-content h2{color:#fff;font-size:1.8rem;font-weight:700;letter-spacing:-.02em;margin-bottom:1rem}.modal-auth-buttons{display:flex;gap:1rem;margin-top:1.5rem}.modal-btn.login,.modal-btn.signup{border-radius:8px;flex:1 1;font-weight:500;padding:.75rem 1.5rem;text-align:center;text-decoration:none;transition:all .2s ease}.modal-btn.login{background:linear-gradient(90deg,#8b5cf6,#ec4899);color:#fff}.modal-btn.signup{background:#ffffff1a;border:1px solid #ffffff1a;color:#fff}.modal-btn:hover{opacity:.9;transform:translateY(-1px)}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (max-width:640px){.modal-content{padding:2rem;width:95%}.modal-actions{flex-direction:column-reverse}.modal-btn{width:100%}}.about-container{background:#0000;bottom:0;left:0;margin:0;min-height:100vh;overflow-y:auto;padding:0;position:fixed;right:0;top:0;width:100vw}.about-content{background:#fff;border-radius:12px;box-shadow:0 4px 6px #0000000d;margin:0 auto;max-width:1200px;padding:1.5rem;width:90%}.section{margin-bottom:2rem}.section-title{color:#1e293b;font-size:1.5rem;font-weight:600;margin-bottom:1rem}.section-content{color:#4b5563;font-size:1rem;line-height:1.6}.cta-section{align-items:center;flex-direction:column;margin-top:2rem}.action-button{border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:1rem;font-weight:500;padding:.75rem 1.5rem;transition:all .2s ease}.note-button{background:#e5e7eb;color:#9ca3af;cursor:not-allowed}.draw-button{background:#7c3aed}.get-started-button{background:#2563eb}.draw-button:hover,.get-started-button:hover{transform:translateY(-1px)}@media (max-width:640px){.about-content{width:95%}}.logged-in-container{background:linear-gradient(145deg,#111827fa,#1f2937fa);display:flex;flex-direction:column;left:0;margin:0;min-height:100vh;overflow:hidden;padding:39px 0 0;position:fixed;top:0;width:100vw}.welcome-header{padding:3rem 2rem;text-align:center}.welcome-header h1{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#8b5cf6,#ec4899);-webkit-background-clip:text;font-size:4rem;font-weight:800;margin-bottom:1rem}.welcome-header p{color:#94a3b8;font-size:1.4rem}.action-blocks{grid-gap:2rem;display:grid;flex:1 1;gap:2rem;grid-template-columns:repeat(3,1fr);max-height:calc(100vh - 200px);padding:0 4rem}.action-block{background:#ffffff08;border:1px solid #ffffff1a;border-radius:24px;cursor:pointer;display:flex;flex-direction:column;height:100%;padding:2.5rem;position:relative;transition:all .3s ease}.action-block:hover{background:#ffffff0d;border-color:#8b5cf64d;box-shadow:0 20px 40px #0000004d;transform:translateY(-5px)}.block-icon{font-size:2.5rem;margin-bottom:2rem}.block-content{display:flex;flex:1 1;flex-direction:column}.block-content h2{color:#fff;font-size:2rem;font-weight:700;margin-bottom:1rem}.block-content p{color:#94a3b8;font-size:1.1rem;line-height:1.6;margin-bottom:auto}.action-link{color:#8b5cf6;display:inline-block;font-size:1.1rem;font-weight:600;margin-top:2rem;transition:all .2s ease}.action-block:hover .action-link{color:#ec4899;transform:translateX(5px)}.action-block.notes{background:linear-gradient(145deg,#8b5cf60d,#8b5cf605)}.action-block.drawings{background:linear-gradient(145deg,#ec48990d,#ec489905)}.action-block.saved{background:linear-gradient(145deg,#3b82f60d,#3b82f605)}@media (max-width:1200px){.action-blocks{grid-template-columns:repeat(2,1fr);padding:0 2rem}}@media (max-width:768px){.action-blocks{grid-template-columns:1fr;padding:0 1.5rem}.welcome-header h1{font-size:3rem}}.about-content-guest{background:#fff;border-radius:20px;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;margin:0 auto;max-width:1200px;padding:2.5rem}.welcome-section{margin-bottom:3rem;text-align:center}.welcome-section h1{color:#1e293b;font-size:2.5rem;font-weight:700;margin-bottom:.5rem}.welcome-section p{color:#64748b;font-size:1.2rem}.features-grid{grid-gap:2rem;display:grid;gap:2rem;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin-bottom:3rem}.feature-card{background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;padding:1.5rem;transition:transform .2s ease,box-shadow .2s ease}.feature-card:hover{box-shadow:0 4px 6px -1px #0000001a;transform:translateY(-2px)}.feature-icon-wrapper{align-items:center;background:#fff;border:1px solid #e2e8f0;border-radius:12px;display:flex;height:48px;justify-content:center;margin-bottom:1rem;width:48px}.feature-icon{color:#2563eb}.feature-card h3{color:#1e293b;font-size:1.25rem;margin-bottom:.5rem}.feature-card p{color:#64748b;line-height:1.5}.auth-section,.try-section{margin:3rem 0;text-align:center}.auth-section h2,.try-section h2{color:#1e293b;font-size:1.8rem;margin-bottom:1.5rem}.auth-buttons,.try-buttons{display:flex;gap:1rem;justify-content:center}.auth-button,.try-button{align-items:center;border-radius:8px;cursor:pointer;display:flex;font-size:1rem;font-weight:500;gap:.5rem;padding:.75rem 1.5rem;transition:all .2s ease}.auth-button,.try-button.primary{background:#2563eb;border:none;color:#fff}.auth-button:hover,.try-button.primary:hover{background:#1d4ed8;transform:translateY(-1px)}.auth-button.secondary{background:#fff;border:1px solid #2563eb;color:#2563eb}.auth-button.secondary:hover{background:#f0f7ff}@media (max-width:768px){.about-container{padding:1rem}.about-content-guest{padding:1.5rem}.welcome-section h1{font-size:2rem}.features-grid{grid-template-columns:1fr}.auth-buttons,.try-buttons{flex-direction:column}.auth-button,.try-button{justify-content:center;width:100%}}.guest-container{background:linear-gradient(145deg,#111827fa,#1f2937fa);min-height:100vh;padding-top:60px;width:100%}.hero-section{padding:2rem 2rem 3rem}.hero-section h1{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#8b5cf6,#ec4899);-webkit-background-clip:text;font-size:4rem;font-weight:800;margin-bottom:1rem}.hero-section p{color:#94a3b8;font-size:1.4rem}.main-features{grid-gap:2rem;display:grid;gap:2rem;grid-template-columns:repeat(2,1fr);margin:2rem auto;max-width:1200px;padding:0 2rem}.feature-card{background:#ffffff08;border-radius:24px;padding:2.5rem}.feature-card:hover{background:#ffffff0d;border-color:#8b5cf64d;box-shadow:0 20px 40px #0000004d;transform:translateY(-5px)}.icon-wrapper{border-radius:12px;height:48px;width:48px}.icon-wrapper.blue{background:#3b82f61a;color:#3b82f6}.icon-wrapper.purple{background:#8b5cf61a;color:#8b5cf6}.feature-card p{color:#94a3b8}.beta-badge{background:#ec489933;border-radius:9999px;color:#ec4899;margin-left:1rem}.secondary-features{grid-gap:2rem;display:grid;gap:2rem;grid-template-columns:repeat(3,1fr);margin:3rem auto;max-width:1200px;padding:0 2rem}.mini-card{background:#ffffff05;border:1px solid #ffffff1a;border-radius:16px;color:#94a3b8;padding:1.5rem;text-align:center}.mini-card h3{color:#fff;font-size:1.2rem;margin:1rem 0 .5rem}.cta-section{display:flex;gap:1rem;justify-content:center;margin-top:3rem;text-align:center}.cta-button{align-items:center;border-radius:12px;cursor:pointer;display:flex;font-size:1rem;font-weight:600;gap:.5rem;padding:.75rem 2rem;transition:all .3s ease}.cta-button.primary{background:linear-gradient(135deg,#8b5cf6,#ec4899);border:none;color:#fff}.cta-button.secondary{background:#0000;border:1px solid #8b5cf6;color:#8b5cf6}.cta-button:hover{box-shadow:0 8px 16px #0003;transform:translateY(-2px)}@media (max-width:768px){.hero-section h1{font-size:2.5rem}.main-features,.secondary-features{grid-template-columns:1fr}.cta-section{flex-direction:column;padding:0 2rem}.cta-button{justify-content:center;width:100%}}.alert-wrapper{left:50%;max-width:90%;min-width:300px;pointer-events:none;position:fixed;top:70px;transform:translateX(-50%);width:auto;z-index:9999}.alert{align-items:center;animation:slideDown .3s ease-out;background:#fff;border-radius:8px;box-shadow:0 4px 6px #0000001a;display:flex;gap:.5rem;margin-bottom:1rem;padding:.75rem 1.25rem}.alert-success{background:#10b981;color:#fff}.alert-error{background:#ef4444;color:#fff}.alert-warning{background:#f59e0b;color:#fff}@media (max-width:640px){.alert-wrapper{min-width:0;min-width:auto;width:90%}}.auth-container{align-items:center;background:linear-gradient(145deg,#111827,#1f2937);display:flex;justify-content:center;left:0;margin:0;min-height:100vh;overflow:hidden;padding:0;position:fixed;top:0;width:100vw}.auth-card{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#1f2937b3;border:1px solid #ffffff1a;border-radius:16px;box-shadow:0 4px 6px #0000001a;margin:1rem;max-width:400px;padding:2.5rem;width:calc(100% - 2rem)}.auth-header{margin-bottom:2rem;text-align:center}.auth-title{-webkit-text-fill-color:#0000;background:linear-gradient(90deg,#8b5cf6,#ec4899);-webkit-background-clip:text;color:#fff;font-size:2rem;font-weight:700;margin-bottom:.5rem}.auth-subtitle{color:#9ca3af;font-size:1rem}.auth-form{display:flex;flex-direction:column;gap:1.25rem}.form-group{position:relative}.form-label{color:#d1d5db;display:block;font-size:.875rem;font-weight:500;margin-bottom:.5rem}.form-input{background-color:#111827cc;border:1px solid #ffffff1a;border-radius:8px;color:#fff;font-size:.875rem;padding:.75rem 1rem .75rem 2.5rem;transition:all .2s ease;width:100%}.form-input:focus{border-color:#8b5cf6;box-shadow:0 0 0 2px #8b5cf633;outline:none}.form-input::placeholder,.input-icon{color:#6b7280}.input-icon{left:.75rem;position:absolute;top:2.25rem}.auth-btn{background:linear-gradient(90deg,#8b5cf6,#ec4899);border:none;border-radius:8px;color:#fff;cursor:pointer;font-weight:500;margin-top:.5rem;padding:.75rem 1rem;transition:all .2s ease}.auth-btn:hover{opacity:.9;transform:translateY(-1px)}.auth-btn:disabled{cursor:not-allowed;opacity:.7;transform:none}.social-button{align-items:center;background-color:#ffffff1a;border:1px solid #ffffff1a;border-radius:8px;color:#fff;cursor:pointer;display:flex;gap:.5rem;justify-content:center;margin-top:.5rem;padding:.75rem 1rem;transition:all .2s ease;width:100%}.social-button:hover{background-color:#ffffff26;transform:translateY(-1px)}.auth-link{color:#9ca3af;margin-top:1.5rem;text-align:center}.auth-link a{color:#8b5cf6;font-weight:500;margin-left:.5rem;text-decoration:none;transition:color .2s ease}.auth-link a:hover{color:#ec4899}@media (max-width:640px){.auth-card{padding:2rem}.auth-title{font-size:1.75rem}}*{box-sizing:border-box}*,body,html{margin:0;padding:0}body,html{height:100%;overflow-x:hidden;width:100%}body{font-family:Arial,sans-serif}.temp-note-container{color:#fff;display:flex;flex-direction:column;left:0;margin:0;min-height:100vh;padding:0;position:absolute;right:0;top:0;transition:all .3s ease;width:100%}.theme-dark{background:linear-gradient(145deg,#111827,#1f2937)}.theme-light{background:linear-gradient(145deg,#f8fafc,#e2e8f0);color:#1e293b}.theme-sepia{background:linear-gradient(145deg,#fef3c7,#fde68a);color:#78350f}.theme-night{background:linear-gradient(145deg,#020617,#1e1b4b);color:#e2e8f0}.temp-note-content{display:flex;flex:1 1;flex-direction:column;margin:0 auto;max-width:1200px;padding:80px 2rem 1.5rem;width:100%}.temp-note-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:1.5rem}.note-title{background:#0000;border:none;border-radius:8px;color:inherit;font-size:1.5rem;font-weight:600;padding:.5rem;transition:all .2s ease}.note-title:focus{background:#ffffff1a;outline:none}.header-right{display:flex;gap:1rem}.feature-button,.switch-button{align-items:center;background:#ffffff1a;border:1px solid #ffffff1a;border-radius:8px;color:inherit;cursor:pointer;display:flex;gap:.5rem;padding:.5rem 1rem;transition:all .2s ease}.switch-button{background:linear-gradient(90deg,#8b5cf6,#ec4899);border:none}.formatting-toolbar{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff1a;border:1px solid #ffffff1a;border-radius:12px;display:flex;gap:1.5rem;margin-bottom:1.5rem;padding:1rem}.toolbar-section{align-items:center;border-right:1px solid #ffffff1a;display:flex;gap:.5rem;padding-right:1.5rem}.toolbar-section:last-child{border-right:none}.toolbar-section button{background:#0000;border:1px solid #ffffff1a;border-radius:6px;color:inherit;cursor:pointer;padding:.5rem;transition:all .2s ease}.toolbar-section button:hover,.toolbar-select{background:#ffffff1a}.toolbar-select{border:1px solid #ffffff1a;border-radius:6px;color:inherit;cursor:pointer;padding:.5rem}.note-editor{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff0d;border:1px solid #ffffff1a;border-radius:12px;flex:1 1;margin-bottom:1.5rem;min-height:500px;overflow-y:auto;padding:2rem;transition:all .2s ease}.note-editor:focus{border-color:#8b5cf680;box-shadow:0 0 0 3px #8b5cf61a;outline:none}.action-buttons-left,.action-buttons-right{display:flex;gap:1rem}.action-btn{background:#ffffff1a;border:1px solid #ffffff1a;border-radius:8px;color:inherit}.action-btn,.save-btn{padding:.75rem 1.25rem}.save-btn{align-items:center;background:linear-gradient(90deg,#8b5cf6,#ec4899);border:none;border-radius:8px;cursor:pointer;display:flex;gap:.5rem;transition:all .2s ease}.action-btn:hover,.feature-button:hover{background:#ffffff26;transform:translateY(-1px)}.save-btn:hover,.switch-button:hover{box-shadow:0 4px 12px #8b5cf640;opacity:.9;transform:translateY(-1px)}@media (max-width:768px){.temp-note-content{padding:70px 1rem 1rem}.formatting-toolbar{flex-wrap:wrap;gap:1rem}.toolbar-section{border-right:none;padding-right:0}.action-buttons{flex-direction:column;gap:1rem}.action-buttons-left,.action-buttons-right{justify-content:center;width:100%}}.page-container{background:#000;color:#fff;margin:0;min-height:100vh;overflow:hidden;padding-top:64px;position:relative;width:100%}.gradient-bg{background:linear-gradient(90deg,#7c3aed,#db2777,#ef4444);inset:0;opacity:.1;pointer-events:none;position:fixed}.hero-section{margin:0 auto;max-width:1280px;padding:4rem 2rem;position:relative;text-align:center}.hero-section h2{-webkit-text-fill-color:#0000;background:linear-gradient(90deg,#a78bfa,#f472b6);-webkit-background-clip:text;font-size:3.5rem;font-weight:700;margin-bottom:1.5rem}.hero-section>p{color:#9ca3af;font-size:1.5rem;margin-bottom:3rem;margin-left:auto;margin-right:auto;max-width:36rem}.feature-cards{grid-gap:2rem;display:grid;gap:2rem;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin:0 auto;max-width:1280px;padding:0 2rem}.feature-card{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:linear-gradient(145deg,#7c3aed1a,#db27771a);border:1px solid #ffffff1a;border-radius:1.5rem;cursor:pointer;padding:2rem;transition:all .3s ease}.feature-card:hover{background:linear-gradient(145deg,#7c3aed26,#db277726);transform:translateY(-4px)}.card-header{gap:1rem;margin-bottom:1.5rem}.card-header,.icon-wrapper{align-items:center;display:flex}.icon-wrapper{border-radius:1rem;justify-content:center;padding:1rem}.icon-wrapper.blue{background:#7c3aed33;color:#a78bfa}.icon-wrapper.purple{background:#db277733;color:#f472b6}.feature-card h3{color:#fff;font-size:1.5rem;font-weight:600;margin:0}.feature-card p{color:#9ca3af;line-height:1.6;margin-top:.5rem}.mini-features{grid-gap:2rem;display:grid;gap:2rem;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin:0 auto;max-width:1280px;padding:4rem 2rem}.mini-feature{align-items:flex-start;background:#ffffff0d;border-radius:1rem;display:flex;gap:1rem;padding:1.5rem;transition:all .3s ease}.mini-feature:hover{background:#ffffff14;transform:translateY(-2px)}@media (max-width:768px){.hero-section h2{font-size:2.5rem}.hero-section>p{font-size:1.25rem}.feature-cards{grid-template-columns:1fr}}.drawings-container{background:linear-gradient(145deg,#140a1ef2,#3c1432f2);min-height:100vh;padding:var(--spacing-xl);padding-top:calc(var(--header-height) + 2rem)}.drawings-content{margin:0 auto;max-width:var(--max-width);padding:2rem var(--container-padding)}.drawings-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:2rem}.drawings-title{-webkit-text-fill-color:#0000;background:var(--gradient-primary);-webkit-background-clip:text;font-size:2rem}.create-drawing-btn{align-items:center;background:var(--gradient-primary);border:none;border-radius:9999px;color:#fff;cursor:pointer;display:flex;font-weight:500;gap:.5rem;padding:.75rem 1.5rem;transition:all .2s ease}.drawings-grid{grid-gap:2rem;display:grid;gap:2rem;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));padding:1rem 0}.drawing-card{background:var(--bg-secondary);border:1px solid #ffffff1a;border-radius:1rem;overflow:hidden;transition:all .2s ease}.drawing-card:hover{box-shadow:0 4px 6px #0000001a;transform:translateY(-2px)}.drawing-preview{background:#f8fafc;border-bottom:1px solid #e2e8f0;height:200px;width:100%}.drawing-actions{display:flex;gap:.5rem;justify-content:flex-end;padding:1rem}.action-btn{background:#0000;border-radius:6px;color:#64748b;padding:.5rem}.action-btn:hover{background:#f1f5f9;color:#0f172a}.action-btn.delete:hover{background:#fef2f2;color:#dc2626}@media (max-width:640px){.drawings-header{flex-direction:column;gap:1rem;text-align:center}.drawings-grid{grid-template-columns:1fr;padding:1rem}}.empty-state{align-items:center;display:flex;justify-content:center;min-height:calc(100vh - 200px);width:100%}.empty-state-content{animation:fadeIn .5s ease-out;max-width:400px;padding:2rem;text-align:center}.empty-state-image{height:240px;margin-bottom:2rem;opacity:.9;width:240px}.empty-state h2{color:#1e293b;font-size:2rem;font-weight:600;margin-bottom:1rem}.empty-state p{color:#64748b;font-size:1.1rem;line-height:1.5;margin-bottom:2rem}.create-drawing-btn,.create-note-btn{background:linear-gradient(45deg,#6366f1,#8b5cf6);border:none;border-radius:12px;box-shadow:0 4px 6px -1px #6366f133;color:#fff;cursor:pointer;font-size:1.1rem;font-weight:500;padding:1rem 2rem;transition:all .2s ease}.create-drawing-btn:hover,.create-note-btn:hover{box-shadow:0 6px 8px -1px #6366f14d;transform:translateY(-2px)}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (max-width:768px){.empty-state-image{height:180px;width:180px}.empty-state h2{font-size:1.75rem}.empty-state p{font-size:1rem}.create-drawing-btn,.create-note-btn{font-size:1rem;padding:.875rem 1.75rem}}.header-left{gap:1rem}.beta-badge,.header-left{align-items:center;display:flex}.beta-badge{animation:pulse 2s infinite;background:linear-gradient(135deg,#6366f1,#8b5cf6);border-radius:20px;color:#fff;font-size:.75rem;font-weight:600;gap:.25rem;letter-spacing:.05em;padding:.25rem .75rem}.features-banner{background:#fff;border:1px solid #edf2f7;border-radius:12px;box-shadow:0 2px 4px #0000000d;justify-content:space-between;margin:1rem 1.5rem 2rem;padding:1.5rem}.feature,.features-banner{align-items:center;display:flex}.feature{color:#1e293b;gap:1rem}.feature-text h3{font-size:1rem;font-weight:600;margin-bottom:.25rem}.feature-text p{color:#64748b;font-size:.9rem}.coming-soon{background:#f1f5f9;border-radius:20px;color:#64748b;font-size:.875rem;font-weight:500;padding:.5rem 1rem}@keyframes pulse{0%,to{opacity:1}50%{opacity:.8}}@media (max-width:768px){.features-banner{flex-direction:column;gap:1rem;margin:1rem;padding:1rem;text-align:center}.feature{flex-direction:column;gap:.5rem}}.feature-list{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;margin:.5rem 0 0;padding:0}.feature-list li{background:#f1f5f9;border-radius:15px;color:#64748b;font-size:.85rem;padding:.25rem .75rem}.beta-features{align-items:flex-end;display:flex;flex-direction:column;gap:.5rem}.feedback-btn{background:#6366f1;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:.9rem;font-weight:500;padding:.5rem 1rem;transition:all .2s ease}.feedback-btn:hover{background:#4f46e5;transform:translateY(-1px)}.canvas-container{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#23142d66;border:1px solid #ec48991a;border-radius:var(--radius-lg);overflow:hidden;padding:1rem}canvas{background:#140a1ef2;border-radius:var(--radius-md);cursor:crosshair}.drawing-tools{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#23142d99;border:1px solid #ec48991a;border-radius:var(--radius-lg);display:flex;gap:.5rem;margin-bottom:1rem;padding:1rem}.tool-button{background:#8b5cf61a;border:1px solid #ec48991a;border-radius:var(--radius-md);color:var(--text-primary);padding:.5rem 1rem;transition:all .2s ease}.tool-button:hover{background:#8b5cf633;border-color:#ec489933}.tool-button.active{background:linear-gradient(135deg,#8b5cf633,#ec489933);border-color:#ec48994d}.drawing-title-container{align-items:center;display:flex;margin-bottom:1rem}.drawing-title{align-items:center;display:flex;gap:.5rem;width:100%}.drawing-title h3{color:#fff;font-size:1.5rem;font-weight:600;margin:0}.edit-title-btn{align-items:center;background:#0000;border:none;border-radius:4px;color:#ffffff80;cursor:pointer;display:flex;justify-content:center;padding:.25rem;transition:all .2s ease}.edit-title-btn:hover{background:#ffffff1a;color:#fff}.edit-title-form{width:100%}.edit-title-form input{background:#0003;border:1px solid #ffffff1a;border-radius:4px;color:#fff;font-size:1.25rem;padding:.5rem;width:100%}.edit-title-form input:focus{border-color:#8b5cf6;box-shadow:0 0 0 2px #8b5cf633;outline:none}.saved-work-container{background:linear-gradient(145deg,#140a1efa,#3c1432fa);min-height:100vh;padding:2rem;padding-top:calc(var(--header-height) + 2rem)}.tabs{display:flex;gap:2rem;justify-content:center;margin-bottom:3rem}.tab{background:none;border:none;color:#fff9;cursor:pointer;font-size:1.2rem;padding:.5rem 1rem;position:relative;transition:all .3s ease}.tab.active{color:#fff}.tab.active:after{background:linear-gradient(90deg,#8b5cf6,#ec4899);bottom:-4px;content:"";height:2px;left:0;position:absolute;width:100%}.content-grid{grid-gap:2.5rem;display:grid;gap:2.5rem;grid-template-columns:repeat(auto-fill,minmax(450px,1fr));padding:1.5rem}.drawing-card,.note-card{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#23142dcc;border:1px solid #ffffff1a;border-radius:24px;display:flex;flex-direction:column;height:100%;padding:2.5rem;transition:all .3s ease}.drawing-card{padding:1.5rem}.drawing-preview{align-items:center;background:#140a1ecc;border:1px solid #ffffff1a;border-radius:16px;box-shadow:inset 0 0 30px #0000004d;display:flex;justify-content:center;margin:-.5rem -.5rem 1.5rem;min-height:300px;overflow:hidden;padding:1.5rem}.drawing-preview img{border-radius:12px;filter:invert(1) brightness(1.5) contrast(1.2);height:100%;mix-blend-mode:lighten;object-fit:contain;width:100%}.drawing-title,.note-title{color:#fff;font-size:2rem;font-weight:700;letter-spacing:-.02em;line-height:1.2;margin-bottom:1.5rem}.note-description{color:#cbd5e1;flex-grow:1;font-size:1.1rem;line-height:1.6;margin-bottom:2rem}.note-tag{background:#94a3b81a;border-radius:9999px;color:#94a3b8;font-size:.9rem;font-weight:500;margin-bottom:1rem;padding:.25rem .75rem}.note-tag.no-tag{background:#94a3b80d;border:1px solid #94a3b81a;color:#64748b}.note-date{color:#94a3b8;font-size:.9rem;margin-bottom:1rem}.card-actions{border-top:1px solid #ffffff1a;display:flex;gap:1rem;justify-content:flex-end;margin-top:auto;padding-top:1.5rem}.edit-btn{background:linear-gradient(135deg,#8b5cf633,#ec489933);color:#fff}.download-btn{background:linear-gradient(135deg,#3b82f633,#2563eb33);color:#fff}.delete-btn{background:linear-gradient(135deg,#ef444433,#dc262633);color:#fff}.edit-btn:hover{background:linear-gradient(135deg,#8b5cf64d,#ec48994d);transform:translateY(-2px)}.download-btn:hover{background:linear-gradient(135deg,#3b82f64d,#2563eb4d);transform:translateY(-2px)}.delete-btn:hover{background:linear-gradient(135deg,#ef44444d,#dc26264d);transform:translateY(-2px)}.drawing-card:hover,.note-card:hover{border-color:#8b5cf64d;box-shadow:0 20px 40px #8b5cf633;transform:translateY(-4px)}.drawing-card:hover .drawing-preview{background:#140a1ee6;box-shadow:inset 0 0 40px #0006}.drawing-card:hover .drawing-preview img{filter:invert(1) brightness(1.8) contrast(1.3)}.note-card h3{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#e2e8f0,#cbd5e1);-webkit-background-clip:text;font-size:1.8rem;font-weight:700;margin-bottom:1rem}.note-card p{color:#cbd5e1;font-size:1.1rem;line-height:1.6;margin-bottom:1.5rem}.edit-note-form{display:flex;flex-direction:column;gap:1rem}.edit-input{background:#0003;border:1px solid #ffffff1a;border-radius:8px;color:#cbd5e1;font-size:1rem;padding:.75rem;width:100%}.edit-input:focus{border-color:#8b5cf6;box-shadow:0 0 0 2px #8b5cf633;outline:none}textarea.edit-input{min-height:120px;resize:vertical}.edit-actions{display:flex;gap:1rem;margin-top:1rem}.cancel-btn,.save-btn{border:none;border-radius:6px;cursor:pointer;font-weight:500;padding:.5rem 1rem;transition:all .2s ease}.save-btn{background:linear-gradient(135deg,#8b5cf6,#ec4899)}.cancel-btn{background:#ffffff1a;color:#cbd5e1}.cancel-btn:hover,.save-btn:hover{transform:translateY(-1px)}.nav-container{align-items:center;background:#fff;box-shadow:0 1px 3px #0000001a;display:flex;height:60px;justify-content:space-between;left:0;padding:0 1.5rem;position:fixed;right:0;top:0;z-index:1000}.app-logo{color:#2563eb;cursor:pointer;font-size:1.25rem;font-weight:600;letter-spacing:-.5px;margin:0}.nav-actions{display:flex;gap:.5rem}.nav-icon-btn{align-items:center;background:#0000;border:none;border-radius:8px;color:#4b5563;cursor:pointer;display:flex;height:40px;justify-content:center;transition:all .2s ease;width:40px}.nav-icon-btn:hover{background:#f3f4f6;color:#2563eb}.nav-icon-btn.logout{color:#dc2626}.nav-icon-btn.logout:hover{background:#fef2f2}@media (max-width:640px){.nav-container{padding:0 1rem}.app-logo{font-size:1.1rem}}.top-nav{align-items:center;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#13131af2;border-bottom:1px solid #ffffff1a;display:flex;height:var(--header-height);justify-content:space-between;left:0;padding:0 2rem;position:fixed;right:0;top:0;z-index:1000}.nav-left h1{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#8b5cf6,#ec4899);-webkit-background-clip:text;cursor:pointer;font-size:1.5rem;font-weight:700;margin:0}.nav-center,.nav-right{align-items:center;display:flex;gap:1rem}.nav-item{align-items:center;background:#0000;border:none;border-radius:.5rem;color:#c4c4d4;cursor:pointer;display:flex;font-size:.95rem;font-weight:500;gap:.5rem;padding:.5rem 1rem;transition:all .2s ease}.nav-item:hover{background:#8b5cf626;color:#fff}.nav-item.active{background:#8b5cf633;color:#8b5cf6;font-weight:600}.nav-item svg{color:#9494a6;transition:all .2s ease}.nav-item:hover svg{color:#c4c4d4}.nav-item.active svg{color:#8b5cf6}.nav-item.signup{background:linear-gradient(135deg,#8b5cf6,#ec4899);border-radius:9999px;color:#fff;font-weight:600}.nav-item.signup:hover{background:linear-gradient(135deg,#9333ea,#f472b6);box-shadow:0 4px 12px #8b5cf640;transform:translateY(-1px)}.nav-item.logout{color:#ef4444}.nav-item.logout:hover{background:#ef444426;color:#ef4444}.nav-item.logout svg{color:#ef4444}@media (max-width:768px){.top-nav{padding:0 1rem}.nav-left h1{font-size:1.25rem}.nav-item span{display:none}.nav-item{padding:.5rem}}.draw-container{background:#f8fafc;margin-top:60px;min-height:calc(100vh - 60px);padding:2rem}.draw-content{background:#fff;border-radius:20px;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;margin:0 auto;max-width:1200px;padding:2.5rem}.draw-title{-webkit-text-fill-color:#0000;background:linear-gradient(45deg,#2563eb,#7c3aed);-webkit-background-clip:text;color:#1e293b;font-size:2.5rem;font-weight:700;margin:0 0 .5rem}.draw-subtitle{color:#64748b;font-size:1.1rem;margin-bottom:2.5rem}.drawing-form{display:flex;flex-direction:column;gap:1.5rem}.input-wrapper{width:100%}.title-input{background:#f8fafc;border:2px solid #e2e8f0;border-radius:12px;font-size:1rem;padding:1rem;transition:all .2s ease;width:100%}.title-input:focus{border-color:#2563eb;box-shadow:0 0 0 3px #2563eb1a;outline:none}.canvas-wrapper{background:#f8fafc;border:2px solid #e2e8f0;border-radius:12px;overflow:hidden;transition:all .2s ease;width:100%}.canvas-wrapper:hover{border-color:#2563eb;box-shadow:0 0 0 3px #2563eb1a}canvas{background:#fff;display:block}.action-buttons{align-items:center;display:flex;justify-content:space-between;margin-top:2rem}.right-buttons{display:flex;gap:1rem}.action-btn{align-items:center;border:none;border-radius:12px;cursor:pointer;display:flex;font-size:1rem;font-weight:500;gap:.5rem;padding:.75rem 1.5rem;transition:all .2s ease}.clear-btn{background:#f1f5f9;color:#64748b}.clear-btn:hover{background:#e2e8f0;transform:translateY(-2px)}.save-btn{background:linear-gradient(45deg,#2563eb,#3b82f6);color:#fff}.save-btn:hover{box-shadow:0 4px 12px #2563eb33;transform:translateY(-2px)}.close-btn{background:#f1f5f9;color:#ef4444}.close-btn:hover{background:#fee2e2;transform:translateY(-2px)}.view-drawings-btn{background:#4f46e5;color:#fff}.view-drawings-btn:hover{background:#4338ca;transform:translateY(-1px)}@media (max-width:768px){.draw-container{padding:1rem}.draw-content{padding:1.5rem}.draw-title{font-size:2rem}.action-buttons{flex-direction:column;gap:1rem}.right-buttons{flex-direction:column;width:100%}.action-btn{justify-content:center;width:100%}}.beta-banner{animation:slideDown .5s ease-out;background:linear-gradient(135deg,#6366f1,#8b5cf6);color:#fff;justify-content:center;left:0;padding:.75rem 2rem;position:fixed;right:0;top:0;z-index:1000}.beta-banner,.beta-banner-content{align-items:center;display:flex;gap:1rem}.beta-banner-content{font-size:.95rem}.sparkle-icon{animation:sparkle 2s infinite}.try-now-btn{background:#fff;border:none;border-radius:20px;color:#6366f1;cursor:pointer;font-size:.85rem;font-weight:600;padding:.4rem 1rem;transition:all .2s ease}.try-now-btn:hover{box-shadow:0 4px 12px #fff3;transform:translateY(-1px)}.close-btn{align-items:center;background:#0000;border:none;color:#fff;cursor:pointer;display:flex;justify-content:center;opacity:.8;padding:.25rem;transition:opacity .2s ease}.close-btn:hover{opacity:1}@keyframes slideDown{0%{transform:translateY(-100%)}to{transform:translateY(0)}}@keyframes sparkle{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.2)}}@media (max-width:768px){.beta-banner{padding:.75rem 1rem}.beta-banner-content{font-size:.85rem;gap:.5rem}}
/*# sourceMappingURL=main.4a413dbc.css.map*/