:root{--color-brand-primary: #0078D4;--color-brand-primary-hover: #106EBE;--color-brand-primary-active: #005A9E;--color-neutral-background-1: #FFFFFF;--color-neutral-background-2: #F5F5F5;--color-neutral-background-3: #F3F3F3;--color-neutral-background-subtle: rgba(249, 249, 249, .85);--color-neutral-foreground-1: #242424;--color-neutral-foreground-2: #424242;--color-neutral-foreground-3: #616161;--color-neutral-foreground-disabled: #A0A0A0;--color-neutral-stroke-1: rgba(0, 0, 0, .08);--color-neutral-stroke-2: rgba(0, 0, 0, .12);--color-status-danger: #D32F2F;--color-status-danger-hover: #C62828;--color-status-success: #107C10;--color-status-warning: #FDB022;--color-status-info: #0078D4;--shadow-2: 0 2px 4px rgba(0, 0, 0, .08);--shadow-4: 0 4px 8px rgba(0, 0, 0, .08);--shadow-8: 0 8px 16px rgba(0, 0, 0, .08);--shadow-16: 0 16px 32px rgba(0, 0, 0, .12);--radius-small: 4px;--radius-medium: 6px;--radius-large: 8px;--radius-xlarge: 12px;--font-family: "Segoe UI", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;--font-size-base: 14px;--font-size-small: 12px;--font-size-large: 16px;--font-size-title: 20px;--font-size-hero: 28px;--font-weight-regular: 400;--font-weight-semibold: 600;--spacing-xs: 4px;--spacing-s: 8px;--spacing-m: 12px;--spacing-l: 16px;--spacing-xl: 24px;--spacing-xxl: 32px;--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-normal: .25s cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box}body{margin:0;font-family:var(--font-family);font-size:var(--font-size-base);color:var(--color-neutral-foreground-1);background-color:var(--color-neutral-background-3);line-height:1.5;-webkit-font-smoothing:antialiased}#root{display:flex;flex-direction:column;min-height:100vh}.app-container{width:100%;max-width:960px;margin:0 auto;padding:var(--spacing-xl);display:flex;flex-direction:column;min-height:100vh}.main-header{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-m) var(--spacing-l);margin-bottom:var(--spacing-xl);background:var(--color-neutral-background-subtle);backdrop-filter:blur(40px);-webkit-backdrop-filter:blur(40px);border:1px solid var(--color-neutral-stroke-1);border-radius:var(--radius-large);box-shadow:var(--shadow-2)}.logo-section{display:flex;align-items:center;gap:var(--spacing-m)}.logo-section .icon{font-size:1.8rem;filter:drop-shadow(0 2px 4px rgba(0,120,212,.3))}.logo-section h1{font-size:var(--font-size-title);font-weight:var(--font-weight-semibold);color:var(--color-brand-primary);margin:0}.controls-section{display:flex;align-items:center;gap:var(--spacing-m)}.current-worker-url-display{font-size:var(--font-size-small);color:var(--color-neutral-foreground-3);background:#0000000a;padding:var(--spacing-xs) var(--spacing-s);border-radius:var(--radius-small);max-width:280px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.config-toggle-button{width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:var(--radius-small);color:var(--color-neutral-foreground-2);font-size:1.4rem;cursor:pointer;transition:all var(--transition-fast)}.config-toggle-button:hover{background:#0000000d;color:var(--color-brand-primary)}h1,h2,h3,h4{margin:0;color:var(--color-neutral-foreground-1)}h2{font-size:var(--font-size-title);font-weight:var(--font-weight-semibold);color:var(--color-brand-primary);margin-bottom:var(--spacing-l)}h3{font-size:var(--font-size-large);font-weight:var(--font-weight-semibold);margin-bottom:var(--spacing-m)}.view-section,.auth-section,.admin-action-section,.config-panel{background:var(--color-neutral-background-1);border:1px solid var(--color-neutral-stroke-1);border-radius:var(--radius-large);padding:var(--spacing-xl);margin-bottom:var(--spacing-l);box-shadow:var(--shadow-2)}.form-group{margin-bottom:var(--spacing-l)}.form-group label{display:block;font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--color-neutral-foreground-1);margin-bottom:var(--spacing-xs)}input[type=text],input[type=password],input[type=number],input[type=email],textarea{width:100%;padding:var(--spacing-s) var(--spacing-m);font-size:var(--font-size-base);font-family:var(--font-family);color:var(--color-neutral-foreground-1);background:var(--color-neutral-background-1);border:1px solid var(--color-neutral-stroke-2);border-radius:var(--radius-small);transition:all var(--transition-fast);outline:none}input:hover,textarea:hover{border-color:#0003}input:focus,textarea:focus{border-color:var(--color-brand-primary);box-shadow:0 0 0 2px #0078d426}input:disabled,textarea:disabled{background:var(--color-neutral-background-2);color:var(--color-neutral-foreground-disabled);cursor:not-allowed}textarea{min-height:100px;resize:vertical}.hint{font-size:var(--font-size-small);color:var(--color-neutral-foreground-3);margin-top:var(--spacing-xs)}button{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-s);padding:var(--spacing-s) var(--spacing-l);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);font-family:var(--font-family);color:#fff;background:var(--color-brand-primary);border:none;border-radius:var(--radius-small);cursor:pointer;transition:all var(--transition-fast);outline:none}button:hover{background:var(--color-brand-primary-hover);box-shadow:var(--shadow-4)}button:active{background:var(--color-brand-primary-active);transform:scale(.98)}button:disabled{background:var(--color-neutral-background-2);color:var(--color-neutral-foreground-disabled);cursor:not-allowed;box-shadow:none;transform:none}button.secondary{background:#0000000d;color:var(--color-neutral-foreground-1)}button.secondary:hover{background:#00000014}button.danger{background:var(--color-status-danger)}button.danger:hover{background:var(--color-status-danger-hover)}.email-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--spacing-m);margin-top:var(--spacing-l)}.email-card{position:relative;padding:var(--spacing-l);background:var(--color-neutral-background-1);border:1px solid var(--color-neutral-stroke-1);border-radius:var(--radius-medium);text-align:center;color:var(--color-neutral-foreground-1);font-size:var(--font-size-base);cursor:pointer;transition:all var(--transition-fast);overflow:hidden}.email-card:before{content:"";position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;border-radius:var(--radius-medium);padding:1px;background:linear-gradient(135deg,transparent,var(--color-brand-primary),transparent);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity var(--transition-fast)}.email-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-8);border-color:var(--color-brand-primary)}.email-card:hover:before{opacity:.6}.email-card:focus{outline:2px solid var(--color-brand-primary);outline-offset:2px}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0006;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .2s ease-out}.modal-content{background:var(--color-neutral-background-1);border-radius:var(--radius-xlarge);padding:var(--spacing-xl);min-width:360px;max-width:480px;box-shadow:var(--shadow-16);animation:slideUp .25s ease-out}.modal-content h3{color:var(--color-neutral-foreground-1);margin-bottom:var(--spacing-l)}.modal-actions{display:flex;justify-content:flex-end;gap:var(--spacing-s);margin-top:var(--spacing-xl)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.admin-tabs{display:flex;gap:var(--spacing-xs);margin-bottom:var(--spacing-l);border-bottom:1px solid var(--color-neutral-stroke-1);padding-bottom:var(--spacing-xs)}.admin-tabs button{background:transparent;color:var(--color-neutral-foreground-2);font-weight:var(--font-weight-regular);padding:var(--spacing-s) var(--spacing-l);border-radius:var(--radius-small) var(--radius-small) 0 0;border-bottom:2px solid transparent;margin-bottom:-1px}.admin-tabs button:hover{background:#0078d40d;color:var(--color-brand-primary);box-shadow:none}.admin-tabs button.active{color:var(--color-brand-primary);font-weight:var(--font-weight-semibold);border-bottom-color:var(--color-brand-primary);background:transparent}table{width:100%;border-collapse:collapse;margin-top:var(--spacing-l)}th,td{padding:var(--spacing-m);text-align:left;border-bottom:1px solid var(--color-neutral-stroke-1)}th{font-weight:var(--font-weight-semibold);color:var(--color-neutral-foreground-2);background:var(--color-neutral-background-2);font-size:var(--font-size-small);text-transform:uppercase;letter-spacing:.5px}tr:hover{background:#0078d405}.account-table{display:grid;border:1px solid var(--color-neutral-stroke-1);border-radius:var(--radius-medium);overflow:hidden}.account-table-header,.account-table-row{display:grid;grid-template-columns:24px 1fr 2fr 140px;gap:var(--spacing-m);align-items:center;padding:var(--spacing-m);border-bottom:1px solid var(--color-neutral-stroke-1)}.account-table-header{background:var(--color-neutral-background-2);font-weight:var(--font-weight-semibold);font-size:var(--font-size-small);color:var(--color-neutral-foreground-2)}.account-table-row:last-child{border-bottom:none}.account-table-row:hover{background:#0078d405}.account-table-row input[type=text]{background:transparent;border:1px solid transparent;padding:var(--spacing-s);border-radius:var(--radius-small)}.account-table-row input[type=text]:not(:disabled){border-color:var(--color-brand-primary);background:var(--color-neutral-background-1)}.account-table-row .action-buttons{display:flex;gap:var(--spacing-xs);justify-content:flex-end}.account-table-row .action-buttons button{padding:var(--spacing-xs) var(--spacing-s);font-size:var(--font-size-small)}.add-new-row{background:#0078d408}.account-management-controls{display:flex;gap:var(--spacing-s);margin-bottom:var(--spacing-l);flex-wrap:wrap}.account-management-controls .search-input{flex:1;min-width:200px}.account-management-controls button{flex-shrink:0}.error-message,.success-message,.info-message{padding:var(--spacing-m);border-radius:var(--radius-small);font-size:var(--font-size-base);margin:var(--spacing-s) 0}.error-message{background:#d32f2f1a;color:var(--color-status-danger);border:1px solid rgba(211,47,47,.2)}.success-message{background:#107c101a;color:var(--color-status-success);border:1px solid rgba(16,124,16,.2)}.info-message{background:#0078d414;color:var(--color-brand-primary);border:1px solid rgba(0,120,212,.15)}.loading-indicator{display:flex;align-items:center;justify-content:center;padding:var(--spacing-xl);color:var(--color-brand-primary);font-size:var(--font-size-base)}.toast-notification{position:fixed;bottom:var(--spacing-xl);left:50%;transform:translate(-50%);padding:var(--spacing-m) var(--spacing-xl);border-radius:var(--radius-medium);color:#fff;font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);box-shadow:var(--shadow-8);z-index:2000;animation:slideUp .25s ease-out}.toast-success{background:var(--color-status-success)}.toast-error{background:var(--color-status-danger)}.toast-info{background:var(--color-brand-primary)}.main-footer{display:flex;align-items:center;justify-content:center;gap:var(--spacing-m);padding:var(--spacing-l);margin-top:auto;border-top:1px solid var(--color-neutral-stroke-1);color:var(--color-neutral-foreground-3);font-size:var(--font-size-small)}.main-footer a{display:inline-flex;align-items:center;gap:var(--spacing-xs);color:var(--color-neutral-foreground-2);text-decoration:none;transition:color var(--transition-fast)}.main-footer a:hover{color:var(--color-brand-primary)}.github-icon{width:18px;height:18px}.footer-separator{color:var(--color-neutral-stroke-2)}.refresh-button,.logout-button{padding:var(--spacing-xs) var(--spacing-m);font-size:var(--font-size-small)}.config-panel{animation:slideUp .25s ease-out}.config-panel-actions{display:flex;gap:var(--spacing-s);margin-top:var(--spacing-l)}@media(max-width:768px){.app-container{padding:var(--spacing-l)}.main-header{flex-direction:column;gap:var(--spacing-m);text-align:center}.controls-section{width:100%;justify-content:center}.current-worker-url-display{display:none}.email-list{grid-template-columns:1fr}.account-table-header,.account-table-row{grid-template-columns:24px 1fr 100px}.account-table-row input[type=text]:nth-child(3){display:none}}input[type=checkbox]{width:18px;height:18px;accent-color:var(--color-brand-primary);cursor:pointer}
