/* Hall of Legends — navy historical legacy certificate, November 2026.
   Presentation only: the challenge system has not awarded scores yet. */
body.hall-visual-demo .hv-certificate{
 --cert-gold:#ffdb29;
 position:relative; isolation:isolate; overflow:hidden;
 width:min(1050px,100%);
 padding:clamp(28px,4.5vw,58px) clamp(14px,3.7vw,46px) clamp(26px,3.8vw,46px);
 margin:26px auto 20px;
 color:#f8f9ff;
 border:2px solid rgba(242,203,74,.8); outline:none; outline-offset:0;
 border-radius:10px;
 background:
   radial-gradient(ellipse at 74% 11%,rgba(45,108,205,.33),transparent 52%),
   radial-gradient(ellipse at 25% 90%,rgba(12,37,103,.65),transparent 58%),
   linear-gradient(125deg,#030b20 0%,#06183c 32%,#102d64 55%,#071738 77%,#020918 100%);
 box-shadow:inset 0 0 0 5px rgba(2,8,25,.92),inset 0 0 0 7px rgba(255,211,67,.31),0 16px 46px rgba(0,0,0,.65),0 0 32px rgba(22,86,202,.13);
 animation:hvCertEntrance .8s cubic-bezier(.21,.83,.27,1.18) both;
}
body.hall-visual-demo .hv-certificate:before{
 content:"";position:absolute;inset:-70%;pointer-events:none;z-index:0;
 background:linear-gradient(110deg,transparent 43%,rgba(255,255,255,.02) 47%,rgba(170,210,255,.17) 50%,rgba(255,255,255,.03) 53%,transparent 57%);
 transform:translateX(-60%) rotate(-8deg);animation:hvCertShimmer 10s ease-in-out 1.1s infinite;
}
body.hall-visual-demo .hv-certificate:after{
 content:"";position:absolute;inset:8px;border:1px solid rgba(255,218,89,.28);border-radius:4px;pointer-events:none;z-index:0;
}
body.hall-visual-demo .hv-certificate>*{position:relative;z-index:1}
body.hall-visual-demo .hv-cert-corners,
body.hall-visual-demo .hv-cert-ornament,
body.hall-visual-demo .hv-cert-watermark,
body.hall-visual-demo .hv-cert-name,
body.hall-visual-demo .hv-cert-intro{display:none!important}
body.hall-visual-demo .hv-cert-brand{
 display:block; margin:0 auto 12px;padding:0 75px;
 font:700 clamp(10px,1.14vw,13px)/1.4 Georgia,serif;
 letter-spacing:.22em;color:#9aff58;text-transform:uppercase;
}
body.hall-visual-demo .hv-cert-title{
 color:#fff;font:700 clamp(21px,3.1vw,43px)/1.14 Georgia,"Times New Roman",serif;
 letter-spacing:-.025em;margin:5px auto 16px;text-shadow:0 3px 12px rgba(0,0,0,.55);
 white-space:nowrap;
}
body.hall-visual-demo .hv-cert-subtitle{
 font:italic clamp(12px,1.6vw,17px)/1.5 Georgia,serif;
 color:#dce7ff;letter-spacing:.03em;
 margin:0 auto 22px;
}
body.hall-visual-demo .hv-cert-lock{
 position:absolute;top:18px;right:18px;z-index:3;
 border-radius:8px;border:1px solid rgba(255,174,167,.75);
 padding:7px 14px;background:linear-gradient(155deg,#a71522,#650610);
 color:#fff;font:700 clamp(12px,1.45vw,16px)/1 Georgia,serif;
 letter-spacing:.025em;box-shadow:0 0 0 2px rgba(255,235,212,.14),0 6px 17px #0008;
}
body.hall-visual-demo .hv-cert-stats{
 display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;
 gap:clamp(7px,2.5vw,30px);margin:20px auto 22px;max-width:890px;
}
body.hall-visual-demo .hv-cert-stats span{
 min-width:0;display:flex;flex-direction:column-reverse;align-items:center;gap:8px;
 font:700 clamp(12px,1.6vw,17px)/1.25 Georgia,serif;color:#fff;text-shadow:0 2px 6px #000a;
}
body.hall-visual-demo .hv-cert-stats b{
 width:100%;min-height:clamp(55px,7vw,78px);
 display:grid;place-items:center;padding:10px 5px;
 border:1px solid #fff5a2;border-radius:999px;
 background:linear-gradient(160deg,#fff577 0%,#ffdc19 42%,#ffc000 90%);
 color:#141627;box-shadow:inset 0 2px 3px #fff9,0 5px 0 #bd7e0c,0 10px 20px #0007,0 0 17px #ffe54d47;
 text-shadow:none;font:700 clamp(17px,2.4vw,27px)/1 Georgia,serif;
 animation:hvCertScoreFloat 4.8s ease-in-out infinite;
}
body.hall-visual-demo .hv-cert-stats span:nth-child(2) b{animation-delay:.45s}
body.hall-visual-demo .hv-cert-stats span:nth-child(3) b{animation-delay:.9s}
body.hall-visual-demo .hv-cert-seals{
 display:flex;justify-content:center;flex-wrap:nowrap;
 gap:clamp(5px,1.45vw,17px);margin:24px auto 12px;
}
body.hall-visual-demo .hv-cert-seal{
 flex:0 1 45px;width:clamp(26px,4vw,45px);height:clamp(26px,4vw,45px);
 border:2px solid #e6c76b;border-radius:50%;
 background:rgba(3,17,48,.64);color:#d9e5ff;
 box-shadow:inset 0 0 8px rgba(255,216,90,.14),0 0 11px rgba(253,218,102,.1);
 font:700 clamp(11px,1.4vw,15px) Georgia,serif;
 transition:transform .3s ease,box-shadow .3s ease,background .3s ease;
}
body.hall-visual-demo .hv-cert-seal:hover{transform:translateY(-3px);box-shadow:0 0 14px rgba(252,221,102,.5)}
body.hall-visual-demo .hv-cert-seal[aria-label*="earned"]:not([aria-label*="not yet earned"]){
 border-color:#fff178;background:linear-gradient(155deg,#fff68d,#e4ae07);color:#142744;
 animation:hvCertSealEarn .65s ease-out both;
}
body.hall-visual-demo .hv-cert-bottom{
 display:flex;justify-content:center;border-top:1px solid rgba(250,214,114,.22);
 color:#c9d9f4;padding-top:13px;margin:22px auto 0;
 font:italic 12px/1.4 Georgia,serif;
}
body.hall-visual-demo .hv-cert-bottom span:first-child{display:none}
@keyframes hvCertEntrance{0%{opacity:0;transform:translateY(17px) scale(.975)}75%{opacity:1;transform:translateY(-2px) scale(1.005)}100%{opacity:1;transform:none}}
@keyframes hvCertShimmer{0%,20%{transform:translateX(-60%) rotate(-8deg)}52%,100%{transform:translateX(65%) rotate(-8deg)}}
@keyframes hvCertScoreFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes hvCertSealEarn{0%{transform:scale(.65)}70%{transform:scale(1.12)}100%{transform:scale(1)}}
@media(max-width:650px){
 body.hall-visual-demo .hv-certificate{padding:56px 14px 27px}
 body.hall-visual-demo .hv-cert-brand{padding:0 6px;font-size:10px;letter-spacing:.1em}
 body.hall-visual-demo .hv-cert-title{white-space:normal;font-size:clamp(23px,6vw,33px)}
 body.hall-visual-demo .hv-cert-lock{top:14px;right:14px;font-size:12px;padding:6px 9px}
 body.hall-visual-demo .hv-cert-stats{gap:7px}
 body.hall-visual-demo .hv-cert-stats b{min-height:47px;font-size:clamp(12px,3.3vw,17px);padding:6px 2px}
 body.hall-visual-demo .hv-cert-stats span{font-size:clamp(10px,2.6vw,13px)}
}
@media(prefers-reduced-motion:reduce){
 body.hall-visual-demo .hv-certificate,
 body.hall-visual-demo .hv-certificate:before,
 body.hall-visual-demo .hv-cert-stats b,
 body.hall-visual-demo .hv-cert-seal{animation:none!important;transition:none!important}
}
