*{margin:0;padding:0;box-sizing:border-box}body{font-family:Comfortaa,Nunito,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:linear-gradient(135deg,#ffe5f1,#e0f6ff,#f0fff0);min-height:100vh}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.app{max-width:900px;margin:0 auto;padding:15px;min-height:100vh;width:100%;box-sizing:border-box;overflow-x:hidden}@media(max-width:768px){.app{padding:10px;max-width:100%}}.header{margin-bottom:30px;padding:20px 0}.header-top{display:flex;justify-content:space-between;align-items:flex-start;gap:15px;flex-wrap:wrap}.header-top>div:first-child{flex:1;text-align:center;min-width:0}.header h1{font-size:2em;margin:0;background:linear-gradient(135deg,#ffb6c1,plum,#b0e0e6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-family:Comfortaa,sans-serif;word-wrap:break-word}.subtitle{font-size:1em;color:#ffb6c1;margin-top:8px;word-wrap:break-word}@media(max-width:768px){.header{margin-bottom:20px;padding:15px 0}.header h1{font-size:1.5em}.subtitle{font-size:.9em}.header-top{gap:10px}}.stats-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:15px;margin-bottom:25px}@media(max-width:768px){.stats-container{grid-template-columns:repeat(2,1fr);gap:10px}}.stat-card{background:linear-gradient(135deg,#fff,#fff0f5);border-radius:20px;padding:25px;text-align:center;box-shadow:0 4px 12px #ffb6c133;transition:transform .2s,box-shadow .2s;border:2px solid rgba(255,182,193,.3)}.stat-card:hover{transform:translateY(-5px);box-shadow:0 8px 20px #ffb6c14d}.stat-card.good{border-top:4px solid #BDFCC9;background:linear-gradient(135deg,#f0fff0,#e0ffe0);border-color:#bdfcc980}.stat-card.bad{border-top:4px solid #FFCCCB;background:linear-gradient(135deg,#fff0f5,#ffe5e5);border-color:#ffcccb80}.stat-card.info{border-top:4px solid #B0E0E6;background:linear-gradient(135deg,#e0f6ff,#f0f8ff);border-color:#b0e0e680}.stat-icon{font-size:3em;margin-bottom:10px}.stat-number{font-size:2.5em;font-weight:700;color:#ffb6c1;margin:10px 0}.stat-label{font-size:1em;color:plum;font-weight:500;margin-bottom:5px}.stat-subtitle{font-size:.85em;color:#b0e0e6}.actions{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px;gap:15px;flex-wrap:wrap}.action-buttons{display:flex;gap:10px;flex-wrap:wrap}.view-toggle{display:flex;gap:8px;background:linear-gradient(135deg,#fff,#fff0f5);padding:5px;border-radius:12px;box-shadow:0 2px 8px #ffb6c133;border:2px solid rgba(255,182,193,.3);flex-wrap:wrap}@media(max-width:768px){.actions{flex-direction:column;align-items:stretch;gap:10px}.view-toggle{width:100%;justify-content:center;gap:4px}.view-btn{flex:1;min-width:0;padding:6px 8px;font-size:.75em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.action-buttons{width:100%;flex-direction:column;gap:8px}}.view-btn{padding:10px 20px;border:none;background:transparent;border-radius:8px;cursor:pointer;font-weight:600;color:plum;transition:all .2s;font-family:Comfortaa,sans-serif}.view-btn:hover{background:#ffb6c11a;color:#ffb6c1}.view-btn.active{background:linear-gradient(135deg,#ffb6c1,plum);color:#fff;box-shadow:0 2px 8px #ffb6c166}.btn-primary{background:linear-gradient(135deg,#ffb6c1,plum,#b0e0e6);color:#fff;border:none;padding:12px 24px;font-size:.95em;border-radius:20px;cursor:pointer;font-weight:600;transition:transform .2s,box-shadow .2s;box-shadow:0 4px 12px #ffb6c166;font-family:Comfortaa,sans-serif}.btn-primary:hover{transform:translateY(-2px) scale(1.05);box-shadow:0 6px 16px #ffb6c180}@media(max-width:768px){.btn-primary{width:100%;padding:14px 20px;font-size:.9em}}.event-form{background:linear-gradient(135deg,#fff,#fff0f5);border-radius:20px;padding:25px;margin-bottom:25px;box-shadow:0 4px 12px #ffb6c133;border:2px solid rgba(255,182,193,.3)}@media(max-width:768px){.event-form{padding:20px}}.event-form h2{margin-top:0;color:#ffb6c1;font-family:Comfortaa,sans-serif}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:10px;font-weight:600;color:plum;font-family:Comfortaa,sans-serif}.form-hint{margin-top:8px;font-size:.9em;color:#b0e0e6;font-style:italic;padding:8px;background:#b0e0e61a;border-radius:8px;border-left:3px solid #B0E0E6}.wetness-level-selector{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-bottom:10px}.wetness-level-btn{display:flex;flex-direction:column;align-items:center;gap:5px;padding:12px 16px;border:2px solid rgba(255,182,193,.4);border-radius:12px;background:#fffc;cursor:pointer;transition:all .2s;min-width:60px}.wetness-level-btn:hover{border-color:#ffb6c1;background:#fff0f5cc;transform:scale(1.05)}.wetness-level-btn.selected{border-color:#b0e0e6;background:linear-gradient(135deg,#e0f6ff,#f0f8ff);box-shadow:0 2px 8px #b0e0e666}.water-drop{font-size:1.8em;display:block;transition:all .2s}.wetness-level-btn.selected .water-drop{transform:scale(1.1)}.wetness-label{font-size:.85em;font-weight:600;color:plum;font-family:Comfortaa,sans-serif}.wetness-level-btn.selected .wetness-label{color:#b0e0e6;font-weight:700}@media(max-width:768px){.wetness-level-selector{gap:6px}.wetness-level-btn{padding:10px 12px;min-width:50px}.water-drop{font-size:1.5em}.wetness-label{font-size:.75em}}.radio-group{display:flex;gap:15px;flex-wrap:wrap}.radio-option{flex:1;min-width:200px;padding:15px;border:2px solid rgba(255,182,193,.4);border-radius:12px;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:10px;background:#fffc}.radio-option:hover{border-color:#ffb6c1;background:#fff0f5cc;transform:scale(1.02)}.radio-option.good{border-color:#bdfcc980;background:linear-gradient(135deg,#f0fff0,#e0ffe0)}.radio-option.good:hover{border-color:#bdfcc9;background:linear-gradient(135deg,#e0ffe0,#d0ffd0)}.radio-option.good input:checked+span{color:#90ee90;font-weight:700}.radio-option.bad{border-color:#ffcccb80;background:linear-gradient(135deg,#fff0f5,#ffe5e5)}.radio-option.bad:hover{border-color:#ffcccb;background:linear-gradient(135deg,#ffe5e5,#ffd5d5)}.radio-option.bad input:checked+span{color:#f99;font-weight:700}.radio-option input[type=radio]{margin:0;cursor:pointer;accent-color:#FFB6C1}.checkbox-option{display:flex;align-items:center;gap:10px;padding:12px;border:2px solid rgba(189,252,201,.5);border-radius:12px;cursor:pointer;transition:all .2s;background:linear-gradient(135deg,#f0fff0,#e0ffe0)}.checkbox-option:hover{border-color:#bdfcc9;background:linear-gradient(135deg,#e0ffe0,#d0ffd0);transform:scale(1.02)}.checkbox-option input[type=checkbox]{cursor:pointer;accent-color:#90EE90;width:20px;height:20px}select{width:100%;padding:12px;border:2px solid rgba(255,182,193,.4);border-radius:8px;font-family:inherit;font-size:1em;background:#fff;color:plum;cursor:pointer;transition:border-color .2s}select:focus{outline:none;border-color:#ffb6c1;box-shadow:0 0 0 3px #ffb6c11a}textarea{width:100%;padding:12px;border:2px solid rgba(255,182,193,.4);border-radius:8px;font-family:inherit;font-size:1em;resize:vertical;transition:border-color .2s;background:#fff;color:plum}textarea:focus{outline:none;border-color:#ffb6c1;box-shadow:0 0 0 3px #ffb6c11a}.btn-submit{background:linear-gradient(135deg,#ffb6c1,plum);color:#fff;border:none;padding:12px 30px;font-size:1em;border-radius:20px;cursor:pointer;font-weight:600;transition:transform .2s;box-shadow:0 4px 12px #ffb6c14d;font-family:Comfortaa,sans-serif}.btn-submit:hover{transform:translateY(-2px) scale(1.05);box-shadow:0 6px 16px #ffb6c166}.events-section{margin-top:40px}.events-section h2{color:#ffb6c1;margin-bottom:20px;font-family:Comfortaa,sans-serif}.loading{text-align:center;padding:40px;color:plum}.empty-state{text-align:center;padding:60px 20px;background:linear-gradient(135deg,#fff,#fff0f5);border-radius:20px;box-shadow:0 4px 12px #ffb6c133;border:2px solid rgba(255,182,193,.3)}.empty-icon{font-size:4em;margin-bottom:20px}.empty-state p{color:plum;font-size:1.1em}.events-list{display:flex;flex-direction:column;gap:15px}.event-card{background:linear-gradient(135deg,#fff,#fff0f5);border-radius:15px;padding:20px;box-shadow:0 2px 8px #ffb6c133;transition:transform .2s,box-shadow .2s;border-left:4px solid;border:2px solid rgba(255,182,193,.2)}.event-card:hover{transform:translate(5px) scale(1.02);box-shadow:0 4px 12px #ffb6c14d}.event-card.diaper{border-left-color:#bdfcc9;background:linear-gradient(135deg,#f0fff0,#e0ffe0)}.event-card.accident{border-left-color:#ffcccb;background:linear-gradient(135deg,#fff0f5,#ffe5e5)}.event-header{display:flex;align-items:center;gap:10px;margin-bottom:10px}.event-icon{font-size:1.5em}.event-type{flex:1;font-weight:600;color:#ffb6c1;font-size:1.1em;font-family:Comfortaa,sans-serif}.delete-btn{background:#ffcccb4d;color:#f99;border:none;width:30px;height:30px;border-radius:50%;cursor:pointer;font-size:1.5em;line-height:1;display:flex;align-items:center;justify-content:center;transition:background .2s}.delete-btn:hover{background:#ffcccb80;transform:scale(1.1)}.event-time{color:plum;font-size:.9em;margin-bottom:10px}.event-notes{color:#b0e0e6;font-style:italic;margin-top:10px;padding-top:10px;border-top:1px solid rgba(255,182,193,.3)}.woke-up-wet-badge{display:inline-block;background:linear-gradient(135deg,#ffe5b4,#ffdab9);color:#ff8c69;padding:4px 10px;border-radius:12px;font-size:.85em;font-weight:600;margin-left:8px;border:1px solid rgba(255,140,105,.3)}.accident-reason{color:#f99;font-size:.9em;font-style:italic;margin-top:5px}.diaper-wetness-info{margin-top:8px;padding:6px 12px;background:linear-gradient(135deg,#e0f6ff,#f0f8ff);border-radius:8px;border-left:3px solid #B0E0E6;color:#b0e0e6;font-size:.9em;font-weight:600}.diaper-type-info{color:#90ee90;font-size:.9em;font-weight:600;margin-top:5px}@media(max-width:768px){.header h1{font-size:2em}.stats-container{grid-template-columns:1fr}.radio-group{flex-direction:column}.radio-option{min-width:100%}}.calendar-view{background:linear-gradient(135deg,#fff,#fff0f5);border-radius:20px;padding:30px;margin-bottom:30px;box-shadow:0 4px 12px #ffb6c133;border:2px solid rgba(255,182,193,.3);width:100%;box-sizing:border-box;overflow-x:hidden}@media(max-width:768px){.calendar-view{padding:15px;margin-bottom:20px;border-radius:15px}}.calendar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}.calendar-header h2{margin:0;color:#ffb6c1;font-size:1.8em;font-family:Comfortaa,sans-serif}.calendar-nav-btn{background:linear-gradient(135deg,#ffb6c1,plum);color:#fff;border:none;width:40px;height:40px;border-radius:50%;cursor:pointer;font-size:1.2em;display:flex;align-items:center;justify-content:center;transition:transform .2s;box-shadow:0 2px 8px #ffb6c14d}.calendar-nav-btn:hover:not(:disabled){transform:scale(1.1);box-shadow:0 4px 12px #ffb6c166}.calendar-nav-btn:disabled{opacity:.5;cursor:not-allowed}.streak-banner{background:linear-gradient(135deg,#ffe5b4,#ffdab9);border:2px solid #FFCC99;border-radius:15px;padding:20px;margin-bottom:20px;display:flex;align-items:center;gap:15px;animation:pulse 2s ease-in-out infinite;box-shadow:0 4px 12px #ffcc994d}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}.streak-icon{font-size:2.5em}.streak-text{flex:1}.streak-text strong{display:block;font-size:1.3em;color:#ff8c69;margin-bottom:5px;font-family:Comfortaa,sans-serif}.streak-subtitle{display:block;color:#f96;font-size:1em}.calendar-stats{display:flex;gap:20px;margin-bottom:20px;padding:15px;background:linear-gradient(135deg,#f0f8ff,#e0f6ff);border-radius:12px;border:2px solid rgba(176,224,230,.3)}.calendar-stat{display:flex;flex-direction:column;align-items:center}.calendar-stat-number{font-size:2em;font-weight:700;color:#b0e0e6}.calendar-stat-label{font-size:.9em;color:plum;margin-top:5px}.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-bottom:20px;width:100%;box-sizing:border-box}@media(max-width:768px){.calendar-grid{gap:4px;margin-bottom:15px}}.calendar-day-header{text-align:center;font-weight:600;color:plum;padding:10px;font-size:.9em;font-family:Comfortaa,sans-serif}.calendar-day{aspect-ratio:1;border:2px solid rgba(255,182,193,.3);border-radius:12px;padding:8px;cursor:pointer;transition:all .2s;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(135deg,#fff,#fff0f5);min-width:0;box-sizing:border-box}@media(max-width:768px){.calendar-day{padding:4px;border-radius:8px;border-width:1.5px}}.calendar-day:hover{transform:translateY(-2px) scale(1.05);box-shadow:0 4px 12px #ffb6c14d;z-index:1}.calendar-day.empty{border:none;cursor:default;background:transparent}.calendar-day.empty:hover{transform:none;box-shadow:none}.calendar-day.good{background:linear-gradient(135deg,#f0fff0,#e0ffe0);border-color:#bdfcc9}.calendar-day.bad{background:linear-gradient(135deg,#fff0f5,#ffe5e5);border-color:#ffcccb}.calendar-day.today{border-color:#ffb6c1;border-width:3px;box-shadow:0 0 0 2px #ffb6c14d}.calendar-day-number{font-weight:600;font-size:1.1em;color:#ffb6c1;font-family:Comfortaa,sans-serif}.calendar-day.good .calendar-day-number{color:#90ee90}.calendar-day.bad .calendar-day-number{color:#f99}.calendar-day-icon{font-size:1.2em;margin-top:4px}.calendar-day.woke-up-wet{position:relative}.calendar-day.woke-up-wet:after{content:"🌙";position:absolute;top:4px;right:4px;font-size:.9em}.calendar-affirmation{position:absolute;top:-40px;left:50%;transform:translate(-50%);background:linear-gradient(135deg,#ffb6c1,plum);color:#fff;padding:8px 12px;border-radius:8px;font-size:.85em;white-space:nowrap;z-index:10;box-shadow:0 4px 12px #ffb6c166;font-family:Comfortaa,sans-serif}.calendar-affirmation:after{content:"";position:absolute;bottom:-6px;left:50%;transform:translate(-50%);border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid #DDA0DD}.calendar-legend{display:flex;justify-content:center;gap:30px;flex-wrap:wrap;padding-top:20px;border-top:2px solid rgba(255,182,193,.3)}.legend-item{display:flex;align-items:center;gap:8px;font-size:.9em;color:plum}.legend-color{width:20px;height:20px;border-radius:6px;border:2px solid}.legend-color.good{background:linear-gradient(135deg,#f0fff0,#e0ffe0);border-color:#bdfcc9}.legend-color.bad{background:linear-gradient(135deg,#fff0f5,#ffe5e5);border-color:#ffcccb}.legend-color.today{background:#fff;border-color:#ffb6c1;border-width:3px}.calendar-day-details{margin-top:30px;padding:25px;background:linear-gradient(135deg,#ffe5b4,#ffdab9);border-radius:15px;border:2px solid #FFCC99;box-shadow:0 4px 12px #ffcc994d}.calendar-day-details h3{margin:0 0 20px;color:#ff8c69;font-size:1.3em;font-family:Comfortaa,sans-serif}.day-affirmation-message{display:flex;align-items:center;gap:15px;padding:20px;background:#fff;border-radius:12px;margin-bottom:15px;box-shadow:0 2px 8px #ffb6c133;border:2px solid rgba(255,182,193,.3)}.affirmation-icon{font-size:2.5em}.affirmation-text{flex:1;font-size:1.3em;font-weight:600;color:#ff8c69;font-family:Comfortaa,sans-serif}.close-details{background:linear-gradient(135deg,#ffb6c1,plum);color:#fff;border:none;padding:10px 20px;border-radius:8px;cursor:pointer;font-weight:600;transition:background .2s;box-shadow:0 2px 8px #ffb6c14d;font-family:Comfortaa,sans-serif}.close-details:hover{transform:scale(1.05);box-shadow:0 4px 12px #ffb6c166}@media(max-width:768px){.calendar-header{margin-bottom:15px}.calendar-header h2{font-size:1.2em}.calendar-nav-btn{width:32px;height:32px;font-size:1em}.calendar-grid{gap:3px;margin-bottom:15px}.calendar-day-header{padding:6px 2px;font-size:.75em}.calendar-day{padding:3px;border-radius:6px;border-width:1.5px}.calendar-day-number{font-size:.85em}.calendar-day-icon{font-size:.9em}.calendar-legend{flex-direction:column;gap:10px;align-items:flex-start;font-size:.85em}.streak-banner{flex-direction:column;text-align:center;padding:15px}.streak-icon{font-size:2em}.streak-text strong{font-size:1.1em}.streak-subtitle{font-size:.9em}.calendar-stats{padding:10px;gap:10px}.calendar-stat-number{font-size:1.5em}.calendar-stat-label{font-size:.8em}.calendar-day-details{padding:15px}.calendar-day-details h3{font-size:1.1em}}.badges-container{background:linear-gradient(135deg,#fff,#fff0f5);border-radius:20px;padding:30px;margin-bottom:30px;box-shadow:0 4px 12px #ffb6c133;border:2px solid rgba(255,182,193,.3)}.badges-container h2{color:#ffb6c1;margin-bottom:20px;font-family:Comfortaa,sans-serif;text-align:center}.badges-progress{text-align:center;color:plum;margin-bottom:25px;font-size:1.1em;font-weight:600}.badges-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:20px}.badge-card{background:linear-gradient(135deg,#f0f8ff,#e0f6ff);border-radius:15px;padding:20px;text-align:center;position:relative;transition:all .3s;border:2px solid rgba(176,224,230,.3);min-height:180px;display:flex;flex-direction:column;align-items:center;justify-content:center}.badge-card.earned{background:linear-gradient(135deg,#f0fff0,#e0ffe0);border-color:#bdfcc9;box-shadow:0 4px 12px #bdfcc94d;animation:bounce .5s ease}.badge-card.locked{opacity:.6;background:linear-gradient(135deg,#f5f5f5,#e5e5e5);border-color:#c8c8c84d}.badge-card:hover{transform:translateY(-5px) scale(1.05);box-shadow:0 6px 16px #ffb6c166}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.badge-emoji{font-size:3em;margin-bottom:10px}.badge-name{font-weight:600;color:#ffb6c1;margin-bottom:5px;font-family:Comfortaa,sans-serif;font-size:1.1em}.badge-card.earned .badge-name{color:#90ee90}.badge-description{font-size:.85em;color:plum;margin-top:5px}.badge-card.earned .badge-description{color:#70c070}.badge-locked{position:absolute;top:10px;right:10px;font-size:1.5em;opacity:.5}.badge-check{position:absolute;top:10px;right:10px;background:#90ee90;color:#fff;width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.2em;box-shadow:0 2px 8px #90ee9066}@media(max-width:768px){.badges-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:15px}.badge-card{min-height:150px;padding:15px}.badge-emoji{font-size:2.5em}}.settings-container{background:linear-gradient(135deg,#fff,#fff0f5);border-radius:20px;padding:30px;margin-bottom:30px;box-shadow:0 4px 12px #ffb6c133;border:2px solid rgba(255,182,193,.3)}.settings-container h2{color:#ffb6c1;margin-bottom:25px;font-family:Comfortaa,sans-serif;text-align:center}.settings-group{margin-bottom:25px}.settings-label{display:block;color:plum;font-weight:600;margin-bottom:10px;font-family:Comfortaa,sans-serif}.settings-input{width:100%;padding:12px;border:2px solid rgba(255,182,193,.4);border-radius:8px;font-family:Comfortaa,sans-serif;font-size:1em;background:#fff;color:plum;transition:border-color .2s}.settings-input:focus{outline:none;border-color:#ffb6c1;box-shadow:0 0 0 3px #ffb6c11a}.settings-hint{color:#b0e0e6;font-size:.85em;margin-top:5px;font-style:italic}.settings-toggle{display:flex;align-items:center;gap:15px;cursor:pointer;padding:15px;background:linear-gradient(135deg,#f0f8ff,#e0f6ff);border-radius:12px;border:2px solid rgba(176,224,230,.3);transition:all .2s}.settings-toggle:hover{background:linear-gradient(135deg,#e0f6ff,#d0eeff);border-color:#b0e0e6}.settings-toggle input[type=checkbox]{width:50px;height:26px;appearance:none;background:#ffb6c14d;border-radius:13px;position:relative;cursor:pointer;transition:background .3s}.settings-toggle input[type=checkbox]:checked{background:linear-gradient(135deg,#ffb6c1,plum)}.settings-toggle input[type=checkbox]:before{content:"";position:absolute;width:22px;height:22px;border-radius:50%;background:#fff;top:2px;left:2px;transition:transform .3s;box-shadow:0 2px 4px #0003}.settings-toggle input[type=checkbox]:checked:before{transform:translate(24px)}.toggle-label{color:plum;font-weight:600;font-family:Comfortaa,sans-serif;font-size:1.1em}.share-settings-btn{width:100%;padding:15px;background:linear-gradient(135deg,#ffb6c1,plum);color:#fff;border:none;border-radius:12px;cursor:pointer;font-weight:600;font-size:1.1em;transition:all .2s;font-family:Comfortaa,sans-serif;box-shadow:0 4px 12px #ffb6c14d}.share-settings-btn:hover{transform:translateY(-2px);box-shadow:0 6px 16px #ffb6c166}.auth-button{display:flex;align-items:center;justify-content:center;gap:12px;background:#fff;color:#3c4043;border:1px solid #dadce0;border-radius:24px;padding:12px 24px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s;box-shadow:0 1px 3px #0000001a;font-family:Comfortaa,sans-serif}.auth-button:hover{box-shadow:0 2px 6px #00000026;background:#f8f9fa}.google-icon{width:20px;height:20px}.login-container{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;background:linear-gradient(135deg,#ffe5f1,#e0f6ff,#f0fff0)}.login-card{background:linear-gradient(135deg,#fff,#fff0f5);border-radius:25px;padding:50px 40px;max-width:450px;width:100%;box-shadow:0 8px 24px #ffb6c14d;border:2px solid rgba(255,182,193,.3);text-align:center}.login-header h1{font-size:2.5em;margin:0 0 15px;background:linear-gradient(135deg,#ffb6c1,plum,#b0e0e6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-family:Comfortaa,sans-serif}.login-subtitle{font-size:1.2em;color:#ffb6c1;margin:0 0 30px}.login-content{display:flex;flex-direction:column;align-items:center}.login-description{color:plum;margin-bottom:30px;line-height:1.6;font-size:1.05em;text-align:center}.login-hint{margin-top:25px;font-size:.9em;color:#b0e0e6;font-style:italic;text-align:center}.user-menu{position:relative}.user-menu-button{background:none;border:none;cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center;transition:transform .2s}.user-menu-button:hover{transform:scale(1.05)}.user-menu-button:active{transform:scale(.95)}.user-menu-avatar{width:40px;height:40px;border-radius:50%;border:2px solid rgba(255,182,193,.5);object-fit:cover}.user-menu-icon{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#ffb6c1,plum);display:flex;align-items:center;justify-content:center;font-size:1.5em;border:2px solid rgba(255,182,193,.5)}.user-menu-dropdown{position:absolute;top:calc(100% + 10px);right:0;background:linear-gradient(135deg,#fff,#fff0f5);border-radius:12px;box-shadow:0 4px 16px #00000026;border:2px solid rgba(255,182,193,.3);min-width:220px;z-index:1000;overflow:hidden}.user-menu-header{display:flex;align-items:center;gap:12px;padding:16px;background:linear-gradient(135deg,#ffb6c11a,#dda0dd1a)}.user-menu-dropdown-avatar{width:48px;height:48px;border-radius:50%;border:2px solid rgba(255,182,193,.5);object-fit:cover}.user-menu-info{flex:1;min-width:0}.user-menu-name{font-weight:600;color:#ffb6c1;font-size:.95em;font-family:Comfortaa,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:4px}.user-menu-email{font-size:.8em;color:plum;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-menu-divider{height:1px;background:#ffb6c133;margin:4px 0}.user-menu-item{width:100%;display:flex;align-items:center;gap:12px;padding:12px 16px;background:none;border:none;cursor:pointer;font-family:Comfortaa,sans-serif;font-size:.95em;color:plum;text-align:left;transition:background .2s}.user-menu-item:hover{background:#ffb6c11a}.user-menu-item-icon{font-size:1.2em;width:24px;text-align:center}@media(max-width:768px){.user-menu-avatar,.user-menu-icon{width:36px;height:36px}.user-menu-dropdown{min-width:200px;right:-10px}.user-menu-header{padding:12px}.user-menu-dropdown-avatar{width:40px;height:40px}}.share-modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.share-modal{background:linear-gradient(135deg,#fff,#fff0f5);border-radius:20px;padding:30px;max-width:500px;width:100%;box-shadow:0 8px 24px #0000004d;border:2px solid rgba(255,182,193,.3)}.share-modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.share-modal-header h2{margin:0;color:#ffb6c1;font-family:Comfortaa,sans-serif}.close-modal{background:#ffcccb4d;border:none;width:30px;height:30px;border-radius:50%;cursor:pointer;font-size:1.5em;color:#f99;display:flex;align-items:center;justify-content:center;transition:all .2s}.close-modal:hover{background:#ffcccb80;transform:scale(1.1)}.share-description{color:plum;margin-bottom:25px;line-height:1.6}.share-url-container{display:flex;gap:10px;margin-bottom:20px}.share-url-input{flex:1;padding:12px;border:2px solid rgba(255,182,193,.4);border-radius:8px;font-family:monospace;font-size:.9em;background:#fff;color:plum}.copy-btn{padding:12px 20px;background:linear-gradient(135deg,#ffb6c1,plum);color:#fff;border:none;border-radius:8px;cursor:pointer;font-weight:600;transition:all .2s;white-space:nowrap;font-family:Comfortaa,sans-serif}.copy-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #ffb6c166}.copy-btn.copied{background:linear-gradient(135deg,#bdfcc9,#90ee90)}.share-actions{display:flex;gap:10px;flex-wrap:wrap}.share-action-btn{flex:1;min-width:150px;padding:12px 20px;background:linear-gradient(135deg,#b0e0e6,#add8e6);color:#fff;border:none;border-radius:8px;cursor:pointer;font-weight:600;transition:all .2s;font-family:Comfortaa,sans-serif}.share-action-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #b0e0e666}.share-action-btn:disabled{opacity:.6;cursor:not-allowed}.share-action-btn.revoke{background:linear-gradient(135deg,#ffcccb,#f99)}.generate-btn{width:100%;padding:15px;background:linear-gradient(135deg,#ffb6c1,plum);color:#fff;border:none;border-radius:12px;cursor:pointer;font-weight:600;font-size:1.1em;transition:all .2s;font-family:Comfortaa,sans-serif}.generate-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 16px #ffb6c166}.generate-btn:disabled{opacity:.6;cursor:not-allowed}@media(max-width:768px){.share-modal-overlay{padding:10px}.share-modal{padding:20px;max-width:100%}.share-modal-header h2{font-size:1.3em}.share-description{font-size:.9em;margin-bottom:20px}.share-url-container{flex-direction:column;gap:8px}.share-url-input{font-size:.8em;padding:10px;width:100%}.copy-btn{width:100%;padding:10px 16px;font-size:.85em}.share-actions{flex-direction:column}.share-action-btn{width:100%;min-width:0;padding:10px 16px;font-size:.9em}.generate-btn{padding:12px;font-size:1em}}.shared-view-container{max-width:900px;margin:0 auto;padding:20px;min-height:100vh}.shared-header{text-align:center;margin-bottom:30px;padding:30px 0}.shared-header h1{font-size:2.5em;margin:0;background:linear-gradient(135deg,#ffb6c1,plum,#b0e0e6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-family:Comfortaa,sans-serif}.shared-subtitle{font-size:1.2em;color:#ffb6c1;margin-top:10px}.shared-note{background:linear-gradient(135deg,#e0f6ff,#f0f8ff);border:2px solid rgba(176,224,230,.5);border-radius:15px;padding:15px 20px;margin-bottom:30px;text-align:center}.shared-note p{margin:0;color:#b0e0e6;font-weight:600}.loading-message,.error-message{text-align:center;padding:60px 20px;background:linear-gradient(135deg,#fff,#fff0f5);border-radius:20px;box-shadow:0 4px 12px #ffb6c133;border:2px solid rgba(255,182,193,.3)}.error-icon{font-size:4em;margin-bottom:20px}.error-message h2{color:#ffb6c1;margin-bottom:15px;font-family:Comfortaa,sans-serif}.error-message p{color:plum}.loading-message{color:plum;font-size:1.2em}.shared-view-toggle{display:flex;gap:10px;justify-content:center;margin-bottom:25px;background:linear-gradient(135deg,#fff,#fff0f5);padding:5px;border-radius:12px;box-shadow:0 2px 8px #ffb6c133;border:2px solid rgba(255,182,193,.3)}.shared-view-btn{padding:10px 20px;border:none;background:transparent;border-radius:8px;cursor:pointer;font-weight:600;color:plum;transition:all .2s;font-family:Comfortaa,sans-serif}.shared-view-btn:hover{background:#ffb6c11a;color:#ffb6c1}.shared-view-btn.active{background:linear-gradient(135deg,#ffb6c1,plum);color:#fff;box-shadow:0 2px 8px #ffb6c166}@media(max-width:768px){.shared-view-toggle{gap:5px;padding:4px}.shared-view-btn{padding:8px 16px;font-size:.9em;flex:1}}
