.search-box{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:12px;background:#f3f4f6;width:300px;transition:background .2s ease}.search-box:hover{background:#e5e7eb}.search-input{flex:1;border:none;outline:none;background:transparent;color:#374151;font-size:14px;padding:4px 0}.search-input::placeholder{color:#6b7280}.icon{width:18px;height:18px;color:#6b7280;flex-shrink:0}.shortcut{margin-left:auto;padding:2px 6px;font-size:12px;font-family:monospace;color:#6b7280;background:#e5e7eb;border-radius:4px;line-height:1}.search-button{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:12px;background:#f3f4f6;width:300px;transition:background .2s ease;cursor:pointer;border:none}.search-button:hover{background:#e5e7eb}.placeholder-text{color:#4b5563;font-size:14px;flex:1;text-align:left}.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.4);display:flex;align-items:flex-start;justify-content:center;padding:16px;z-index:50}.modal-content{width:100%;max-width:600px;background:#fff;border-radius:16px;box-shadow:0 4px 20px rgba(0,0,0,.15);padding:16px;animation:fadeIn .2s ease}.modal-input-wrapper{display:flex;align-items:center;gap:8px;border:1px solid #d1d5db;border-radius:12px;padding:8px 12px}.modal-input-wrapper .search-input{flex:1;font-size:14px;padding:4px 0}.close-btn{border:none;background:transparent;cursor:pointer;color:#9ca3af;transition:color .2s ease;display:flex;align-items:center;justify-content:center}.close-btn:hover{color:#4b5563}.close-btn .icon{width:20px;height:20px}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}