.php-embed{--pe-bg: hsl(var(--brand-mist));--pe-card: hsl(var(--background));--pe-line: hsl(var(--brand-line));--pe-ink: hsl(var(--brand-ink));--pe-muted: hsl(var(--brand-slate));--pe-blue: hsl(var(--brand-blue));--pe-cyan: hsl(var(--brand-cyan));--pe-green: hsl(var(--brand-green));--pe-amber: hsl(var(--brand-amber));--pe-red: hsl(var(--destructive));margin:2.25rem 0;border:1px solid var(--pe-line);border-radius:1.25rem;background:var(--pe-bg);padding:1.5rem;color:var(--pe-ink);overflow:hidden}@media(max-width:640px){.php-embed{padding:1.1rem;border-radius:1rem;margin:1.75rem 0}}.php-embed__eyebrow{display:inline-flex;align-items:center;gap:.45rem;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--pe-blue)}.php-embed__title{margin:.35rem 0 .25rem;font-size:1.2rem;font-weight:800;line-height:1.25;letter-spacing:-.01em;color:var(--pe-ink)}.php-embed__lead{margin:0 0 1.1rem;font-size:.95rem;color:var(--pe-muted)}.php-embed__note{margin:1rem 0 0;font-size:.8rem;color:var(--pe-muted)}.php-toggle{display:inline-flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1.1rem}.php-toggle button{border:1px solid var(--pe-line);background:var(--pe-card);color:var(--pe-ink);border-radius:999px;padding:.45rem .9rem;font-size:.85rem;font-weight:600;cursor:pointer;transition:background .2s ease,border-color .2s ease,color .2s ease}.php-toggle button:hover{border-color:var(--pe-blue)}.php-toggle button[aria-pressed=true]{background:var(--pe-blue);border-color:var(--pe-blue);color:#fff}.php-toggle button:focus-visible{outline:2px solid var(--pe-cyan);outline-offset:2px}.php-flow{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.75rem}.php-node{display:flex;flex-direction:column;align-items:center;gap:.45rem;width:6.5rem;text-align:center}.php-node__icon{display:grid;place-items:center;width:4rem;height:4rem;border-radius:1.1rem;background:var(--pe-card);border:1px solid var(--pe-line);color:var(--pe-ink);transition:background .3s ease,border-color .3s ease,color .3s ease,box-shadow .3s ease}.php-node__icon svg{width:1.9rem;height:1.9rem}.php-node__label{font-size:.8rem;font-weight:700}.php-node__sub{font-size:.7rem;color:var(--pe-muted);line-height:1.3}.php-node--attacker .php-node__icon{color:var(--pe-red)}.php-track{position:relative;height:4rem}.php-track:before{content:"";position:absolute;left:0;right:0;top:50%;border-top:2px dashed var(--pe-line)}.php-packet{position:absolute;top:50%;left:0;translate:0 -50%;display:inline-flex;align-items:center;gap:.3rem;padding:.3rem .6rem;border-radius:999px;background:var(--pe-red);color:#fff;font-size:.7rem;font-weight:700;white-space:nowrap;box-shadow:0 6px 18px -8px var(--pe-red)}.php-packet svg{width:.85rem;height:.85rem}.php-shield{position:absolute;right:-.25rem;top:50%;translate:0 -50%;display:grid;place-items:center;width:2.4rem;height:2.4rem;border-radius:50%;background:var(--pe-green);color:#fff;opacity:0;scale:.6;transition:opacity .3s ease,scale .3s ease}.php-shield svg{width:1.3rem;height:1.3rem}.php-flow[data-mode=safe] .php-shield{opacity:1;scale:1}.php-flow[data-mode=open] .php-packet{left:calc(100% - 5.5rem)}.php-flow[data-mode=safe] .php-packet{left:calc(100% - 8rem);opacity:.45}.php-flow[data-mode=open] .php-node--server .php-node__icon{background:var(--pe-red);border-color:var(--pe-red);color:#fff;box-shadow:0 0 0 6px color-mix(in srgb,var(--pe-red) 22%,transparent)}.php-flow[data-mode=safe] .php-node--server .php-node__icon{background:var(--pe-green);border-color:var(--pe-green);color:#fff}html[data-motion=on] .php-flow[data-mode=open] .php-packet{animation:php-send-open 3.6s cubic-bezier(.5,0,.3,1) infinite}html[data-motion=on] .php-flow[data-mode=safe] .php-packet{animation:php-send-safe 3.6s cubic-bezier(.5,0,.3,1) infinite}html[data-motion=on] .php-flow[data-mode=open] .php-node--server .php-node__icon{animation:php-hit 3.6s ease infinite}html[data-motion=on] .php-flow[data-mode=safe] .php-shield{animation:php-block 3.6s ease infinite}@keyframes php-send-open{0%{left:0;opacity:0}10%{opacity:1}55%{left:calc(100% - 5.5rem);opacity:1}70%,to{left:calc(100% - 5.5rem);opacity:0}}@keyframes php-send-safe{0%{left:0;opacity:0}10%{opacity:1}50%{left:calc(100% - 8rem);opacity:1}65%{left:calc(100% - 11rem);opacity:.6}80%,to{left:calc(100% - 13rem);opacity:0}}@keyframes php-hit{0%,50%{background:var(--pe-card);border-color:var(--pe-line);color:var(--pe-ink);box-shadow:none}56%,92%{background:var(--pe-red);border-color:var(--pe-red);color:#fff;box-shadow:0 0 0 8px color-mix(in srgb,var(--pe-red) 22%,transparent)}to{background:var(--pe-card);border-color:var(--pe-line);color:var(--pe-ink);box-shadow:none}}@keyframes php-block{0%,45%{scale:1}50%{scale:1.25}58%,to{scale:1}}.php-flow__result{margin-top:1rem;display:flex;align-items:flex-start;gap:.6rem;padding:.8rem 1rem;border-radius:.9rem;font-size:.9rem;font-weight:600;background:color-mix(in srgb,var(--pe-red) 12%,var(--pe-card));color:var(--pe-ink);border:1px solid color-mix(in srgb,var(--pe-red) 40%,transparent)}.php-flow__result--safe{background:color-mix(in srgb,var(--pe-green) 12%,var(--pe-card));border-color:color-mix(in srgb,var(--pe-green) 40%,transparent)}.php-flow__result svg{flex:none;width:1.2rem;height:1.2rem;margin-top:.1rem}.php-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem;margin-top:1rem}.php-fact{background:var(--pe-card);border:1px solid var(--pe-line);border-radius:.9rem;padding:.75rem .85rem}.php-fact b{display:block;font-size:1.15rem;font-weight:800;color:var(--pe-ink)}.php-fact span{font-size:.78rem;color:var(--pe-muted)}@media(max-width:640px){.php-node{width:4.6rem}.php-node__icon{width:3.2rem;height:3.2rem;border-radius:.9rem}.php-node__icon svg{width:1.5rem;height:1.5rem}.php-node__sub,.php-packet span{display:none}.php-flow[data-mode=open] .php-packet{left:calc(100% - 2.2rem)}.php-flow[data-mode=safe] .php-packet{left:calc(100% - 4.4rem)}.php-facts{grid-template-columns:1fr}@keyframes php-send-open{0%{left:0;opacity:0}10%{opacity:1}55%{left:calc(100% - 2.2rem);opacity:1}70%,to{left:calc(100% - 2.2rem);opacity:0}}@keyframes php-send-safe{0%{left:0;opacity:0}10%{opacity:1}50%{left:calc(100% - 4.4rem);opacity:1}80%,to{left:10%;opacity:0}}}.php-check__step{margin-bottom:.9rem}.php-check__q{margin:0 0 .5rem;font-size:.9rem;font-weight:700}.php-result{display:grid;grid-template-columns:auto 1fr;gap:.9rem;align-items:start;padding:1rem 1.1rem;border-radius:1rem;background:var(--pe-card);border:1px solid var(--pe-line);border-left:5px solid var(--tone, var(--pe-blue))}html[data-motion=on] .php-result{animation:php-pop .42s cubic-bezier(.2,.9,.3,1.2)}@keyframes php-pop{0%{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}.php-result--safe{--tone: var(--pe-green)}.php-result--update{--tone: var(--pe-amber)}.php-result--upgrade{--tone: var(--pe-red)}.php-result--unknown{--tone: var(--pe-blue)}.php-result__icon{display:grid;place-items:center;width:2.6rem;height:2.6rem;border-radius:.8rem;background:var(--tone);color:#fff}.php-result__icon svg{width:1.35rem;height:1.35rem}.php-result h4{margin:0 0 .25rem;font-size:1rem;font-weight:800;color:var(--pe-ink)}.php-result p{margin:0 0 .6rem;font-size:.88rem;color:var(--pe-muted)}.php-meter{height:.5rem;border-radius:999px;background:var(--pe-line);overflow:hidden;margin:.2rem 0 .75rem}.php-meter i{display:block;height:100%;width:var(--risk, 50%);background:var(--tone);border-radius:inherit}html[data-motion=on] .php-meter i{animation:php-grow .9s cubic-bezier(.2,.8,.2,1)}@keyframes php-grow{0%{width:0}}.php-cta{display:inline-flex;align-items:center;gap:.4rem;border-radius:999px;background:var(--pe-blue);color:#fff!important;padding:.55rem 1rem;font-size:.88rem;font-weight:700;text-decoration:none!important}.php-cta:hover{filter:brightness(1.08)}.php-cta svg{width:1rem;height:1rem}.php-reset{margin-left:.75rem;background:none;border:0;color:var(--pe-muted);font-size:.82rem;text-decoration:underline;cursor:pointer}.php-tl{position:relative;display:grid;gap:.55rem;padding-top:1.6rem}.php-tl__axis{position:absolute;left:5.5rem;right:0;top:0;display:flex;justify-content:space-between;font-size:.68rem;color:var(--pe-muted)}.php-tl__row{display:grid;grid-template-columns:5.5rem 1fr;align-items:center;gap:0}.php-tl__name{font-size:.82rem;font-weight:700}.php-tl__name small{display:block;font-size:.68rem;font-weight:600;color:var(--pe-muted)}.php-tl__lane{position:relative;height:1.6rem;border-radius:.5rem;background:color-mix(in srgb,var(--pe-line) 55%,transparent)}.php-tl__bar{position:absolute;top:.2rem;bottom:.2rem;left:var(--start);width:var(--len);border-radius:.4rem;background:var(--tone);transform-origin:left center}html[data-motion=on] .php-tl.is-in .php-tl__bar{animation:php-bar 1.1s cubic-bezier(.2,.8,.2,1) both;animation-delay:var(--d, 0ms)}html[data-motion=on] .php-tl:not(.is-in) .php-tl__bar{transform:scaleX(0)}@keyframes php-bar{0%{transform:scaleX(0)}to{transform:scaleX(1)}}.php-tl__row--eol{--tone: color-mix(in srgb, var(--pe-red) 70%, var(--pe-muted))}.php-tl__row--soon{--tone: var(--pe-amber)}.php-tl__row--ok{--tone: var(--pe-green)}.php-tl__today{position:absolute;top:1.2rem;bottom:0;left:calc(5.5rem + (100% - 5.5rem) * var(--today));width:2px;background:var(--pe-blue)}.php-tl__today span{position:absolute;top:-1.3rem;left:50%;translate:-50% 0;white-space:nowrap;font-size:.66rem;font-weight:800;color:#fff;background:var(--pe-blue);border-radius:999px;padding:.1rem .45rem}html[data-motion=on] .php-tl__today span{animation:php-blink 2.4s ease-in-out infinite}@keyframes php-blink{50%{box-shadow:0 0 0 5px color-mix(in srgb,var(--pe-blue) 25%,transparent)}}.php-tl__legend{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:.9rem;font-size:.78rem;color:var(--pe-muted)}.php-tl__legend i{display:inline-block;width:.75rem;height:.75rem;border-radius:.2rem;margin-right:.35rem;vertical-align:-.1rem}@media(max-width:640px){.php-tl__axis{left:4.2rem}.php-tl__row{grid-template-columns:4.2rem 1fr}.php-tl__today{left:calc(4.2rem + (100% - 4.2rem) * var(--today))}.php-tl__axis span:nth-child(2n){visibility:hidden}}.php-day{position:relative;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.5rem;padding-top:.25rem}.php-day__rail{position:absolute;left:8%;right:8%;top:1.6rem;height:4px;border-radius:999px;background:var(--pe-line)}.php-day__rail i{position:absolute;inset:0 auto 0 0;width:100%;border-radius:inherit;background:linear-gradient(90deg,var(--pe-blue),var(--pe-cyan))}html[data-motion=on] .php-day.is-in .php-day__rail i{animation:php-rail 4.8s cubic-bezier(.4,0,.2,1) both}html[data-motion=on] .php-day:not(.is-in) .php-day__rail i{width:0}@keyframes php-rail{0%{width:0}to{width:100%}}.php-day__step{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:.4rem}.php-day__dot{position:relative;z-index:1;display:grid;place-items:center;width:3.2rem;height:3.2rem;border-radius:50%;background:var(--pe-blue);color:#fff;border:4px solid var(--pe-bg)}.php-day__dot svg{width:1.3rem;height:1.3rem}html[data-motion=on] .php-day:not(.is-in) .php-day__dot{background:var(--pe-card);color:var(--pe-muted);box-shadow:inset 0 0 0 1px var(--pe-line)}html[data-motion=on] .php-day.is-in .php-day__dot{animation:php-dot .5s ease both;animation-delay:var(--d)}@keyframes php-dot{0%{background:var(--pe-card);color:var(--pe-muted);scale:.85}60%{scale:1.12}to{background:var(--pe-blue);color:#fff;scale:1}}.php-day__step b{font-size:.82rem;font-weight:800}.php-day__step span{font-size:.72rem;color:var(--pe-muted);line-height:1.35}.php-day__badge{display:inline-flex;align-items:center;gap:.4rem;margin-top:1.1rem;padding:.45rem .9rem;border-radius:999px;background:color-mix(in srgb,var(--pe-green) 14%,var(--pe-card));color:var(--pe-ink);font-size:.85rem;font-weight:700;border:1px solid color-mix(in srgb,var(--pe-green) 40%,transparent)}.php-day__badge svg{width:1rem;height:1rem;color:var(--pe-green)}@media(max-width:640px){.php-day{grid-template-columns:1fr;gap:.8rem}.php-day__rail{left:1.5rem;right:auto;top:1.6rem;bottom:1.6rem;width:4px;height:auto}.php-day__rail i{inset:0 0 auto;width:100%;height:100%;background:linear-gradient(180deg,var(--pe-blue),var(--pe-cyan))}html[data-motion=on] .php-day.is-in .php-day__rail i{animation-name:php-rail-v}html[data-motion=on] .php-day:not(.is-in) .php-day__rail i{width:100%;height:0}@keyframes php-rail-v{0%{height:0}to{height:100%}}.php-day__step{flex-direction:row;text-align:left;gap:.8rem}.php-day__step>div{display:flex;flex-direction:column}}.php-day__step>div{display:flex;flex-direction:column;align-items:center;gap:.15rem}@media(max-width:640px){.php-day__step>div{align-items:flex-start}}.dark .php-toggle button[aria-pressed=true],.dark .php-cta,.dark .php-day__dot,.dark .php-tl__today span{color:hsl(var(--brand-navy))!important}