.page.work,.page.work .slider{position:relative;width:100%;height:100svh;overflow:hidden}.page.work canvas{position:absolute;top:0;left:0;display:block;width:100%;height:100%;z-index:0}.page.work .slider-content{position:absolute;top:50%;right:2rem;transform:translateY(-50%);width:50%;display:flex;flex-direction:column;gap:2rem;z-index:2}.page.work .slide-description{width:50%;padding:.5rem;display:flex;flex-direction:column;gap:2rem;color:var(--tone-400)}.page.work .slide-title h1{display:flex;justify-content:flex-start;font-size:7rem}.page.work .slide-title h1 .word{display:flex}.page.work .slide-title h1 .char{display:block}.page.work .char,.page.work .line{overflow:hidden}.page.work .char span,.page.work .line span{position:relative;display:inline-block;will-change:transform}.page.work .slide-link a{position:relative;display:block;color:var(--tone-400);width:max-content;padding:.5rem 0}.page.work .slide-footer{position:absolute;bottom:0;left:0;width:100%;z-index:10;pointer-events:none}.page.work .slide-footer .container{display:flex;justify-content:space-between;align-items:center;color:var(--tone-400)}.slide-footer-hint{font-family:var(--font-secondary);font-size:1rem;letter-spacing:.08em;text-transform:uppercase;color:var(--tone-400);margin:0;padding:.5rem 0;-webkit-user-select:none;user-select:none}.slide-footer-hint.mobile-hint{display:none!important}.slide-footer-hint.desktop-hint{display:block}.work-index-trigger{background:transparent;border:none;outline:none;color:var(--tone-400);font-family:var(--font-secondary);font-size:1.1rem;font-weight:500;text-transform:uppercase;letter-spacing:.08em;cursor:pointer;padding:.5rem 0;transition:color .2s ease;pointer-events:auto}.work-index-trigger:hover{color:var(--tone-500)}.work-index-modal{position:fixed;inset:0;z-index:1000;display:flex;justify-content:center;align-items:center;opacity:0;pointer-events:none;visibility:hidden;transition:opacity .35s cubic-bezier(.16,1,.3,1),visibility .35s}.work-index-modal.active{opacity:1;pointer-events:auto;visibility:visible}.work-index-overlay{position:absolute;inset:0;background:#000000eb;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}.work-index-dialog{position:relative;z-index:10;width:100%;height:100%;height:100svh;max-height:100svh;display:flex;flex-direction:column;background-color:var(--tone-100);color:var(--tone-400);border-radius:0;box-shadow:0 0 80px #000000e6;overflow:hidden}.work-index-header{display:flex;justify-content:space-between;align-items:center;padding:1.5rem 2.5rem;border-bottom:1px solid var(--tone-200);background-color:var(--tone-100);flex-shrink:0}.work-index-header-left{display:flex;align-items:center;gap:1.5rem}.work-index-tag{font-family:var(--font-secondary);font-size:.95rem;letter-spacing:.12em;text-transform:uppercase;color:var(--tone-400);font-weight:500}.work-index-count{font-family:var(--font-secondary);font-size:.85rem;color:var(--tone-500);letter-spacing:.1em;text-transform:uppercase;font-weight:600}.work-index-header-right{flex-shrink:0}.work-index-close-btn{background:transparent;border:1.5px solid var(--tone-400);color:var(--tone-400);font-family:var(--font-secondary);font-size:.85rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding:.55rem 1.35rem;cursor:pointer;border-radius:0;transition:all .2s ease;white-space:nowrap;flex-shrink:0}.work-index-close-btn:hover{background-color:var(--tone-500);border-color:var(--tone-500);color:#fff}.work-index-filters{display:flex;justify-content:space-between;align-items:center;padding:.85rem 2.5rem;background-color:#1a1a1ab3;border-bottom:1px solid var(--tone-200);flex-shrink:0}.filter-group{display:flex;gap:.6rem;flex-wrap:wrap}.filter-btn{background:transparent;border:1px solid transparent;color:var(--tone-300);font-family:var(--font-secondary);font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;padding:.35rem .85rem;cursor:pointer;border-radius:0;transition:all .2s ease;white-space:nowrap;flex-shrink:0}.filter-btn:hover{color:var(--tone-400);border-color:var(--tone-300)}.filter-btn.active{color:var(--tone-100);background-color:var(--tone-400);border-color:var(--tone-400);font-weight:600}.index-shortcut-hint{font-family:var(--font-secondary);font-size:.75rem;color:var(--tone-300);letter-spacing:.12em;text-transform:uppercase}.work-index-table-header{display:grid;grid-template-columns:50px 2.2fr 1.6fr 1.2fr .8fr 3.5fr 1fr;align-items:center;gap:1.5rem;padding:.85rem 2.5rem;background-color:var(--tone-100);border-bottom:1px solid var(--tone-200);font-family:var(--font-secondary);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--tone-300);font-weight:600;flex-shrink:0}.work-index-list{flex:1 1 0%;min-height:0;height:100%;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;touch-action:pan-y;overscroll-behavior:contain;background-color:var(--tone-100);scrollbar-width:thin;scrollbar-color:var(--tone-300) var(--tone-100)}.work-index-list::-webkit-scrollbar{display:block!important;width:6px}.work-index-list::-webkit-scrollbar-track{background:var(--tone-100)}.work-index-list::-webkit-scrollbar-thumb{background:var(--tone-300);border-radius:0}.work-index-row{display:grid;grid-template-columns:50px 2.2fr 1.6fr 1.2fr .8fr 3.5fr 1fr;align-items:center;gap:1.5rem;padding:1.4rem 2.5rem;border-bottom:1px solid rgba(255,255,255,.08);transition:background-color .2s ease,border-color .2s ease;position:relative}.work-index-row:hover{background-color:#fe01000a;border-bottom-color:#fe010040}.work-index-row .col-num{font-family:var(--font-secondary);font-size:.85rem;color:var(--tone-300);font-weight:500}.work-index-row .col-title{font-family:var(--font-primary);font-size:1.6rem;letter-spacing:.02em;text-transform:uppercase;color:var(--tone-400);line-height:1.1;transition:color .2s ease}.work-index-row:hover .col-title{color:var(--tone-500)}.work-index-row .col-client{font-family:var(--font-secondary);font-size:.95rem;color:var(--tone-400);line-height:1.35}.work-index-row .col-type{font-family:var(--font-secondary);font-size:.8rem;color:var(--tone-300);letter-spacing:.06em;text-transform:uppercase}.work-index-row .col-year{font-family:var(--font-secondary);font-size:.95rem;color:var(--tone-400);font-weight:500}.work-index-row .col-brief{font-family:var(--font-secondary);font-size:.88rem;line-height:1.65;color:#e3e4d8b8;text-transform:none}.work-index-row .col-action a{display:inline-block;color:var(--tone-500);font-family:var(--font-secondary);font-size:.85rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;white-space:nowrap;padding:.4rem .75rem;border:1px solid rgba(254,1,0,.4);transition:all .2s ease}.work-index-row .col-action a:hover{background-color:var(--tone-500);color:#fff;border-color:var(--tone-500)}.work-index-footer{display:flex;justify-content:space-between;align-items:center;padding:1.25rem 2.5rem;border-top:1px solid var(--tone-200);background-color:var(--tone-100);font-family:var(--font-secondary);font-size:.82rem;letter-spacing:.08em;color:var(--tone-300);text-transform:uppercase;flex-shrink:0}.work-index-footer .footer-meta{display:flex;gap:1.5rem}.work-index-footer .footer-cta a{color:var(--tone-500);text-decoration:none;font-weight:600;transition:color .2s ease}.work-index-footer .footer-cta a:hover{color:var(--tone-400)}@media(max-width:1080px){.work-index-table-header{display:none}.work-index-header{padding:1rem 1.25rem;gap:.75rem}.work-index-tag{font-size:.82rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.work-index-close-btn{padding:.35rem .85rem;font-size:.76rem;letter-spacing:.06em;white-space:nowrap;flex-shrink:0}.work-index-filters{padding:.75rem 1.5rem}.index-shortcut-hint{display:none}.work-index-row{display:flex;flex-direction:column;align-items:flex-start;gap:.75rem;padding:1.5rem}.work-index-row .col-num{font-size:.8rem;color:var(--tone-500)}.work-index-row .col-title{font-size:1.5rem}.work-index-row .col-client{font-size:.95rem}.work-index-row .col-brief{font-size:.85rem;line-height:1.55}.work-index-row .col-action{width:100%;margin-top:.5rem}.work-index-row .col-action a{width:100%;text-align:center;padding:.6rem 1rem}.work-index-footer{padding:1rem 1.5rem;flex-direction:column;gap:.75rem;text-align:center}}@media(max-width:1000px){.page.work .slider-content{width:calc(100% - 2rem);max-width:540px;right:unset;left:50%;transform:translate(-50%,-50%);align-items:center;text-align:center;gap:1.5rem}.page.work .slide-title h1{font-size:clamp(2.25rem,8.5vw,3.5rem);justify-content:center}.page.work .slide-description{width:95%;gap:1.5rem}.page.work .slide-description p,.work-index-row .col-brief{font-size:.85rem!important;line-height:1.65}.page.work .slide-link a{margin:0 auto}.slide-footer-hint.desktop-hint{display:none!important}.slide-footer-hint.mobile-hint{display:block!important;font-size:.72rem;letter-spacing:.1em;color:var(--tone-400);opacity:.75;padding:0;margin:0;pointer-events:none;line-height:1.2;text-align:center}.page.work .slide-footer .container{flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:.5rem;padding:1rem 1.25rem max(1.25rem,env(safe-area-inset-bottom,1.25rem)) 1.25rem;font-size:.85rem}.work-index-trigger{font-size:.95rem;padding:.25rem .5rem;margin:0 auto;text-align:center;white-space:nowrap}}@media(max-width:480px){.page.work .slider-content{width:calc(100% - 1.5rem);gap:1rem}.page.work .slide-title h1{font-size:clamp(1.85rem,8vw,2.5rem)}.page.work .slide-description{width:100%;gap:1rem;padding:.25rem}.page.work .slide-description p,.work-index-row .col-brief{font-size:.8rem!important;line-height:1.6}.slide-footer-hint.mobile-hint{font-size:.68rem;letter-spacing:.08em}.page.work .slide-footer .container{gap:.4rem;padding:.75rem 1rem max(1rem,env(safe-area-inset-bottom,1rem)) 1rem;font-size:.8rem}.work-index-trigger{font-size:.88rem}.work-index-header{padding:.75rem .85rem;gap:.5rem}.work-index-tag{font-size:.75rem}.work-index-close-btn{padding:.3rem .6rem;font-size:.7rem;letter-spacing:.05em}}
