:root{--c-primary: #cc0000;--c-primary-dark: #990000;--c-primary-light: #fde8e8;--c-success: #107c10;--c-success-bg: #dff6dd;--c-warning: #8a6914;--c-warning-bg: #fff4ce;--c-error: #a4262c;--c-error-bg: #fde7e9;--c-bg: #f3f2f1;--c-surface: #ffffff;--c-border: #e1dfdd;--c-text: #201f1e;--c-muted: #605e5c;--c-hover: #f8f7f6;--radius-sm: 3px;--radius: 6px;--radius-lg: 10px;--shadow: 0 2px 8px rgba(0, 0, 0, .08);--shadow-lg: 0 4px 20px rgba(0, 0, 0, .12);--font: "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font);background:var(--c-bg);color:var(--c-text);font-size:14px;line-height:1.5;min-height:100vh}.app{display:flex;flex-direction:column;min-height:90vh}.app-footer{margin-top:auto;padding:.75rem 1rem;text-align:center;font-size:.72rem;color:var(--c-muted);letter-spacing:.02em}.app-header{background:linear-gradient(135deg,#b50000 0%,var(--c-primary) 60%,#e02020 100%);color:#fff;padding:.625rem 1.5rem;box-shadow:0 2px 8px #00000040;position:sticky;top:0;z-index:10}.app-header-inner{display:flex;align-items:center;gap:.75rem;max-width:960px;margin:0 auto;width:100%}.app-header-icon{display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;background:#ffffff26;border-radius:var(--radius);flex-shrink:0}.app-header-home{display:inline-flex;align-items:center;justify-content:center;color:inherit;text-decoration:none}.app-header-titles{display:flex;flex-direction:column;gap:0;line-height:1.2}.app-header h1{font-size:1.0625rem;font-weight:700;letter-spacing:.01em}.app-header-sub{font-size:.75rem;opacity:.7;font-weight:400;letter-spacing:.02em}.app-nav{display:flex;gap:.25rem;flex-wrap:wrap}.app-nav-wrap{max-width:960px;margin:.5rem auto 0;width:100%}.nav-btn{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#ffffffd9;text-decoration:none;padding:.3rem .85rem;border-radius:var(--radius);font-size:.8125rem;font-family:var(--font);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.4rem;transition:background .12s,border-color .12s,box-shadow .12s;white-space:nowrap;font-weight:600}.nav-btn:hover{background:#fff3;color:#fff}.nav-btn.active{background:#ffffff40;color:#fff;font-weight:600;border-color:#fff6}.header-user{display:flex;align-items:center;gap:.5rem;margin-left:auto}.user-avatar{display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;background:#ffffff40;border-radius:50%;font-size:.8125rem;font-weight:700;flex-shrink:0;color:#fff;border:1.5px solid rgba(255,255,255,.4)}.header-user-name{font-size:.8125rem;opacity:.9;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.app-main{flex:1;padding:1.5rem 1rem;max-width:960px;margin:0 auto;width:100%}.card{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:1.25rem;margin-bottom:1rem}.card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem;gap:.75rem}.card-title{font-size:1rem;font-weight:600}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.5rem 1.125rem;border-radius:var(--radius);font-size:.875rem;font-family:var(--font);font-weight:600;line-height:1.4;cursor:pointer;border:1px solid transparent;transition:background .12s,border-color .12s,box-shadow .12s;text-decoration:none;white-space:nowrap;-webkit-user-select:none;user-select:none}.btn:disabled{opacity:.5;cursor:not-allowed}.btn:focus-visible{outline:2px solid var(--c-primary);outline-offset:2px}.btn-primary{background:var(--c-primary);color:#fff;border-color:var(--c-primary)}.btn-primary:hover:not(:disabled){background:var(--c-primary-dark);border-color:var(--c-primary-dark)}.btn-secondary{background:var(--c-surface);color:var(--c-text);border-color:var(--c-border)}.btn-secondary:hover:not(:disabled){background:var(--c-hover)}.btn-ghost{background:transparent;color:var(--c-muted);border-color:transparent}.btn-ghost:hover:not(:disabled){background:var(--c-hover);color:var(--c-text)}.header-user .btn-ghost{color:#ffffffd9}.header-user .btn-ghost:hover:not(:disabled){background:#ffffff26;color:#fff}.btn-danger{background:var(--c-surface);color:var(--c-error);border-color:var(--c-error)}.btn-danger:hover:not(:disabled){background:var(--c-error-bg)}.btn-sm{padding:.3125rem .75rem;font-size:.8125rem}.btn-ms{background:#fff;color:#1a1a1a;border-color:#d1d1d1;min-width:220px;width:100%}.btn-ms:hover:not(:disabled){background:#f5f5f5}.form-group{display:flex;flex-direction:column;gap:.3rem;margin-bottom:.875rem}.form-label{font-size:.8125rem;font-weight:500;color:var(--c-text)}.form-input,.form-textarea,.form-select{padding:.4375rem .625rem;border:1px solid var(--c-border);border-radius:var(--radius);font-size:.8125rem;font-family:var(--font);color:var(--c-text);background:var(--c-surface);transition:border-color .15s;width:100%;height:2.25rem;box-sizing:border-box}.form-input:focus,.form-textarea:focus,.form-select:focus{outline:none;border-color:var(--c-primary);box-shadow:0 0 0 2px var(--c-primary-light)}.form-textarea{resize:vertical;min-height:80px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.alert{padding:.625rem .875rem;border-radius:var(--radius);font-size:.875rem;margin-bottom:1rem;text-align:left}.alert-error{background:var(--c-error-bg);color:var(--c-error);border:1px solid #f1c1c3}.alert-success{background:var(--c-success-bg);color:var(--c-success);border-color:#9fd89f}.alert-warning{background:var(--c-warning-bg);color:var(--c-warning);border-color:#f3d786}.spinner{display:inline-block;width:.9em;height:.9em;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .65s linear infinite;flex-shrink:0}@keyframes spin{to{transform:rotate(360deg)}}.badge{display:inline-flex;align-items:center;padding:.15rem .5rem;border-radius:999px;font-size:.6875rem;font-weight:600;white-space:nowrap}.badge-success{background:var(--c-success-bg);color:var(--c-success)}.badge-warning{background:var(--c-warning-bg);color:var(--c-warning)}.badge-error{background:var(--c-error-bg);color:var(--c-error)}.badge-neutral{background:var(--c-hover);color:var(--c-muted)}.badge-info{background:#e8f1fb;color:#1d4f91}.badge-mailcontact{background:#fdf1d8;color:#8a5a00}.table-wrap{overflow-x:auto;border:1px solid var(--c-border);border-radius:var(--radius)}table{width:100%;border-collapse:collapse;font-size:.8125rem}thead th{background:var(--c-hover);padding:.5rem .75rem;text-align:left;font-weight:600;font-size:.75rem;color:var(--c-muted);border-bottom:1px solid var(--c-border);white-space:nowrap}tbody td{padding:.5rem .75rem;border-bottom:1px solid var(--c-border);vertical-align:middle}tbody tr:last-child td{border-bottom:none}tbody tr:hover{background:var(--c-hover)}.td-actions{text-align:right;white-space:nowrap}.contacts-table{font-size:.78125rem}.contacts-table thead th,.contacts-table tbody td{padding:.4375rem .625rem}.contacts-summary-card{padding:1rem 1.125rem}.contacts-summary-top{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:.75rem}.contacts-summary-title{font-size:.95rem;font-weight:700;margin-bottom:.2rem}.contacts-summary-meta{display:flex;flex-direction:column;gap:.4rem}.contacts-summary-row{display:flex;gap:.75rem;align-items:flex-start;font-size:.875rem;color:var(--c-muted)}.contacts-summary-label{min-width:7.25rem;font-weight:600;color:var(--c-text);flex-shrink:0}.contacts-sync-badge{display:inline-flex;align-items:center;gap:.45rem;padding:.4rem .75rem;border-radius:999px;background:var(--c-hover);border:1px solid var(--c-border);color:var(--c-muted);font-size:.8125rem;font-weight:600;white-space:nowrap}.contacts-sync-badge.is-running{background:var(--c-warning-bg);border-color:#f0d88a;color:var(--c-warning)}.import-drop-card{padding:1.25rem}.import-dropzone{border:2px dashed #d0d0d0;border-radius:var(--radius-lg);background:linear-gradient(180deg,#faf9f8,#f5f3f2);padding:2rem 1.25rem;text-align:center;cursor:pointer;transition:border-color .12s,background .12s,transform .12s}.import-dropzone:hover{border-color:var(--c-primary);background:#fff7f7}.import-dropzone:focus-visible{outline:2px solid var(--c-primary);outline-offset:2px}.import-dropzone.is-busy{cursor:progress;opacity:.85}.import-drop-icon{display:inline-flex;align-items:center;justify-content:center;min-width:3.5rem;height:2.25rem;padding:0 .75rem;border-radius:999px;background:var(--c-primary-light);color:var(--c-primary);font-size:.875rem;font-weight:700;letter-spacing:.04em;margin-bottom:.75rem}.import-drop-title{font-size:1rem;font-weight:700;margin-bottom:.35rem}.contacts-name-col{min-width:180px;max-width:240px}.contacts-email-col{min-width:190px;max-width:240px}.contacts-lists{display:flex;align-items:center;gap:.25rem;flex-wrap:wrap}.contacts-lists .badge{padding:.125rem .375rem;font-size:.625rem}.contacts-notes-col{max-width:220px}.contacts-meta-col{min-width:180px}.contacts-meta-line{display:flex;align-items:baseline;gap:.35rem;font-size:.75rem;line-height:1.35}.contacts-meta-line+.contacts-meta-line{margin-top:.2rem}.contacts-meta-line-block{align-items:flex-start}.contacts-meta-label{color:var(--c-muted);white-space:nowrap}.contacts-actions{width:1%}.contacts-action-btn{padding:.25rem .5rem;font-size:.75rem}.list-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1rem}.list-card{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:1.125rem;cursor:pointer;transition:box-shadow .15s,border-color .15s,transform .1s;display:flex;flex-direction:column;gap:.5rem}.list-card:hover{box-shadow:var(--shadow-lg);border-color:var(--c-primary);transform:translateY(-1px)}.list-card-header{display:flex;align-items:flex-start;justify-content:space-between;gap:.5rem}.list-card-name{font-size:.9375rem;font-weight:600;color:var(--c-text);word-break:break-word}.list-card-mail{font-size:.75rem;color:var(--c-muted);font-family:monospace}.list-card-description{font-size:.8125rem;color:var(--c-muted)}.list-card-stats{display:flex;gap:.75rem;margin-top:.25rem}.list-stat{font-size:.75rem;color:var(--c-muted);display:flex;align-items:center;gap:.25rem}.list-stat strong{color:var(--c-text);font-size:.875rem}.detail-header{display:flex;align-items:center;gap:.75rem;margin-bottom:1.5rem}.detail-title{font-size:1.25rem;font-weight:700}.detail-mail{font-size:.8125rem;color:var(--c-muted);font-family:monospace}.detail-sections{display:grid;grid-template-columns:1fr 320px;gap:1rem;align-items:start}@media (max-width: 800px){.detail-sections{grid-template-columns:1fr}}.section-title{font-size:.875rem;font-weight:600;color:var(--c-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.75rem}.member-row{display:flex;align-items:center;padding:.5rem .75rem;border-bottom:1px solid var(--c-border);gap:.75rem}.member-row:last-child{border-bottom:none}.member-row:hover{background:var(--c-hover)}.row-removing{opacity:.7}.row-removing .member-name,.row-removing .member-email,.row-removing .manager-name,.row-removing .manager-email,.row-removing .contact-name-cell,.row-removing .contact-email-cell{text-decoration:line-through}.contact-name-cell,.contact-email-cell{display:block;max-width:100%}.contact-name-cell{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;white-space:normal;line-height:1.3}.contact-email-cell{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;white-space:normal;word-break:break-word;line-height:1.3}.member-info{flex:1;min-width:0}.member-name-row{display:flex;align-items:flex-start;gap:.5rem;min-width:0;flex-wrap:wrap}.member-name{font-weight:500;font-size:.875rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.member-email{font-size:.75rem;color:var(--c-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.search-wrap{position:relative}.search-results{position:absolute;top:calc(100% + 4px);left:0;right:0;background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius);box-shadow:var(--shadow-lg);z-index:100;max-height:240px;overflow-y:auto}.search-result-item{padding:.5rem .75rem;cursor:pointer;border-bottom:1px solid var(--c-border);transition:background .1s}.search-result-item:last-child{border-bottom:none}.search-result-item:hover{background:var(--c-hover)}.search-result-name{font-size:.8125rem;font-weight:500}.search-result-email{font-size:.75rem;color:var(--c-muted)}.manager-row{display:flex;align-items:center;justify-content:space-between;padding:.4rem .75rem;border-bottom:1px solid var(--c-border);gap:.5rem}.manager-row:last-child{border-bottom:none}.manager-info{flex:1;min-width:0}.manager-name-row{display:flex;align-items:center;gap:.5rem;min-width:0}.manager-name{font-size:.8125rem;font-weight:500}.manager-email{font-size:.75rem;color:var(--c-muted)}.sync-icon{font-size:.75rem;flex-shrink:0}.contact-form-card{background:var(--c-surface);border:1px solid var(--c-primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);padding:1.25rem;margin-bottom:0}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#201f1e61;display:flex;align-items:center;justify-content:center;padding:1rem;z-index:1000}.modal-dialog{width:min(100%,760px);max-height:calc(100vh - 2rem);overflow-y:auto}.import-area{border:2px dashed var(--c-border);border-radius:var(--radius);padding:1rem;text-align:center;font-size:.8125rem;color:var(--c-muted);cursor:pointer;transition:border-color .15s,background .15s}.import-area:hover{border-color:var(--c-primary);background:var(--c-primary-light)}.import-result{margin-top:.75rem;font-size:.8125rem}.exchange-group-row{display:flex;align-items:center;justify-content:space-between;padding:.625rem .75rem;border-bottom:1px solid var(--c-border);gap:.75rem}.exchange-group-row:last-child{border-bottom:none}.exchange-group-info{flex:1;min-width:0}.exchange-group-name{font-size:.875rem;font-weight:500}.exchange-group-mail{font-size:.75rem;color:var(--c-muted);font-family:monospace}.empty-state{text-align:center;padding:2.5rem 1rem;color:var(--c-muted)}.empty-state-icon{font-size:2.5rem;margin-bottom:.75rem;opacity:.5}.empty-state-text{font-size:.875rem}.login-container{display:flex;justify-content:center;padding-top:3.5rem}.login-card{background:var(--c-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);padding:2.25rem 2rem;width:100%;max-width:400px;text-align:center}.login-icon{font-size:2.5rem;margin-bottom:.75rem}.login-card h2{font-size:1.25rem;margin-bottom:.5rem}.login-card p{color:var(--c-muted);margin-bottom:1.5rem;line-height:1.6}.text-muted{color:var(--c-muted)}.text-sm{font-size:.8125rem}.text-xs{font-size:.75rem}.text-error{color:var(--c-error)}.text-success{color:var(--c-success)}.text-mono{font-family:monospace}.flex-between{display:flex;align-items:center;justify-content:space-between;gap:.5rem}.flex-gap{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.mb-1{margin-bottom:.5rem}.mb-2{margin-bottom:1rem}.mt-1{margin-top:.5rem}.mt-2{margin-top:1rem}@media (max-width: 700px){.form-input,.form-select,.form-textarea{font-size:16px}}@media (max-width: 700px){.app-main{padding:1rem .75rem}.app-header{padding:.5rem .875rem}.app-header-inner{align-items:center;gap:.625rem}.app-header-titles{min-width:0;flex:1}.app-header h1{font-size:1rem}.app-nav{width:100%;display:flex;gap:.4rem;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:thin}.app-nav-wrap{margin-top:.5rem}.nav-btn{justify-content:center;padding:.45rem .8rem;font-size:.8125rem;flex:0 0 auto}.header-user{margin-left:auto}.header-user-name{display:none}.header-user .btn{padding-left:.75rem;padding-right:.75rem}.form-row,.list-grid{grid-template-columns:1fr}.list-card{padding:1rem}.list-card-stats{flex-wrap:wrap;gap:.5rem .75rem}.detail-header{align-items:flex-start;flex-wrap:wrap;margin-bottom:1rem}.detail-title{font-size:1.125rem}.member-row,.manager-row,.exchange-group-row{align-items:flex-start;flex-wrap:wrap}.member-name-row{flex-wrap:wrap}.member-email,.manager-email,.exchange-group-mail{white-space:normal;word-break:break-word}.td-actions{text-align:left}table{min-width:720px}.login-card{padding:1.5rem 1.25rem}.login-container{padding-top:2rem}}@media (max-width: 480px){.app-main{padding:.875rem .625rem}.card{padding:1rem;border-radius:var(--radius)}.flex-between{align-items:flex-start;flex-direction:column}.flex-gap,.flex-gap .btn{width:100%}.detail-mail{white-space:normal;word-break:break-word}}@media (max-width: 600px){.app-header{padding:.5rem .875rem}.app-header-icon{width:2rem;height:2rem}.app-header h1{font-size:.9375rem}.app-header-sub{font-size:.6875rem}}
