.family-drawer { position:relative; overflow:hidden; min-height:550px; padding:58px 34px 34px; border:12px solid #29353c; border-radius:7px; color:#28251e; background:linear-gradient(90deg,rgba(0,0,0,.32),transparent 7%,transparent 93%,rgba(0,0,0,.28)),repeating-linear-gradient(0deg,rgba(255,255,255,.04) 0 1px,transparent 1px 5px),linear-gradient(135deg,#65747a,#35454d 55%,#202c32); box-shadow:inset 0 0 0 3px #879397,inset 0 0 35px #152026,0 12px 35px rgba(0,0,0,.38); }
.family-drawer::before,.family-drawer::after { position:absolute; top:12px; width:15px; height:15px; border-radius:50%; content:''; background:radial-gradient(circle at 35% 30%,#f1f2df,#556268 58%,#192329 62%); box-shadow:0 505px 0 #26343a; }.family-drawer::before{left:14px}.family-drawer::after{right:14px}
.drawer-handle { position:absolute; top:18px; left:50%; width:min(55%,360px); height:27px; transform:translateX(-50%); border:3px solid #202a2e; border-radius:3px; background:linear-gradient(#c1c8bd,#718087); box-shadow:inset 0 2px #e5e7d7,0 3px 0 #172026; }.drawer-handle span{display:block;padding-top:4px;color:#1b2529;font:bold 10px/1 monospace;text-align:center;letter-spacing:1px}
.drawer-heading{position:relative;z-index:1;margin:0 0 14px;color:#edf0dc;text-shadow:1px 2px #182126}.drawer-heading .document-kicker{color:#d4dfc8}.drawer-heading h2{margin:6px 0 0;font:700 clamp(22px,4vw,34px)/1 Georgia,serif}
.chronology-tabs{position:relative;z-index:2;display:flex;gap:4px;align-items:end;overflow-x:auto;padding:0 6px}.chronology-tabs button{flex:0 0 auto;min-width:66px;padding:9px 12px 8px;border:1px solid #817454;border-bottom:0;border-radius:5px 5px 0 0;color:#3d3425;background:#c8b783;box-shadow:inset 0 1px rgba(255,255,255,.55);font:bold 12px monospace;cursor:pointer}.chronology-tabs button:nth-child(even){background:#b9c4a3}.chronology-tabs button:nth-child(3n){background:#c79576}.chronology-tabs button.active{position:relative;z-index:3;padding-top:13px;color:#192d36;background:#eee4bf}
.chronology-card{position:relative;z-index:1;min-height:325px;margin-top:-1px;padding:29px clamp(20px,5vw,48px) 28px;border:1px solid #927e57;border-radius:2px;background:repeating-linear-gradient(0deg,transparent 0 27px,rgba(91,74,48,.13) 28px 29px),linear-gradient(115deg,rgba(255,255,255,.6),transparent 34%),#eee4bf;box-shadow:8px 10px 0 rgba(13,23,25,.3),inset 0 0 38px rgba(126,95,43,.13);transform:rotate(-.3deg)}
.chronology-card::before{position:absolute;top:17px;right:20px;width:113px;padding:6px 4px;border:2px solid #a34036;color:#a34036;content:attr(data-stamp);font:bold 10px/1.1 monospace;text-align:center;letter-spacing:.8px;transform:rotate(6deg)}.chronology-card header{max-width:calc(100% - 126px);margin-bottom:19px}.chronology-card .file-number{color:#746441;font:bold 11px monospace;letter-spacing:1px}.chronology-card h3{margin:4px 0 0;color:#1b3c4d;font:bold clamp(23px,4vw,32px)/1 Georgia,serif}.chronology-card .subtitle{margin:5px 0 0;color:#7e342e;font:italic 15px Georgia,serif}.chronology-card ul{margin:0;padding-left:21px}.chronology-card li{margin:0 0 10px;font:16px/1.43 Georgia,serif}.family-note{margin:20px 0 0;padding:10px 13px;border-left:4px solid #2e6978;color:#233842;background:rgba(164,199,190,.38);font:14px/1.35 Georgia,serif}.family-note b{font:bold 11px monospace;letter-spacing:.7px}
@media (max-width:560px){.family-drawer{min-height:0;padding:57px 14px 21px;border-width:8px}.drawer-handle{width:63%}.drawer-heading{padding:0 9px}.chronology-card{min-height:0;padding:26px 18px 20px}.chronology-card::before{top:16px;right:14px;width:86px;font-size:8px}.chronology-card header{max-width:calc(100% - 88px)}.chronology-card li{font-size:15px}}
