.works-archive-page{font-family:Noto Sans JP,sans-serif;background:#f8fafc;min-height:100vh}.works-archive-hero{background:linear-gradient(135deg,#1e3a8a,#3b82f6);color:white;text-align:center;padding:80px 20px 50px}.works-archive-hero h1{font-size:36px;font-weight:900;margin:0 0 12px;letter-spacing:.05em;text-shadow:0 2px 8px rgba(0,0,0,.2)}.works-archive-hero p{font-size:18px;font-weight:500;margin:0;opacity:.85}.works-archive-grid{max-width:1200px;margin:0 auto;padding:40px 20px;display:grid;grid-template-columns:repeat(3,1fr);grid-gap:24px;gap:24px}.works-archive-empty{grid-column:1/-1;text-align:center;color:#94a3b8;font-size:16px;padding:60px 0}.works-archive-card{background:white;border-radius:16px;overflow:hidden;box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);transition:transform .3s ease,box-shadow .3s ease}.works-archive-card:hover{transform:translateY(-4px);box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04)}.works-archive-image{position:relative;overflow:hidden}.works-archive-img{width:100%;height:auto;display:block;object-fit:cover;aspect-ratio:3/2}.works-archive-ba{display:grid;grid-template-columns:1fr 1fr}.works-archive-shot{position:relative}.works-archive-label{position:absolute;top:8px;left:8px;font-size:11px;font-weight:700;padding:2px 10px;border-radius:4px;z-index:1;text-transform:uppercase}.works-archive-label.before{background:rgba(239,68,68,.9);color:white}.works-archive-label.after{background:rgba(34,197,94,.9);color:white}.works-archive-chip{position:absolute;bottom:8px;right:8px;background:rgba(30,58,138,.85);color:white;font-size:11px;font-weight:600;padding:4px 12px;border-radius:20px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.works-archive-body{padding:16px 18px 20px}.works-archive-body h3{font-size:16px;font-weight:700;color:#1e293b;margin:0 0 8px;line-height:1.4}.works-archive-tags{display:flex;flex-wrap:wrap;gap:6px}.works-archive-tag{font-size:11px;color:#3b82f6;background:#eff6ff;padding:3px 10px;border-radius:12px;font-weight:500}.works-archive-back{text-align:center;padding:20px 20px 60px}@media (max-width:900px){.works-archive-grid{grid-template-columns:repeat(2,1fr);gap:16px}}@media (max-width:600px){.works-archive-grid{grid-template-columns:1fr}.works-archive-hero{padding:70px 16px 40px}.works-archive-hero h1{font-size:24px}}