.tls-page{--tls-client:#5aa9ff;--tls-server:#c084fc;--tls-ok:#4ecb93;--tls-eve:#ff7a6b;--tls-warn:#e8a838;width:min(1120px,100% - 32px);margin:0 auto;padding:0 0 clamp(36px,5vw,64px)}.tls-page *,.tls-page :before,.tls-page :after{box-sizing:border-box}.tls-page h1,.tls-page h2,.tls-page h3,.tls-page p{margin:0}.tls-page button{font:inherit}.tls-page ol{margin:0;padding:0;list-style:none}.tls-kicker{color:var(--accent);letter-spacing:.12em;text-transform:uppercase;font-size:.7rem;font-weight:850}.tls-hero{grid-template-columns:1.35fr .65fr;align-items:center;gap:clamp(24px,5vw,64px);padding:clamp(24px,4vw,38px);display:grid}.tls-hero h1{max-width:700px;color:var(--foreground);font-family:var(--font-display), var(--font-sans), sans-serif;letter-spacing:-.045em;word-break:keep-all;margin-top:10px;font-size:clamp(32px,4.2vw,48px);line-height:1.05}.tls-hero>div>p:last-child{max-width:680px;color:var(--muted);word-break:keep-all;margin-top:15px;font-size:clamp(.88rem,1.6vw,1.05rem);line-height:1.7}.tls-hero-answer{border:var(--pixel) solid var(--accent);background:color-mix(in srgb, var(--accent) 10%, var(--surface-2));gap:9px;padding:22px;display:grid}.tls-hero-answer span{color:var(--muted);font-size:.72rem;font-weight:750}.tls-hero-answer strong{color:var(--foreground);word-break:keep-all;font-size:clamp(1.05rem,2.2vw,1.4rem);line-height:1.35}.tls-demo{margin-top:16px;padding:clamp(22px,4vw,38px)}.tls-demo-head{justify-content:space-between;align-items:start;gap:18px;display:flex}.tls-demo-head h2,.tls-section-title h2{color:var(--foreground);letter-spacing:-.035em;word-break:keep-all;margin-top:7px;font-size:clamp(1.35rem,3vw,2rem);line-height:1.2}.tls-reset{border:var(--pixel) solid var(--border-strong);background:var(--surface-2);color:var(--muted);cursor:pointer;flex:none;padding:8px 11px;font-size:.72rem;font-weight:750}.tls-reset:hover{border-color:var(--accent);color:var(--foreground)}.tls-scene-strip{grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;display:grid;margin-top:18px!important}.tls-scene-strip li{border:1px solid var(--border);background:var(--background);color:var(--muted);align-items:center;gap:7px;padding:8px 9px;font-size:.68rem;font-weight:750;display:flex}.tls-scene-strip b{border:1px solid var(--border-strong);width:19px;height:19px;font:800 .58rem/1 var(--font-geist-mono), monospace;flex:none;place-items:center;display:grid}.tls-scene-strip li.is-done{color:var(--foreground-soft)}.tls-scene-strip li.is-done b{border-color:var(--tls-ok);color:var(--tls-ok)}.tls-scene-strip li.is-current{border-color:var(--accent);color:var(--foreground)}.tls-scene-strip li.is-current b{border-color:var(--accent);background:var(--accent);color:var(--accent-contrast)}.tls-now{border:var(--pixel) solid var(--accent);background:color-mix(in srgb, var(--accent) 7%, var(--surface-2));grid-template-columns:auto 1fr;align-items:start;gap:12px;min-height:92px;margin-top:9px;padding:13px 15px;display:grid}.tls-now>span{background:var(--accent);color:var(--accent-contrast);font:850 .62rem/1 var(--font-geist-mono), monospace;padding:5px 7px}.tls-now>div{gap:4px;display:grid}.tls-now strong{color:var(--foreground);word-break:keep-all;font-size:.86rem}.tls-now p{color:var(--muted);word-break:keep-all;font-size:.72rem;line-height:1.5}.tls-peers{grid-template-columns:auto 1fr auto;align-items:center;gap:10px;margin-top:20px;display:grid}.tls-peer{border:var(--pixel) solid var(--border-strong);background:var(--surface-2);text-align:center;gap:6px;min-width:196px;padding:12px 14px;transition:border-color .15s,background .15s;display:grid}.tls-peer strong{color:var(--foreground);font-size:.84rem}.tls-peer small{color:var(--muted);font:650 .62rem/1.3 var(--font-geist-mono), monospace}.tls-peer.is-active{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 10%, var(--surface-2))}.tls-keys{justify-content:center;gap:5px;margin-top:2px;display:flex}.tls-key{border:1px solid var(--tls-warn);background:color-mix(in srgb, var(--tls-warn) 9%, var(--background));min-width:86px;color:var(--tls-warn);font:700 .62rem/1.2 var(--font-geist-mono), monospace;gap:2px;padding:6px 8px;display:grid}.tls-key i{font-size:.56rem;font-style:normal;font-weight:650}.tls-key.is-none{border-style:dashed;border-color:var(--border-strong);color:var(--muted);background:0 0}.tls-key.is-ready{border-style:solid;border-color:var(--tls-ok);background:color-mix(in srgb, var(--tls-ok) 11%, var(--background));color:var(--tls-ok)}.tls-lane{align-items:center;min-width:0;height:30px;display:grid;position:relative;overflow:hidden}.tls-lane-line{border-top:2px dashed var(--border-strong);height:0;display:block}.tls-lane.is-active{border:var(--pixel) solid var(--tls-client);background:color-mix(in srgb, var(--tls-client) 8%, var(--background))}.tls-lane.is-active.is-encrypted{border-color:var(--tls-ok);background:color-mix(in srgb, var(--tls-ok) 8%, var(--background))}.tls-moving{font:850 .68rem/1 var(--font-geist-mono), monospace;white-space:nowrap;text-align:center;font-style:normal;animation:1.1s linear infinite tls-go}.tls-moving.is-client{color:var(--tls-client)}.tls-moving.is-server{color:var(--tls-server)}.tls-lane.is-encrypted .tls-moving{color:var(--tls-ok)}.tls-moving.is-return{animation-name:tls-back}@keyframes tls-go{0%{opacity:.4;transform:translate(-24%)}to{opacity:1;transform:translate(24%)}}@keyframes tls-back{0%{opacity:.4;transform:translate(24%)}to{opacity:1;transform:translate(-24%)}}.tls-eve{border:var(--pixel) solid color-mix(in srgb, var(--tls-eve) 45%, var(--border-strong));background:color-mix(in srgb, var(--tls-eve) 6%, var(--surface-2));align-items:baseline;gap:10px;margin-top:8px;padding:10px 14px;display:flex}.tls-eve b{color:var(--tls-eve);flex:none;font-size:.72rem;font-weight:850}.tls-eve span{color:var(--foreground-soft);word-break:keep-all;font-size:.74rem;line-height:1.5}.tls-timeline-area{border:var(--pixel) solid var(--border);background:var(--background);align-items:center;min-height:330px;margin-top:12px;padding:clamp(12px,2vw,18px);display:grid}.tls-idle{text-align:center;justify-items:center;gap:9px;display:grid}.tls-idle strong{color:var(--foreground);font-size:.94rem}.tls-idle span{max-width:380px;color:var(--muted);word-break:keep-all;font-size:.75rem;line-height:1.55}.tls-timeline{align-content:center;gap:9px;display:grid}.tls-timeline.is-single{min-height:150px}.tls-bubble{border:var(--pixel) solid var(--border-strong);background:var(--surface-2);gap:6px;width:min(460px,88%);padding:10px 13px;transition:border-color .15s;display:grid}.tls-bubble.is-client{border-left:4px solid var(--tls-client);justify-self:start}.tls-bubble.is-server{border-right:4px solid var(--tls-server);text-align:right;justify-self:end}.tls-bubble.is-server .tls-bubble-head{justify-content:flex-end}.tls-bubble.is-encrypted{background:color-mix(in srgb, var(--tls-ok) 5%, var(--surface-2))}.tls-bubble.is-moving{border-color:var(--accent)}.tls-bubble.is-moving .tls-bubble-status{color:var(--accent);font-weight:800}.tls-bubble-head{flex-wrap:wrap;align-items:center;gap:5px;display:flex}.tls-chip{color:#14181d;font:850 .64rem/1 var(--font-geist-mono), monospace;letter-spacing:.03em;padding:5px 8px}.tls-chip.is-client{background:var(--tls-client)}.tls-chip.is-server{background:var(--tls-server)}.tls-chip.is-lock{background:var(--tls-ok)}.tls-field{border:1px solid var(--border-strong);background:var(--background);cursor:help;text-align:left;align-items:center;gap:6px;padding:5px 8px;display:inline-flex;position:relative}.tls-field b{color:var(--muted);font-size:.6rem;font-weight:750}.tls-field>span{color:var(--foreground);font:700 .66rem/1.2 var(--font-geist-mono), monospace}.tls-field:hover,.tls-field:focus-visible{border-color:var(--accent)}.tls-field:focus-visible{outline:2px solid color-mix(in srgb, var(--accent) 60%, transparent);outline-offset:2px}.tls-tip{z-index:6;border:var(--pixel) solid var(--border-strong);background:var(--surface-1);width:max-content;max-width:250px;color:var(--foreground-soft);text-align:left;word-break:keep-all;padding:8px 10px;font-size:.68rem;font-style:normal;line-height:1.5;display:none;position:absolute;bottom:calc(100% + 7px);left:0;box-shadow:0 6px 18px #00000059}.tls-bubble.is-server .tls-tip{left:auto;right:0}.tls-field:hover .tls-tip,.tls-field:focus-visible .tls-tip{display:block}.tls-bubble-say{color:var(--foreground);word-break:keep-all;font-size:.8rem;line-height:1.5}.tls-bubble-status{color:var(--muted);font-size:.64rem}.tls-tech summary{width:max-content;color:var(--muted);cursor:pointer;font-size:.64rem;font-weight:750}.tls-bubble.is-server .tls-tech summary{margin-left:auto}.tls-tech summary:hover,.tls-tech summary:focus-visible{color:var(--accent)}.tls-tech>div{flex-wrap:wrap;gap:5px;margin-top:7px;display:flex}.tls-bubble.is-server .tls-tech>div{justify-content:flex-end}.tls-note{text-align:center;word-break:keep-all;justify-self:center;width:min(460px,92%);padding:9px 13px;font-size:.74rem;font-weight:750}.tls-note.is-key{border:var(--pixel) solid var(--tls-warn);background:color-mix(in srgb, var(--tls-warn) 9%, var(--background));color:color-mix(in srgb, var(--tls-warn) 80%, var(--foreground))}.tls-note.is-ok,.tls-note.is-lock{border:var(--pixel) solid var(--tls-ok);background:color-mix(in srgb, var(--tls-ok) 9%, var(--background));color:color-mix(in srgb, var(--tls-ok) 80%, var(--foreground))}.tls-done{border:var(--pixel) solid var(--tls-ok);background:color-mix(in srgb, var(--tls-ok) 12%, var(--background));text-align:center;justify-items:center;gap:4px;padding:13px;display:grid}.tls-done b{color:var(--tls-ok);font:850 .74rem/1 var(--font-geist-mono), monospace;letter-spacing:.06em}.tls-done span{color:var(--foreground-soft);word-break:keep-all;font-size:.74rem}.tls-caption{min-height:3.2em;color:var(--foreground-soft);word-break:keep-all;font-size:.8rem;line-height:1.6;margin-top:11px!important}.tls-controls{flex-wrap:wrap;align-items:center;gap:8px;padding-top:12px;display:flex}.tls-main{border:var(--pixel) solid var(--accent);background:var(--accent);min-width:150px;min-height:46px;color:var(--accent-contrast);cursor:pointer;font-size:.84rem;font-weight:850}.tls-main:hover{filter:brightness(1.08)}.tls-auto{border:var(--pixel) solid var(--border-strong);background:var(--surface-2);min-height:46px;color:var(--foreground-soft);cursor:pointer;padding:0 16px;font-size:.78rem;font-weight:800}.tls-auto:hover{border-color:var(--accent);color:var(--foreground)}.tls-auto.is-on{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 12%, var(--surface-2));color:var(--foreground)}.tls-main:focus-visible,.tls-auto:focus-visible,.tls-reset:focus-visible{outline:3px solid color-mix(in srgb, var(--accent) 55%, transparent);outline-offset:3px}.tls-progress{color:var(--muted);margin-left:auto;font-size:.72rem}.tls-progress b{color:var(--foreground-soft);font-weight:800}.tls-benefits{margin-top:16px;padding:clamp(22px,4vw,38px)}.tls-section-title{text-align:center}.tls-benefits>div:last-child{grid-template-columns:repeat(3,1fr);gap:9px;margin-top:22px;display:grid}.tls-benefits article{border:var(--pixel) solid var(--border-strong);background:var(--surface-2);gap:8px;padding:19px;display:grid}.tls-benefits article>b{color:var(--accent);font:850 .68rem/1 var(--font-geist-mono), monospace}.tls-benefits article strong{color:var(--foreground);font-size:.9rem}.tls-benefits article p{color:var(--muted);word-break:keep-all;font-size:.75rem;line-height:1.55}.tls-summary{border:var(--pixel) solid var(--border-strong);background:var(--surface-1);color:var(--foreground-soft);text-align:center;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;align-items:center;gap:10px;margin-top:16px;padding:20px;font-size:.75rem;font-weight:750;display:grid}.tls-summary i{color:var(--accent);font-style:normal}.tls-warning{gap:8px;padding:22px 2px 0;display:grid}.tls-warning strong{color:var(--foreground);font-size:.78rem}.tls-warning p{color:var(--muted);word-break:keep-all;font-size:.72rem;line-height:1.6}.tls-warning span{color:var(--muted);font:650 .62rem/1.5 var(--font-geist-mono), monospace}@media (prefers-reduced-motion:reduce){.tls-moving{animation:none}.tls-peer,.tls-bubble{transition:none}}@media (max-width:840px){.tls-hero{grid-template-columns:1fr}.tls-hero-answer{grid-template-columns:auto 1fr;align-items:center}.tls-bubble{width:min(460px,94%)}}@media (max-width:620px){.tls-page{width:min(100% - 24px,1120px);padding:0 0 36px}.tls-hero,.tls-demo,.tls-benefits{padding:20px 16px}.tls-hero h1{font-size:clamp(33px,10vw,46px)}.tls-hero-answer{grid-template-columns:1fr}.tls-demo-head{align-items:flex-start}.tls-scene-strip{grid-template-columns:repeat(6,minmax(112px,1fr));padding-bottom:5px;overflow-x:auto}.tls-now{grid-template-columns:1fr;min-height:132px}.tls-peers{grid-template-columns:1fr 1fr;gap:8px}.tls-lane{display:none}.tls-peer{min-width:0}.tls-key{flex:1;min-width:0}.tls-timeline-area{min-height:230px;padding:10px 8px}.tls-bubble{width:100%}.tls-tip{max-width:210px}.tls-progress{flex-basis:100%;margin-left:0}.tls-benefits>div:last-child,.tls-summary{grid-template-columns:1fr}.tls-summary i{transform:rotate(90deg)}}