/* PacketNebula - contenu migre depuis Astro. Composants recurrents.
   Fort contraste, accent bleu, aucun jaune. S'adapte au mode sombre de JNews. */
.pn-content{--pn-accent:#1d63d1;--pn-line:#d8dee7;--pn-soft:#f4f7fb;--pn-ink:#111826;--pn-mute:#4a5568;;--panel:#ffffff;--panel-border:#dbe4f0;--radius-lg:16px;--shadow-panel:0 6px 24px rgba(16, 24, 40, .07);--glow-soft:0 4px 16px rgba(37, 99, 235, .1);--space-5:1.5rem;--ease-out:cubic-bezier(.16, 1, .3, 1);--space-6:2rem;--space-4:1rem;--space-2:.5rem;--radius-sm:6px;--text-xs:.78rem;--accent-2:#2563eb;--accent:#0e7490;--ok:#15803d;--text-3:#5d6b89;--code-bg:#f4f7fc;--font-display:"Space Grotesk Variable", "Space Grotesk", system-ui, sans-serif;--text-sm:.875rem;--text-2:#45526e;--space-3:.75rem;--bad-strong:#991b1b;--bad:#b91c1c;--warn:#c2410c;--ok-strong:#166534;--radius-md:10px;--font-mono:ui-monospace, "Cascadia Code", Consolas, "SF Mono", Menlo, monospace;--text-2xl:1.7rem;--space-1:.25rem;--accent-deep:#1e40af}
@media (prefers-color-scheme:dark){.pn-content{--pn-accent:#69a5ff;--pn-line:#2b3444;--pn-soft:#161c27;--pn-ink:#e8edf5;--pn-mute:#9aa7ba}}
body.dark-mode .pn-content,.dark-mode .pn-content{--pn-accent:#69a5ff;--pn-line:#2b3444;--pn-soft:#161c27;--pn-ink:#e8edf5;--pn-mute:#9aa7ba}

.pn-content .lede{font-size:1.15em;line-height:1.65;color:var(--pn-mute);margin-bottom:1.6em}

.pn-content .tldr{background:var(--pn-soft);border:1px solid var(--pn-line);border-left:4px solid var(--pn-accent);border-radius:6px;padding:1.1em 1.3em;margin:1.8em 0}
.pn-content .tldr-label{font-size:.78em;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--pn-accent);margin:0 0 .5em}
.pn-content .tldr>p{margin:0 0 .6em}
.pn-content .tldr-stats{display:flex;flex-wrap:wrap;gap:1.4em;margin-top:1em;padding-top:1em;border-top:1px solid var(--pn-line)}
.pn-content .tldr-stat{display:flex;flex-direction:column;min-width:5.5em}
.pn-content .tldr-stat b{font-size:1.5em;line-height:1.1;color:var(--pn-ink)}
.pn-content .tldr-stat span{font-size:.8em;color:var(--pn-mute);margin-top:.2em}

.pn-content figure.fig{margin:2em 0}
.pn-content figure.fig img{width:100%;height:auto;border:1px solid var(--pn-line);border-radius:6px;display:block}
.pn-content figure.fig figcaption{font-size:.86em;color:var(--pn-mute);margin-top:.7em;line-height:1.5}

.pn-content details.faq-item{border:1px solid var(--pn-line);border-radius:6px;margin:.6em 0;background:var(--pn-soft)}
.pn-content details.faq-item>summary{cursor:pointer;padding:.85em 1.1em;font-weight:600;list-style:none;color:var(--pn-ink)}
.pn-content details.faq-item>summary::-webkit-details-marker{display:none}
.pn-content details.faq-item>summary::after{content:"+";float:right;font-weight:400;color:var(--pn-accent)}
.pn-content details.faq-item[open]>summary::after{content:"\2212"}
.pn-content details.faq-item>p{padding:0 1.1em 1em;margin:0;color:var(--pn-mute)}

.pn-content .cmdb{border:1px solid var(--pn-line);border-radius:6px;overflow:hidden;margin:1.4em 0;background:var(--pn-soft)}
.pn-content .cmdb-os{display:block;font-size:.74em;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--pn-mute);padding:.5em .9em;border-bottom:1px solid var(--pn-line)}
.pn-content .cmdb-row{display:flex;align-items:stretch;gap:.5em}
.pn-content .cmdb-code{flex:1;padding:.8em .9em;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.92em;white-space:pre-wrap;word-break:break-word;background:none;color:var(--pn-ink)}
.pn-content .cmdb-copy{display:inline-flex;align-items:center;gap:.4em;border:0;border-left:1px solid var(--pn-line);background:none;cursor:pointer;padding:0 .9em;color:var(--pn-accent);font-size:.82em;font-weight:600}
.pn-content .cmdb-copy:hover{background:rgba(29,99,209,.08)}
.pn-content .cmdb-copy.is-done{color:#12805c}

/* Hub /articles/ rendu par le raccourci [pn_articles] */
.pn-hub{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.4em;margin:1.5em 0}
.pn-hub-card{display:flex;flex-direction:column;border:1px solid var(--pn-line,#d8dee7);border-radius:8px;overflow:hidden;text-decoration:none;color:inherit;background:var(--pn-soft,#f4f7fb);transition:box-shadow .2s,transform .2s}
.pn-hub-card:hover{box-shadow:0 6px 22px rgba(16,24,40,.1);transform:translateY(-2px)}
.pn-hub-img img{width:100%;height:auto;display:block;aspect-ratio:1200/630;object-fit:cover}
.pn-hub-body{display:flex;flex-direction:column;gap:.35em;padding:.9em 1em 1.1em}
.pn-hub-cat{font-size:.72em;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:#1d63d1}
.pn-hub-title{font-weight:700;line-height:1.35}
.pn-hub-ex{font-size:.88em;line-height:1.5;color:var(--pn-mute,#4a5568)}
.pn-hub-date{font-size:.78em;color:var(--pn-mute,#4a5568);margin-top:.2em}
.pn-hub-pag ul{list-style:none;display:flex;flex-wrap:wrap;gap:.4em;padding:0;justify-content:center}
.pn-hub-pag a,.pn-hub-pag span{display:inline-block;padding:.4em .75em;border:1px solid var(--pn-line,#d8dee7);border-radius:4px;text-decoration:none}
.pn-hub-pag .current{background:#1d63d1;color:#fff;border-color:#1d63d1}

.pn-content .sources{font-size:.9em;color:var(--pn-mute)}
.pn-content table{width:100%;border-collapse:collapse;margin:1.6em 0}
.pn-content th,.pn-content td{border:1px solid var(--pn-line);padding:.55em .7em;text-align:left;vertical-align:top}
.pn-content th{background:var(--pn-soft);font-weight:700}


/* --- diagrammes sur mesure, repris du build Astro --- */
.pn-content .panel{background:var(--panel);border:1px solid var(--panel-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-panel)}
.pn-content :root[data-theme=dark] .panel{backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.pn-content .panel-glow{box-shadow:var(--shadow-panel),var(--glow-soft)}
.pn-content .panel-pad{padding:var(--space-5)}
@media(prefers-reduced-motion:no-preference){.pn-content html.js .reveal{opacity:0;transform:translateY(14px);transition:opacity .55s var(--ease-out),transform .55s var(--ease-out)}.pn-content html.js .reveal.is-in{opacity:1;transform:none}.pn-content html.js .draw-svg line{transition:stroke-dashoffset 1.1s var(--ease-out)}}
.pn-content .tool-panel{margin-bottom:var(--space-6)}
@media(max-width:640px){.pn-content .panel-pad{padding:var(--space-4)}}
.pn-content .fig-anim-body{padding:var(--space-5);overflow-x:auto}
.pn-content .fig-anim-body svg{width:100%;height:auto}
.pn-content .jas{display:grid;gap:var(--space-4);grid-template-columns:repeat(3,1fr)}
.pn-content .jas-part{display:flex;flex-direction:column;gap:var(--space-2);text-align:center;opacity:0;transform:translateY(14px);transition:opacity .55s ease,transform .55s var(--ease-out)}
.pn-content html:not(.js) .jas-part,.pn-content .reveal.is-in .jas-part{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.pn-content .jas-part{opacity:1;transform:none}}
.pn-content .jas-token{border-radius:var(--radius-sm);padding:.45rem .5rem;font-size:var(--text-xs);color:#fff;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;border:none}
.pn-content .jas-header .jas-token{background:var(--accent-2)}
.pn-content .jas-payload .jas-token{background:var(--accent);color:#06243a}
.pn-content .jas-sig .jas-token{background:transparent;border:1.5px solid var(--ok);color:var(--ok)}
.pn-content .jas-arrow{color:var(--text-3)}
.pn-content .jas-body{font-size:var(--text-xs);border:1px solid var(--panel-border);border-radius:var(--radius-sm);padding:.6rem .5rem;background:var(--code-bg);min-height:3.6em;display:flex;align-items:center;justify-content:center}
.pn-content .jas-sig .jas-body{border-color:color-mix(in srgb,var(--ok) 50%,transparent)}
.pn-content .jas-label{font-family:var(--font-display);font-size:var(--text-sm)}
.pn-content .jas-header .jas-label{color:var(--accent-2)}
.pn-content .jas-payload .jas-label{color:var(--accent)}
.pn-content .jas-sig .jas-label{color:var(--ok)}
.pn-content .jas-note{font-size:var(--text-xs);color:var(--text-2)}
@media(max-width:640px){.pn-content .jas{grid-template-columns:1fr}}
.pn-content .ctb-title{font-family:var(--font-display);font-weight:700;margin-bottom:var(--space-4)}
.pn-content .ctb-row{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-3)}
.pn-content .ctb-label{width:150px;flex:none;text-align:right;font-size:var(--text-xs);color:var(--text-2);font-weight:600}
.pn-content .ctb-track{flex:1;display:flex;align-items:center;gap:var(--space-2);min-width:0}
.pn-content .ctb-bar{height:20px;border-radius:6px;width:0;transition:width .9s var(--ease-out);flex:none}
.pn-content html:not(.js) .ctb-bar,.pn-content .reveal.is-in .ctb-bar{width:var(--w)}
@media(prefers-reduced-motion:reduce){.pn-content .ctb-bar{width:var(--w)}}
.pn-content .tone-bad{background:linear-gradient(90deg,var(--bad-strong),var(--bad))}
.pn-content .tone-warn{background:linear-gradient(90deg,#ea580c,var(--warn))}
.pn-content .tone-ok{background:linear-gradient(90deg,var(--ok-strong),var(--ok))}
.pn-content .ctb-value{font-size:var(--text-sm);white-space:nowrap}
.pn-content .ctb-note{font-size:var(--text-xs);color:var(--text-3);margin-top:var(--space-3)}
.pn-content .eaf{display:flex;gap:var(--space-3);align-items:center;flex-wrap:wrap}
.pn-content .eaf-step{opacity:0;transform:translateY(10px);transition:opacity .5s ease,transform .5s var(--ease-out)}
.pn-content html:not(.js) .eaf-step,.pn-content .reveal.is-in .eaf-step{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.pn-content .eaf-step{opacity:1;transform:none}}
.pn-content .eaf-sender{border:1.5px solid var(--accent-2);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);text-align:center;flex:none}
.pn-content .eaf-sender b{display:block;font-family:var(--font-display)}
.pn-content .eaf-sender span{font-size:var(--text-xs);color:var(--text-2);font-family:var(--font-mono)}
.pn-content .eaf-arrow{font-size:var(--text-2xl);color:var(--text-3);flex:none}
.pn-content .eaf-checks{flex:1;min-width:250px;border:1px solid var(--panel-border);border-radius:var(--radius-md);padding:var(--space-3)}
.pn-content .eaf-title{font-family:var(--font-display);font-weight:700;font-size:var(--text-sm);margin-bottom:var(--space-2);text-align:center}
.pn-content .eaf-check{border:1.5px solid;border-radius:var(--radius-sm);padding:var(--space-2) var(--space-3);margin-top:var(--space-2);font-size:var(--text-sm)}
.pn-content .eaf-check b{font-family:var(--font-display);margin-right:var(--space-2)}
.pn-content .eaf-check span{color:var(--text-2);font-size:var(--text-xs)}
.pn-content .c-spf{border-color:var(--accent-2)}
.pn-content .c-spf b{color:var(--accent-2)}
.pn-content .c-dkim{border-color:var(--accent)}
.pn-content .c-dkim b{color:var(--accent)}
.pn-content .c-dmarc{border-color:var(--ok)}
.pn-content .c-dmarc b{color:var(--ok)}
.pn-content .eaf-outcomes{display:flex;flex-direction:column;gap:var(--space-2);flex:none}
.pn-content .eaf-out{border:1.5px solid;border-radius:var(--radius-sm);padding:var(--space-2) var(--space-3);font-size:var(--text-xs);font-weight:700}
.pn-content .o-ok{border-color:var(--ok);color:var(--ok)}
.pn-content .o-warn{border-color:var(--warn);color:var(--warn)}
.pn-content .o-bad{border-color:var(--bad);color:var(--bad)}
@media(max-width:760px){.pn-content .eaf{flex-direction:column;align-items:stretch}.pn-content .eaf-arrow{transform:rotate(90deg);align-self:center}.pn-content .reveal.is-in .eaf-arrow{transform:rotate(90deg)}}
.pn-content .ths{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-6)}
.pn-content .ths-title{font-family:var(--font-display);font-weight:700;text-align:center;margin-bottom:var(--space-3)}
.pn-content .t-warn{color:var(--warn)}
.pn-content .t-ok{color:var(--ok)}
.pn-content .ths-lane{border-left:2px solid var(--panel-border);border-right:2px solid var(--panel-border);padding:var(--space-3) 0;min-height:230px}
.pn-content .ths-msg{margin:var(--space-3) 0;opacity:0;transition:opacity .45s ease,transform .45s var(--ease-out)}
.pn-content .ths-msg.dir-r{transform:translate(-18px)}
.pn-content .ths-msg.dir-l{transform:translate(18px)}
.pn-content html:not(.js) .ths-msg,.pn-content .reveal.is-in .ths-msg{opacity:1;transform:none}
.pn-content .ths-label{display:block;text-align:center;font-size:var(--text-xs);color:var(--text-2);font-family:var(--font-mono)}
.pn-content .ths-line{display:block;height:2px;background:var(--accent);margin:4px var(--space-3) 0;position:relative}
.pn-content .ths-line:after{content:"";position:absolute;top:-3.5px;border:4.5px solid transparent}
.pn-content .dir-r .ths-line:after{right:-2px;border-left-color:var(--accent)}
.pn-content .dir-l .ths-line:after{left:-2px;border-right-color:var(--accent)}
.pn-content .ths-data,.pn-content .ths-note{text-align:center;font-weight:700;font-size:var(--text-sm);margin-top:var(--space-4);opacity:0;transition:opacity .45s ease}
.pn-content .ths-note{color:var(--text-3);font-weight:400;font-size:var(--text-xs)}
.pn-content html:not(.js) .ths-data,.pn-content .reveal.is-in .ths-data,.pn-content html:not(.js) .ths-note,.pn-content .reveal.is-in .ths-note{opacity:1}
@media(prefers-reduced-motion:reduce){.pn-content .ths-msg,.pn-content .ths-data,.pn-content .ths-note{opacity:1;transform:none}}
.pn-content .ths-ends{display:flex;justify-content:space-between;font-size:var(--text-xs);color:var(--text-3);margin-top:var(--space-1);padding-inline:var(--space-2)}
@media(max-width:700px){.pn-content .ths{grid-template-columns:1fr}.pn-content .ths-lane{min-height:0}}
.pn-content .sas-addr{font-size:var(--text-2xl);text-align:center;margin-bottom:var(--space-4)}
.pn-content .sas-addr code{background:none;border:none}
.pn-content .sas-addr b{color:var(--accent)}
.pn-content .sas-bits{display:grid;grid-template-columns:repeat(32,1fr);gap:3px}
.pn-content .sas-cell{height:26px;border-radius:4px;opacity:0;transform:translateY(6px);transition:opacity .4s ease,transform .4s var(--ease-out)}
.pn-content .sas-cell.net{background:var(--accent-2)}
.pn-content .sas-cell.host{background:var(--accent)}
.pn-content .sas-cell.gap{margin-left:5px}
.pn-content html:not(.js) .sas-cell,.pn-content .reveal.is-in .sas-cell{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.pn-content .sas-cell{opacity:1;transform:none}}
.pn-content .sas-legend{display:flex;justify-content:space-between;gap:var(--space-4);margin-top:var(--space-3)}
.pn-content .sas-part b{display:block;font-family:var(--font-display);font-size:var(--text-sm)}
.pn-content .sas-part span{font-size:var(--text-xs);color:var(--text-2)}
.pn-content .net-c{color:var(--accent-2)}
.pn-content .host-c{color:var(--accent)}
.pn-content .sas-facts{display:flex;flex-wrap:wrap;gap:var(--space-5);margin:var(--space-4) 0 0;font-family:var(--font-mono);font-size:var(--text-sm)}
.pn-content .sas-facts dt{color:var(--text-3);font-size:var(--text-xs)}
.pn-content .sas-facts dd{margin:0;font-weight:700}
@media(max-width:560px){.pn-content .sas-bits{gap:1px}.pn-content .sas-cell.gap{margin-left:3px}}
.pn-content .ttlb-title{font-family:var(--font-display);font-weight:700;margin-bottom:var(--space-4)}
.pn-content .ttlb-row{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-3)}
.pn-content .ttlb-label{width:160px;flex:none;text-align:right;font-size:var(--text-xs);color:var(--text-2);font-weight:600}
.pn-content .ttlb-track{flex:1;display:flex;align-items:center;gap:var(--space-2);min-width:0}
.pn-content .ttlb-bar{height:20px;border-radius:6px;width:0;transition:width .9s var(--ease-out);flex:none}
.pn-content html:not(.js) .ttlb-bar,.pn-content .reveal.is-in .ttlb-bar{width:var(--w)}
@media(prefers-reduced-motion:reduce){.pn-content .ttlb-bar{width:var(--w)}}
.pn-content .tone-accent{background:linear-gradient(90deg,var(--accent-deep),var(--accent-2))}
.pn-content .ttlb-value{font-size:var(--text-sm);white-space:nowrap}
.pn-content .ttlb-note{font-size:var(--text-xs);color:var(--text-3);margin-top:var(--space-3)}