.work-section{padding:120px 0}.work-heading{font-family:var(--font-body);font-weight:800;font-size:clamp(32px,5vw,52px);line-height:1.08;letter-spacing:-.01em;color:var(--text);margin:0 0 72px;max-width:22ch}.work-showcase{display:grid;grid-template-columns:35% 1fr;gap:32px;align-items:start}.work-list{display:flex;flex-direction:column;gap:8px;position:sticky;top:120px}.work-list-item{display:flex;align-items:flex-start;gap:16px;padding:18px 20px;background:transparent;border:1px solid transparent;border-radius:var(--radius-md);cursor:pointer;transition:background .25s ease,border-color .25s ease,box-shadow .25s ease;text-align:left;width:100%;font-family:inherit;color:inherit;outline:none}.work-list-item:hover{background:rgba(255,255,255,.03)}.work-list-item:focus-visible{box-shadow:0 0 0 2px var(--accent)}.work-list-item.is-active{background:var(--card);border-color:var(--border-strong);box-shadow:var(--shadow-card)}.work-list-number{font-family:var(--font-mono);font-size:14px;font-weight:700;color:var(--accent);flex-shrink:0;line-height:1.4;margin-top:1px}.work-list-text{display:flex;flex-direction:column;gap:4px;min-width:0}.work-list-name{font-size:15px;font-weight:700;color:var(--text);line-height:1.4}.work-list-sub{font-size:13px;color:var(--text-muted);line-height:1.45;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.work-detail{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);padding:36px 32px;position:relative;overflow:hidden;min-height:520px}.work-detail-inner{position:relative;z-index:1}.work-detail-number{position:absolute;top:24px;right:32px;font-family:var(--font-mono);font-size:clamp(64px,8vw,96px);font-weight:800;color:var(--accent);opacity:.08;line-height:1;z-index:0;pointer-events:none;user-select:none}.work-detail-title{font-size:clamp(22px,2.8vw,30px);font-weight:800;color:var(--text);margin:0 0 6px;line-height:1.2;max-width:80%}.work-detail-subtitle{font-size:14px;font-weight:500;color:var(--accent);margin:0 0 24px}.work-detail-preview{width:100%;height:220px;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;margin-bottom:24px;overflow:hidden}.work-detail-preview-img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block}.work-detail-preview-icon{width:48px;height:48px;color:var(--text-faint);opacity:.5}.work-detail-desc{font-size:15px;line-height:1.7;color:var(--text-muted);margin:0 0 24px}.work-detail-techs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}.work-tech-pill{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:999px;background:var(--bg);border:1px solid var(--border);font-size:12.5px;font-weight:500;color:var(--text-muted);white-space:nowrap;transition:border-color .2s ease}.work-tech-pill:hover{border-color:var(--border-strong)}.work-tech-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.work-detail-github{display:inline-flex;align-items:center;gap:10px;padding:12px 22px;border-radius:var(--radius-sm);background:var(--bg);border:1px solid var(--border);font-size:14px;font-weight:600;color:var(--text);text-decoration:none;transition:background .2s ease,border-color .2s ease}.work-detail-github:hover{background:rgba(255,255,255,.06);border-color:var(--border-strong)}.work-detail-github svg{flex-shrink:0}.work-detail-inner.is-fading{opacity:0;transform:translateY(8px)}.work-detail-inner{transition:opacity .25s ease,transform .25s ease;opacity:1;transform:translateY(0)}.work-modal-overlay{display:none}@media(max-width:860px){.work-section{padding:80px 0}.work-heading{margin-bottom:40px}.work-showcase{grid-template-columns:1fr;gap:0}.work-list{position:static;flex-direction:column;gap:6px}.work-list-item{flex-shrink:0;padding:14px 16px;min-height:44px;border-radius:var(--radius-md)}.work-list-item.is-active{background:transparent;border-color:transparent;box-shadow:none}.work-list-item:active{background:rgba(255,255,255,.05)}.work-list-sub{display:none}.work-list-name{font-size:14px}.work-list-number{font-size:13px}.work-detail{display:none}.work-modal-overlay{display:none;position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.6);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);align-items:center;justify-content:center;padding:24px;opacity:0;transition:opacity .25s ease}.work-modal-overlay.is-open{display:flex;opacity:1}.work-modal{position:relative;background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);padding:32px 24px 28px;max-width:480px;width:100%;max-height:85vh;overflow-y:auto;transform:translateY(16px);transition:transform .3s ease}.work-modal-overlay.is-open .work-modal{transform:translateY(0)}.work-modal-close{position:absolute;top:14px;right:14px;width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-muted);cursor:pointer;transition:border-color .2s ease,color .2s ease;z-index:2}.work-modal-close:hover{border-color:var(--border-strong);color:var(--text)}.work-modal-number{font-family:var(--font-mono);font-size:13px;font-weight:700;color:var(--accent);display:block;margin-bottom:8px}.work-modal-preview{width:100%;height:180px;border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden;margin-bottom:16px}.work-modal-preview-img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block}.work-modal-title{font-size:20px;font-weight:800;color:var(--text);margin:0 0 4px;line-height:1.25;padding-right:44px}.work-modal-subtitle{font-size:13px;font-weight:500;color:var(--accent);margin:0 0 18px}.work-modal-desc{font-size:14px;line-height:1.7;color:var(--text-muted);margin:0 0 20px}.work-modal-techs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:22px}.work-modal-techs .work-tech-pill{font-size:11.5px;padding:5px 12px}.work-modal-github{display:inline-flex;align-items:center;gap:10px;padding:12px 22px;border-radius:var(--radius-sm);background:var(--bg);border:1px solid var(--border);font-size:14px;font-weight:600;color:var(--text);text-decoration:none;width:100%;justify-content:center;min-height:44px;transition:background .2s ease,border-color .2s ease}.work-modal-github:hover{background:rgba(255,255,255,.06);border-color:var(--border-strong)}.work-modal-github svg{flex-shrink:0}}@media(max-width:520px){.work-section{padding:60px 0}.work-heading{margin-bottom:32px}.work-list-item{padding:12px 14px}.work-modal{padding:28px 18px 24px}.work-modal-title{font-size:18px}}