*,*:before,*:after{box-sizing:border-box}body{margin:0;font-family:system-ui,sans-serif}.api-key-gate{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#f5f5f5}.api-key-gate__box{background:#fff;border:1px solid #ddd;border-radius:8px;padding:2rem;width:360px;display:flex;flex-direction:column;gap:.75rem}.api-key-gate__box h1{margin:0;font-size:1.25rem}.api-key-gate__box p{margin:0;color:#555}.api-key-gate__box input{padding:.5rem .75rem;border:1px solid #ccc;border-radius:4px;font-size:1rem;width:100%}.api-key-gate__box button{padding:.5rem 1rem;background:#0070f3;color:#fff;border:none;border-radius:4px;font-size:1rem;cursor:pointer}.api-key-gate__box button:disabled{background:#999;cursor:not-allowed}.api-key-gate__error{margin:0;color:#c00;font-size:.875rem}.app-header{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;border-bottom:1px solid #ddd}.change-key-link{background:none;border:none;color:#0070f3;cursor:pointer;font-size:.875rem;text-decoration:underline;padding:0}.result-list{display:flex;flex-direction:column;gap:.5rem;padding:1rem}.result-card{border:1px solid #e0e0e0;border-radius:6px;padding:.75rem 1rem;cursor:pointer;background:#fff;display:flex;flex-direction:column;gap:.375rem}.result-card:hover{background:#f8f9fa;border-color:#bbb}.result-card:focus{outline:2px solid #0070f3;outline-offset:1px}.result-card__header{display:flex;align-items:center;gap:.5rem}.result-card__subject{font-weight:600;font-size:.9375rem;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.result-card__attachment{font-size:1rem;flex-shrink:0}.result-card__meta{display:flex;align-items:center;gap:.75rem;font-size:.8125rem;color:#555;flex-wrap:wrap}.result-card__sender{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.result-card__date{white-space:nowrap;flex-shrink:0}.tier{display:inline-block;padding:.125rem .5rem;border-radius:999px;font-size:.75rem;font-weight:600;flex-shrink:0}.tier-internal{background:#dbeafe;color:#1d4ed8}.tier-business{background:#dcfce7;color:#16a34a}.tier-personal{background:#fef9c3;color:#854d0e}.tier-newsletter{background:#f3f4f6;color:#6b7280}.tier-junk{background:#fee2e2;color:#dc2626}.result-card__categories{display:flex;flex-wrap:wrap;gap:.375rem}.category-pill{display:inline-block;padding:.125rem .5rem;border-radius:999px;font-size:.75rem;background:#e0e7ff;color:#3730a3}.result-card__snippet{font-size:.8125rem;color:#444;line-height:1.5}.result-card__snippet mark{background:#fef08a;color:inherit;border-radius:2px;padding:0 1px}.app-layout{display:flex;flex-direction:column;min-height:100vh}.app-body{flex:1;position:relative}.app-main{min-height:100%}.email-detail-panel{position:fixed;top:0;right:0;bottom:0;width:40%;background:#fff;border-left:1px solid #ddd;box-shadow:-4px 0 12px #0000001a;display:flex;flex-direction:column;z-index:100;overflow:hidden}.email-detail-panel__header{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;border-bottom:1px solid #ddd;flex-shrink:0;gap:.5rem}.email-detail-panel__title{margin:0;font-size:1rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}.email-detail-panel__close{padding:.25rem .75rem;background:none;border:1px solid #ccc;border-radius:4px;cursor:pointer;font-size:.875rem;flex-shrink:0}.email-detail-panel__close:hover{background:#f5f5f5}.email-detail-panel__body{flex:1;overflow-y:auto;padding:1rem}.email-detail__loading{color:#555;margin:0}.email-detail__error{color:#c00;font-size:.875rem;margin:0}.email-detail__meta{display:flex;flex-direction:column;gap:.375rem;font-size:.875rem;margin-bottom:1rem;padding-bottom:1rem;border-bottom:1px solid #eee}.email-detail__body{font-family:monospace;font-size:.8125rem;line-height:1.6;white-space:pre-wrap;word-break:break-word;background:#f9f9f9;border:1px solid #eee;border-radius:4px;padding:.75rem;margin:0 0 1rem}.email-detail__attachments h3{font-size:.9375rem;margin:0 0 .5rem}.email-detail__no-attachments{font-size:.875rem;color:#888;margin:0}.email-detail__attachment-list{display:flex;flex-direction:column;gap:.375rem}.email-detail__attachment-row{display:flex;gap:.75rem;font-size:.8125rem;padding:.375rem .5rem;border:1px solid #eee;border-radius:4px;background:#f9f9f9;flex-wrap:wrap}.email-detail__attachment-filename{font-weight:500;flex:1}.email-detail__attachment-type{color:#666}.email-detail__attachment-size{color:#555;white-space:nowrap}.email-detail__attachment-status{color:#555}.filter-panel{margin:0 1rem 4px}.filter-toggle{background:none;border:1px solid #ccc;border-radius:4px;padding:4px 12px;cursor:pointer;font-size:.875rem;color:#555}.filter-toggle:hover{background:#f5f5f5}.filter-body{display:flex;flex-wrap:wrap;gap:16px;padding:12px;border:1px solid #eee;border-top:none;border-radius:0 0 4px 4px;background:#fafafa}.filter-group{display:flex;flex-direction:column;gap:4px;border:none;padding:0;margin:0;min-width:120px}.filter-group legend,.filter-label{font-weight:600;font-size:.8rem;color:#444;margin-bottom:4px;display:block}.filter-checkbox-label{display:flex;align-items:center;gap:6px;font-size:.85rem;cursor:pointer}.filter-input{border:1px solid #ccc;border-radius:4px;padding:4px 8px;font-size:.875rem}.filter-date-range{display:flex;align-items:center;gap:8px}.filter-category-list{display:flex;flex-direction:column;gap:4px;max-height:150px;overflow-y:auto}.filter-empty{font-size:.8rem;color:#999;font-style:italic}.filter-chips{display:flex;flex-wrap:wrap;gap:6px;padding:4px 1rem 8px}.chip{display:inline-flex;align-items:center;gap:4px;background:#e8f0fe;border:1px solid #b3c4fd;border-radius:16px;padding:2px 8px;font-size:.8rem;color:#1a56db}.chip-dismiss{background:none;border:none;cursor:pointer;font-size:1rem;line-height:1;color:#1a56db;padding:0;margin-left:2px}.chip-dismiss:hover{color:#0d30a6}.error-banner{display:flex;align-items:center;gap:.5rem;padding:.75rem 1rem;background:#fef2f2;border-bottom:1px solid #fca5a5;color:#991b1b;font-size:.875rem}.error-banner__icon{font-size:1rem;flex-shrink:0}.error-banner__message{flex:1}.error-banner__dismiss{background:none;border:none;cursor:pointer;font-size:1.25rem;line-height:1;color:#991b1b;padding:0;flex-shrink:0}.error-banner__dismiss:hover{color:#7f1d1d}