*,*:before,*:after{box-sizing:border-box}:root{--background-color: #ffffff;--text-color: #333333;--header-color: #1a1a1a;--accent-color: #000000;--border-color: #000000;--font-main: "Space Grotesk", sans-serif;--font-size-small: .8rem;--font-size-normal: 1rem;--font-size-medium: 1.2rem;--font-size-large: 1.8rem;--spacing-unit: 20px;--border-width-thin: 1px;--border-width-medium: 2px;--border-width-thick: 4px;--border-radius-sm: 4px;--border-radius-md: 8px;--border-radius-lg: 12px;--color-shadow: rgba(0, 0, 0, .1)}body{font-family:var(--font-main);margin:0;padding:0;background-color:var(--background-color);color:var(--text-color);line-height:1.6;font-size:var(--font-size-normal);height:100vh;width:100vw;display:flex;justify-content:center;align-items:flex-start;padding-top:35vh}.container{width:80vw;max-width:2000px;display:flex;flex-direction:column;gap:calc(var(--spacing-unit) * 3);padding:var(--spacing-unit);border:1px solid black}.main-header{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-unit);border:none;background:transparent;width:100%;margin-bottom:0}.header-left .site-title{font-size:var(--font-size-large);margin:0;font-weight:500;color:var(--header-color);border:none;padding:0;text-align:left}.header-right{display:flex;gap:calc(var(--spacing-unit) * 1.5);align-items:center}.nav-item{position:relative}.nav-button{background:none;border:1px solid var(--border-color);padding:calc(var(--spacing-unit) * .5) var(--spacing-unit);font-family:var(--font-main);font-size:var(--font-size-normal);color:var(--text-color);cursor:pointer;transition:all .2s ease}.nav-button:hover{background-color:var(--accent-color);color:var(--background-color)}.popup{position:absolute;top:100%;right:0;background:var(--background-color);border:1px solid var(--border-color);padding:var(--spacing-unit);margin-top:10px;z-index:1000;min-width:300px;max-width:400px;box-shadow:0 4px 8px var(--color-shadow)}.popup p{margin:0;font-size:var(--font-size-small);line-height:1.5}.popup a{color:var(--accent-color);text-decoration:none}.popup a:hover{text-decoration:underline}h1,h2,h3{font-family:var(--font-main);color:var(--header-color);margin-top:0;font-weight:500}h2{font-size:var(--font-size-medium);color:var(--accent-color);margin-bottom:calc(var(--spacing-unit) / 2);border-bottom:1px solid var(--e0e0e0);padding-bottom:calc(var(--spacing-unit) / 4)}h3{font-size:var(--font-size-normal);font-weight:700;margin-bottom:calc(var(--spacing-unit) / 4)}p,li{font-size:var(--font-size-small);margin-bottom:calc(var(--spacing-unit) / 2)}.header-subtitle{text-align:center;font-size:var(--font-size-small);margin-top:-15px;color:#777}ul{list-style:none;padding-left:0}li{margin-bottom:calc(var(--spacing-unit) / 4);padding-left:var(--spacing-unit);position:relative}li:before{content:"▹";position:absolute;left:0;color:var(--accent-color)}a{color:var(--accent-color);text-decoration:none;font-weight:700;background-color:var(--background-color)}a:hover{text-decoration:underline}.bio{font-size:var(--font-size-small);font-style:italic;text-align:justify;padding-inline:var(--spacing-unit);border-left:3px solid var(--accent-color);background-color:var(--background-color)}#testvideo video{width:100%;height:auto;max-height:500px;object-fit:contain;display:block;background-color:#f0f0f0}.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--spacing-unit)}.info-grid>div{border:1px solid var(--border-color);padding:var(--spacing-unit);background-color:var(--background-color)}footer{text-align:center;font-size:var(--font-size-small);padding:var(--spacing-unit);border-top:2px solid var(--accent-color)}.project-card{background-color:var(--background-color);border:1px solid var(--border-color);border-radius:var(--border-radius-md);overflow:hidden;transition:transform .3s ease,box-shadow .3s ease}.project-card:hover{transform:translateY(-5px);box-shadow:0 8px 25px var(--color-shadow)}.project-image{width:100%;height:200px;overflow:hidden;background-color:#f0f0f0}.project-image img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.project-card:hover .project-image img{transform:scale(1.05)}.project-content{padding:var(--spacing-unit)}.project-title{font-size:var(--font-size-medium);font-weight:600;color:var(--header-color);margin:0 0 calc(var(--spacing-unit) / 2) 0}.project-description{font-size:var(--font-size-small);color:var(--text-color);line-height:1.5;margin:0}@media (max-width: 768px){.project-grid{grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(3,auto);gap:var(--spacing-unit)}.project-image{height:150px}.project-content{padding:calc(var(--spacing-unit) * .75)}}@media (max-width: 480px){.project-grid{grid-template-columns:1fr;grid-template-rows:repeat(6,auto);gap:calc(var(--spacing-unit) * .75)}.project-image{height:180px}.project-content{padding:calc(var(--spacing-unit) * .6)}.project-title{font-size:var(--font-size-normal)}}.project-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:calc(var(--spacing-unit) * 3);width:100%}.project-button{border:1px solid var(--border-color);background:var(--background-color);cursor:pointer;transition:all .3s ease;overflow:hidden;display:flex;flex-direction:column}.project-button:not(.expanded){height:60px}.project-button.expanded{height:auto}.project-button:hover{border-color:var(--accent-color)}.project-title{padding-top:calc(var(--spacing-unit) / 2);padding-left:calc(var(--spacing-unit) / 2);padding-right:calc(var(--spacing-unit) / 2);padding-bottom:calc(var(--spacing-unit) / 2);font-weight:500;font-size:var(--font-size-medium);color:var(--header-color);text-align:center;display:flex;align-items:center;justify-content:center;flex:none;height:60px;margin:0}.project-preview{padding-left:calc(var(--spacing-unit) / 2);padding-right:calc(var(--spacing-unit) / 2);padding-top:0;padding-bottom:var(--spacing-unit);background:var(--background-color);animation:expandDown .3s ease}@keyframes expandDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.project-thumbnail{width:100%;height:auto;object-fit:cover;margin-bottom:calc(var(--spacing-unit) * .5);border:1px solid var(--border-color)}.project-info h3{margin:0 0 calc(var(--spacing-unit) * .5) 0;font-size:var(--font-size-normal);color:var(--header-color)}.project-info p{margin:0;font-size:var(--font-size-small);color:var(--text-color);line-height:1.4}.webllm-dropdown{padding:calc(var(--spacing-unit) / 2);background:var(--background-color);animation:expandDown .3s ease;display:flex;flex-direction:column;gap:calc(var(--spacing-unit) / 2)}.dropdown-button{background:none;border:1px solid var(--border-color);padding:calc(var(--spacing-unit) * .5) var(--spacing-unit);font-family:var(--font-main);font-size:var(--font-size-small);color:var(--text-color);cursor:pointer;transition:all .2s ease;text-align:center;border-radius:0}.dropdown-button:hover{background-color:var(--accent-color);color:var(--background-color);border-color:var(--accent-color)}#philosophy-compass{margin-top:calc(var(--spacing-unit) * 2)}.compass-description{text-align:center;font-style:italic;color:var(--text-color);margin-bottom:calc(var(--spacing-unit) * 1.5)}.compass-container{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-unit);width:100%;margin:0 auto;padding:0 10px;overflow-x:hidden}.compass-grid{position:relative;width:45vw;height:45vw;max-width:400px;max-height:400px;min-width:220px;min-height:220px;border:2px solid var(--border-color);background:linear-gradient(135deg,#c0d8b91a,#ffffff4d);border-radius:var(--border-radius-md);-webkit-user-select:none;user-select:none;cursor:crosshair}.axis-label{position:absolute;font-weight:600;color:var(--header-color);pointer-events:none;font-size:clamp(.5rem,1.5vw,.8rem)}.axis-top{top:0;left:50%;transform:translate(-50%)}.axis-bottom{bottom:0;left:50%;transform:translate(-50%)}.axis-left{left:2%;top:53%;transform:translateY(-50%)}.axis-right{right:2%;top:53%;transform:translateY(-50%)}.grid-lines{position:absolute;width:100%;height:100%;pointer-events:none}.grid-line{position:absolute;background-color:var(--border-color);opacity:.3}.grid-line.horizontal{width:100%;height:1px;transform:translateY(-50%)}.grid-line.vertical{height:100%;width:1px;transform:translate(-50%)}.compass-point{position:absolute;width:20px;height:20px;transform:translate(-50%,-50%);z-index:10;transition:transform .1s ease}.compass-point:hover{transform:translate(-50%,-50%) scale(1.2)}.point-inner{width:100%;height:100%;background:radial-gradient(circle,var(--accent-color) 60%,transparent 60%);border:3px solid var(--background-color);border-radius:50%;box-shadow:0 2px 8px #0000004d}.position-display{text-align:center;padding:var(--spacing-unit);background-color:var(--background-color);border:1px solid var(--border-color);border-radius:var(--border-radius-md);min-width:300px}.position-display p{margin-bottom:var(--spacing-unit);font-size:var(--font-size-small)}.find-quote-btn{background-color:var(--accent-color);color:var(--background-color);border:none;padding:calc(var(--spacing-unit) * .75) calc(var(--spacing-unit) * 1.5);border-radius:var(--border-radius-sm);font-family:var(--font-main);font-size:var(--font-size-small);font-weight:600;cursor:pointer;transition:all .3s ease}.find-quote-btn:hover:not(:disabled){background-color:var(--header-color);transform:translateY(-2px);box-shadow:0 4px 12px #0003}.find-quote-btn:disabled{opacity:.6;cursor:not-allowed}.quote-display{margin-top:calc(var(--spacing-unit) * 2);padding:calc(var(--spacing-unit) * 1.5);background-color:var(--background-color);border-left:4px solid var(--accent-color);border-radius:var(--border-radius-md);max-width:600px;margin-left:auto;margin-right:auto;display:flex;align-items:center;gap:calc(var(--spacing-unit) * 1.5)}.philosopher-photo{width:100px;height:100px;border-radius:50%;overflow:hidden;border:3px solid var(--border-color);flex-shrink:0;box-shadow:0 4px 12px #0000001a}.philosopher-photo img{width:100%;height:100%;object-fit:cover}.quote-content{flex-grow:1}.quote-display blockquote{font-size:var(--font-size-medium);font-style:italic;line-height:1.6;margin:0 0 var(--spacing-unit) 0;color:var(--header-color)}.quote-display cite{font-size:var(--font-size-normal);font-weight:600;color:var(--accent-color);font-style:normal}.quote-context{font-size:var(--font-size-small);color:var(--text-color);margin-top:calc(var(--spacing-unit) * .5);opacity:.8}.compass-and-timeline{display:flex;align-items:center;justify-content:center;width:100%}.timeline-spacer{width:4vw;max-width:30px;min-width:10px;flex-shrink:0}.timeline-container{position:absolute;left:102%;scale:.8;height:45vw;max-height:400px;min-height:220px}.timeline-pointer{position:absolute;left:20%;transform:translateY(-50%);z-index:3;transition:top .2s ease;-webkit-user-select:none;user-select:none;display:flex;align-items:center;justify-content:center}.triangle-icon{width:0;height:0;border-left:10px solid var(--accent-color);border-top:8px solid transparent;border-bottom:8px solid transparent}.timeline-track{position:relative;width:clamp(30px,6vw,60px);height:100%;background:linear-gradient(to bottom,var(--border-color) 0%,var(--border-color) 100%);background-size:2px 100%;background-repeat:no-repeat;background-position:center;cursor:pointer}.timeline-marker{position:absolute;left:0;width:100%;transform:translateY(-50%);display:flex;align-items:center}.marker-tick{width:10px;height:2px;background-color:var(--text-color);margin-left:calc(50% - 1px)}.marker-label{position:absolute;left:clamp(35px,7vw,70px);font-size:clamp(.5rem,1.5vw,.75rem);color:var(--text-color);white-space:nowrap;-webkit-user-select:none;user-select:none}@media (max-width: 768px){.main-header{flex-direction:column;gap:var(--spacing-unit);align-items:flex-start}.header-right{align-self:stretch;justify-content:space-between}.popup{right:auto;left:0;min-width:280px}.project-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 480px){.project-grid{grid-template-columns:1fr}.popup{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);min-width:90vw;max-width:90vw}}.p1-highlight{outline:7px solid #86d2e1;outline-offset:0px;background-color:#86d2e1}.p1-highlight .project-preview{background-color:#86d2e1}