/* HUD-ALL-20261010. 문제=제목·아이콘 효과 누락과 불통일. 수정=의미별 벡터와 지속동작, 은색 광택. 잠금=사진·내용·배경색·기존 이벤트 보존. */
.ph-icon{display:inline-flex;width:30px;height:30px;flex:0 0 auto;vertical-align:middle;margin-right:8px;align-items:center;justify-content:center;--ph-color:#22d3ee}
.ph-icon svg{width:100%;height:100%;overflow:visible;transform:none!important;filter:drop-shadow(0 0 5px var(--ph-color));animation:none!important}
.ph-icon:before,.ph-icon:after{display:none!important}
.ph-title{position:relative}.ph-title>.ph-icon{vertical-align:middle}.ph-title>.ph-text{vertical-align:middle}
.ph-metal{background-image:linear-gradient(105deg,#263f59 0%,#748494 22%,#c5cdd5 36%,#fff 42%,#919eab 48%,#334e69 60%,#263f59 100%);background-size:280% 100%;background-position:100% 0;background-clip:text;-webkit-background-clip:text;color:transparent!important;-webkit-text-fill-color:transparent;text-shadow:0 1px 1px #10243a12;animation:ph-silver 5.5s linear infinite}
.hero h1>.ph-icon{width:48px;height:48px}.hero h1 .ph-metal em{color:inherit!important;-webkit-text-fill-color:transparent;background:none!important}
.ph-title:hover>.ph-text,.ph-title:focus-visible>.ph-text,.ph-title:focus-within>.ph-text{background-image:linear-gradient(105deg,#294158,#98a7b6 28%,#fff 42%,#bac5d0 48%,#294158 65%);background-size:280% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent;animation:ph-silver 2.8s linear infinite}
.topnav .ph-icon{width:17px;height:17px;margin-right:4px}.servicebar .ph-icon{width:25px;height:25px;margin-right:6px}.topnav a{display:inline-flex;align-items:center}
.ph-spin{transform-origin:12px 12px;animation:ph-spin 4s linear infinite}.ph-flow{stroke-dasharray:3 18;animation:ph-flow 1.8s linear infinite}.ph-work{transform-origin:12px 20px;animation:ph-work 2.8s ease-in-out infinite}.ph-scan{animation:ph-scan 2.8s ease-in-out infinite}.ph-pulse{animation:ph-pulse 2.6s ease-in-out infinite}
.ph-title:hover .ph-spin{animation-duration:2s}.ph-title:hover .ph-flow{animation-duration:1s}
.uf-icon.ph-icon,.report-icon.ph-icon{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;transform:none!important;animation:none!important;filter:none!important}
.uf-badge,.uf-point-card,.uf-view-tab{box-shadow:inset 0 1px 0 #ffffff55,0 4px 0 #021729,0 0 12px #22d3ee22;border-color:#36c7e088;background:linear-gradient(165deg,#12334eea,#07172aed);backdrop-filter:blur(10px)}
.uf-point-card{color:#eefaff}.uf-point-card .ph-icon{width:29px;height:29px;margin-right:2px}.uf-view-tab{color:#ecfaff}
.uf-view-copy .ph-text,.detail .ph-text{color:#edf8ff}.uf-view-copy .ph-title:hover>.ph-text,.detail .ph-title:hover>.ph-text{background-image:linear-gradient(105deg,#a2b5c8,#fff 42%,#879bb1 65%)}
.equipment-card .uf-layer{display:none!important}.equipment-card{position:relative}.equipment-card>.ph-equipment-mark{position:absolute;right:12px;top:8px;display:flex;align-items:center;pointer-events:none}.ph-equipment-mark .ph-icon{width:28px;height:28px;margin:0}.equipment-card>.eq-badge{max-width:calc(100% - 55px)}
.eq-korean{display:block!important;font-size:11px!important;line-height:1.75!important;color:var(--ph-translation,#44647e)!important;margin-top:7px!important}.eq-card-copy h3{font-size:14px;line-height:1.6}
.uf-still .ph-icon *,.still .ph-icon *,body[data-ph-still=true] .ph-icon *,body[data-ph-still=true] .ph-metal,body[data-ph-still=true] .ph-text{animation-play-state:paused!important}
@keyframes ph-silver{from{background-position:100% 0}to{background-position:0% 0}}
@keyframes ph-spin{to{transform:rotate(360deg)}}@keyframes ph-flow{to{stroke-dashoffset:-42}}@keyframes ph-work{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(6deg) translateY(-1px)}}@keyframes ph-scan{0%,100%{transform:translateY(-3px)}50%{transform:translateY(3px)}}@keyframes ph-pulse{0%,100%{opacity:.55}50%{opacity:1}}
@media(max-width:800px){.ph-icon{width:25px;height:25px;margin-right:6px}.hero h1>.ph-icon{width:34px;height:34px}.servicebar .ph-icon{width:21px;height:21px}.topnav a{display:flex}}
@media(prefers-reduced-motion:reduce){.ph-icon *,.ph-metal,.ph-text{animation:none!important}}

/* HUD-ALL readability correction: metallic highlight retains a dark hairline on white backgrounds. */
.hero .ph-metal{-webkit-text-stroke:.35px #4c607580}.service-card strong .ph-icon{width:32px;height:32px}.service-card strong{display:flex;align-items:center}.service-card strong .ph-text{display:inline}

/* HUD-ALL: hover description uses actual existing copy, no fabricated job information. */
.ph-title[data-ph-description]:hover:after,.ph-title[data-ph-description]:focus-visible:after{content:attr(data-ph-description);position:absolute;left:0;top:calc(100% + 9px);min-width:160px;width:max-content;max-width:min(300px,80vw);padding:10px 13px;border:1px solid #48d8f388;border-radius:10px;background:linear-gradient(150deg,#142c43f5,#06172af5);color:#eaf6ff;-webkit-text-fill-color:#eaf6ff;font:12px/1.7 "Malgun Gothic",sans-serif;letter-spacing:0;text-align:left;white-space:normal;box-shadow:inset 0 1px 0 #ffffff33,0 8px 22px #00162b44;z-index:80;pointer-events:none}
.topnav .ph-title:last-child:after{left:auto;right:0}.archive-card>strong .ph-icon{width:21px;height:21px}.filters .ph-icon,.story-tabs .ph-icon,summary .ph-icon{width:22px;height:22px}.ph-motion-control{max-width:calc(100vw - 28px)}

/* HUD-ALL: stable inline number/title layout in existing photo selection tabs. */
.uf-view-tab>.ph-text{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}.uf-view-tab>.ph-icon{flex-shrink:0}.uf-view-tab .ph-text .uf-num{display:inline-grid}.uf-badge:hover .uf-copy b{background:linear-gradient(105deg,#afc4d8,#fff 42%,#8299af);background-size:280% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;animation:ph-silver 2.8s linear infinite}

/* Role lock: photo location / observed equipment / explanatory guide. */
.uf-role-photo-marker{--ph-color:#67dbe6}.uf-role-equipment-detail{--ph-color:#d78cbe}.uf-role-observation{opacity:1}
