:root {
  color-scheme:light;
  --ink:#202a30; --muted:#516067; --line:#ccd4d4; --accent:#166965;
  --paper:#fff; --wash:#f3f5f4;
  font:16px/1.5 system-ui,sans-serif; background:var(--wash); color:var(--ink);
}
*{box-sizing:border-box}
body{margin:0}
/* Give content half the space that used to sit outside the 1060px layout. */
.wrap{width:min(calc(50% + 530px),calc(100% - 1.25rem));margin:auto}
.mast{background:#263238;color:#fff}
.top,.bottom,.brand,.inputrow,.tool-heading,.bar,.report-tools{display:flex;align-items:center;gap:1rem}
.brand{gap:.65rem;color:inherit;font-size:1.45rem;font-weight:720;text-decoration:none}
.mast-label{border-left:1px solid #647375;padding-left:1rem;color:#d3dedd;font-size:.84rem}
main{padding:1.7rem 0 2.5rem}
.tool-heading,.bar,.bottom,.report-tools{justify-content:space-between}
h1{margin:0;font-size:clamp(1.65rem,3vw,2.1rem);letter-spacing:-.045em}
.tool-heading p,.empty p{margin:.15rem 0;color:var(--muted)}
.protocol,.bar span,.eyebrow,.report-tools span{font:.78rem/1.5 ui-monospace,monospace}
.protocol{white-space:nowrap;color:#435257;background:#e7eceb;padding:.2rem .55rem;border-radius:3px}
form,.output,details{background:var(--paper);border:1px solid var(--line);border-radius:5px}
form{margin:1rem 0;padding:1rem 1.15rem}
fieldset{padding:0;border:0;margin:0;min-width:0}
.field-label{display:block;font-weight:650;font-size:.88rem;margin-bottom:.35rem}
.inputrow{align-items:stretch;gap:.5rem}
input,button{font:inherit}
input[type=text]{min-width:0;flex:1;padding:.6rem .75rem;border:1px solid #819192;border-radius:3px;font-family:ui-monospace,monospace;color:var(--ink)}
button{padding:.55rem .95rem;background:var(--accent);color:white;font-weight:650;border:0;border-radius:3px;cursor:pointer}
button:disabled{opacity:.6;cursor:wait}button:hover:not(:disabled){background:#105551}
.consent{display:flex;align-items:baseline;gap:.5rem;color:var(--muted);margin-top:.65rem;font-size:.87rem}
input[type=checkbox]{accent-color:var(--accent);margin:0}
:focus-visible{outline:3px solid #267d80;outline-offset:3px}
.output{overflow:hidden}.bar{border-bottom:1px solid var(--line);padding:.55rem 1.15rem;background:#e8edec;font-size:.89rem;font-weight:700}.bar span{color:var(--muted)}
#vr-check-result{padding:1rem 1.15rem;overflow-wrap:anywhere}
.empty{padding:.6rem 0}.empty strong{font-size:.94rem}.empty p{font-size:.9rem}
h2{font-size:1.55rem;letter-spacing:-.035em;margin:.1em 0}
h3{font-size:1.04rem;margin:.8em 0 .45em}
h4{margin:.8rem 0 .2rem}
.eyebrow{margin:0;color:var(--muted);letter-spacing:.1em}
.report-tools{flex-wrap:wrap;margin:.6rem 0;color:var(--muted)}
.report-tools button{background:white;color:var(--accent);border:1px solid #7f9b99;font-size:.82rem}
.report-tools button:hover{background:#e7f1ef}
.vr-tls-highlights,.vr-result-grid{list-style:none;margin:.8rem 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem}
.vr-tls-highlights li,.vr-result-grid>div{padding:.52rem .72rem;display:grid;align-content:start;gap:.12rem;overflow-wrap:anywhere;background:var(--wash);border:1px solid var(--line);border-radius:4px}
.vr-tls-highlights strong,dt{font-size:.78rem;color:var(--muted)}
.vr-tls-highlights span,dd{font: .91rem/1.45 ui-monospace,monospace}dd{margin:0}
.vr-tls-good{--signal:#106344}.vr-tls-caution{--signal:#805000}.vr-tls-bad{--signal:#a22f36}.vr-tls-neutral{--signal:#46545b}
.vr-tls-highlights small,.vr-tls-headline{color:var(--signal);font-weight:650}
details{margin:.65rem 0;padding:.65rem .85rem}summary{cursor:pointer;font-weight:620;font-size:.92rem}
.probes{margin:1.2rem 0}.probes details{margin:0;border-radius:0;border-bottom:0}.probes details:last-child{border-bottom:1px solid var(--line)}.probes summary strong{float:right;font-size:.83rem;color:#41525a}.probes summary::after{content:"";display:block;clear:both}
.vr-hint,#method p,details p{color:var(--muted);font-size:.91rem}#method{margin-top:.85rem}
a{color:var(--accent)}footer{border-top:1px solid var(--line)}.bottom{padding:1rem 0;color:var(--muted);font-size:.85rem}
.skip,.sr{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden}.skip:focus{clip-path:none;width:auto;height:auto;background:white;padding:.7rem}
@media(max-width:700px){.wrap{width:calc(100% - .75rem)}.protocol{display:none}.vr-tls-highlights,.vr-result-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mast-label{font-size:.75rem}main{padding-top:1rem}}
@media(max-width:480px){.inputrow{flex-direction:column}.vr-result-grid{grid-template-columns:1fr}.probes summary strong{float:none;display:block;margin-left:1rem}.bottom{align-items:start}.bottom span{text-align:right}}
.plan{width:100%;margin-top:1rem;border-collapse:collapse;font-size:.88rem;text-align:left}
.plan caption{text-align:left;font-weight:650;margin-bottom:.3rem}.plan th{color:var(--muted);background:var(--wash);font-weight:550}
.plan td,.plan th{padding:.45rem .65rem;border-bottom:1px solid var(--line)}.plan td:first-child{width:32%;font-weight:600}

.tools-nav{display:flex;align-self:stretch;align-items:stretch;gap:.3rem;margin-left:auto}
.tools-prompt{align-self:center;white-space:nowrap;padding:.18rem .5rem;border-radius:3px;background:#344b4c;color:#a5e7dd;font-size:.85rem;font-weight:700}
.tools-nav a{display:grid;align-items:center;text-decoration:none;color:#d7e2e2;font-weight:600;font-size:1rem;padding:0 .85rem;border-bottom:3px solid transparent}
.tools-nav a:hover,.tools-nav a[aria-current=page]{background:#34444a;color:white}
.tools-nav a[aria-current=page]{border-color:#8dd9ce}
.bv [hidden]{display:none!important}
.bv-start,.bv #bv-work>section{margin:1rem 0;padding:1rem 1.15rem;background:var(--paper);border:1px solid var(--line);border-radius:5px}

.bv-start h2,.bv #bv-work h2{font-size:1.2rem;margin:0}.bv-start p{margin:.4rem 0}
.bv-actions,.bv-filters,.bv-stats{display:flex;align-items:end;flex-wrap:wrap;gap:.65rem}
.bv label{display:grid;gap:.25rem;max-width:100%;font-weight:600;font-size:.87rem}
.bv-actions{margin:.8rem 0}.bv input,.bv select{max-width:100%;padding:.4rem;color:var(--ink);background:white;border:1px solid var(--line);border-radius:3px}
.bv-stats span{background:var(--wash);padding:.5rem .8rem;border:1px solid var(--line);border-radius:4px}.bv-stats b{display:block;font-size:1.3rem}
.bv-columns{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:1rem}
.bv-list{display:grid;gap:.2rem;max-height:32rem;overflow:auto}
.bv-list button,.bv #bv-detail button{background:var(--wash);color:var(--ink);border:1px solid var(--line);text-align:left;overflow-wrap:anywhere}
.bv-list button:hover,.bv #bv-detail button:hover,.bv-list button[aria-current=true]{background:#dcece8;border-color:var(--accent)}
.bv-list small{display:block;color:var(--muted)}
.bv #bv-detail{margin-top:1rem;border:1px solid var(--line);padding:1rem;min-width:0}
.bv #bv-detail,.bv #bv-status,.bv #bv-notes,.bv #bv-document,.bv #bv-meta{overflow-wrap:anywhere}
.bv #bv-detail button{margin:.15rem;font-size:.86rem}.bv #bv-detail pre{white-space:pre-wrap;overflow-wrap:anywhere}
.bv #bv-detail dt{margin-top:.5rem}
@media(max-width:700px){.bv-columns{grid-template-columns:minmax(0,1fr)}.bv-list{max-height:15rem}}
@media(max-width:480px){.top{height:auto;align-items:flex-start;flex-direction:column;gap:.4rem;padding-top:.55rem}.tools-nav{margin:0}.tools-nav a{padding:.45rem .7rem}.bv-start,.bv #bv-work>section{padding:.8rem}}

.ci-input{margin:1rem 0;padding:1rem 1.15rem;background:var(--paper);border:1px solid var(--line);border-radius:5px}
form,.ci-input,.bv-start{background:#d6e7f1;border-color:#a9c1cf}
form:focus-within,.ci-input:focus-within,.bv-start:focus-within{border-color:var(--accent)}
.ci-input label{display:block;margin-bottom:.45rem;font-weight:650}
.ci textarea{box-sizing:border-box;width:100%;padding:.65rem;border:1px solid #819192;border-radius:3px;resize:vertical;font: .86rem/1.4 ui-monospace,monospace}
.ci-actions{display:flex;flex-wrap:wrap;gap:.5rem}.ci .secondary{background:var(--wash);color:var(--ink);border:1px solid var(--line)}
.ci-hint,.ci #ci-result>p{color:var(--muted);font-size:.9rem}
#ci-result{padding:1rem 1.15rem;overflow-wrap:anywhere}
#ci-result article{border-top:1px solid var(--line);margin-top:1rem}
.ci-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr));gap:.6rem}
.ci-grid>div{background:var(--wash);padding:.6rem}.ci-badge{display:inline-block;color:var(--signal);font-size:.8rem;font-weight:700}
.tools-nav{flex-wrap:wrap}
@media(max-width:600px){.top{height:auto;align-items:flex-start;flex-direction:column;gap:.4rem;padding-top:.55rem}.tools-nav{margin:0}.tools-nav a{padding:.45rem .48rem;font-size:.83rem}}

.top{min-height:81px;flex-wrap:wrap;padding:.5rem clamp(.5rem,1vw,1rem)}.tools-nav a{padding:.5rem .6rem}
@media(max-width:860px){.top{align-items:flex-start;flex-direction:column;gap:.25rem}.tools-nav{margin-left:0}}
.tool-result{padding:1rem;overflow-wrap:anywhere}.tool-result h3{margin-top:1.2rem}
.evidence-list{margin:.5rem 0;border:1px solid var(--line);border-radius:4px}.evidence-list>div{display:grid;grid-template-columns:minmax(9rem,1fr) 2fr auto;gap:.6rem;padding:.4rem .65rem;align-items:baseline}.evidence-list>div+div{border-top:1px solid var(--line)}
.evidence-list dt{font-size:.86rem;font-weight:650}.finding{font-size:.78rem;color:var(--muted)}.finding.positive{color:#106344}.finding.attention{color:#805000}.finding.weak{color:#a22f36}
@media(max-width:650px){.evidence-list>div{grid-template-columns:1fr}.top{gap:.25rem}.tools-nav a{padding:.35rem .5rem}}

/* TLS field guide */
.tls-guide > p{max-width:76ch}
.tls-guide h2{margin-top:1.6rem}
.wire{margin:1.3rem 0;background:var(--paper);border:1px solid var(--line);border-radius:5px;padding:1rem clamp(.8rem,3vw,2rem)}
.wire figcaption{color:var(--muted)}.wire figcaption strong{color:var(--ink);font-size:1.2rem}
.actors{display:flex;justify-content:space-between;color:var(--accent);margin:1rem 0 .25rem}
.wire ol{margin:0 .6rem;padding:.4rem clamp(.5rem,3vw,2rem);list-style:none;border-inline:2px solid var(--line)}
.wire li{display:grid;grid-template-columns:minmax(0,1fr) 2.5rem minmax(0,1fr);align-items:center;gap:.6rem;padding:.5rem 0;border-bottom:1px solid var(--line)}
.wire li:last-child{border-bottom:0}.wire li span{font-family:ui-monospace,monospace;overflow-wrap:anywhere}.wire li b{color:var(--accent);font-size:1.5rem;text-align:center}.wire small{color:var(--muted)}
.phase{display:flex;gap:1rem;border-top:1px solid var(--line);padding:1rem 0}.phase h3,.phase p{margin:0 0 .4rem}.phase p{max-width:80ch}.phase code{display:inline-block;color:var(--accent);margin-bottom:.5rem}.step{font:bold 1.25rem ui-monospace,monospace;color:var(--accent)}
.signals{border-collapse:collapse;width:100%;background:white}.signals caption{text-align:left;background:#263238;color:white;padding:.65rem}.signals td,.signals th{text-align:left;padding:.65rem;border-bottom:1px solid var(--line);vertical-align:top}.signals thead{background:#e8edec}
@media(max-width:600px){.signals td,.signals th{padding:.4rem;overflow-wrap:anywhere}.signals{font-size:.84rem;table-layout:fixed}.signals th:last-child{width:43%}}
.vr-tls-highlights li>a{color:inherit;text-underline-offset:.18em}
.tls-guide :target{scroll-margin-top:1rem;outline:2px solid var(--accent);outline-offset:3px}

.handshake-lab{background:white;border:1px solid var(--line);border-radius:5px;padding:clamp(.8rem,3vw,2rem);margin:1.25rem 0}.handshake-lab header h2{margin:.15rem 0}.handshake-lab header p{margin:.3rem 0}
#diagram-status{color:var(--muted);font-size:.9rem;overflow-wrap:anywhere}
.handshake-lab{--client-fill:#dbeaff;--server-fill:#eee5fb}
.diagram-actors{display:flex;justify-content:space-between}.diagram-actors strong{background:#263238;color:white;padding:.35rem .8rem;border-radius:3px}
.diagram-rows{list-style:none;margin:0 1.8rem;padding:.2rem clamp(.4rem,2vw,1.4rem);border-inline:2px dashed #849895}
.diagram-actors strong:first-child{background:#294e78}.diagram-actors strong:last-child{background:#614580}
.diagram-rows>.out{--sender-fill:var(--client-fill)}.diagram-rows>.in{--sender-fill:var(--server-fill)}
.diagram-rows details{background:transparent;margin:.3rem 0;border:0;padding:0}.diagram-rows summary{padding:.3rem .15rem;list-style:none;text-align:center}.diagram-rows summary::-webkit-details-marker{display:none}.diagram-rows summary:hover .diagram-caption{text-decoration:underline}.diagram-message{font-family:ui-monospace,monospace}.diagram-message small{color:var(--muted)}.diagram-caption{font-size:.83rem;color:var(--muted)}
.diagram-arrow{position:relative;display:block;border-top:2px solid var(--accent);margin:.35rem 0}
.diagram-arrow.out::after,.diagram-arrow.both::after,.diagram-arrow.in::before,.diagram-arrow.both::before{content:'';position:absolute;top:-5px;width:7px;height:7px;border-top:2px solid var(--accent);border-right:2px solid var(--accent)}
.diagram-arrow.out::after,.diagram-arrow.both::after{right:0;transform:rotate(45deg)}.diagram-arrow.in::before,.diagram-arrow.both::before{left:0;transform:rotate(-135deg)}
.diagram-rows details p,.diagram-observation{max-width:72ch;margin:.35rem auto .8rem;padding:.35rem .6rem}.diagram-observation{color:var(--ink);overflow-wrap:anywhere;font-size:.9rem}
.diagram-rows .in summary,.diagram-rows .in .diagram-observation,.diagram-rows .in details p{text-align:right}
.diagram-rows .out summary,.diagram-rows .out .diagram-observation,.diagram-rows .out details p{text-align:left}
.diagram-rows .in .diagram-observation,.diagram-rows .in details p{margin-right:0}
.diagram-rows .out .diagram-observation,.diagram-rows .out details p{margin-left:0}
.diagram-observation{max-width:min(75%,65ch)}.diagram-observation details{background:transparent}.diagram-observation strong{display:block}
.crypto{display:inline-block;border:1px solid #c5ced1;background:#f4f6f6;color:#34454e;border-radius:3px;margin:.16rem;padding:.12rem .36rem;font:.8rem/1.45 ui-monospace,monospace;overflow-wrap:anywhere;max-width:100%}
.crypto.hybrid,.crypto.pqc{background:#d8f3e2;color:#145330;border-color:#84b998}.crypto.classical{background:#fff0c8;color:#624207;border-color:#ceb175}.crypto.symmetric{background:#e1edf9;color:#224767;border-color:#9dbad6}
@media(max-width:600px){.diagram-observation{max-width:95%}}

.diagram-rows>li{border:1px solid var(--line);border-radius:6px;padding:.4rem clamp(.45rem,1.5vw,1rem);margin:.6rem 0 1rem;background:var(--sender-fill,#f3f4f5)}
.diagram-observation h3{margin:0 0 .45rem;padding-bottom:.3rem;border-bottom:1px solid #b4d1ca;font-size:.85rem}
.diagram-caption::after,.diagram-observation summary::after{content:'';display:inline-block;width:.45em;height:.45em;margin-inline:.55em .25em;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg);vertical-align:.06em;color:var(--accent)}
.diagram-rows details[open]>summary .diagram-caption::after,.diagram-observation details[open]>summary::after{transform:rotate(45deg);vertical-align:.2em}

@media (prefers-reduced-motion:no-preference){
  .diagram-arrow i{position:absolute;top:-1px;width:5px;height:5px;border-radius:50%;background:var(--accent);transform:translate(-50%,-50%);pointer-events:none;animation:handshake-flow 15s linear infinite}
  .diagram-arrow i:nth-child(2){animation-delay:-5s}
  .diagram-arrow i:nth-child(3){animation-delay:-10s}
  .diagram-arrow.in i,.diagram-arrow.both i:nth-child(2){animation-direction:reverse}
}
@keyframes handshake-flow{
  0%{left:0%;opacity:0}
  6%,94%{opacity:.75}
  100%{left:100%;opacity:0}
}
#diagram-hostname{color:var(--accent);overflow-wrap:anywhere}
#bt-result section{border:1px solid var(--line);border-radius:5px;margin:.8rem 0;padding:.7rem 1rem}
#bt-result section:nth-of-type(2){background:#dbeaff}
#bt-result section:nth-of-type(3){background:#eee5fb}
#bt-result section p{margin:.3rem 0}
.ci-chain-view{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:1rem;margin:1rem 0}
.ci-chain-view nav,.ci-chain-view article{border:1px solid var(--line);border-radius:5px;padding:.75rem}
#ci-result .ci-chain-view article{margin:0}.ci-chain-view h3{margin-top:0}
.ci-chain-view ul{list-style:none;padding:0;margin:.3rem 0}
.ci-chain-view ul ul{margin-left:.3rem;padding-left:.6rem;border-left:1px solid var(--line)}
.ci-chain-view button,.ci-missing{display:block;width:100%;padding:.45rem .55rem;text-align:left;margin:.25rem 0;background:var(--wash);border:1px solid var(--line);color:var(--ink);overflow-wrap:anywhere}
.ci-chain-view button[aria-pressed=true],.ci-chain-view button:hover{background:#deeae8;color:#104f4c;border-color:var(--accent)}
.ci-chain-view small{display:block;color:var(--muted);font-size:.8rem}.ci-missing{background:white;border-style:dashed}
@media(max-width:700px){.ci-chain-view{grid-template-columns:minmax(0,1fr)}}
.guide-sequence .diagram-rows header{padding:.35rem 0}
.guide-sequence .in header{text-align:right}
.guide-sequence .both header{text-align:center}
.guide-sequence .diagram-rows h3{margin:.15rem 0}
.guide-sequence .diagram-rows p{margin:.6rem 0;max-width:80ch}
.guide-sequence .diagram-rows small{color:var(--muted)}
@media(max-width:600px){.guide-sequence .diagram-rows{margin-inline:.4rem}}
.guide-boundary{margin-top:1rem;padding:.7rem .9rem;border-top:2px dashed var(--accent);background:var(--paper)}
.guide-sequence .guide-boundary p{margin:.25rem 0}
.tls-guide .signals td{overflow-wrap:anywhere}