*{margin:0;padding:0;box-sizing:border-box}html,body,#root{width:100%;height:100%;min-height:100vh}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:var(--bg-secondary, #f8fafc);transition:background .3s ease}:root{--bg-primary: #ffffff;--bg-secondary: #f8fafc;--bg-tertiary: #f0f2f5;--text-primary: rgba(0, 0, 0, .88);--text-secondary: rgba(0, 0, 0, .65);--border-color: #f0f0f0;--shadow-color: rgba(0, 0, 0, .08)}[data-theme=dark]{--bg-primary: #141414;--bg-secondary: #1f1f1f;--bg-tertiary: #262626;--text-primary: rgba(255, 255, 255, .88);--text-secondary: rgba(255, 255, 255, .65);--border-color: #303030;--shadow-color: rgba(0, 0, 0, .3)}.auth-page{min-height:100vh;display:flex}.auth-left{flex:1;background:linear-gradient(135deg,#1a365d,#2d3748);display:flex;align-items:center;justify-content:center;padding:48px}.auth-branding{max-width:400px;text-align:center}.auth-logo{font-size:80px;margin-bottom:24px;filter:drop-shadow(0 4px 8px rgba(0,0,0,.3))}.auth-title{color:#fff!important;margin-bottom:16px!important;font-weight:700!important}.auth-description{color:#fffc!important;font-size:16px!important;line-height:1.6!important}.auth-right{flex:1;display:flex;align-items:center;justify-content:center;padding:48px;background:var(--bg-secondary)}.auth-card{width:100%;max-width:420px;border-radius:12px;box-shadow:0 4px 24px #00000014;padding:16px}.auth-card-header{text-align:center;margin-bottom:32px}.auth-card-header h2{margin-bottom:8px!important}.auth-footer{text-align:center}.auth-footer a{font-weight:500}@media(max-width:768px){.auth-page{flex-direction:column}.auth-left{padding:32px 24px;min-height:auto}.auth-logo{font-size:48px;margin-bottom:16px}.auth-branding h1{font-size:28px!important}.auth-description{font-size:14px!important}.auth-right{padding:24px}.auth-card{padding:8px}}.sidebar-container{display:flex;flex-direction:column;justify-content:space-between;height:100%;background:linear-gradient(180deg,#001529,#002140)}.layout-logo{height:64px;display:flex;align-items:center;justify-content:center;gap:12px;background:#ffffff08;border-bottom:1px solid rgba(255,255,255,.08)}.layout-logo-icon{font-size:32px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.2))}.layout-logo-text{font-size:20px;font-weight:700;color:#fff;letter-spacing:.5px}.sidebar-menu{border-right:none!important;padding:8px}.sidebar-menu .ant-menu-item{margin:4px 0!important;border-radius:8px!important;height:44px!important;line-height:44px!important}.sidebar-menu .ant-menu-item-selected{background:linear-gradient(90deg,#1890ff,#096dd9)!important}.sidebar-menu .ant-menu-item:not(.ant-menu-item-selected):hover{background:#ffffff14!important}.sidebar-menu .ant-menu-item .anticon{font-size:18px}.sidebar-user-section{padding:0 12px 16px}.sidebar-user{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;cursor:pointer;transition:all .2s ease;background:#ffffff0a}.sidebar-user:hover{background:#ffffff1a}.sidebar-user-avatar{background:linear-gradient(135deg,#1890ff,#096dd9)!important;flex-shrink:0}.sidebar-user-info{display:flex;flex-direction:column;overflow:hidden}.sidebar-user-name{color:#fff!important;font-weight:600;font-size:14px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-user-role{color:#ffffff80!important;font-size:12px;line-height:1.3}.layout-header{background:var(--bg-primary);padding:0 24px;display:flex;align-items:center;justify-content:space-between;box-shadow:0 1px 4px var(--shadow-color);position:sticky;top:0;z-index:10}.layout-trigger{font-size:18px;padding:0 12px}.layout-header-right{display:flex;align-items:center}.layout-user{display:flex;align-items:center;gap:8px;cursor:pointer;padding:8px 12px;border-radius:8px;transition:background .2s}.layout-user:hover{background:var(--bg-tertiary)}.theme-toggle-btn{font-size:18px;margin-right:8px}.layout-username{font-weight:500}.layout-content{margin:24px;padding:24px;background:var(--bg-primary);border-radius:8px;min-height:calc(100vh - 112px)}.ant-layout-sider-collapsed .sidebar-menu{padding:8px 4px}.ant-layout-sider-collapsed .sidebar-user-section{padding:0 8px 16px}.ant-layout-sider-collapsed .sidebar-user{justify-content:center;padding:8px}.ant-layout-sider-collapsed .layout-logo-icon{font-size:28px}@media(max-width:768px){.layout-username{display:none}.layout-content{margin:12px;padding:12px}.layout-header{padding:0 12px}}.dashboard-welcome{margin-bottom:24px;background:linear-gradient(135deg,#1a365d,#2d3748);border:none;border-radius:12px}.dashboard-welcome-inner{display:flex;align-items:center;gap:20px}.dashboard-welcome-avatar{background-color:#fff3;border:3px solid rgba(255,255,255,.3)}.dashboard-stat-card{border-radius:12px}.dashboard-stat-icon{width:40px;height:40px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;margin-right:8px}.dashboard-user-card{margin-top:24px;border-radius:12px}@media(max-width:768px){.dashboard-welcome{margin-bottom:16px}.dashboard-welcome-inner{flex-direction:column;text-align:center;gap:12px}.dashboard-welcome-avatar{width:56px!important;height:56px!important;line-height:56px!important}.dashboard-welcome h3{font-size:18px!important}.dashboard-stat-icon{width:32px;height:32px;margin-right:4px}.dashboard-user-card{margin-top:16px}}@media(max-width:480px){.dashboard-welcome-inner{padding:8px 0}.dashboard-welcome h3{font-size:16px!important}}.change-password-container{max-width:480px;margin:0 auto}.change-password-card{border-radius:12px;box-shadow:0 2px 12px #0000000f}.change-password-icon{width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,#1890ff,#096dd9);display:flex;align-items:center;justify-content:center;margin:0 auto 16px}@media(max-width:768px){.change-password-container{max-width:100%}.change-password-icon{width:56px;height:56px}.change-password-icon .anticon{font-size:24px!important}}@media(max-width:480px){.change-password-card{box-shadow:none;border:1px solid #f0f0f0}}.page-container{display:flex;flex-direction:column;gap:16px}.page-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;margin-bottom:8px}.page-header-left{display:flex;align-items:center;gap:16px}.page-header-icon{width:56px;height:56px;border-radius:16px;background:linear-gradient(135deg,#e6f4ff,#bae0ff);display:flex;align-items:center;justify-content:center;font-size:28px;box-shadow:0 2px 8px #1890ff26}[data-theme=dark] .page-header-icon{background:linear-gradient(135deg,#111d2c,#112a45)}.filter-card{border-radius:12px;box-shadow:0 1px 4px var(--shadow-color)}.filter-card .ant-card-body{padding:16px!important}.table-card{border-radius:12px;overflow:hidden;box-shadow:0 1px 4px var(--shadow-color);isolation:isolate}.table-card .ant-table{border-radius:0}.table-card .ant-table-thead>tr>th{background:var(--bg-secondary)!important;font-weight:600;padding:14px 16px}.table-card .ant-table-thead>tr>th.ant-table-cell-fix-left,.table-card .ant-table-thead>tr>th.ant-table-cell-fix-right{z-index:5!important}.table-card .ant-table-tbody>tr>td{padding:12px 16px}.table-card .ant-table-tbody>tr>td.ant-table-cell-fix-left,.table-card .ant-table-tbody>tr>td.ant-table-cell-fix-right{background:var(--bg-primary)!important}.table-row{transition:all .2s ease}.table-row:hover{background:var(--bg-tertiary)!important}.table-card .ant-table-tbody>tr.table-row:hover>td{background:transparent!important}.table-card .ant-table-tbody>tr.table-row:hover>td.ant-table-cell-fix-left,.table-card .ant-table-tbody>tr.table-row:hover>td.ant-table-cell-fix-right,.table-card .ant-table-tbody>tr.table-row:hover>td.ant-table-cell-fix-start,.table-card .ant-table-tbody>tr.table-row:hover>td.ant-table-cell-fix-end{background:var(--bg-tertiary)!important}.table-card .ant-pagination{margin:16px!important}.table-card .ant-empty{padding:48px 0}@media(max-width:768px){.page-header{flex-direction:column;align-items:flex-start}.page-header-icon{width:48px;height:48px;font-size:24px;border-radius:12px}.page-header-left h4{font-size:18px!important}.filter-card .ant-card-body{padding:12px!important}.filter-card .ant-space{width:100%}.filter-card .ant-space .ant-btn{flex:1}.table-card .ant-table-thead>tr>th,.table-card .ant-table-tbody>tr>td{padding:10px 12px}}@media(max-width:480px){.page-header-icon{width:44px;height:44px;font-size:20px}.page-header-left{gap:12px}}.detail-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.detail-hero-card{margin-bottom:24px;border-radius:16px;overflow:hidden}.detail-hero-image{width:100%;aspect-ratio:1;border-radius:12px;overflow:hidden;background:#f0f5ff}.detail-hero-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:64px;background:#f0f5ff}.detail-hero-info{padding:8px 0}.detail-info-list{display:flex;flex-direction:column;gap:16px}.detail-info-item{display:flex;align-items:center;gap:12px}.detail-info-icon{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0}.detail-info-content{display:flex;flex-direction:column;gap:2px}.detail-parent-card{display:flex;align-items:center;gap:16px;padding:16px;border-radius:12px;transition:all .2s ease}.detail-parent-father{background:linear-gradient(135deg,#e6f7ff,#bae7ff)}.detail-parent-father:hover{background:linear-gradient(135deg,#bae7ff,#91d5ff)}.detail-parent-mother{background:linear-gradient(135deg,#fff0f6,#ffadd2)}.detail-parent-mother:hover{background:linear-gradient(135deg,#ffadd2,#ff85c0)}.detail-parent-icon{width:56px;height:56px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:24px;flex-shrink:0}.detail-parent-icon.father{background:linear-gradient(135deg,#1890ff,#096dd9)}.detail-parent-icon.mother{background:linear-gradient(135deg,#eb2f96,#c41d7f)}.detail-parent-info{display:flex;flex-direction:column;gap:2px}.detail-child-card{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 8px;background:var(--bg-secondary);border-radius:12px;cursor:pointer;transition:all .2s ease;border:1px solid var(--border-color)}.detail-child-card:hover{background:var(--bg-tertiary);transform:translateY(-2px);box-shadow:0 4px 12px var(--shadow-color)}.detail-child-emoji{font-size:32px}.detail-child-name{font-size:13px;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}@media(max-width:768px){.detail-hero-image{max-width:200px;margin:0 auto}.detail-hero-info{text-align:center}.detail-hero-info .ant-space,.detail-hero-info .ant-row{justify-content:center}.detail-parent-card{padding:12px}.detail-parent-icon{width:48px;height:48px;font-size:20px}}.pedigree-card{margin-bottom:24px}.pedigree-table-wrapper{overflow-x:auto;padding:16px}.pedigree-table{border-collapse:collapse;width:100%;min-width:600px}.pedigree-td{border:1px solid #e8e8e8;vertical-align:middle;height:1px;padding:0}[data-theme=dark] .pedigree-td{border-color:#424242}.pedigree-cell{padding:8px 12px;height:100%;display:flex;align-items:center;justify-content:center;transition:background-color .2s,box-shadow .2s}.pedigree-cell:hover:not(.pedigree-empty):not(.pedigree-current){box-shadow:inset 0 0 0 2px #1677ff4d}.pedigree-empty-clickable{cursor:pointer}.pedigree-empty-clickable:hover{background-color:#e6f4ff}[data-theme=dark] .pedigree-empty-clickable:hover{background-color:#111d2c}.pedigree-add-icon{font-size:16px;color:#1677ff;margin-bottom:2px}.pedigree-cell-content{display:flex;flex-direction:column;align-items:center;text-align:center;min-width:100px;gap:2px}.pedigree-male{background:#f0f5ff;color:#1d39c4}.pedigree-female{background:#fff0f6;color:#c41d7f}.pedigree-name{font-weight:600;font-size:14px}.pedigree-name-empty{color:#adb5bd;font-style:italic;font-size:12px}.pedigree-uulder{font-size:12px;opacity:.8}.pedigree-year{font-size:11px;opacity:.7}.pedigree-huis{font-size:10px;opacity:.6}.pedigree-empty{background:#fafafa;text-align:center}.pedigree-descendants-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.pedigree-descendants-title{font-weight:600;font-size:13px;color:#595959}.pedigree-current{background:#e6f4ff;border-right:3px solid #1677ff}.pedigree-descendants{padding:16px;border-top:1px solid #e8e8e8}.dtree-root{display:flex;flex-direction:column;align-items:center;overflow-x:auto;padding-bottom:8px}.dtree-branch{display:flex;flex-direction:column;align-items:center;position:relative;padding:0 8px}.dtree-vline{width:2px;height:20px;background:#bfbfbf;flex-shrink:0}.dtree-children{display:flex}.dtree-children>.dtree-branch:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:#bfbfbf}.dtree-children>.dtree-branch:first-child:before{left:50%}.dtree-children>.dtree-branch:last-child:before{right:50%}.dtree-children>.dtree-branch:only-child:before{display:none}.dtree-node{padding:8px 16px;border-radius:8px;border:2px solid;text-align:center;cursor:pointer;white-space:nowrap;transition:box-shadow .15s;position:relative;z-index:1;background:#fff}.dtree-node:hover{box-shadow:0 2px 8px #0000001f}.dtree-node-current{cursor:default}.dtree-node-current:hover{box-shadow:none}.dtree-node-male{border-color:#91caff;background:#e6f4ff}.dtree-node-female{border-color:#ffadd2;background:#fff0f6}.dtree-node-name{font-weight:600;font-size:13px}.dtree-node-male .dtree-node-name{color:#1677ff}.dtree-node-female .dtree-node-name{color:#c41d7f}.dtree-node-meta{font-size:11px;color:#8c8c8c;margin-top:2px}[data-theme=dark] .pedigree-male{background:#111d2c;color:#8db1ff}[data-theme=dark] .pedigree-female{background:#2a1125;color:#f38cb5}[data-theme=dark] .pedigree-empty{background:#1f1f1f}[data-theme=dark] .pedigree-name-empty{color:#6b6b6b}[data-theme=dark] .pedigree-descendants-title{color:#a6a6a6}[data-theme=dark] .pedigree-current{background:#111d2c;border-right-color:#177ddc}[data-theme=dark] .pedigree-descendants{border-top-color:#424242}[data-theme=dark] .dtree-node-male{border-color:#15395b;background:#111d2c}[data-theme=dark] .dtree-node-female{border-color:#441326;background:#2a1125}[data-theme=dark] .dtree-node-male .dtree-node-name{color:#8db1ff}[data-theme=dark] .dtree-node-female .dtree-node-name{color:#f38cb5}[data-theme=dark] .dtree-node-meta{color:#6b6b6b}[data-theme=dark] .dtree-node:hover{box-shadow:0 2px 8px #0006}[data-theme=dark] .dtree-vline,[data-theme=dark] .dtree-children>.dtree-branch:before{background:#424242}