.aging-hero.hero{padding:0;min-height:0;display:block;overflow:visible;position:relative;background:#122438;color:#fff}
.aging-hero.hero:before{display:none}.aging-hero .hero-content{position:relative;padding:22px 24px 24px;text-align:left;width:100%;max-width:none}
.aging-hero .hero-title{font-size:clamp(27px,7.6vw,37px);line-height:1.24;letter-spacing:-.055em;font-weight:800;margin:0;color:inherit;text-shadow:none;word-break:keep-all}
.aging-hero .hero-title .highlight{background:none;-webkit-text-fill-color:#a9d5ef;color:#a9d5ef}.aging-hero .hero-sub{margin:16px 0;font-size:14px;line-height:1.6;color:#e3ebf2}
/* 검색창에 커서를 두면 index.html 이 .search-pinned(position:fixed; left:12px; right:12px)를 건다.
   그때 width:100% 는 부모가 아니라 화면 전체를 기준으로 재어져 오른쪽 끝이 화면 밖으로 나간다.
   제자리(static)에서는 블록이라 어차피 부모 폭을 채우므로 width 는 적지 않는다. */
.aging-hero .search-box{margin:0}.aging-hero .search-input-wrap{min-width:0}.aging-hero .search-input{font-size:14px;min-width:0}.aging-hero .search-btn{flex-shrink:0}.aging-hero .popular-wrap{margin-top:10px}.aging-hero .popular-toggle{min-height:36px;color:#fff;background:#ffffff14;border-color:#ffffff60;font-size:12px}
.aging-hero .photo-note{font-size:10px;line-height:1.6;margin:17px 0 0;color:#edf3f6}.aging-hero .photo-origin{display:inline-block;margin-top:5px;color:#bbcad6;font-size:9px}.aging-hero button:focus-visible,.micro-lens:focus-visible{outline:3px solid #a9d5ef;outline-offset:5px}
.aging-photos{position:absolute;inset:0;overflow:hidden}.aging-photos img{position:absolute;width:100%;height:100%;object-fit:cover;object-position:50% 32%;max-width:none}.aging-photos .dirty-macro{opacity:var(--dirt)}.aging-shade{position:absolute;inset:0;background:linear-gradient(180deg,#11263a40 0%,#11263a05 20%,#102236b8 40%,#102236f5 59%,#102236 84%)}
.aging-hero .photo-top{min-height:35px}.aging-hero .photo-label{font-size:11px;text-shadow:0 1px 6px #0008;letter-spacing:.02em}.aging-hero .photo-buttons{z-index:6;min-width:88px;top:0;right:0;gap:3px;padding:4px;background:#142b3ce8;box-shadow:0 4px 16px #12233526}.aging-hero .photo-buttons button{display:flex;align-items:center;justify-content:center;gap:5px;min-height:44px;font-size:11px}.aging-hero .photo-buttons .replace-action{color:#1a3050;background:#eef6f8;box-shadow:0 1px 5px #0002}.aging-hero .photo-buttons button.is-fresh{background:#a9d5ef33}.toggle-dot,.status-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:#c9a176;flex-shrink:0}.toggle-dot{background:#b5dbe8}
.lens-stage{height:221px;position:relative}.micro-lens{position:absolute;margin:0;width:174px;height:174px;z-index:4}.lens-glass{position:relative;width:100%;height:100%;border-radius:50%;overflow:hidden;border:5px solid #f5f5eff2;box-shadow:0 0 0 1px #1a30503d,0 12px 26px #0b1d3850;background:#303437;isolation:isolate}.lens-glass:after{content:'';position:absolute;inset:0;border-radius:50%;box-shadow:inset 0 0 18px #0007;pointer-events:none}.micro-fallback,.micro-canvas{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}.lens-glint{position:absolute;inset:0;border-radius:50%;background:linear-gradient(135deg,#fff2,transparent 44%,transparent 82%,#fff1);pointer-events:none}.micro-lens figcaption{position:absolute;left:50%;bottom:11px;transform:translateX(-50%);white-space:nowrap;padding:4px 8px;border:1px solid #ffffff40;border-radius:20px;background:#102236e8;color:#fff;font-size:9px;line-height:1.4;pointer-events:none}.micro-lens figcaption span{color:#aebfcc}
.aging-a .micro-lens{top:22px;left:0}.lens-link{position:absolute;left:151px;top:156px;width:74px;height:1px;background:#f6f4ee;transform:rotate(23deg);transform-origin:left}.lens-target{position:absolute;left:216px;top:176px;width:12px;height:12px;border:1px solid #fff;border-radius:50%;box-shadow:0 0 0 4px #ffffff30}.lens-caption{position:absolute;left:193px;top:110px;font-size:11px;line-height:1.65;color:#fff;text-shadow:0 1px 4px #0009;white-space:nowrap}
.aging-status{display:flex;align-items:center;gap:7px;margin:0 0 16px;font-size:11px;color:#c6d8e5;min-height:18px}.aging-track{display:block;height:3px;width:56px;border-radius:3px;background:#ffffff24;overflow:hidden;margin-left:auto}.aging-track i{display:block;width:calc(var(--dirt)*100%);height:100%;background:#c6a17c}
.aging-kicker{font-size:11px;letter-spacing:.035em;font-weight:650;margin:0 0 14px;color:#9dc8e3}.sample-stage,.explore-stage{position:relative;height:290px;overflow:hidden;border-radius:16px;margin:23px 0 13px;border:1px solid #ffffff33}.sample-stage .photo-buttons,.explore-stage .photo-buttons{right:12px;top:12px}.sample-shade{position:absolute;inset:0;background:linear-gradient(180deg,#18334a05 30%,#142b3c99)}
.aging-b.hero{background:#f5f2eb;color:#1a3050}.aging-b .hero-title .highlight{color:#417ba0;-webkit-text-fill-color:#417ba0}.aging-b .aging-kicker{color:#557187}.aging-b .hero-sub{color:#526578;margin:18px 0 14px}.aging-b .sample-stage{height:278px;border-color:#d8d2c2}.aging-b .micro-lens{width:200px;height:200px;left:15px;top:22px}.sample-caption{position:absolute;bottom:17px;right:16px;text-align:right;font-size:12px;line-height:1.5;color:#fff;text-shadow:0 1px 5px #0008}.aging-b .aging-status{color:#566d7c;margin-bottom:13px}.aging-b .aging-track{background:#1a305020}.micro-explainer{font-size:15px;line-height:1.6;letter-spacing:-.025em;margin:0;color:#1a3050;font-weight:600}.aging-b .photo-note{color:#556b7d}.aging-b .photo-origin{color:#657584}.aging-b .popular-toggle{color:#1a3050;background:#ffffffa0;border-color:#c9d0d3}
.aging-c.hero{background:#132438}.aging-c .explore-stage{height:290px;margin-top:22px}.aging-c .micro-lens{left:10%;top:24%;width:174px;height:174px;cursor:grab;touch-action:none;user-select:none}.aging-c .micro-lens.dragging{cursor:grabbing}.aging-c .micro-lens:after{content:'';position:absolute;height:42px;width:10px;border-radius:0 0 6px 6px;background:linear-gradient(90deg,#7d99ac,#d3e0e5,#7d99ac);top:93%;left:84%;transform:rotate(-39deg);transform-origin:top;z-index:-1}.explore-hint{position:absolute;bottom:13px;left:0;width:100%;text-align:center;font-size:10px;color:#fff;pointer-events:none}.explore-hint span{margin-left:8px}.aging-c .aging-status{margin-bottom:10px}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(min-width:481px){.aging-hero .hero-content{padding:28px 32px}.aging-hero .hero-title{font-size:38px}.aging-a .lens-stage{height:235px}.aging-a .micro-lens{width:195px;height:195px;top:16px;left:15px}.aging-a .lens-caption{left:250px;top:116px}.aging-a .lens-link{left:190px;top:159px;width:79px}.aging-a .lens-target{left:262px;top:185px}.aging-b .sample-stage{height:300px}.aging-b .micro-lens{width:228px;height:228px;left:28px}.aging-c .explore-stage{height:315px}.aging-c .micro-lens{width:195px;height:195px}}
@media(max-width:359px){.aging-hero .hero-content{padding:20px}.aging-hero .hero-title{font-size:27px}.aging-hero .hero-sub{font-size:13px}.aging-hero .search-input{font-size:12px}.aging-hero .search-input-wrap{padding:10px 8px;gap:8px}.aging-hero .search-btn{padding:10px 12px}.aging-hero .search-icon{width:18px}.aging-hero .photo-label{font-size:10px;padding-right:88px}.aging-hero .photo-buttons{min-width:83px}.aging-hero .photo-buttons button{font-size:10px;padding:9px 8px}.aging-a .lens-stage{height:212px}.aging-a .micro-lens{width:152px;height:152px;top:32px}.aging-a .lens-caption{left:164px;top:112px;font-size:10px}.aging-a .lens-link{left:137px;top:160px;width:48px}.aging-a .lens-target{left:177px;top:173px}.aging-b .micro-lens{width:166px;height:166px;left:9px;top:32px}.aging-b .sample-stage{height:246px}.aging-c .micro-lens{width:150px;height:150px}.aging-c .explore-stage{height:263px}.aging-hero .photo-note{font-size:9px}.aging-hero .photo-origin{font-size:8px}}
/* A: four monthly story segments, driven by the same clock as the filter. */
.aging-a .micro-lens figcaption{font-size:11px;font-weight:600}
.aging-a .story-progress{display:flex;gap:5px;width:100%;height:3px;margin:-7px 0 15px}
.story-progress>span{flex:1;height:100%;border-radius:4px;overflow:hidden;background:#ffffff48;box-shadow:0 1px 3px #0002}
.story-progress i{display:block;width:100%;height:100%;background:#f5f8fb;transform:scaleX(0);transform-origin:left}
.aging-a .aging-track{display:none}
.aging-a .photo-buttons{min-width:124px;border-radius:25px}
.aging-a .photo-buttons button{font-size:11px;white-space:nowrap;padding:9px 10px;font-variant-numeric:tabular-nums}
.aging-a .photo-label{padding-right:134px}
.aging-a .replace-action{transition:background-color .35s,box-shadow .35s}
.aging-a.replace-ready .replace-action{background:#bd343b;color:#fff;box-shadow:0 0 0 2px #ffb2b580,0 0 18px #f24c5555;animation:replace-invite 2.2s ease-in-out infinite}
.aging-a.replace-ready .photo-buttons{border-color:#df969b99}
@keyframes replace-invite{0%,100%{background-color:#243c50;box-shadow:0 0 0 1px #dbe8f238,0 0 0 #f24c5500}50%{background-color:#bd343b;box-shadow:0 0 0 3px #ffb2b560,0 0 21px #f24c5570}}
@media(max-width:359px){.aging-a .photo-buttons{min-width:116px}.aging-a .photo-buttons button{font-size:10px}.aging-a .photo-label{padding-right:124px}.aging-a .story-progress{gap:4px}}
@media(prefers-reduced-motion:reduce){.aging-hero *{animation:none!important;transition:none!important}}
