:root{--bg-color: #000;--text-color: #fff;--accent-color: #fff;--font-serif: "Times New Roman", serif;--font-mono: "Courier Prime", monospace;--timeline-gutter: 100px}#timeline-container{position:absolute;top:50%;left:0;width:100%;height:400px;transform:translateY(-50%);z-index:10;overflow-x:auto;overflow-y:hidden;white-space:nowrap;display:flex;align-items:center;padding:0 var(--timeline-gutter) 0 var(--timeline-gutter);box-sizing:border-box;-webkit-mask-image:linear-gradient(to right,transparent 0,transparent var(--timeline-gutter),black calc(var(--timeline-gutter) + 20px),black calc(100% - var(--timeline-gutter) - 20px),transparent calc(100% - var(--timeline-gutter)),transparent 100%);mask-image:linear-gradient(to right,transparent 0,transparent var(--timeline-gutter),black calc(var(--timeline-gutter) + 20px),black calc(100% - var(--timeline-gutter) - 20px),transparent calc(100% - var(--timeline-gutter)),transparent 100%)}@media (max-width: 768px){:root{--timeline-gutter: 30px}.timeline-item{margin:0 -25px}#timeline-container{height:300px}}body,html{margin:0;padding:0;width:100%;height:100%;background-color:var(--bg-color);color:var(--text-color);overflow:hidden;touch-action:none;font-family:var(--font-serif);user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}#app{position:relative;width:100%;height:100%;user-select:none;-webkit-user-select:none}#oscilloscope{position:absolute;top:0;left:0;width:100%;height:150px;z-index:1;pointer-events:none;opacity:.9}#timeline-container{position:absolute;top:50%;left:0;width:100%;height:400px;transform:translateY(-50%);z-index:10;overflow-x:auto;overflow-y:hidden;white-space:nowrap;display:flex;align-items:center;padding:0 var(--timeline-gutter) 0 var(--timeline-gutter);box-sizing:border-box;mask-image:none;-webkit-mask-image:none;scrollbar-width:none;-ms-overflow-style:none;pointer-events:none}#timeline-container::-webkit-scrollbar{display:none}#scroll-indicator{position:absolute;top:75px;left:0;width:8px;height:8px;background:#fff;border-radius:50%;z-index:100;pointer-events:auto;cursor:grab;box-shadow:0 0 8px #fff;transform:translate(-50%,-50%);transition:transform .1s}#timeline-track{display:flex;align-items:center;padding:0 100px;height:100%;position:relative;box-sizing:border-box}#static-beam{position:fixed;top:50%;left:0;width:100%;height:100%;transform:translateY(-50%);z-index:5;pointer-events:auto;cursor:grab;display:flex;justify-content:center;align-items:center;mix-blend-mode:screen}#static-beam:active{cursor:grabbing}.beam-core{position:absolute;top:50%;transform:translateY(-50%);width:100%;height:230px;z-index:1;transition:height 1.6s ease}.beam-core:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(to bottom,#fff0,#fff 30%,#fff 70%,#fff0);opacity:1;transition:opacity 1s ease}.beam-core:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:#fff;opacity:0;transition:opacity .8s ease}.beam-noise{position:absolute;top:50%;transform:translateY(-50%);width:100%;height:calc(500px + 15rem);z-index:1;opacity:1;--noise-url: url(/ddd/noise.webp);transition:height .8s ease;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:pixelated}.no-animations .beam-noise:before,.no-animations .beam-noise:after{animation-play-state:paused!important}.beam-noise:before,.beam-noise:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:var(--noise-url),var(--noise-url),linear-gradient(to bottom,#000,#757575 20%,#9f9f9f 25%,#fff 45%,#fff 55%,#9f9f9f 75%,#757575 80%,#000);background-blend-mode:overlay;background-size:1000px 1000px,617px 617px,100% 100%;background-repeat:repeat,repeat,no-repeat;-webkit-mask-image:linear-gradient(to bottom,transparent 0%,black 15%,black 85%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 0%,black 15%,black 85%,transparent 100%);animation:static-flicker 1.5s steps(3) infinite}.beam-noise.paused:before,.beam-noise.paused:after{animation-play-state:paused}.beam-noise:before{mix-blend-mode:screen;filter:grayscale(100%) contrast(1000%);opacity:1;transition:opacity .8s ease;z-index:1}.beam-noise:after{mix-blend-mode:multiply;filter:invert(1);opacity:0;transition:opacity .8s ease;z-index:2}#static-beam.expanded,#static-beam.expanded:active{cursor:default}#static-beam.expanded .beam-core{height:100vh;transition:height 1.2s cubic-bezier(.2,0,0,1)}#static-beam.expanded .beam-core:after{opacity:1;transition:opacity 1.5s ease}#static-beam.expanded .beam-noise{height:300vh;transition:height 1.2s cubic-bezier(.2,0,0,1)}@keyframes static-flicker{0%{background-position:calc(var(--scroll-offset, 0px) + 0px) 0,calc(var(--scroll-offset, 0px) + 50px) 50px,0 0}25%{background-position:calc(var(--scroll-offset, 0px) + 317px) -153px,calc(var(--scroll-offset, 0px) - 127px) 200px,0 0}50%{background-position:calc(var(--scroll-offset, 0px) - 482px) 234px,calc(var(--scroll-offset, 0px) + 420px) -100px,0 0}75%{background-position:calc(var(--scroll-offset, 0px) + 129px) 441px,calc(var(--scroll-offset, 0px) - 300px) 150px,0 0}to{background-position:calc(var(--scroll-offset, 0px) + 0px) 0,calc(var(--scroll-offset, 0px) + 50px) 50px,0 0}}*{-webkit-tap-highlight-color:transparent}#detail-content span{width:auto!important;height:auto!important;display:block!important;text-align:center}#detail-content img{max-width:90%!important;max-height:50vh!important;width:auto!important;height:auto!important;display:block!important;margin:1rem auto!important;border-radius:4px;cursor:pointer;transform:none!important}.timeline-item{display:grid;grid-template-columns:max-content auto;align-items:start;gap:0 5px;margin:0 40px;cursor:pointer;transition:transform .3s ease,opacity .5s ease;opacity:0;position:relative;z-index:15;vertical-align:middle;pointer-events:auto}.timeline-date{display:block;position:relative;bottom:auto;left:auto;grid-column:1;grid-row:1;font-family:var(--font-serif);font-size:2rem;line-height:1;margin-bottom:5px;color:#000;text-shadow:none;z-index:20;white-space:nowrap}.timeline-title-block{position:relative;display:inline-block;padding:0;z-index:10;grid-column:2;grid-row:2;margin-left:0;--v-offset: 15px;--square-w: 20px}.timeline-item.visible{opacity:.9}.timeline-item.up{transform:translateY(-50px)}.timeline-item.down{transform:translateY(50px)}.timeline-item:hover{z-index:20;opacity:1}.timeline-item.up:hover{transform:translateY(-50px) scale(1.1)}.timeline-item.down:hover{transform:translateY(50px) scale(1.1)}.bg-square{position:absolute;width:var(--square-w);background:#000;z-index:2;height:100%}.bg-square.left{top:-5px;left:0}.bg-square.right{top:5px;right:0}.bg-rect.mid{position:absolute;top:-5px;left:calc(var(--square-w) - 1px);right:calc(var(--square-w) - 1px);height:calc(100% + 10px);background:#000;z-index:1;clip-path:polygon(0 0,100% 10px,100% 100%,0 calc(100% - 10px))}.title-text{position:relative;z-index:10;color:#fff;font-family:var(--font-serif);font-size:1.6rem;padding:10px;top:-2px;display:block}#logo-container{position:absolute;bottom:0;left:0;width:300px;max-width:50%;height:auto;z-index:20;pointer-events:none}#logo{width:100%;display:block;-webkit-mask-image:linear-gradient(to top,rgba(0,0,0,1) 1%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(to top,#000 1%,#0000)}#overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000e6;z-index:100;display:flex;justify-content:center;align-items:center;opacity:1;transition:opacity .3s ease}#overlay.hidden{opacity:0;pointer-events:none}#overlay-content{width:80%;max-width:800px;max-height:80vh;background:#111;border:1px solid #333;padding:2rem;overflow-y:auto;color:#ddd;font-family:var(--font-serif)}#overlay-content img{max-width:100%;max-height:60vh;width:auto;display:block;margin:1rem auto;object-fit:contain}#close-overlay{position:absolute;top:20px;right:30px;font-size:3rem;color:#fff;background:none;border:none;cursor:pointer}#scroll-indicator{position:absolute;top:75px;left:0;width:8px;height:8px;background:#fff;border-radius:50%;z-index:100;pointer-events:auto;cursor:grab;box-shadow:0 0 8px #fff;transform:translate(-50%,-50%);transition:transform .1s,opacity .5s ease;opacity:0}#scroll-indicator.visible{opacity:1}#scroll-indicator:active{cursor:grabbing;transform:translate(-50%,-50%) scale(1.5)}#scroll-indicator:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:150px;height:150px;background:transparent;z-index:101}@media (max-width: 768px){:root{--timeline-gutter: 30px}.timeline-item{margin:0 -15px}.timeline-item:first-child{margin-left:0}.timeline-date{font-size:1.2rem}.title-text{font-size:.9rem;padding:5px 15px}.beam-core{height:180px}.beam-noise{height:calc(450px + 10rem)}#timeline-container{height:300px}#timeline-track{padding:0 30px 0 85px}}#about-btn{position:fixed;bottom:20px;bottom:calc(20px + env(safe-area-inset-bottom));right:20px;right:calc(20px + env(safe-area-inset-right));background:none;border:none;color:#fff;font-family:var(--font-serif);font-size:1rem;font-weight:500;cursor:pointer;z-index:1000;padding:10px;text-transform:none;pointer-events:auto;opacity:1!important}#about-btn:hover{opacity:.8}.back-button{position:fixed;bottom:30px;left:50%;transform:translate(-50%);z-index:1000;background:#000!important;color:#fff!important;border:1px solid #fff!important;padding:10px 30px;cursor:pointer;font-size:1.2rem;font-family:var(--font-serif);text-transform:uppercase;transition:all .3s ease}@media (max-width: 768px){.back-button{bottom:20px;left:auto;right:20px;transform:none}.back-button:hover{background:#333}}#detail-content::-webkit-scrollbar{display:none}#detail-content{scrollbar-width:none}body.invert-mode #static-beam.expanded .beam-core,body.invert-mode #static-beam.expanded .beam-noise{height:0!important;opacity:0!important;transition:height 1s ease,opacity .5s ease}body.invert-mode #static-beam.expanded .beam-core:after,body.invert-mode #static-beam.expanded .beam-core:before{opacity:0!important}body.invert-mode #detail-content,body.invert-mode #detail-content h2,body.invert-mode #detail-content div,body.invert-mode #detail-content p,body.invert-mode #detail-content span{color:#fff!important}body.invert-mode #detail-scrollbar-dot{background:#fff!important;box-shadow:0 0 8px #fff}#logo-container{position:fixed;bottom:20px;left:20px;width:300px;z-index:1000;pointer-events:none;transition:filter .5s ease}#logo-container img{width:100%;display:block}#logo-container.detail{filter:invert(1)}body.invert-mode #logo-container.detail{filter:none}.stylized-text{display:inline-flex;align-items:center;vertical-align:middle;line-height:1}.st-big{font-size:2em;line-height:.7;align-self:center;position:relative;top:.05em}.st-small{font-size:1.2em;line-height:1;margin:0 1px;top:.06em;font-weight:500;position:relative}.st-detail .st-big,.st-detail .st-small{font-weight:600!important}.st-big{white-space:pre}#detail-content .stylized-text{display:inline-flex!important;flex-wrap:nowrap!important;justify-content:center;width:auto!important;gap:0}#detail-content .st-big,#detail-content .st-small{display:inline-block!important;width:auto!important;margin:0 1px!important}.detail-date{font-family:var(--font-serif);font-size:1.3rem;color:#ccc;margin-bottom:10px;display:block;width:100%;text-align:center;font-weight:600}

/* --- INTERVIEW FIX --- */
.interview-table { 
    width: 100%; 
    border-collapse: collapse;
    /* Fixed layout helps keep columns stable */
    table-layout: fixed; 
}

.interview-row td { 
    vertical-align: top; 
    padding: 10px; 
    text-align: left !important;
    word-wrap: break-word; /* Prevents text from pushing columns off-screen */
}

/* 1. Handle the Portrait Column */
/* If a row has 3 columns, make the first one (the image) small */
.interview-row td:first-child:nth-last-child(3) {
    width: 80px;
}

/* 2. Handle the Merged Columns (Headings/Banners) */
/* Ensures merged columns ignore the width restrictions of the split columns */
.interview-row td[colspan="3"] {
    width: 100%;
    text-align: center !important;
}

/* 3. Global alignment for specific elements */
.interview-heading { 
    font-size: 1.5em; 
    font-weight: bold; 
    display: block; 
    margin-bottom: 15px; 
    text-align: center !important;
}

.interview-question { 
    font-size: 1.2em; 
    font-weight: bold; 
    display: block; 
    margin-top: 20px; 
    margin-bottom: 10px; 
    text-align: left !important;
}

.speaker-name { 
    font-weight: bold; 
    color: #fff; 
    display: inline !important;
}

/* Force left-alignment for text inside cells */
#detail-content .interview-row td span { 
    text-align: left !important; 
    display: inline !important; 
}

/* Exception: Keep the "◇" and Headings centered */
#detail-content .interview-row td .interview-heading {
    text-align: center !important;
    display: block !important;
}