html,body{margin:0;padding:0;font-family:var(--font-primary);height:100%;width:100%;background:var(--brand-bg);overflow-x:hidden;-webkit-font-smoothing:antialiased}.welcome-container{display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:100vh;padding:2rem;text-align:center}.welcome-card{background:var(--brand-bg2);padding:3rem 2rem;border-radius:1.5rem;box-shadow:0 15px 30px #0000001a}.logo{width:160px;height:auto}h1{font-size:2.75rem;margin:.5rem 0;color:var(--brand-text);font-weight:700}h3{font-size:1.25rem;margin:.25rem 0;color:var(--brand-text);font-weight:400}.continue-button{padding:.8rem 2rem;background-color:var(--brand-accent);color:#fff;font-size:1rem;font-weight:500;border:none;border-radius:2rem;margin-top:1rem;cursor:pointer;transition:transform .3s ease,background-color .3s ease}.continue-button:hover{background-color:#6f9572;transform:scale(1.05)}.home-wrapper{display:flex;flex-direction:column;align-items:center;min-height:100vh;background:var(--brand-bg)}.hero-header{position:relative;background:var(--brand-bg2);background-size:cover;padding:4rem 0 0;width:100vw;min-height:200px;text-align:center;border-bottom-left-radius:3rem;border-bottom-right-radius:3rem;overflow:hidden;box-shadow:0 10px 30px #9333ea66}.hero-glow{position:absolute;top:-50%;left:50%;width:200%;height:200%;background:radial-gradient(circle at center,rgba(255,255,255,.08),transparent);transform:translate(-50%);z-index:0}.hero-logo-wrapper{position:relative;display:inline-block;margin-top:-3rem}.hero-logo{width:300px;height:auto;position:relative;z-index:1}.hero-logo-wrapper:before{content:"";position:absolute;top:50%;left:50%;width:280px;height:280px;transform:translate(-50%,-50%);background:radial-gradient(circle,rgb(255,255,255),transparent 70%);filter:blur(40px);z-index:0;border-radius:50%}.hero-title{font-size:3.5rem;font-weight:700;color:#fff;margin-top:-1rem;letter-spacing:1px;position:relative;z-index:1;text-shadow:0 2px 4px rgba(0,0,0,.2)}.hero-subtitle{font-size:1rem;font-weight:400;color:#f3e8ff;margin-top:.25rem;max-width:300px;margin-bottom:2rem;margin-left:auto;margin-right:auto;position:relative;z-index:1;opacity:.9}.feature-grid{display:flex;flex-wrap:wrap;gap:1.5rem;justify-content:center;margin-top:2rem}.card{width:160px;background:#fff;border-radius:1.25rem;overflow:hidden;box-shadow:0 10px 25px #00000014;display:flex;flex-direction:column;text-align:center;cursor:pointer;transition:transform .3s ease,box-shadow .3s ease;opacity:0;transform:translateY(20px);animation:fadeInUp .6s ease-out forwards}.disabled{opacity:.6!important}.card:hover{transform:translateY(-5px);box-shadow:0 15px 30px #00000026}.card-image{height:75px;background:#f3f4f6;display:flex;align-items:center;justify-content:center}.card-image img{object-fit:cover;width:125%}.card-info{padding:.75rem 1rem;background-color:#fff;flex:1}.card-info h3{font-size:1rem;font-weight:600;margin:0 0 .4rem;color:indigo}.card-info p{font-size:.75rem;color:#666;line-height:1.3;margin:0}.home-footer{margin-top:auto;padding:2rem 0 1rem}.get-started-button{padding:.9rem 2rem;font-size:1rem;font-weight:600;background-color:var(--accent);color:#fff;border:none;border-radius:2rem;cursor:pointer;transition:background-color .3s ease,transform .2s ease}.get-started-button:hover{background-color:#6f9572;transform:scale(1.04)}.delay-1{animation-delay:.2s}.delay-2{animation-delay:.4s}.delay-3{animation-delay:.6s}.delay-4{animation-delay:.8s}@keyframes fadeInUp{to{opacity:1;transform:translateY(0)}}@media (max-width: 600px){h1{font-size:2rem}h3{font-size:1rem}.home-logo{width:120px}.header-title{font-size:2.25rem}.feature-card{width:120px;height:120px}.info-section h2{font-size:.75rem}}.image-loader{position:absolute;top:50%;left:50%;width:32px;height:32px;margin:-16px;border:3px solid rgba(255,255,255,.2);border-top-color:#9333ea;border-radius:50%;animation:spin 1s linear infinite;z-index:2}.hidden-image{opacity:0}.fade-in-image{opacity:1}@keyframes spin{to{transform:rotate(360deg)}}.login-body{width:100vw;min-height:100vh;padding:0;display:flex;justify-content:center;align-items:center;background-image:url(/bg.png);background-size:cover;background-position:center}.login-container{margin-top:100px;margin-bottom:100px;width:100%;max-width:250px;padding:40px 30px;background:#fff;border-radius:16px;box-shadow:0 12px 24px #0000001a;display:flex;flex-direction:column;gap:20px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.login-container h1{text-align:center;font-size:26px;color:#333;margin-bottom:10px}.login-container h1 span{color:var(--highlight)}.login-container h2{margin-top:-10px;text-align:center;font-size:16px;color:#333;margin-bottom:10px}.login-container form{display:flex;flex-direction:column;gap:20px}.login-container form input,.login-container form select{padding:12px 14px;border:1px solid #ddd;border-radius:8px;font-size:16px;transition:border-color .3s,box-shadow .3s}.login-container form input:focus,.login-container form select:focus{border-color:var(--highlight);box-shadow:0 0 0 3px var(--highlight);outline:none}.login-container form label{display:flex;flex-direction:column;font-size:14px;color:#333;gap:2px}.login-container form button{padding:12px;background-color:var(--button, #646cff);color:#fff;border:none;border-radius:8px;font-size:16px;font-weight:500;cursor:pointer;transition:background-color .3s ease,transform .1s}.login-container form button:hover{background-color:var(--button-hover, #535bf2);transform:translateY(-1px)}.login-container form button:active{transform:scale(.98)}.login-container .checkbox-container{display:flex;align-items:left;gap:10px;font-size:14px;color:#555}.login-container .checkbox-container input[type=checkbox]{width:16px;height:16px;accent-color:var(--button);box-shadow:none!important;cursor:pointer}.login-container p{text-align:center;font-size:14px;color:#555}.login-container p a{color:var(--highlight);font-weight:500;text-decoration:none;transition:color .2s}.login-container p a:hover{text-decoration:underline;color:#535bf2}.login-container p:last-of-type{margin-top:-20px}.success-screen{display:flex;justify-content:center;flex-direction:column;align-items:center;max-width:250px;height:420px;margin:100px auto;padding:30px;text-align:center;border-radius:12px;border:1px solid var(--success);box-shadow:0 6px 18px #00000026}.success-icon-ring{width:40px;height:40px;border-radius:50%;border:4px solid var(--highlight);display:flex;align-items:center;justify-content:center;margin-bottom:-10px;background-color:#fff;box-shadow:0 2px 6px #0000001a}.success-icon{font-size:30px;color:var(--highlight)}.success-screen h1{color:var(--highlight);font-size:30px;margin-bottom:10px}.success-screen p{font-size:16px;color:#333;margin-bottom:30px}.success-button{display:inline-block;padding:12px 24px;background-color:var(--button);color:#fff;text-decoration:none;border:none;border-radius:6px;font-weight:700;transition:background-color .3s ease;box-shadow:0 0 10px var(--button)}.success-button:hover{background-color:var(--button-hover)}.auth-loading-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;border-radius:20px;overflow:hidden;width:100vw;background-color:#f5f7fa;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;color:#333}.auth-spinner{width:60px;height:60px;border:6px solid #e0e0e0;border-top:6px solid var(--highlight);border-radius:50%;animation:auth-spin 1s linear infinite}.auth-loading-text{margin-top:20px;font-size:18px;color:var(--text-color)}@keyframes auth-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.chat-wrapper{max-width:500px;margin:auto;font-family:sans-serif;border:1px solid var(--background-color);border-radius:12px;padding:16px;background-color:var(--background-color);display:flex;flex-direction:column;height:90vh}.chat-log{display:flex;flex-direction:column;justify-content:flex-end;min-height:100%;overflow-y:auto;padding:10px;gap:10px}.chat-message{max-width:75%;display:flex;flex-direction:column}.chat-message.user{align-self:flex-end;background-color:var(--usr-msg);border-radius:20px}.chat-message.ai{align-self:flex-start;background-color:var(--ai-msg);border-radius:20px}.chat-bubble{padding:10px 20px;border-radius:20px}.chat-input-area{position:fixed;bottom:0;left:0;right:0;padding:8px;background-color:#fff;display:flex;gap:8px;border-top:1px solid #ddd}.chat-input-area form{display:relative;width:100%;display:flex}.chat-input{flex:1;padding:10px;border-radius:8px;border:1px solid #ccc;font-size:16px;position:relative}.chat-button{padding:10px 14px;background-color:var(--highlight, #8d64ff);border:none;color:#fff;border-radius:8px;cursor:pointer}.chat-button:hover{background-color:var(--button-hover, #b397fd)}.chat-secondary-button{padding:10px;background-color:var(--button-hover, #b397fd);border:none;color:#fff;border-radius:8px;cursor:pointer}.chat-button,.chat-secondary-button{font-size:16px}.chat-image{margin-top:8px;max-width:100%;border-radius:8px}.camera-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000e6;z-index:1000;display:flex;flex-direction:column;justify-content:center;align-items:center}.camera-video{max-width:100%;max-height:70vh;border-radius:8px;background:#000}.camera-controls{margin-top:20px;display:flex;gap:10px}@keyframes slideFadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.new-message{animation:slideFadeIn .3s ease-out}.face-aligner{position:absolute;z-index:400;height:100%;transform:translate(-60px) scale(1.2) translateY(10px);opacity:.3}.photo-capture{display:flex;flex-direction:column;justify-content:center;align-items:center;height:auto;min-height:100vh;padding:1rem;box-sizing:border-box;overflow:hidden;position:relative;background:var(--brand-bg2)}.photo-capture__container{width:100%;max-width:360px;background:#fff;color:#111827;border-radius:20px;box-shadow:0 12px 24px #0003;padding:20px;text-align:center;animation:fadeInUp .4s ease-out}.photo-capture__title{font-size:1.5rem;font-weight:700;margin-bottom:1rem}.photo-capture__frame{position:relative;width:100%;aspect-ratio:3 / 4;border-radius:16px;overflow:hidden;background:#000;margin-bottom:1.5rem;transition:all .3s ease-in-out}.photo-capture__video,.photo-capture__image{width:100%;height:100%;object-fit:cover;transition:opacity .3s ease-in-out;transform:scaleX(-1)}.photo-capture__buttons{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap}.photo-capture__button{padding:12px 24px;font-size:1rem;border-radius:14px;border:none;cursor:pointer;background-color:#6b7280;color:#fff;transition:background-color .3s ease;width:100%;max-width:180px}.photo-capture__button:hover{background-color:#4b5563}.photo-capture__button.primary{background:var(--brand-bg2)}.photo-capture__button.primary:hover{background:var(--brand-bg3)}.photo-capture__canvas{display:none}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 480px){.photo-capture__title{font-size:1.25rem}.photo-capture__button{padding:10px 20px}}.exit_button{position:absolute;top:10px;right:10px;z-index:6;border:4px solid var(--brand-accent);background:none;color:var(--brand-accent);font-weight:600;padding:12px 15px;border-radius:20px;transition:.3s ease-in-out}.exit_button:hover{transform:scale(1.2)}.photo-capture__analyze-wrapper{position:relative;width:100%;height:100%}.photo-capture__video-wrapper,.photo-capture__analyze-wrapper{width:100%;max-width:360px;aspect-ratio:3/4;position:relative;border-radius:16px;overflow:hidden;background-color:#000;box-shadow:0 0 12px var(--brand-bg2)}.photo-capture__controls{margin-top:1.5rem;display:flex;flex-direction:row;gap:1rem;flex-wrap:wrap;justify-content:center}.photo-capture__button{padding:.75rem 1.5rem;font-size:1rem;border:none;border-radius:999px;background:linear-gradient(to right,var(--highlight),var(--logo1));color:var(--logo2);cursor:pointer;box-shadow:0 4px 10px var(--brand-bg2);transition:transform .2s ease}.photo-capture__button:hover{transform:scale(1.05)}.analyze-overlay{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;background:#0000001a;overflow:hidden;border-radius:16px}.scan-line{position:absolute;top:-10%;left:0;width:100%;height:4px;background:linear-gradient(to right,#8d64ff,#aa8ff7);box-shadow:0 0 8px #b9a6ee;transform-origin:center;animation:scanThickSlowLoop 2.5s linear infinite}.analysis-card{max-width:400px;margin:40px auto;padding:24px;background:linear-gradient(to bottom right,#fdf6ef,#f0e7dc);border-radius:20px;box-shadow:0 10px 20px #00000014;text-align:center;font-family:Segoe UI,sans-serif;color:#2f3e2f;animation:fadeInUp .4s ease-out}.success-alert{font-size:30px;background-color:#86a78962;color:#0e3511;margin-bottom:16px;padding:5px;border:2px solid #86a789;border-radius:10px;animation:fadeInUp .4s ease-out}.analysis-card h2{font-size:22px;margin:0 0 10px}.analysis-card p{margin-bottom:20px;color:#4a5a4a}.analysis-card button{padding:10px 24px;background:var(--brand-bg2);border:none;color:#fff;font-weight:600;font-size:15px;border-radius:50px;cursor:pointer;transition:background .3s ease}.analysis-card button:hover{background:#3a68e9}@keyframes scanThickSlowLoop{0%{top:-10%;transform:scaleY(1);opacity:.6}25%{top:20%;transform:scaleY(2);opacity:.8}50%{top:50%;transform:scaleY(3);opacity:1}75%{top:80%;transform:scaleY(2);opacity:.7}to{top:110%;transform:scaleY(1);opacity:.3}}.dots{position:absolute;width:100%;height:100%;background-image:radial-gradient(rgba(255,255,255,.2) 1px,transparent 0);background-size:12px 12px;animation:pulseDotsLoop 1.6s ease-in-out infinite;z-index:0}@keyframes pulseDotsLoop{0%,to{opacity:.4}50%{opacity:1}}.blur-overlay{position:absolute;top:0;left:0;width:100%;height:100%;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:deblur 2.5s ease-out forwards;pointer-events:none;z-index:5;border-radius:16px}@keyframes deblur{0%{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:1}70%{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:.7}to{-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px);opacity:0}}.skin-quiz-card{display:flex;flex-direction:column;justify-content:center;align-items:center;height:auto;padding:2rem;box-sizing:border-box;position:relative;background-color:#fff;border-radius:20px}.skin-quiz-card h1{font-size:28px;font-weight:700;letter-spacing:1px;margin-bottom:10px;color:#2f3e2f}.skin-quiz-card p{font-size:14px;color:#4a5a4a}form{text-align:left;display:flex;flex-direction:column;justify-content:center}.age-selector{margin-bottom:24px}.age-selector label{font-weight:600;margin-bottom:8px;display:block;color:#2f3e2f}.age-options{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}.age-option{background:#fff;border:1px solid #d3cfc9;border-radius:40px;padding:8px 18px;font-size:14px;cursor:pointer;position:relative;transition:all .3s ease}.age-option input[type=radio]{display:none}.age-option span{color:#2f3e2f}.age-option:hover{border-color:#a084dc;background:#f1eafc;box-shadow:0 0 5px #a084dc80}.age-option input[type=radio]:checked+span{color:#a084dc;font-weight:1000}textarea{width:80%;padding:12px;margin-top:8px;font-size:14px;border:1px solid #ccc;border-radius:12px;resize:vertical;font-family:inherit;background:#fff}.results-card{background-color:#fff;min-width:300px;height:auto;width:40%;border-radius:20px;box-shadow:0 8px 24px #00000014;padding:1.5rem;max-width:600px;margin:0 auto}.result-photo{margin-bottom:20px;height:300px}.result-photo img{border-radius:20px}.tab-buttons{display:flex;justify-content:center;margin-bottom:1rem}.tab{border:none;background:#f3e8ff;color:#6b21a8;padding:.5rem 1rem;margin:0 .5rem;border-radius:999px;font-weight:500;cursor:pointer;transition:all .3s ease}.tab.active{background-color:#9333ea;color:#fff}.chart-container{height:300px;width:100%}.fade-in{opacity:0;transform:translateY(20px);animation:fadeInUp .6s ease-out forwards}.delay-1{animation-delay:.3s}.delay-2{animation-delay:.5s}.delay-3{animation-delay:.7s}html,body{height:100%;overflow-x:hidden}.overview-container{min-height:100vh;background:var(--brand-bg2);padding:1rem;overflow-y:auto;-webkit-overflow-scrolling:touch}.overview-card{background-color:#fff;border-radius:1.5rem;box-shadow:0 10px 25px #00000026;padding:1rem;height:auto;max-width:90vw;overflow-y:visible}.overview-content{display:flex;flex-direction:column;align-items:center;gap:1rem}.overview-image{width:100%;max-height:240px;object-fit:cover;border-radius:1rem}.chart-tabs{display:flex;justify-content:center;gap:1rem;margin-top:1rem}.chart-tab{padding:.5rem 1rem;border-radius:999px;font-size:.875rem;font-weight:500;border:none;width:33%;background-color:#f8ddff;color:#000;cursor:pointer;transition:all .3s ease}.chart-tab.active{background-color:#6b21a8;color:#fff}.chart-container{width:100%;height:16rem;margin-top:.5rem}.products-section{width:80vw;margin-bottom:1.5rem}.products-title{font-weight:600;margin-bottom:1rem}.products-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}.product-card{background-color:#ebebeb;border-radius:.75rem;padding:.5rem;box-shadow:0 2px 6px #0000000d;transition:all .3s ease;cursor:pointer;height:auto;display:flex;flex-direction:column;justify-content:space-between}.product-content{display:flex;flex-direction:column;align-items:center;flex:1}.product-card:hover{box-shadow:0 4px 12px #0000001a}.product-image{width:100%;height:96px;object-fit:contain;border-radius:.5rem;margin-bottom:.5rem}.product-name{font-size:.875rem;font-weight:500;text-align:center;height:35px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.product-button{font-size:.75rem;padding:5px 10px;background:var(--brand-bg2);border-radius:5px;color:#fff;border:none;text-decoration:none;cursor:pointer;width:100%}:root{--brand-bg: linear-gradient(to bottom right, #eae6ff, #d2ccfb, #b5b0f8);--brand-bg2: linear-gradient(to bottom right, #6949fa, #873ffa, #9224f8);--brand-bg3: linear-gradient(to bottom right, #dbd3ff, #c6adff, #b291ff);--brand-text: #2d1f59;--brand-accent: #7d5fff;--font-primary: "Outfit", sans-serif;--app-height: 100vh}html,body{margin:0;padding-bottom:env(safe-area-inset-bottom)}.custom-font-r{font-family:Outfit,sans-serif;font-optical-sizing:auto;font-style:normal;font-weight:200}.custom-font-b{font-family:Outfit,sans-serif;font-optical-sizing:auto;font-style:normal;font-weight:800}@supports (height: 100svh){:root{--app-height: 100svh}}