:root{
  --bg:#0a1120;
  --bg2:#0e1830;
  --panel:#101a2c;
  --panel2:#16233e;
  --text:#eaf1ff;
  --muted:#94a3b8;
  --line:#2b3b5a;
  --accent:#56d6b2;
  --accent2:#74a7ff;
  --danger:#ff6b6b;
  --shadow:0 18px 40px rgba(0,0,0,.28);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:Inter,Arial,sans-serif;background:linear-gradient(180deg,var(--bg),var(--bg2));color:var(--text)}
a{text-decoration:none;color:inherit}
input,select,textarea,button{font:inherit}
button{cursor:pointer}
[hidden]{display:none !important}
.wrap{max-width:1440px;margin:0 auto;padding:0 16px}
.site-header{position:sticky;top:0;z-index:20;background:rgba(10,17,32,.84);backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.06)}
.site-header.compact{padding:8px 0}
.header-row{display:flex;justify-content:space-between;align-items:center;gap:16px}
.header-row h1{margin:0;font-size:clamp(1rem,2vw,1.35rem)}
.header-row p{margin:.2rem 0 0;color:var(--muted);font-size:.9rem;max-width:720px}
.public-main{padding:12px 16px 24px}
.card{background:rgba(16,26,44,.92);border:1px solid rgba(255,255,255,.07);border-radius:18px;box-shadow:var(--shadow)}
.btn{border:none;background:linear-gradient(135deg,var(--accent),#3ec7c0);color:#08211c;padding:11px 16px;border-radius:12px;font-weight:700}
.btn-outline{background:transparent;color:var(--text);border:1px solid var(--line)}
.btn-soft{background:#162742;color:var(--text)}
.btn-danger{background:rgba(255,107,107,.15);color:#ffd9d9}
.full{width:100%}
.icon-btn{background:transparent;border:none;color:var(--text);font-size:1.1rem}
.muted{color:var(--muted)}
.small{font-size:.86rem}
.gap{gap:12px}
.row-between{display:flex;justify-content:space-between;align-items:center}
.stack{display:grid;gap:12px}
.clean-list{margin:0;padding-left:18px}
.clean-list li{margin:.35rem 0}
.filter-bar{display:grid;grid-template-columns:minmax(220px,1.6fr) repeat(2,minmax(160px,1fr)) auto;gap:10px;padding:12px;position:sticky;top:53px;z-index:12}
.filter-bar input,.filter-bar select,.compact-form input,.compact-form select,.compact-form textarea,.grid-form input,.grid-form select,.grid-form textarea,.login-card input{width:100%;padding:11px 13px;border-radius:12px;border:1px solid var(--line);background:#0d1629;color:var(--text)}
textarea{resize:vertical;min-height:110px}

.tree-shell{padding:18px;overflow-x:auto;overflow-y:visible;min-height:55vh;-webkit-overflow-scrolling:touch}
.tree-root{display:flex;flex-direction:column;align-items:flex-start;gap:22px;min-width:max-content;padding-bottom:16px}
.tree-node{position:relative;display:flex;flex-direction:column;align-items:center;gap:18px;flex:0 0 auto}
.tree-node::after{content:'';position:absolute;top:100%;left:50%;transform:translateX(-50%);width:2px;height:18px;background:var(--line)}
.tree-node.collapsed::after,.tree-node:not(:has(.children-rail))::after{display:none}
.children-rail{position:relative;padding-top:12px;width:max-content;min-width:100%}
.children-rail::before{content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);width:2px;height:12px;background:var(--line)}
.children-row{display:flex;align-items:flex-start;gap:18px;position:relative;padding-top:18px;width:max-content;flex-wrap:nowrap}
.children-row::before{content:'';position:absolute;top:0;left:24px;right:24px;height:2px;background:var(--line)}
.children-row > .tree-node::before{content:'';position:absolute;top:-18px;left:50%;transform:translateX(-50%);width:2px;height:18px;background:var(--line)}
.tree-node.collapsed > .children-rail{display:none}

.family-card{min-width:290px;max-width:370px;width:100%;padding:16px;position:relative;background:linear-gradient(180deg,#13203a,#101a2d);border:1px solid #22304d;overflow:visible}
.family-card.couple .family-body{display:grid;grid-template-columns:1fr 20px 1fr;gap:12px;align-items:start}
.family-card.single .family-body{display:block}
.family-body{margin-top:10px}
.person-head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.person-head strong{font-size:1.02rem;display:block}
.person-meta{font-size:.75rem;color:var(--muted)}
.person-mini{appearance:none;-webkit-appearance:none;width:100%;text-align:left;background:transparent;border:none;color:var(--text);padding:0;cursor:pointer}
.person-mini:hover strong{color:#9cc7ff}
.person-mini p{margin:.45rem 0 0;color:#cfdbef;font-size:.9rem;line-height:1.45}
.person-mini small{display:block;margin-top:4px;color:var(--muted)}
.badges{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0 6px}
.badge{display:inline-flex;padding:5px 9px;border-radius:999px;background:#1a2b47;color:#dce8ff;font-size:.74rem}
.muted-badge{background:#18273e;color:#c6d5ee}
.spouse-link{width:20px;height:2px;background:linear-gradient(90deg,var(--line),var(--accent),var(--line));align-self:center;margin-top:38px}
.generation-chip{position:absolute;left:12px;top:-12px;background:#0c1830;border:1px solid #2b4368;border-radius:999px;padding:5px 10px;font-size:.74rem;color:#bdd2f4}
.collapse-toggle{position:absolute;top:10px;right:10px;background:#0d1730;border:1px solid var(--line);color:var(--text);border-radius:10px;padding:3px 8px}
.node-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.action-circle{border:none;background:#172945;color:#e9f4ff;border-radius:12px;padding:8px 10px;font-size:.82rem;font-weight:700}
.action-circle.danger{background:rgba(255,107,107,.15);color:#ffd7d7}
.family-card{transition:transform .15s ease, box-shadow .15s ease}
.family-card:hover{transform:translateY(-2px);box-shadow:0 22px 44px rgba(0,0,0,.3)}

.support-modal,.person-modal{position:fixed;inset:0;background:rgba(4,9,18,.68);display:grid;place-items:center;padding:18px;z-index:50}
.modal-panel{width:min(680px,100%);padding:18px}
.modal-panel.wide,.info-modal-panel{width:min(980px,100%)}
.modal-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:8px}
.contact-box{display:flex;gap:14px;flex-wrap:wrap;color:var(--muted);margin:.5rem 0 1rem}
.form-msg{min-height:22px;color:#bde7d9}
.hidden-admin-link{position:fixed;right:8px;bottom:8px;opacity:.05;font-size:2rem}
.login-page{min-height:100vh;display:grid;place-items:center;padding:20px}
.login-card{width:min(420px,100%);padding:24px;display:grid;gap:14px}
.text-link{color:#cbe0ff}
.error-box,.empty-state{padding:14px;border-radius:14px;background:#14223b;color:#c9d8f0}
.admin-body{min-height:100vh}
.admin-layout{display:grid;grid-template-columns:290px 1fr;min-height:100vh}
.sidebar{padding:20px;border-right:1px solid rgba(255,255,255,.06);background:#0a1324;display:flex;flex-direction:column;gap:18px}
.sidebar nav{display:grid;gap:10px}
.nav-btn{background:#111c31;border:1px solid var(--line);color:var(--text);padding:12px 14px;border-radius:14px;text-align:left}
.nav-btn.active{background:#162845;border-color:#365786}
.admin-content{padding:20px;min-width:0}
.tab-panel{display:none}.tab-panel.active{display:block}
.section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.form-card,.support-item,.list-row{padding:16px}
.compact-list{display:grid;gap:10px}
.support-item.read{opacity:.82}
.row-actions{display:flex;gap:10px;flex-wrap:wrap}
.grid-form{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.full-span{grid-column:1/-1}
.drag-hint{font-size:.85rem;color:var(--muted);margin-top:-6px}
.family-drop-target{outline:2px dashed var(--accent2);outline-offset:4px}
.settings-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:18px}
.info-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.info-item{padding:14px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:#0c1629}
.info-item span{display:block;font-size:.8rem;color:var(--muted);margin-bottom:6px}
.info-item p,.info-item strong{margin:0;line-height:1.5}
.info-item.full{grid-column:1/-1}
.list-row{display:flex;justify-content:space-between;align-items:center;border:1px solid rgba(255,255,255,.06);border-radius:14px;background:#101b31;gap:12px}

@media (max-width:1080px){
  .admin-layout{grid-template-columns:1fr}
  .sidebar{position:sticky;top:0;z-index:30}
  .grid-2,.settings-grid{grid-template-columns:1fr}
  .family-card{min-width:270px}
}

@media (max-width:760px){
  .site-header.compact{padding:8px 0}
  .header-row{align-items:flex-start;flex-direction:column}
  .wrap{padding:0 12px}
  .public-main{padding:10px 12px 20px}
  .filter-bar{grid-template-columns:1fr;top:52px}
  .tree-shell{padding:12px;overflow-x:hidden}
  .tree-root{min-width:0;width:100%;align-items:stretch}
  .tree-node,.tree-root>.tree-node{width:100%;align-items:stretch}
  .children-rail{width:100%;min-width:0}
  .children-row{display:grid;grid-template-columns:1fr;gap:14px;width:100%}
  .children-row::before,.children-row>.tree-node::before,.tree-node::after,.children-rail::before{display:none}
  .family-card{min-width:0;max-width:none;width:100%}
  .family-card.couple .family-body{grid-template-columns:1fr}
  .spouse-link{display:none}
  .grid-form,.info-grid{grid-template-columns:1fr}
  .node-actions{display:grid;grid-template-columns:1fr 1fr}
  .action-circle{width:100%}
}


/* Revize v8: yatay taşma kontrollü, orta ekran düzeni daha dengeli */
.public-main{max-width:100%;}
.tree-shell{width:100%;overflow:auto hidden;}
.tree-root{display:inline-flex;flex-direction:column;align-items:flex-start;min-width:100%;width:max-content;}
.tree-root > .tree-node{margin-right:24px;}
.tree-node{align-items:flex-start;}
.children-rail{padding-top:14px;min-width:max-content;width:max-content;}
.children-row{gap:16px;}
.family-card{min-width:320px;max-width:320px;}
.family-card.couple .family-body{grid-template-columns:minmax(0,1fr) 16px minmax(0,1fr);gap:10px;}
.person-head strong{font-size:.98rem;line-height:1.2;}
.person-mini p{font-size:.85rem;}
.node-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
.action-circle{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.modal-inline-actions{margin-top:14px;display:flex;justify-content:flex-end;}

@media (max-width:1320px){
  .wrap{max-width:none;padding:0 14px;}
  .family-card{min-width:288px;max-width:288px;padding:14px;}
  .children-row{gap:12px;}
  .node-actions{grid-template-columns:repeat(2,minmax(0,1fr));}
  .action-circle{font-size:.78rem;padding:8px 8px;}
}

@media (max-width:980px){
  .filter-bar{grid-template-columns:minmax(180px,1.2fr) repeat(2,minmax(140px,1fr)) auto;}
  .tree-shell{padding:14px 10px 18px;}
  .tree-root{min-width:max-content;width:max-content;}
  .family-card{min-width:250px;max-width:250px;}
  .family-card.couple .family-body{grid-template-columns:1fr;}
  .spouse-link{display:none;}
  .node-actions{grid-template-columns:1fr 1fr;}
}

@media (max-width:760px){
  .tree-shell{overflow:auto;}
  .tree-root{display:flex;min-width:0;width:100%;}
  .tree-node,.tree-root>.tree-node{width:100%;align-items:stretch;margin-right:0;}
  .children-rail,.children-row{width:100%;min-width:0;}
  .children-row{display:grid;grid-template-columns:1fr;gap:14px;}
  .family-card{min-width:0;max-width:none;width:100%;}
  .person-head{gap:8px;}
  .node-actions{grid-template-columns:1fr;}
}