:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;color:#ffffffde;background-color:#1a1a2e;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-width:320px;min-height:100vh}#root{min-height:100vh}*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;background-color:#1a1a2e;color:#fff;min-height:100vh}.app{min-height:100vh;display:flex;flex-direction:column}.header{background-color:#16213e;padding:20px 40px;border-bottom:1px solid #0f3460}.header h1{font-size:28px;margin-bottom:5px;color:#e94560}.header p{color:#9ca3af;font-size:14px}.version{color:#6b7280;font-size:12px;margin-left:8px}.main{flex:1;padding:20px 40px}.toolbar{display:flex;align-items:center;gap:20px;margin-bottom:20px}.btn{padding:10px 20px;border:none;border-radius:8px;cursor:pointer;font-size:14px;font-weight:600;transition:all .2s}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-primary{background-color:#4a90d9;color:#fff}.btn-primary:hover:not(:disabled){background-color:#3a7bc8}.btn-danger{background-color:#e94560;color:#fff;margin-top:20px}.btn-danger:hover:not(:disabled){background-color:#d63850}.comment-count{color:#9ca3af;font-size:14px}.error{background-color:#dc3545;color:#fff;padding:12px 20px;border-radius:8px;margin-bottom:20px}.content{display:grid;grid-template-columns:1fr 1fr;gap:20px;height:calc(100vh - 200px)}.comment-list,.comment-detail{background-color:#16213e;border-radius:12px;padding:20px;overflow-y:auto}.comment-list h2,.comment-detail h2{font-size:18px;margin-bottom:15px;color:#e94560;border-bottom:1px solid #0f3460;padding-bottom:10px}.no-comments,.no-selection{color:#6b7280;text-align:center;padding:40px}.comment-item{background-color:#0f3460;border-radius:8px;padding:15px;margin-bottom:10px;cursor:pointer;transition:all .2s;border:2px solid transparent}.comment-item:hover{background-color:#1a4a7a}.comment-item.selected{border-color:#e94560}.comment-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.file-name{font-weight:600;color:#4a90d9;font-size:13px}.date{color:#9ca3af;font-size:12px}.comment-preview{color:#d1d5db;font-size:14px;line-height:1.4}.detail-content{padding:10px 0}.detail-row{margin-bottom:15px}.detail-row label{display:block;color:#9ca3af;font-size:12px;margin-bottom:4px;text-transform:uppercase;letter-spacing:1px}.detail-row span{color:#fff;font-size:14px}.comment-full-content{background-color:#0f3460;border-radius:8px;padding:15px;color:#d1d5db;font-size:14px;line-height:1.6;white-space:pre-wrap;word-break:break-word;max-height:300px;overflow-y:auto;margin-bottom:15px}.has-image-badge{margin-right:6px}.comment-image-container{background-color:#0f3460;border-radius:8px;padding:10px;margin-bottom:15px}.comment-image{max-width:100%;max-height:400px;border-radius:6px;display:block;margin:0 auto}.login-container{flex:1;display:flex;align-items:center;justify-content:center;padding:20px}.login-box{background-color:#16213e;border-radius:16px;padding:40px;text-align:center;max-width:400px;width:100%}.login-box h1{font-size:28px;margin-bottom:10px;color:#e94560}.login-box p{color:#9ca3af;margin-bottom:30px}.login-error{background-color:#dc3545;color:#fff;padding:12px 20px;border-radius:8px;margin-bottom:20px;font-size:14px}.google-btn-wrapper{display:flex;justify-content:center}.header-content{display:flex;justify-content:space-between;align-items:center}.user-info{display:flex;align-items:center;gap:12px}.user-avatar{width:36px;height:36px;border-radius:50%}.user-name{color:#d1d5db;font-size:14px}.btn-logout{background-color:transparent;color:#9ca3af;border:1px solid #9ca3af;padding:8px 16px}.btn-logout:hover{background-color:#ffffff1a;color:#fff;border-color:#fff}@media (max-width: 768px){.content{grid-template-columns:1fr}.header,.main{padding:15px 20px}.header-content{flex-direction:column;gap:15px}.user-info{width:100%;justify-content:center}}