:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#eef3fb;--surface:#fff;--border:#d7e3f5;--text:#1e293b;--text-muted:#64748b;--accent:#2563eb;--accent-soft:#dce9ff;--male:#2563eb;--female:#dc2626;--danger:#dc2626;font-family:Hiragino Sans,Yu Gothic,system-ui,-apple-system,sans-serif}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0}button{font:inherit;cursor:pointer}ul{list-style:none}.app{min-height:100vh;padding-bottom:env(safe-area-inset-bottom);flex-direction:column;display:flex}.toolbar{padding:calc(14px + env(safe-area-inset-top)) 24px 14px;background:var(--surface);border-bottom:1px solid var(--border);z-index:5;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;display:flex;position:sticky;top:0}.toolbar-title h1{letter-spacing:.02em;background:linear-gradient(120deg, var(--accent), #4338ca);color:#0000;-webkit-background-clip:text;background-clip:text;margin:0;font-family:Poppins,Hiragino Sans,sans-serif;font-size:1.5rem;font-weight:700}.toolbar-title p{color:var(--text-muted);margin:0;font-size:.8rem}.toolbar-actions{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.toolbar-actions button{border:1px solid var(--border);background:var(--surface);border-radius:6px;padding:6px 12px;font-size:.85rem}.toolbar-actions button:hover{background:var(--accent-soft)}.edit-toggle{background:var(--accent-soft);border-radius:999px;align-items:center;gap:6px;padding:6px 12px;font-size:.9rem;display:flex}.edit-toggle input{accent-color:var(--accent);width:16px;height:16px}.link-button{color:var(--text-muted);background:0 0;border:none;padding:0;text-decoration:underline}.app-main{flex:1;align-items:flex-start;gap:0;display:flex}.tree-scroll-area{flex:1;min-width:0;padding:24px 0;overflow-x:auto}.zoom-controls{background:var(--surface);border:1px solid var(--border);border-radius:999px;align-items:center;gap:8px;margin:0 0 12px 16px;padding:4px 6px;display:inline-flex;position:sticky;left:16px;box-shadow:0 1px 3px #2563eb14}.zoom-controls button{background:var(--accent-soft);color:var(--accent);border:none;border-radius:50%;justify-content:center;align-items:center;width:26px;height:26px;font-size:1rem;line-height:1;display:flex}.zoom-controls button:hover{background:var(--accent);color:#fff}.zoom-controls span{color:var(--text-muted);text-align:center;min-width:3ch;font-size:.8rem}.birthday-sidebar{flex-shrink:0;width:260px;padding:24px 20px 24px 0}.birthday-sidebar h2{color:var(--text);margin:0 0 12px;font-size:.95rem}.birthday-sidebar-empty{color:var(--text-muted);font-size:.8rem}.birthday-sidebar-list{flex-direction:column;gap:6px;display:flex}.birthday-sidebar-row{background:var(--surface);border:1px solid var(--border);text-align:left;width:100%;color:inherit;border-radius:10px;align-items:center;gap:10px;padding:8px 10px;display:flex}.birthday-sidebar-row:hover{background:var(--accent-soft)}@media (width<=860px){.app-main{flex-direction:column}.birthday-sidebar{width:100%;padding:0 16px 16px}}.hint{text-align:center;color:var(--text-muted);margin:0 0 24px;font-size:.85rem}.empty-state{text-align:center;color:var(--text-muted)}.error-banner{color:var(--danger);text-align:center;background:#fbe4e0;margin:0;padding:8px 24px;font-size:.85rem}.birthday-banner{background:linear-gradient(90deg, var(--accent), #4338ca);color:#fff;justify-content:center;align-items:center;gap:10px;margin:0;padding:10px 24px;font-size:.9rem;display:flex}.birthday-banner-icon{background:#fff;border-radius:50%;flex-shrink:0;width:10px;height:10px}.birthday-banner-close{color:#fff;opacity:.85;background:0 0;border:none;padding:0 0 0 8px;font-size:1.1rem;line-height:1}.birthday-banner-close:hover{opacity:1}.tree-wrapper{justify-content:center;min-width:fit-content;display:flex}.tree,.tree ul{justify-content:center;padding-top:28px;display:flex;position:relative}.tree.tree-root{padding-top:0}.tree li{flex-direction:column;align-items:center;padding:28px 14px 0;display:flex;position:relative}.tree.tree-root>li{padding-top:0}.tree li:before,.tree li:after{content:"";border-top:2px solid var(--border);width:50%;height:28px;position:absolute;top:0;right:50%}.tree.tree-root>li:before,.tree.tree-root>li:after{display:none}.tree li:after{border-left:2px solid var(--border);left:50%;right:auto}.tree li:only-child:before,.tree li:only-child:after{display:none}.tree li:first-child:before,.tree li:last-child:after{border:0}.tree li:last-child:before{border-right:2px solid var(--border);border-radius:0 6px 0 0}.tree li:first-child:after{border-radius:6px 0 0}.tree ul:before{content:"";border-left:2px solid var(--border);height:28px;position:absolute;top:0;left:50%}.couple{align-items:center;display:flex}.couple-connector{background:var(--border);width:20px;height:2px}.person-card{background:var(--surface);border:1px solid var(--border);border-top:4px solid var(--text-muted);border-radius:10px;flex-direction:column;align-items:center;width:128px;padding:10px;display:flex;box-shadow:0 1px 3px #0000000f}.person-card.gender-male{border-top-color:var(--male)}.person-card.gender-female{border-top-color:var(--female)}.person-card-main{width:100%;color:inherit;text-align:center;background:0 0;border:none;flex-direction:column;align-items:center;gap:6px;padding:0;display:flex}.avatar{background:var(--accent-soft);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:56px;height:56px;display:flex;overflow:hidden}.avatar img{object-fit:cover;width:100%;height:100%}.avatar-fallback{color:var(--accent);font-size:1.3rem;font-weight:600}.avatar-large{width:84px;height:84px}.avatar-large .avatar-fallback{font-size:1.8rem}.person-name{word-break:break-word;font-size:.9rem;font-weight:600;line-height:1.3}.person-birthdate{color:var(--text-muted);font-size:.75rem}.person-card-actions{flex-wrap:wrap;justify-content:center;gap:4px;margin-top:8px;display:flex}.person-card-actions button{border:1px solid var(--border);background:var(--surface);border-radius:6px;min-height:30px;padding:6px 8px;font-size:.72rem}.person-card-actions button:hover{background:var(--accent-soft)}.person-card-actions button.danger{color:var(--danger);border-color:var(--danger)}.person-card-actions button.danger:hover{background:#f8d7d3}.person-list-info{flex-direction:column;gap:2px;display:flex}.person-list-meta{color:var(--text-muted);font-size:.8rem}.profile-modal{padding:0;overflow:hidden}.profile-modal-header{background:linear-gradient(160deg, var(--profile-accent,var(--accent)), transparent 140%);flex-direction:column;align-items:center;gap:12px;padding:32px 24px 24px;display:flex}.profile-modal-header .avatar-large{border:3px solid var(--surface);width:100px;height:100px;box-shadow:0 4px 16px #0f172a26}.profile-heading{text-align:center}.profile-heading h2{margin:0 0 4px;font-family:Poppins,Hiragino Sans,sans-serif;font-size:1.3rem;font-weight:700}.profile-birthdate{color:var(--text-muted);margin:0;font-size:.85rem}.profile-bio{color:var(--text);white-space:pre-wrap;margin:0;padding:4px 24px 24px;line-height:1.7}.profile-modal .modal-actions{padding:0 24px 24px}.modal-overlay{z-index:10;background:#0f172a80;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.modal{background:var(--surface);border-radius:12px;flex-direction:column;gap:12px;width:100%;max-width:380px;max-height:90vh;padding:24px;display:flex;overflow-y:auto}.modal h2{margin:0 0 4px;font-size:1.1rem}.modal-photo-row{align-items:center;gap:14px;display:flex}.modal-photo-actions{flex-direction:column;align-items:flex-start;gap:6px;display:flex}.modal-photo-actions button:not(.link-button){border:1px solid var(--border);background:var(--surface);border-radius:6px;padding:6px 10px;font-size:.85rem}.field{color:var(--text-muted);flex-direction:column;gap:4px;font-size:.85rem;display:flex}.field input,.field select,.field textarea{font:inherit;color:var(--text);border:1px solid var(--border);background:var(--bg);resize:vertical;border-radius:6px;padding:8px}.modal-actions{justify-content:flex-end;gap:10px;margin-top:8px;display:flex}.modal-actions button{border:1px solid var(--border);background:var(--surface);border-radius:6px;padding:8px 16px}.modal-actions button.primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}@media (width<=480px){.toolbar{padding:calc(10px + env(safe-area-inset-top)) 14px 10px;gap:10px}.toolbar-title h1{font-size:1.25rem}.toolbar-actions{gap:8px}.toolbar-actions button{padding:7px 10px;font-size:.8rem}.edit-toggle{padding:7px 10px;font-size:.85rem}.tree-scroll-area{padding:16px 0}.zoom-controls{margin:0 0 10px 12px}.person-card{width:108px;padding:8px}.avatar{width:46px;height:46px}.person-name{font-size:.82rem}.person-birthdate{font-size:.68rem}.modal{max-width:100%;padding:18px}.profile-modal-header{padding:24px 18px 20px}.birthday-sidebar{padding:0 14px 16px}}
