*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{color:#333;background:#fff8f5;min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Noto Sans KR,sans-serif}#root{min-height:100vh}button{font-family:inherit}.app{flex-direction:column;min-height:100vh;display:flex}.header{z-index:10;background:#fff;justify-content:space-between;align-items:center;padding:18px 32px;display:flex;position:sticky;top:0;box-shadow:0 2px 8px #0000000f}.logo{color:#ff7043;letter-spacing:-.3px;font-size:1.25rem;font-weight:700}.btn-add{color:#fff;cursor:pointer;background:#ff7043;border:none;border-radius:24px;padding:10px 20px;font-size:.875rem;font-weight:600;transition:background .2s,transform .1s}.btn-add:hover{background:#f4511e;transform:translateY(-1px)}.main{flex:1;width:100%;max-width:960px;margin:0 auto;padding:48px 32px}.empty-state{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:12px;min-height:60vh;display:flex}.empty-icon{margin-bottom:8px;font-size:5rem;animation:3s ease-in-out infinite float}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.empty-state h2{color:#444;font-size:1.4rem;font-weight:700}.empty-state p{color:#999;margin-bottom:8px;font-size:.95rem}.btn-add-primary{color:#fff;cursor:pointer;background:#ff7043;border:none;border-radius:28px;margin-top:8px;padding:14px 36px;font-size:1rem;font-weight:600;transition:background .2s,transform .15s;box-shadow:0 4px 16px #ff704359}.btn-add-primary:hover{background:#f4511e;transform:translateY(-2px)}.children-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:24px;display:grid}.child-card{text-align:center;background:#fff;border-radius:20px;padding:32px 20px 24px;transition:transform .2s,box-shadow .2s;box-shadow:0 2px 16px #00000012}.child-card:hover{transform:translateY(-4px);box-shadow:0 10px 28px #0000001f}.child-photo-wrap{background:#ffe8df;border:3px solid #ffd0c2;border-radius:50%;justify-content:center;align-items:center;width:110px;height:110px;margin:0 auto 16px;display:flex;overflow:hidden}.child-photo{object-fit:cover;width:100%;height:100%}.child-photo-placeholder{font-size:2.8rem}.child-name{color:#222;margin-bottom:6px;font-size:1.15rem;font-weight:700}.child-age{color:#ff7043;margin-bottom:4px;font-size:.95rem;font-weight:600}.child-birth{color:#aaa;font-size:.8rem}.add-card{cursor:pointer;color:#ff7043;background:#fff;border:2px dashed #ffbcac;border-radius:20px;flex-direction:column;justify-content:center;align-items:center;gap:8px;min-height:210px;padding:32px 20px 24px;transition:border-color .2s,background .2s,transform .15s;display:flex}.add-card:hover{background:#fff3ef;border-color:#ff7043;transform:translateY(-2px)}.add-card span{font-size:2.5rem;font-weight:300;line-height:1}.add-card p{font-size:.9rem;font-weight:600}.modal-overlay{z-index:100;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#00000073;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.modal{background:#fff;border-radius:24px;width:100%;max-width:400px;padding:36px 32px;animation:.25s slideUp;box-shadow:0 24px 64px #0003}@keyframes slideUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.modal-title{color:#222;text-align:center;margin-bottom:28px;font-size:1.25rem;font-weight:700}.child-form{flex-direction:column;gap:20px;display:flex}.photo-upload{cursor:pointer;background:#ffe8df;border:2px dashed #ffbcac;border-radius:50%;justify-content:center;align-items:center;width:110px;height:110px;margin:0 auto;transition:border-color .2s,background .2s;display:flex;overflow:hidden}.photo-upload:hover{background:#ffd8cc;border-color:#ff7043}.photo-preview{object-fit:cover;width:100%;height:100%}.photo-placeholder{color:#ff7043;flex-direction:column;align-items:center;gap:4px;display:flex}.photo-placeholder span{font-size:1.8rem}.photo-placeholder p{font-size:.7rem;font-weight:600}.form-label{color:#666;letter-spacing:.2px;flex-direction:column;gap:6px;font-size:.8rem;font-weight:600;display:flex}.form-input{color:#333;background:#fff;border:1.5px solid #e5e5e5;border-radius:12px;outline:none;width:100%;padding:12px 14px;font-size:.95rem;transition:border-color .2s}.form-input:focus{border-color:#ff7043}.form-actions{gap:10px;margin-top:4px;display:flex}.btn-cancel{color:#888;cursor:pointer;background:#fff;border:1.5px solid #e5e5e5;border-radius:12px;flex:1;padding:13px;font-size:.9rem;font-weight:600;transition:border-color .2s,color .2s}.btn-cancel:hover{color:#555;border-color:#ccc}.btn-submit{color:#fff;cursor:pointer;background:#ff7043;border:none;border-radius:12px;flex:2;padding:13px;font-size:.9rem;font-weight:600;transition:background .2s}.btn-submit:hover{background:#f4511e}@media (width<=640px){.header{padding:16px 20px}.main{padding:32px 20px}.children-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:16px}.modal{padding:28px 20px}}