:root{--color-bg-light:#f5f5f5;--color-bg-white:#fff;--color-text-dark:#2c3e50;--color-text-light:#7f8c8d;--color-border:#e0e0e0;--color-input-focus:#3498db;--color-delete-light:#ff6b6b;--color-delete-dark:#e63946;--color-accent:#3498db;--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px}*{box-sizing:border-box}body{font-family:var(--font-sans);background-color:var(--color-bg-light);color:var(--color-text-dark);margin:0;padding:0;line-height:1.6}html,body,#root{width:100%;height:100%}#root{flex-direction:column;display:flex}h1{color:var(--color-text-dark);margin:0;font-size:32px;font-weight:600}h2{color:var(--color-text-dark);margin:0;font-size:20px;font-weight:600}p{color:var(--color-text-light);margin:0}main{padding:var(--space-xl);flex:1}.container{width:100%;max-width:800px;margin:0 auto}.page-title{text-align:center;margin-bottom:var(--space-xl);color:var(--color-text-dark);font-size:28px;font-weight:700}.form-container{max-width:400px;margin:0 auto var(--space-xl);background-color:var(--color-bg-white);padding:var(--space-lg);border-radius:8px;box-shadow:0 2px 8px #0000001a}.form-group{margin-bottom:var(--space-md)}.form-group:last-child{margin-bottom:0}.form-label{margin-bottom:var(--space-sm);color:var(--color-text-dark);font-size:14px;font-weight:500;display:block}.form-input{width:100%;padding:var(--space-md) var(--space-md);border:1px solid var(--color-border);font-size:14px;font-family:var(--font-sans);color:var(--color-text-dark);background-color:var(--color-bg-white);border-radius:6px;transition:all .2s}.form-input:focus{border-color:var(--color-input-focus);outline:none;box-shadow:0 0 0 3px #3498db1a}.form-input::placeholder{color:var(--color-text-light)}.form-error{color:#c92a2a;padding:var(--space-md);margin-bottom:var(--space-md);border-left:4px solid var(--color-delete-light);background-color:#ffe0e0;border-radius:6px;font-size:14px}.form-button{width:100%;padding:var(--space-md) var(--space-lg);background-color:var(--color-accent);color:#fff;cursor:pointer;font-size:14px;font-weight:600;font-family:var(--font-sans);border:none;border-radius:6px;transition:all .2s}.form-button:hover{background-color:#2980b9;box-shadow:0 4px 12px #3498db4d}.form-button:active{transform:translateY(1px)}.contacts-container{background-color:var(--color-bg-white);max-width:600px;padding:var(--space-lg);border-radius:8px;margin:0 auto;box-shadow:0 2px 8px #0000001a}.contacts-title{margin-bottom:var(--space-lg);color:var(--color-text-dark);font-size:20px;font-weight:600}.contacts-empty{text-align:center;padding:var(--space-xl) var(--space-md);color:var(--color-text-light);font-size:14px}.contacts-list{gap:var(--space-md);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.contact-item{padding:var(--space-md);border:1px solid var(--color-border);background-color:#fafafa;border-radius:6px;justify-content:space-between;align-items:center;transition:all .2s;display:flex}.contact-item:hover{background-color:#f0f0f0;box-shadow:0 2px 6px #0000000d}.contact-info{text-align:left;flex:1}.contact-name{color:var(--color-text-dark);margin-bottom:4px;font-size:15px;font-weight:600}.contact-email{color:var(--color-text-light);font-size:13px}.delete-button{margin-left:var(--space-md);padding:var(--space-sm) var(--space-md);background-color:var(--color-delete-light);color:#fff;cursor:pointer;white-space:nowrap;border:none;border-radius:6px;font-size:13px;font-weight:600;transition:all .2s}.delete-button:hover{background-color:var(--color-delete-dark);box-shadow:0 4px 12px #ff6b6b4d}.delete-button:active{transform:translateY(1px)}@media (width<=640px){main{padding:var(--space-lg)}.page-title{margin-bottom:var(--space-lg);font-size:24px}.form-container{padding:var(--space-md)}.contact-item{flex-direction:column;align-items:flex-start}.delete-button{margin-left:0;margin-top:var(--space-md);width:100%}}