:root{--portfolio-bg:#f9f9f9;--card-bg:white;--card-bg-subtle:rgba(1,1,1,0.02);--text-primary:black;--text-secondary:#b9b9b9;--link-hover-bg:#d9d9d9;--hoverable-hover-bg:#e9e9e9;--spacing-xs:2px;--spacing-sm:4px;--spacing-md:8px;--spacing-lg:16px;--spacing-xl:24px;--radius-sm:6px;--radius-md:8px;--font-xs:12px;--font-sm:13px;--transition-fast:0.1s ease;--transition-normal:0.2s ease;--shadow-card:rgba(14,63,126,0.06) 0px 0px 0px 1px,rgba(42,51,70,0.03) 0px 1px 1px -0.5px,rgba(42,51,70,0.04) 0px 2px 2px -1px,rgba(42,51,70,0.04) 0px 3px 3px -1.5px,rgba(42,51,70,0.03) 0px 5px 5px -2.5px,rgba(42,51,70,0.03) 0px 10px 10px -5px,rgba(42,51,70,0.03) 0px 24px 24px -8px;--shadow-active:rgba(9,30,66,0.25) 0px 4px 8px -2px,rgba(9,30,66,0.08) 0px 0px 0px 1px}.portfolio-container{position:relative;width:100vw;height:100vh;overflow:hidden;background-color:var(--portfolio-bg)}.portfolio-header{margin:var(--spacing-lg);display:flex;flex-direction:row;justify-content:space-between;flex-wrap:wrap;gap:var(--spacing-xl);font-size:var(--font-sm);animation:header-animation 1s ease forwards}.header-card{padding:var(--spacing-sm);padding-top:var(--spacing-xs);background-color:var(--card-bg);box-shadow:var(--shadow-card);display:inline-block;will-change:transform,z-index;transition:var(--transition-normal)}@keyframes header-animation{0%{opacity:0}to{opacity:1}}.card-container{cursor:-webkit-grab;cursor:grab;position:relative}.card-container:active{cursor:-webkit-grabbing;cursor:grabbing}.card{padding:var(--spacing-sm);padding-top:var(--spacing-xs);background-color:var(--card-bg-subtle);border-radius:var(--radius-md);box-shadow:var(--shadow-card);display:inline-block;will-change:transform,filter,z-index;transition:var(--transition-normal);overflow:hidden}.card:hover{transform:translateY(-4px)}.card:active{scale:1.01;box-shadow:var(--shadow-active);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.card-header{display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin:var(--spacing-sm);margin-bottom:var(--spacing-md)}.window-controls{display:flex;gap:6px;margin-right:4px}.window-control-btn{width:10px;height:10px;border-radius:50%;border:none;cursor:pointer;transition:var(--transition-fast);position:relative;padding:0}.window-control-btn:hover{opacity:.8}.window-control-close{background-color:#ff5f57}.window-control-minimize{background-color:#febc2e}.window-control-maximize{background-color:#28c840}.card-link{display:flex;flex-direction:row;gap:var(--spacing-md);align-items:baseline;transition:var(--transition-normal);cursor:pointer}.card-link:hover{gap:10px;opacity:.5}.card-name{color:var(--text-primary);width:-moz-fit-content;width:fit-content;font-size:var(--font-xs);text-decoration:none}.growth-badge{font-size:14px;line-height:1;margin-left:4px;display:inline-block;transition:var(--transition-fast)}.growth-badge:hover{transform:scale(1.2)}.card-footer{padding:var(--spacing-sm) var(--spacing-md);padding-top:var(--spacing-md);display:flex;flex-direction:column;gap:var(--spacing-sm);font-size:11px;border-top:1px solid rgba(0,0,0,.05);background-color:rgba(249,249,249,.5)}.card-tags{display:flex;flex-wrap:wrap;gap:4px}.card-tag{display:inline-block;padding:2px 6px;background-color:rgba(0,0,0,.05);border-radius:3px;font-size:10px;color:var(--text-primary);transition:var(--transition-fast)}.card-tag:hover{background-color:rgba(0,0,0,.1)}.card-tag-more{background-color:rgba(0,0,0,.08);font-weight:500}.card-updated{color:var(--text-secondary);font-size:10px;font-style:italic}.hoverable-work,.link{text-decoration:none;transition:var(--transition-fast);color:inherit}.link:hover{background-color:var(--link-hover-bg);box-shadow:4px 0 0 var(--link-hover-bg),-4px 0 0 var(--link-hover-bg);color:var(--text-primary)}.hoverable-work{cursor:pointer;display:block;padding-inline:var(--spacing-sm)}.hoverable-work:hover{background-color:var(--hoverable-hover-bg)}.about-link{text-decoration:none;transition:var(--transition-fast);color:inherit;display:flex;flex-direction:row;gap:var(--spacing-md);align-items:baseline;width:-moz-fit-content;width:fit-content}.about-link:hover{gap:10px;opacity:.5}.works-index{display:flex;flex-direction:column;gap:var(--spacing-xs)}.header-cards-wrapper{display:flex;flex-direction:row;gap:var(--spacing-lg)}.header-card-name{display:flex;flex-direction:column;gap:var(--spacing-sm);transform:rotate(-2deg);height:-moz-fit-content;height:fit-content;padding-inline:var(--spacing-md);padding-block:var(--spacing-sm)}.header-card-name a{color:inherit;text-decoration:none}.header-card-intro{transform:rotate(2deg);padding-inline:var(--spacing-md);padding-block:var(--spacing-sm);height:-moz-fit-content;height:fit-content;max-width:258px}.header-card-works{transform:rotate(-1deg)}.works-index-wrapper{display:flex;flex-direction:row;padding-top:var(--spacing-xs)}.card-year,.work-year{color:var(--text-secondary)}.card-year{opacity:.8}.card-image{border-radius:var(--radius-sm);display:block;pointer-events:none}.card-image-clickable{pointer-events:auto!important;cursor:pointer!important;transition:transform var(--transition-normal),opacity var(--transition-fast)}.card-image-clickable:hover{opacity:.9;transform:scale(1.02)}.desktop-icon{position:fixed;bottom:30px;left:30px;display:flex;flex-direction:column;align-items:center;gap:8px;cursor:pointer;z-index:100;-webkit-user-select:none;-moz-user-select:none;user-select:none}.desktop-icon-image{width:80px;height:80px;display:flex;align-items:center;justify-content:center}.guestbook-icon-emoji{font-size:48px;line-height:1;-webkit-user-select:none;-moz-user-select:none;user-select:none}.desktop-icon-label{font-size:12px;font-weight:500;color:var(--text-primary)}.minimize-animation{animation:minimize .5s ease-out forwards}@keyframes minimize{0%{transform:scale(1);opacity:1}to{transform:scale(.1);opacity:0}}@keyframes toss-0{0%{transform:translate3d(102vw,-104vh,0) rotate(0deg)}to{transform:translateZ(0) rotate(0deg)}}.card-0{position:absolute;animation:toss-0 .8s cubic-bezier(.22,.61,.36,1) forwards;transform:translate3d(102vw,-104vh,0) rotate(0deg);animation-delay:.02s}@keyframes toss-1{0%{transform:translate3d(-104vw,-106vh,0) rotate(0deg)}to{transform:translateZ(0) rotate(0deg)}}.card-1{position:absolute;animation:toss-1 .8s cubic-bezier(.22,.61,.36,1) forwards;transform:translate3d(-104vw,-106vh,0) rotate(0deg);animation-delay:.04s}@keyframes toss-2{0%{transform:translate3d(-120vw,-104vh,0) rotate(0deg)}to{transform:translateZ(0) rotate(0deg)}}.card-2{position:absolute;animation:toss-2 .8s cubic-bezier(.22,.61,.36,1) forwards;transform:translate3d(-120vw,-104vh,0) rotate(0deg);animation-delay:.06s}@keyframes toss-3{0%{transform:translate3d(124vw,104vh,0) rotate(0deg)}to{transform:translateZ(0) rotate(0deg)}}.card-3{position:absolute;animation:toss-3 .8s cubic-bezier(.22,.61,.36,1) forwards;transform:translate3d(124vw,104vh,0) rotate(0deg);animation-delay:.08s}@keyframes toss-4{0%{transform:translate3d(0,-120vh,0) rotate(0deg)}to{transform:translateZ(0) rotate(0deg)}}.card-4{position:absolute;animation:toss-4 .8s cubic-bezier(.22,.61,.36,1) forwards;transform:translate3d(0,-120vh,0) rotate(0deg);animation-delay:.1s}@keyframes toss-5{0%{transform:translate3d(102vw,108vh,0) rotate(0deg)}to{transform:translateZ(0) rotate(0deg)}}.card-5{position:absolute;animation:toss-5 .8s cubic-bezier(.22,.61,.36,1) forwards;transform:translate3d(102vw,108vh,0) rotate(0deg);animation-delay:.12s}@keyframes toss-6{0%{transform:translate3d(-110vw,110vh,0) rotate(0deg)}to{transform:translateZ(0) rotate(0deg)}}.card-6{position:absolute;animation:toss-6 .8s cubic-bezier(.22,.61,.36,1) forwards;transform:translate3d(-110vw,110vh,0) rotate(0deg);animation-delay:.14s}.detail-card{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);max-width:380px;width:90vw;max-height:70vh;overflow-y:auto;z-index:10000;cursor:-webkit-grab;cursor:grab;background:linear-gradient(135deg,#fef9e7,#fcf3cf);box-shadow:0 1px 3px rgba(0,0,0,.08),0 4px 12px rgba(0,0,0,.08),inset 0 0 0 1px rgba(255,255,255,.5);padding:var(--spacing-xl);display:flex;flex-direction:column;gap:var(--spacing-lg);border-radius:2px}.detail-card:active{cursor:-webkit-grabbing;cursor:grabbing}.detail-card-sticky-top{position:absolute;top:0;left:50%;transform:translateX(-50%);width:60px;height:20px;background:rgba(255,255,255,.4);border-radius:0 0 4px 4px;box-shadow:0 2px 4px rgba(0,0,0,.1),inset 0 -1px 2px rgba(0,0,0,.05);opacity:.8}.detail-card-header-bar{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--spacing-lg);margin-bottom:var(--spacing-sm)}.detail-card-title-section{flex:1 1}.detail-card-title{font-size:15px;font-weight:600;color:#5a4a2f;margin:0 0 var(--spacing-sm) 0;letter-spacing:-.01em}.detail-card-meta{display:flex;align-items:center;gap:var(--spacing-md);font-size:11px;color:#8b7355;letter-spacing:.02em}.detail-card-separator{color:#c9b896}.detail-card-close-btn{background:none;border:none;font-size:20px;line-height:1;cursor:pointer;color:#8b7355;transition:var(--transition-fast);padding:0;width:20px;height:20px;display:flex;align-items:center;justify-content:center;flex-shrink:0;opacity:.6}.detail-card-close-btn:hover{color:#5a4a2f;opacity:1}.detail-card-body{line-height:1.7;color:#3e3529;font-size:13px;letter-spacing:.01em}.detail-card-body p{margin:0 0 var(--spacing-md) 0}.detail-card-body p:last-child{margin-bottom:0}.detail-card-footer{margin-top:var(--spacing-sm)}.detail-card-link{display:inline-flex;align-items:center;gap:var(--spacing-sm);color:#5a4a2f;text-decoration:none;font-size:var(--font-xs);font-weight:600;transition:var(--transition-fast);padding:6px 12px;background:rgba(255,255,255,.5);border-radius:2px;border:1px solid rgba(90,74,47,.15)}.detail-card-link:hover{background:rgba(255,255,255,.8);gap:10px;transform:translateY(-1px);box-shadow:0 2px 4px rgba(0,0,0,.1)}@media only screen and (max-width:796px){.works-index-container{display:none!important}.header-cards-wrapper{gap:var(--spacing-md)}.header-card-intro{max-width:100%}}@media only screen and (max-width:576px){.portfolio-header{margin:var(--spacing-md);gap:var(--spacing-md)}.header-cards-wrapper{flex-direction:column;gap:var(--spacing-md)}.header-card-intro,.header-card-name{transform:rotate(0deg)!important;max-width:100%}.card{scale:.8}.card:active{scale:.81}.card-header{font-size:11px}.detail-card{width:95vw;max-height:85vh}.filter-bar{padding:var(--spacing-sm) var(--spacing-md)}.filter-bar-content{flex-direction:column;align-items:stretch;gap:var(--spacing-md)}.filter-search{max-width:100%}.filter-categories{justify-content:flex-start;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;padding-bottom:var(--spacing-sm)}.filter-category-btn{white-space:nowrap;flex-shrink:0}.filter-results{margin-left:0;text-align:center}}.view-mode-toggle{display:flex;gap:4px;background-color:white;border-radius:4px;padding:2px;box-shadow:var(--shadow-card);border:1px solid rgba(0,0,0,.1)}.view-mode-btn{padding:6px 8px;background-color:transparent;border:none;border-radius:3px;transition:var(--transition-fast);display:flex;align-items:center;justify-content:center}.view-mode-btn:hover{background-color:rgba(0,0,0,.05);color:var(--text-primary)}.view-mode-btn.active{background-color:var(--text-primary)}.gallery-container{position:relative;padding:var(--spacing-xl);min-height:100vh;padding-left:80px;padding-top:40px}.gallery-card-wrapper{position:absolute;cursor:default}.gallery-card-wrapper .card{position:relative;cursor:default}.gallery-card-wrapper .card:hover{transform:translateY(-4px)}@media only screen and (max-width:1200px){.gallery-container{padding-left:40px}}@media only screen and (max-width:768px){.gallery-container{padding:var(--spacing-lg)}}@media only screen and (max-width:576px){.gallery-container{padding:var(--spacing-md)}.view-mode-toggle{order:-1}}.view-mode-controls{display:flex;gap:8px;padding:20px 60px;max-width:1400px;margin:0 auto}.view-mode-btn{padding:8px 16px;font-size:var(--font-sm);font-weight:500;background:transparent;border:1px solid rgba(0,0,0,.1);border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast)}.view-mode-btn:hover{background:var(--hoverable-hover-bg);border-color:rgba(0,0,0,.2)}.view-mode-btn.active{background:var(--text-primary);color:white;border-color:var(--text-primary)}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));grid-gap:32px;gap:32px;padding:20px 60px 80px;max-width:1400px;margin:0 auto}.gallery-item{position:relative;overflow:hidden;border-radius:var(--radius-md);background:var(--card-bg);transition:transform var(--transition-normal),box-shadow var(--transition-normal)}.gallery-item:hover{transform:translateY(-4px);box-shadow:var(--shadow-active)}.gallery-image{width:100%;height:auto;display:block;object-fit:cover;aspect-ratio:4/3}.gallery-iframe-wrapper{width:100%;aspect-ratio:4/3;position:relative;overflow:hidden}.gallery-iframe{width:100%;height:100%;border:none}.gallery-component-wrapper{width:100%;aspect-ratio:4/3;position:relative;overflow:hidden}.gallery-item-info{padding:16px;display:flex;justify-content:space-between;align-items:center;border-top:1px solid rgba(0,0,0,.06)}.gallery-item-title{margin:0;font-size:15px;font-weight:500;color:var(--text-primary)}.gallery-item-year{font-size:var(--font-sm);color:var(--text-secondary)}@media only screen and (max-width:1024px){.view-mode-controls{padding:20px 40px}.gallery-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:24px;padding:20px 40px 60px}}@media only screen and (max-width:768px){.view-mode-controls{padding:16px 24px}.gallery-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:20px;padding:16px 24px 40px}}@media only screen and (max-width:576px){.view-mode-controls{padding:12px 16px}.gallery-grid{grid-template-columns:1fr;gap:16px;padding:12px 16px 24px}}.calendar-timeline-container{background:var(--card-bg);border-radius:2px;box-shadow:0 1px 3px rgba(0,0,0,.12),0 4px 8px rgba(0,0,0,.08);padding:var(--spacing-md);max-width:calc(100vw)}.calendar-timeline-scroll{overflow-x:auto;overflow-y:hidden;cursor:-webkit-grab;cursor:grab;-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none;scroll-behavior:smooth;scroll-snap-type:x proximity;will-change:scroll-position}.calendar-timeline-scroll::-webkit-scrollbar{display:none}.calendar-timeline-scroll.dragging{cursor:-webkit-grabbing;cursor:grabbing;scroll-behavior:auto}.calendar-timeline-scroll.dragging *{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.calendar-timeline-days{display:flex;gap:2px;align-items:flex-end;min-width:max-content;padding-bottom:var(--spacing-sm)}.calendar-timeline-day-wrapper{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xs)}.calendar-timeline-month-label{font-size:10px;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;padding:2px 6px;white-space:nowrap}.calendar-timeline-day,.calendar-timeline-month-label{background:var(--card-bg-subtle);border-radius:2px;transition:var(--transition-fast)}.calendar-timeline-day{width:24px;height:24px;display:flex;align-items:center;justify-content:center;position:relative;cursor:default;overflow:hidden;flex-shrink:0}.calendar-timeline-day-number{font-size:9px;color:var(--text-secondary);font-weight:500;line-height:1}.calendar-timeline-day-today{position:relative;background:rgba(0,0,0,.1);border-radius:50%}.calendar-timeline-day-today .calendar-timeline-day-number{color:var(--text-primary);font-weight:600}.calendar-timeline-day-with-image{cursor:pointer;border:1px solid rgba(0,0,0,.08);background:white;width:40px;height:40px;transition:var(--transition-normal)}.calendar-timeline-day-with-image:hover{transform:scale(1.1) translateY(-2px);box-shadow:0 2px 4px rgba(0,0,0,.12),0 4px 8px rgba(0,0,0,.08);z-index:100;border-color:rgba(0,0,0,.12)}.calendar-timeline-day-image-wrapper{width:100%;height:100%;position:relative;overflow:hidden}.calendar-timeline-day-image{width:100%;height:100%;object-fit:cover;display:block;transition:var(--transition-fast)}.calendar-timeline-day-with-image:hover .calendar-timeline-day-image{transform:scale(1.1)}.calendar-timeline-day-number-overlay{position:absolute;top:1px;left:1px;font-size:7px;font-weight:700;color:white;background:rgba(0,0,0,.7);padding:1px 3px;border-radius:2px;line-height:1.2;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}@media only screen and (max-width:768px){.calendar-timeline-container{padding:var(--spacing-md)}.calendar-timeline-day{width:22px;height:22px}.calendar-timeline-day-number{font-size:8px}.calendar-timeline-day-with-image{width:36px;height:36px}.calendar-timeline-day-with-image:hover{width:44px;height:44px}.calendar-timeline-month-label{font-size:9px}}@media only screen and (max-width:576px){.calendar-timeline-container{padding:var(--spacing-sm)}.calendar-timeline-days{gap:2px}.calendar-timeline-day{width:20px;height:20px}.calendar-timeline-day-number{font-size:8px}.calendar-timeline-day-with-image{width:32px;height:32px}.calendar-timeline-day-with-image:hover{width:42px;height:42px}.calendar-timeline-month-label{font-size:9px}.calendar-timeline-day-number-overlay{font-size:8px}}.calendar-image-preview-container{position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(249,249,249,.85);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);z-index:10000;display:flex;align-items:center;justify-content:center;padding:var(--spacing-xl);animation:fadeIn .2s ease;cursor:pointer}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.calendar-image-preview-card{position:relative;max-width:420px;background:white;border-radius:2px;padding:18px 18px 70px;box-shadow:0 2px 4px rgba(0,0,0,.12),0 8px 16px rgba(0,0,0,.1),0 16px 24px rgba(0,0,0,.08);animation:slideUp .3s cubic-bezier(.34,1.56,.64,1);cursor:default;transform:rotate(-1deg);transition:transform .3s ease}.calendar-image-preview-card:hover{transform:rotate(0deg)}.calendar-image-preview-date{position:absolute;bottom:18px;left:18px;right:18px;text-align:center;padding:14px;font-size:var(--font-sm);font-weight:400;color:#666;background:transparent;font-family:Segoe UI,-apple-system,BlinkMacSystemFont,sans-serif}.calendar-image-preview-img{display:block;width:100%;height:auto;max-height:480px;object-fit:cover;box-shadow:0 1px 2px rgba(0,0,0,.08)}@media only screen and (max-width:576px){.calendar-image-preview-container{padding:var(--spacing-md)}.calendar-image-preview-card{max-width:90%;padding:12px 12px 50px}.calendar-image-preview-date{bottom:12px;left:12px;right:12px;font-size:11px;padding:8px}.calendar-image-preview-img{max-height:320px}}.tooltip{position:fixed;background:rgba(28,28,30,.95);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:white;padding:6px 12px;border-radius:8px;font-size:12px;font-weight:500;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;z-index:10000;white-space:nowrap;box-shadow:0 4px 12px rgba(0,0,0,.25),0 0 0 1px rgba(255,255,255,.1);transform-origin:left center}