*{box-sizing:border-box;margin:0;padding:0}:root{--bg:#0f172a;--surface:#1e293b;--border:#334155;--text:#e2e8f0;--text-muted:#94a3b8;--primary:#3b82f6;--primary-hover:#2563eb;--danger:#ef4444;--danger-hover:#dc2626;--secondary:#475569;--secondary-hover:#64748b;--success:#22c55e;--success-hover:#16a34a;--warning-bg:#713f12;--warning-text:#fef3c7;--warning-border:#a16207}body{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text);min-height:100vh;line-height:1.6}.container{max-width:640px;margin:0 auto;padding:2rem 1rem 4rem}header{text-align:center;margin-bottom:2rem}h1,h2{font-size:1.75rem;font-weight:700;color:#f8fafc}.subtitle,label{font-size:.875rem;color:var(--text-muted)}.subtitle{margin-top:.25rem}h2{font-size:1.125rem;font-weight:600;margin-bottom:.75rem}.form-section,input{border:1px solid var(--border)}.form-section{background:var(--surface);border-radius:12px;padding:1.5rem;margin-bottom:1.5rem}.form-group{margin-bottom:1rem}label{display:block;font-weight:500;margin-bottom:.375rem}.label-optional{font-weight:400;color:var(--secondary);font-size:.8125rem}input{width:100%;padding:.625rem .875rem;background:var(--bg);border-radius:8px;color:var(--text);font-size:.9375rem;transition:border-color .15s}.btn:focus-visible,input:focus-visible{outline:2px solid var(--primary);outline-offset:2px}input:focus{outline:0;border-color:var(--primary)}input::placeholder{color:var(--secondary)}input.input-error{border-color:var(--danger)}.field-error{display:block;color:var(--danger);font-size:.8125rem;margin-top:.25rem;min-height:1.2em}.warning-banner{background:var(--warning-bg);border:1px solid var(--warning-border);color:var(--warning-text);border-radius:8px;padding:.625rem .875rem;font-size:.875rem;margin-bottom:1rem}.form-actions{display:flex;margin-top:1rem}.btn{display:inline-flex;align-items:center;justify-content:center;padding:.5rem 1rem;font-size:.875rem;font-weight:600;border:0;border-radius:8px;cursor:pointer;transition:background .15s,opacity .15s,transform .1s}.btn:active:not(:disabled){transform:scale(.98)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover:not(:disabled){background:var(--primary-hover)}.btn-secondary{background:var(--secondary);color:#fff}.btn-secondary:hover:not(:disabled){background:var(--secondary-hover)}.btn-danger{background:var(--danger);color:#fff}.btn-danger:hover:not(:disabled){background:var(--danger-hover)}.btn-export{background:var(--success);color:#fff;font-size:.8125rem}.btn-export:hover:not(:disabled){background:var(--success-hover)}.btn-delete,.btn-edit{color:#fff;padding:.375rem .75rem;font-size:.8125rem}.btn-edit{background:var(--primary)}.btn-delete{background:var(--danger)}.btn-success-flash{background:var(--success)!important;transition:background .2s}.contacts-section,.search-section{margin-bottom:1.5rem}#contactCount,.search-section input{font-size:.9375rem}.contacts-section{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:1.5rem}.contacts-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.contacts-header h2{margin-bottom:0}#contactCount{color:var(--text-muted);font-weight:400}.contact-list{list-style:none}.contact-list li{padding:.875rem 0;border-bottom:1px solid var(--border)}.contact-list li:last-child{border-bottom:none}.contact-item{display:flex;justify-content:space-between;align-items:flex-start;gap:.75rem}.contact-info{flex:1;min-width:0}.contact-name{font-weight:600;color:#f8fafc;word-break:break-word}.contact-email,.contact-phone{font-size:.875rem;color:var(--text-muted);word-break:break-all}.contact-phone{margin-top:.125rem}.contact-actions{display:flex;flex-shrink:0}.empty-message,.modal-content p{color:var(--text-muted);font-size:.9375rem}.empty-message{text-align:center;padding:2rem 0}.modal{position:fixed;inset:0;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;padding:1rem;z-index:100}.modal-content{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:1.5rem;max-width:360px;width:100%}.modal-content h3{font-size:1.0625rem;font-weight:600;margin-bottom:.75rem}.modal-content p{margin-bottom:1.25rem}.modal-actions{display:flex}.hidden{display:none!important}.multiplayer-section{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:1.5rem;margin-bottom:1.5rem}.multiplayer-buttons{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:.875rem}.join-game-form{display:flex;gap:.5rem;align-items:center}.join-game-form input{flex:1}.version-footer{position:fixed;bottom:8px;right:12px;font-size:10px;color:var(--text-muted);font-family:monospace;opacity:.5;pointer-events:none;z-index:9999;white-space:nowrap}.btn{min-height:44px;min-width:44px}.contact-actions,.form-actions,.modal-actions{gap:.75rem}@media (max-width:639px){.container{padding:1rem .75rem}.contact-item{flex-direction:column;gap:.5rem}.contact-actions{align-self:flex-start}}@media (min-width:640px){.container{max-width:640px}}@media (min-width:1024px){.container{max-width:1120px}.contact-item{display:grid;grid-template-columns:1fr auto;align-items:center}}@media (prefers-color-scheme:light){:root{--bg:#f8fafc;--surface:#ffffff;--border:#e2e8f0;--text:#0f172a;--text-muted:#475569}.contact-name,h1,h2{color:#0f172a}}@media (prefers-reduced-motion:reduce){*,::after,::before{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}