:root{--bg:#000;--fg:#fff;--muted:#bbb;--overlay:0 0 0;--overlay-alpha:.7;--overlay-extend:40px;--gutter:clamp(16px, 4vw, 48px)}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--fg);-webkit-font-smoothing:antialiased;margin:0;font-family:system-ui,-apple-system,Helvetica Neue,sans-serif;overflow:hidden}.viewer{cursor:grab;touch-action:none;position:fixed;inset:0}.viewer:active{cursor:grabbing}.viewer canvas{width:100%;height:100%;display:block}.overlay{z-index:2;--solid:rgb(var(--overlay) / var(--overlay-alpha));position:fixed;left:0;right:0}.site-header{padding:20px var(--gutter) calc(20px + var(--overlay-extend));background:linear-gradient(to bottom, var(--solid), transparent);justify-content:space-between;align-items:flex-start;gap:24px;display:flex;top:0}.site-nav{gap:clamp(14px,2.5vw,28px);padding-top:4px;display:flex}.site-nav a{color:var(--muted);white-space:nowrap;font-size:14px;text-decoration:none;transition:color .2s}.site-nav a:hover,.site-nav a:focus-visible,.site-nav a[aria-current=page]{color:var(--fg)}.site-title{color:inherit;letter-spacing:.02em;font-size:20px;font-weight:600;text-decoration:none}.site-subtitle{color:var(--muted);margin:4px 0 0;font-size:14px}.stage-caption{padding:calc(16px + var(--overlay-extend)) var(--gutter) 16px;background:linear-gradient(to top, var(--solid), transparent);grid-template-columns:minmax(0,1fr) auto;align-items:baseline;row-gap:12px;display:grid;bottom:0}.breadcrumb{align-items:center;gap:14px;display:flex}.breadcrumb-sep{background:#ffffff40;width:1px;height:16px}#category-picker .picker-label{color:var(--muted)}#category-picker .picker-toggle:hover .picker-label,#category-picker .picker-toggle:focus-visible .picker-label,#category-picker .picker-toggle[aria-expanded=true] .picker-label{color:var(--fg)}.picker{position:relative}.picker-toggle{color:inherit;font:inherit;cursor:pointer;background:0 0;border:0;border-radius:6px;align-items:center;gap:6px;margin:-6px -8px;padding:6px 8px;transition:background-color .2s;display:flex}.picker-toggle:hover,.picker-toggle:focus-visible{background:#ffffff14}.picker-toggle svg{fill:none;width:16px;height:16px;stroke:var(--muted);stroke-width:1.75px;stroke-linecap:round;stroke-linejoin:round;transition:rotate .2s}.picker-toggle[aria-expanded=true] svg{rotate:180deg}.picker-label{font-size:15px;font-weight:500}.picker-menu{background:#121212eb;border:1px solid #ffffff14;border-radius:10px;min-width:200px;margin:0;padding:6px;list-style:none;position:absolute;bottom:calc(100% + 12px);left:-8px;box-shadow:0 12px 32px #00000080}.picker-menu[hidden]{display:none}.picker-menu [role=option]{color:var(--muted);cursor:pointer;border-radius:6px;outline:none;padding:8px 12px;font-size:14px}.picker-menu [role=option]:hover,.picker-menu [role=option]:focus-visible{color:var(--fg);background:#ffffff14}.picker-menu [role=option][aria-selected=true]{color:var(--fg);font-weight:500}.scene-count{color:var(--muted);font-variant-numeric:tabular-nums;font-size:13px}.footer-end{align-items:center;gap:20px;margin-left:auto;display:flex}.social{gap:4px;margin:-8px -8px -8px 0;display:flex}.social a{width:34px;height:34px;color:var(--muted);border-radius:50%;place-items:center;transition:color .2s,background-color .2s;display:grid}.social a:hover,.social a:focus-visible{color:var(--fg);background:#ffffff14}.social svg{fill:currentColor;width:18px;height:18px}.social svg.stroke{fill:none;stroke:currentColor;stroke-width:1.6px;stroke-linejoin:round}.page{z-index:1;padding:130px var(--gutter) 110px;position:fixed;inset:0;overflow-y:auto}.page[hidden]{display:none}.page-inner{max-width:900px;margin:0 auto}.resume{flex-direction:column;align-items:center;gap:20px;display:flex}.resume img{border-radius:4px;width:100%;max-width:850px;height:auto;display:block;box-shadow:0 12px 40px #0009}.page-button{color:var(--fg);border:1px solid #ffffff40;border-radius:999px;padding:9px 18px;font-size:14px;text-decoration:none;transition:background-color .2s,border-color .2s}.page-button:hover,.page-button:focus-visible{background:#ffffff14;border-color:#ffffff80}.about{grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:center;gap:clamp(24px,5vw,56px);display:grid}.about img{border-radius:6px;width:100%;height:auto;display:block}.about-text h1{margin:0 0 18px;font-size:28px;font-weight:600}.about-text p{color:#cfcfcf;margin:0 0 16px;font-size:16px;line-height:1.65}.about-text .about-contact{color:var(--muted);margin-top:24px;font-size:14px}.about-contact a{color:var(--fg)}@media (width<=720px){.about{grid-template-columns:1fr}.about img{max-width:420px}}:root{--display-top:104px;--display-bottom:150px}.media-stage{inset:var(--display-top) var(--gutter) var(--display-bottom);z-index:1;pointer-events:none;grid-template:minmax(0,1fr)/minmax(0,1fr);place-items:center;display:grid;position:fixed}.media-stage :is(img,video){pointer-events:auto;max-width:100%;max-height:100%;display:block;box-shadow:0 12px 40px #0009}.miris-stage{z-index:1;cursor:grab;touch-action:none;position:fixed;inset:0}.miris-stage[hidden]{display:none}.miris-stage:active{cursor:grabbing}.miris-stage canvas{width:100%;height:100%;display:block}.miris-stage[data-status]:not([data-status=""]):after{content:attr(data-status);color:var(--muted);pointer-events:none;place-items:center;font-size:13px;display:grid;position:absolute;inset:0}.caption{text-shadow:0 1px 8px #000c;grid-column:1/-1}.caption p{margin:0}.caption p:empty{display:none}.caption:not(:has(p:not(:empty))){display:none}.caption p{color:#c4c4c4;font-size:13px;line-height:1.5}.caption-intro{margin-bottom:4px!important}.caption a{color:inherit;text-underline-offset:2px;-webkit-text-decoration:underline #c4c4c480;text-decoration:underline #c4c4c480}.caption a:hover{color:var(--fg)}body:not([data-page=portfolio]) :is(.breadcrumb,.scene-count,.carousel-arrow,.media-stage,.miris-stage,.caption,.viewer-status),body[data-item=media] .viewer-status{display:none}.carousel-arrow{z-index:2;width:48px;height:48px;color:var(--fg);opacity:.55;cursor:pointer;background:0 0;border:0;border-radius:50%;place-items:center;padding:0;transition:opacity .2s,background-color .2s;display:grid;position:fixed;top:50%;translate:0 -50%}.carousel-arrow:hover,.carousel-arrow:focus-visible{opacity:1;background:#ffffff14}.carousel-arrow.prev{left:calc(var(--gutter) - 12px)}.carousel-arrow.next{right:calc(var(--gutter) - 12px)}.carousel-arrow svg{fill:none;stroke:currentColor;stroke-width:1.5px;stroke-linecap:round;stroke-linejoin:round;width:28px;height:28px}.viewer-status[hidden]{display:none}.viewer-status{color:var(--muted);pointer-events:none;place-items:center;font-size:13px;display:grid;position:absolute;inset:0}.viewer-stats{top:136px;left:var(--gutter);opacity:.9;cursor:pointer;z-index:1;position:absolute}.debug-panel{top:96px;right:var(--gutter);z-index:3;width:300px;max-height:calc(100% - 200px);color:var(--fg);background:#0e0e0eeb;border:1px solid #ffffff1a;border-radius:10px;padding:12px 14px;font-size:12px;position:fixed;overflow:auto;box-shadow:0 12px 32px #00000080}.debug-panel[hidden]{display:none}.debug-panel header{align-items:baseline;gap:8px;margin-bottom:10px;display:flex}.debug-panel header span{color:var(--muted);flex:1}.debug-panel kbd{color:var(--muted);font:inherit;border:1px solid #fff3;border-radius:4px;padding:1px 5px}.debug-check{flex-wrap:wrap;align-items:center;gap:6px;margin:6px 0;display:flex}.debug-check small{width:100%;color:var(--muted);padding-left:22px}.debug-panel fieldset{border:0;flex-wrap:wrap;align-items:center;gap:6px;margin:10px 0 0;padding:0;display:flex}.debug-panel legend{color:var(--muted);margin-bottom:4px;padding:0}.debug-panel input[type=number]{width:0;min-width:0;color:inherit;font:inherit;font-variant-numeric:tabular-nums;background:#ffffff0d;border:1px solid #ffffff1f;border-radius:5px;flex:1;padding:4px 6px}.debug-limit{flex:40%;align-items:center;gap:6px;display:flex}.debug-limit label{min-width:0;color:var(--muted);flex:1;align-items:center;gap:6px;display:flex}.debug-limits .debug-check{width:100%;margin:0 0 2px}.debug-panel button{color:inherit;font:inherit;cursor:pointer;background:#ffffff0f;border:1px solid #ffffff26;border-radius:5px;padding:4px 8px}.debug-panel button:hover{background:#ffffff1f}.debug-panel :disabled{opacity:.4;cursor:default}.debug-readout{color:var(--muted);font-variant-numeric:tabular-nums;margin:10px 0 0}.debug-copy{width:100%;margin-top:14px}.debug-panel pre{color:var(--muted);white-space:pre-wrap;-webkit-user-select:all;user-select:all;background:#ffffff0a;border-radius:5px;margin:8px 0 0;padding:8px;font-size:11px}@media (width<=640px){:root{--display-bottom:190px}.stage-caption{align-items:end}.breadcrumb{flex-direction:column;align-items:flex-start;gap:8px}.breadcrumb-sep{display:none}}
