body{color:#333;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f5f7fa;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;line-height:1.6}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#f1f1f1}::-webkit-scrollbar-thumb{background:#667eea;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#764ba2}.login-container{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex}.login-card{background:#fff;border-radius:15px;width:100%;max-width:400px;overflow:hidden;box-shadow:0 20px 60px #0000004d}.login-header{color:#fff;text-align:center;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);padding:40px 20px}.login-header h1{margin:0 0 10px;font-size:2.5em}.login-header p{opacity:.9;margin:0;font-size:.95em}.login-form{padding:40px}.form-group{margin-bottom:20px}.form-group label{color:#333;margin-bottom:8px;font-size:.95em;font-weight:600;display:block}.form-group input{box-sizing:border-box;border:2px solid #e0e0e0;border-radius:8px;width:100%;padding:12px;font-size:1em;transition:all .3s}.form-group input:focus{border-color:#667eea;outline:none;box-shadow:0 0 0 3px #667eea1a}.form-group input:disabled{cursor:not-allowed;background-color:#f5f5f5}.error-message{color:#c33;background-color:#fee;border-left:4px solid #c33;border-radius:8px;margin-bottom:20px;padding:12px;font-size:.9em}.submit-button{color:#fff;cursor:pointer;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border:none;border-radius:8px;width:100%;margin-top:10px;padding:12px;font-size:1em;font-weight:600;transition:all .3s}.toggle-section{text-align:center;border-top:1px solid #e0e0e0;margin-top:20px;padding:0 40px 30px}.toggle-section p{color:#666;margin:0;font-size:.95em}.toggle-button{color:#667eea;cursor:pointer;background:0 0;border:none;font-weight:600;text-decoration:underline;transition:color .3s}.toggle-button:hover:not(:disabled){color:#764ba2}.toggle-button:disabled{cursor:not-allowed;opacity:.7}.note-form-container{background:#fff;border-radius:12px;margin-bottom:30px;padding:30px;box-shadow:0 4px 15px #0000001a}.form-header{border-bottom:2px solid #f0f0f0;margin-bottom:25px;padding-bottom:15px}.form-header h2{color:#333;margin:0 0 5px;font-size:1.6em}.form-header p{color:#999;margin:0;font-size:.95em}.note-form{flex-direction:column;gap:20px;display:flex}.form-group{flex-direction:column;gap:8px;display:flex}.form-group label{color:#333;font-size:.95em;font-weight:600}.form-group input[type=text],.form-group textarea{resize:vertical;border:2px solid #e0e0e0;border-radius:8px;padding:12px;font-family:inherit;font-size:1em;transition:all .3s}.form-group input[type=text]:focus,.form-group textarea:focus{border-color:#667eea;outline:none;box-shadow:0 0 0 3px #667eea1a}.form-group input:disabled,.form-group textarea:disabled{cursor:not-allowed;background-color:#f5f5f5}.mood-selector{flex-wrap:wrap;gap:10px;display:flex}.mood-button{cursor:pointer;background:#fff;border:2px solid #e0e0e0;border-radius:10px;flex-direction:column;flex:1;align-items:center;gap:5px;min-width:100px;padding:12px 16px;transition:all .3s;display:flex}.mood-button:hover:not(:disabled){background:#f8f9ff;border-color:#667eea}.mood-button.active{background:linear-gradient(135deg,#667eea1a 0%,#764ba21a 100%);border-color:#667eea;box-shadow:0 4px 12px #667eea33}.auto-detect-toggle{background:#f0f4ff;border-radius:8px;align-items:center;gap:8px;margin-bottom:12px;padding:10px;font-size:.9em;display:flex}.auto-detect-toggle input[type=checkbox]{cursor:pointer;width:18px;height:18px}.auto-detect-toggle label{cursor:pointer;color:#667eea;margin:0;font-weight:500}.detected-mood{margin-left:auto;font-size:1.2em;animation:.3s fadeIn}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.mood-button:disabled{cursor:not-allowed;opacity:.6}.mood-emoji{font-size:1.8em}.mood-label{color:#666;font-size:.8em;font-weight:500}.error-message{color:#c33;background-color:#fee;border-left:4px solid #c33;border-radius:8px;padding:12px;font-size:.9em}.submit-button{color:#fff;cursor:pointer;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border:none;border-radius:8px;padding:14px 20px;font-size:1em;font-weight:600;transition:all .3s}.submit-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 20px #667eea4d}.submit-button:disabled{opacity:.7;cursor:not-allowed}.note-card{background:#fff;border-left:4px solid #667eea;border-radius:12px;margin-bottom:20px;transition:all .3s;overflow:hidden;box-shadow:0 2px 8px #00000014}.note-card:hover{transform:translateY(-4px);box-shadow:0 8px 20px #0000001f}.note-mood-bar{width:100%;transition:all .3s}.note-content{padding:20px}.note-header{justify-content:space-between;align-items:flex-start;gap:15px;margin-bottom:12px;display:flex}.note-title-section{flex:1;align-items:center;gap:10px;display:flex}.note-title{color:#333;margin:0;font-size:1.3em;font-weight:600}.note-emoji{font-size:1.5em}.note-mood-label{white-space:nowrap;background:#f0f0f0;border-radius:6px;padding:4px 8px;font-size:.85em;font-weight:600}.note-meta{color:#666;flex-wrap:wrap;align-items:center;gap:15px;margin-bottom:15px;font-size:.9em;display:flex}.note-date,.note-time{align-items:center;gap:4px;display:flex}.mood-indicator{border-radius:3px;flex:1;justify-content:center;align-items:center;min-width:80px;height:6px;display:flex;position:relative}.mood-level{color:#333;background:#fff;border-radius:2px;padding:0 4px;font-size:.7em;font-weight:600;position:absolute}.note-body{color:#555;word-wrap:break-word;white-space:pre-wrap;margin:0;font-size:.95em;line-height:1.6}@media (width<=600px){.note-header{flex-direction:column;align-items:flex-start}.note-mood-label{align-self:flex-start}.note-meta{flex-direction:column;gap:8px;font-size:.85em}.note-title{font-size:1.1em}}.diary-page{background:linear-gradient(135deg,#f5f7fa 0%,#c3cfe2 100%);min-height:100vh}.diary-header{color:#fff;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);padding:40px 20px;box-shadow:0 4px 20px #667eea4d}.header-content{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:30px;max-width:1200px;margin:0 auto;display:flex}.header-title h1{margin:0;font-size:2.2em;font-weight:700}.header-title p{opacity:.95;margin:5px 0 0;font-size:.95em}.header-stats{gap:30px;display:flex}.stat{flex-direction:column;align-items:center;gap:5px;display:flex}.stat-value{font-size:1.8em;font-weight:700}.stat-label{opacity:.9;font-size:.85em}.header-actions{align-items:center;gap:15px;display:flex}.user-email{opacity:.95;word-break:break-word;font-size:.95em}.logout-btn{color:#fff;cursor:pointer;white-space:nowrap;background:#fff3;border:2px solid #ffffff80;border-radius:6px;padding:10px 20px;font-size:.95em;font-weight:600;transition:all .3s}.logout-btn:hover{background:#ffffff4d;border-color:#fff}.diary-main{padding:40px 20px}.diary-container{max-width:900px;margin:0 auto}.notes-section{margin-top:40px}.section-header{justify-content:space-between;align-items:center;gap:15px;margin-bottom:25px;display:flex}.section-header h2{color:#333;margin:0;font-size:1.6em}.note-count{color:#fff;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-radius:20px;padding:6px 14px;font-size:.85em;font-weight:600}.notes-list{flex-direction:column;gap:15px;display:flex}.empty-state{text-align:center;background:#fff;border-radius:12px;padding:60px 30px;box-shadow:0 4px 15px #0000001a}.empty-icon{margin-bottom:20px;font-size:4em}.empty-state h3{color:#333;margin:0 0 10px;font-size:1.3em}.empty-state p{color:#999;margin:0;font-size:.95em}@media (width<=900px){.header-content{flex-direction:column;align-items:flex-start}.header-stats{justify-content:flex-start;width:100%}.header-actions{justify-content:space-between;width:100%}.logout-btn{text-align:center;flex:1}.header-title h1{font-size:1.8em}.section-header{flex-direction:column;align-items:flex-start}}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{width:100%;height:100%}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#f5f7fa;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}#root{flex-direction:column;display:flex}