.shield-scene{max-width:700px;margin:28px auto 0;background:linear-gradient(145deg,#122840,#0c1729 65%,#1b2440);border:1px solid #29445e;border-radius:26px;padding:20px;color:#e8f5ff;overflow:hidden}.sa-top{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:16px}.sa-brand{display:flex;align-items:center;gap:7px;font-size:14px;white-space:nowrap}.sa-brand svg{width:26px;height:28px;color:#66ddf2}.sa-brand b{font-weight:500;color:#7fe5fa}.sa-switch{display:flex;align-items:center;gap:8px;position:relative;font-size:11px;letter-spacing:.08em;border:1px solid #795349;background:#382c30;border-radius:30px;padding:8px 11px;min-width:72px;height:32px}.sa-switch i{width:12px;height:12px;border-radius:50%;background:#ffb573}.sa-switch .sa-on{position:absolute;left:11px}.sa-stage{height:320px;position:relative;border:1px solid #3c526c;border-radius:18px;background:#142238;overflow:hidden}.sa-browser{display:flex;align-items:center;justify-content:space-between;background:#1d3048;padding:11px 14px;font-size:10px;color:#94acbf}.sa-browser b{font-weight:400;font-size:9px;margin-left:8px;color:#6fcae0}.sa-page{padding:23px 27px}.sa-page small{font-size:9px;letter-spacing:.14em;color:#82b7c8}.sa-page h3{font-size:20px;margin:7px 0 16px;letter-spacing:-.03em}.sa-photo{height:115px;border-radius:12px;background:linear-gradient(135deg,#174355,#24446b);position:relative;overflow:hidden}.sa-photo span{position:absolute;left:24px;top:15px;font-size:25px;color:#ffd587}.sa-photo i{position:absolute;width:160px;height:100px;background:#326275;border-radius:60% 60% 0 0;bottom:-50px;left:25px;transform:rotate(-12deg)}.sa-photo i+i{left:auto;right:-20px;background:#3e7890;bottom:-35px;transform:rotate(20deg)}.sa-lines{margin-top:18px}.sa-lines i{display:block;height:5px;border-radius:8px;background:#39546e;margin:9px 0;width:93%}.sa-lines i:nth-child(2){width:78%}.sa-lines i:nth-child(3){width:55%}.sa-pop{position:absolute;display:flex;align-items:center;gap:10px;background:#352a36;border:1px solid #d79c6880;border-radius:13px;padding:13px 15px;box-shadow:0 8px 24px #0003;z-index:2;transform-origin:center;min-width:165px}.sa-pop small{display:block;font-size:8px;letter-spacing:.13em;color:#ffc778}.sa-pop b{font-size:12px;font-weight:500;color:#fff1dd;white-space:nowrap}.sa-germ{font-size:28px;color:#ffbd75}.sa-x{font-size:13px;margin-left:auto;color:#cbac99}.sa-p0{left:18px;top:59px}.sa-p1{right:16px;top:102px}.sa-p2{left:28px;top:158px}.sa-p3{right:22px;top:207px}.sa-p4{left:17px;top:261px}.sa-burst{position:absolute;inset:-9px;border:2px solid #65dff3;border-radius:50%;opacity:0;pointer-events:none}.sa-clean{position:absolute;bottom:16px;left:0;right:0;text-align:center;font-size:11px;color:#94eed4;opacity:0}.sa-clean span{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#244b48;margin-right:4px}.sa-caption{position:relative;height:42px;text-align:center;font-size:12px;display:grid;place-items:center;margin-top:8px}.sa-caption>span{grid-area:1/1}.sa-on{opacity:0}.sa-controls{display:flex;justify-content:center;gap:8px}.sa-controls button{min-height:44px;border:1px solid #42617b;border-radius:10px;background:#183149;color:#b9eafa;font-size:11px;padding:0 14px;cursor:pointer}.sa-note{font-size:10px;color:#97acbf;text-align:center;line-height:1.6;margin:14px 0 0}.sa-auto .sa-pop{animation:sa-pop 12s both infinite;animation-delay:var(--d);animation-play-state:paused}.sa-auto .sa-burst{animation:sa-burst 12s both infinite;animation-delay:var(--d);animation-play-state:paused}.sa-auto .sa-off{animation:sa-off 12s both infinite;animation-play-state:paused}.sa-auto .sa-on,.sa-auto .sa-clean{animation:sa-on 12s both infinite;animation-play-state:paused}.sa-auto.sa-running *{animation-play-state:running}.sa-manual-on .sa-pop{transform:scale(.25);opacity:0;transition:transform .35s ease,opacity .25s;transition-delay:var(--d)}.sa-manual-on .sa-off{opacity:0}.sa-manual-on .sa-on,.sa-manual-on .sa-clean{opacity:1}.sa-manual-on .sa-switch{background:#164039;border-color:#458a78}.sa-manual-on .sa-switch i{background:#72e2bb}.sa-manual-off .sa-pop{opacity:1;transform:none}.sa-manual-off .sa-on,.sa-manual-off .sa-clean{opacity:0}
@keyframes sa-pop{0%{opacity:0;transform:translateY(12px) scale(.75)}8%,39%{opacity:1;transform:translateY(0) scale(1)}43%{opacity:1;transform:scale(1.12)}47%,100%{opacity:0;transform:scale(.15)}}@keyframes sa-burst{0%,41%{opacity:0;transform:scale(.6)}43%{opacity:1;transform:scale(1)}49%,100%{opacity:0;transform:scale(1.45)}}@keyframes sa-off{0%,39%{opacity:1}42%,100%{opacity:0}}@keyframes sa-on{0%,39%{opacity:0}42%,100%{opacity:1}}
@media(max-width:700px){.shield-scene{max-width:350px;padding:15px;border-radius:24px}.sa-brand{font-size:12px;gap:5px}.sa-brand svg{width:23px}.sa-stage{height:325px}.sa-page{padding:25px 19px}.sa-page h3{font-size:18px}.sa-pop{padding:11px 12px;gap:8px;min-width:160px}.sa-p0{left:9px}.sa-p1{right:7px}.sa-p2{left:14px}.sa-p3{right:10px}.sa-p4{left:9px}.sa-pop b{font-size:11px}.sa-caption{font-size:11px}.sa-note{font-size:9px}.sa-controls button{padding:0 12px}}
@media(prefers-reduced-motion:reduce){.shield-scene *{animation:none!important;transition:none!important}.sa-auto .sa-pop{opacity:0}.sa-auto .sa-off{opacity:0}.sa-auto .sa-on,.sa-auto .sa-clean{opacity:1}}
html[data-theme=day] .shield-scene{background:linear-gradient(145deg,#effaff,#eceafa);border-color:#b3cfe0;color:#162f4a}html[data-theme=day] .sa-note{color:#4b6e83}html[data-theme=day] .sa-brand{color:#183753}html[data-theme=day] .sa-brand b{color:#14758c}html[data-theme=day] .sa-controls button{background:#f5fcff;border-color:#b4d0df;color:#245a75}html[data-theme=day] .sa-caption{color:#24516e}
.sa-manual-on .sa-burst{animation:sa-manual-burst .55s ease-out both;animation-delay:var(--d)}@keyframes sa-manual-burst{0%{opacity:0;transform:scale(.65)}35%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.5)}}
.sa-p4{top:246px}.sa-switch i{position:relative}.sa-switch i:after{content:'';position:absolute;inset:0;border-radius:50%;background:#72e2bb;opacity:0}.sa-auto .sa-switch i:after{animation:sa-on 12s both infinite;animation-play-state:paused}.sa-auto.sa-running .sa-switch i:after{animation-play-state:running}.sa-manual-on .sa-switch i:after{opacity:1}@media(prefers-reduced-motion:reduce){.sa-auto .sa-switch i:after{opacity:1}}
.sa-lines i:nth-child(3){display:none}.sa-clean{bottom:9px}.sa-p4{top:240px}
html[data-theme=day] .shield-scene .sa-page h3{color:#e8f5ff}html[data-theme=day] .shield-scene .sa-pop b{color:#fff1dd}html[data-theme=day] .shield-scene .sa-switch{color:#eefaff}
html[data-theme=day] .shield-scene .sa-page h3{color:#e8f5ff!important}html[data-theme=day] .shield-scene .sa-pop b{color:#fff1dd!important}html[data-theme=day] .shield-scene .sa-switch{color:#eefaff!important}