*{box-sizing:border-box;margin:0;padding:0}html,body{background:#dbe8f3;font-family:Poppins,sans-serif;overflow-x:hidden}.app{max-width:1500px;min-height:100vh;margin:0 auto;padding:40px}.top-section{grid-template-columns:1fr auto 1fr;align-items:start;display:grid}.left-section{align-items:center;gap:35px;display:flex}.middle-section{justify-content:center;align-items:center;display:flex}.right-section{flex-direction:column;align-items:flex-end;display:flex}.weather-card{background:linear-gradient(#6bb9ff 0%,#4a90e2 45%,#2f6ed8 100%);border-radius:28px;flex-direction:column;justify-content:center;align-items:center;width:230px;height:200px;transition:transform .3s;display:flex;box-shadow:0 4px 10px #0000001a}.weather-card:hover{transform:translateY(-5px)}.weather-icon{color:#fdb813;margin-bottom:10px;font-size:70px}.weather-card h3{font-size:22px;font-weight:600}.weather-card h1{margin:8px 0;font-size:52px}.weather-card p{color:#fff;font-size:18px}.generate-btn{color:#fff;cursor:pointer;background:#123b73;border:none;border-radius:30px;width:230px;height:58px;margin-top:20px;padding:18px 40px;font-family:Poppins,sans-serif;font-size:18px;font-weight:600;box-shadow:0 4px 10px #123b7340}.generate-btn:hover{background:#1c4f99;transform:translateY(-3px);box-shadow:0 12px 25px #123b7359}.generate-btn:active{transform:scale(.97)}.avatar{object-fit:cover;border:5px solid #fff;border-radius:50%;width:180px;height:180px;transition:transform .3s;box-shadow:0 4px 10px #000}.avatar:hover{transform:scale(1.05)}.outfit-section{flex-direction:column;align-items:center;gap:40px;margin-top:0;display:flex}.clothing-placeholder{background:#fff;border-radius:25px;justify-content:center;align-items:center;width:270px;height:300px;font-size:22px;display:flex;box-shadow:0 4px 10px #00000014}.welcome-text{color:#123b73;letter-spacing:-1px;max-width:420px;font-size:2.7rem;font-weight:700;line-height:1.2}.clothing-image{object-fit:contain;border-radius:20px;width:100%;height:100%}.inspiration-container{background:#fff;border-radius:25px;width:400px;height:450px;padding:25px;box-shadow:0 12px 30px #00000014}.inspiration-container h2{text-align:center;margin-bottom:15px;font-size:22px;font-weight:600}.carousel-wrapper{justify-content:center;align-items:center;gap:10px;display:flex}.image-stack{width:250px;height:330px;position:relative}.front-image{object-fit:cover;z-index:3;border-radius:20px;width:220px;height:300px;transition:all .35s;position:absolute;top:0;left:15px;box-shadow:0 15px 35px #00000038}.front-image:hover{transform:translateY(-5px)}.side-image{object-fit:cover;border-radius:18px;width:190px;height:270px;transition:all .35s;position:absolute}.arrow-btn{cursor:pointer;background:gray;border:none;border-radius:50%;width:40px;height:40px;transition:all .25s;box-shadow:0 4px 10px #0000001f}.arrow-btn:hover{transform:scale(1.1)}.main-content{grid-template-columns:1fr 1.5fr 1fr;align-items:start;gap:40px;margin-top:40px;display:grid}.left-column{justify-content:center;align-items:flex-start;width:100%;display:flex}.right-column{justify-content:center;align-items:flex-start;display:flex}.left-image{z-index:1;opacity:.5;top:15px;left:-20px}.right-image{z-index:1;opacity:.5;top:15px;right:-20px}.notes-paper{background:#fdf6d8;border-radius:15px;width:320px;min-height:430px;margin-top:35px;position:relative;box-shadow:0 10px 25px #0000001f}.notes-paper h2{color:#123b73;text-align:center;margin-top:20px;margin-bottom:18px;font-size:24px;font-weight:700}.notes-paper textarea{resize:none;color:#333;background:0 0;border:none;outline:none;width:80%;height:260px;padding-left:20px;font-family:Poppins,sans-serif;font-size:18px;line-height:34px}.save-notes-btn{color:#fff;cursor:pointer;background:#123b73;border:none;border-radius:22px;justify-content:center;align-items:center;width:140px;height:42px;margin:20px auto;padding:0;font-family:Poppins,sans-serif;font-size:15px;font-weight:600;transition:all .25s;display:flex}.save-notes-btn:hover{background:#1e4d8e;transform:translateY(-2px)}@media (width<=1350px){.top-section{flex-direction:column;align-items:center;gap:30px;display:flex}.main-content{flex-direction:column;align-items:center;gap:40px;display:flex}}
