/* XBlog AnyTLS + S-UI tutorial */
.x-anytls{--at-green:#48e58f;--at-blue:#45bff8;--at-line:rgba(148,163,184,.22);--at-card:rgba(255,255,255,.62);font-size:1rem;line-height:1.78}.dark .x-anytls{--at-line:rgba(148,163,184,.18);--at-card:rgba(15,23,42,.48)}.x-anytls *{box-sizing:border-box}.at-hero{position:relative;overflow:hidden;margin:0 0 1.5rem;padding:clamp(1.6rem,4vw,2.7rem);border:1px solid rgba(69,191,248,.22);border-radius:20px;background:#06111b;background-image:linear-gradient(rgba(69,191,248,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(69,191,248,.05) 1px,transparent 1px),radial-gradient(circle at 82% 20%,rgba(72,229,143,.1),transparent 34%);background-size:30px 30px,30px 30px,auto;color:#fff;box-shadow:0 18px 48px rgba(2,6,23,.2)}.at-kicker{display:inline-block;padding:.25rem 0;border-bottom:1px solid rgba(72,229,143,.5);color:#83f5ad;font-size:.7rem;font-weight:800;letter-spacing:.12em}.at-title{max-width:980px;margin:.85rem 0 .7rem;color:#fff;font-size:clamp(1.8rem,4vw,3rem);font-weight:850;line-height:1.12;letter-spacing:-.035em}.at-hero p{max-width:900px;margin:0;color:rgba(255,255,255,.78)}.at-chips{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:1.1rem}.at-chips span{padding:.3rem .55rem;border:1px solid rgba(255,255,255,.13);border-radius:7px;background:rgba(255,255,255,.035);color:rgba(255,255,255,.78);font-size:.73rem}.at-section{margin:2.55rem 0}.at-purpose,.at-note,.at-warning,.at-ok,.at-important,.at-source{margin:1rem 0;padding:.92rem 1rem;border:1px solid var(--at-line);border-left:3px solid var(--at-blue);border-radius:10px;background:rgba(69,191,248,.045)}.at-warning,.at-important{border-left-color:#f59e0b;background:rgba(245,158,11,.05)}.at-ok{border-left-color:var(--at-green);background:rgba(72,229,143,.045)}.at-source{border-left-color:#94a3b8;background:rgba(148,163,184,.05)}.at-purpose strong,.at-note strong,.at-warning strong,.at-ok strong,.at-important strong,.at-source strong{display:block;margin-bottom:.2rem}.at-table{overflow:auto;margin:1rem 0;border:1px solid var(--at-line);border-radius:12px}.at-table table{width:100%;margin:0!important;border-collapse:collapse}.at-table th,.at-table td{padding:.7rem .78rem;border-bottom:1px solid var(--at-line);text-align:left;vertical-align:top}.at-table th{background:rgba(69,191,248,.08);font-weight:750}.at-code{overflow:hidden;margin:1rem 0 1.15rem;border:1px solid rgba(148,163,184,.18);border-radius:14px;background:#07111c;box-shadow:0 14px 34px rgba(2,6,23,.14)}.at-code-head{padding:.55rem .8rem;border-bottom:1px solid rgba(148,163,184,.14);color:#94a3b8;font:650 .7rem/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.07em;text-transform:uppercase}.x-anytls .at-code pre{margin:0!important;padding:1rem!important;border-radius:0!important;background:transparent!important;overflow:auto}.x-anytls .at-code code{font-size:.84rem;line-height:1.65}.at-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem;margin:1rem 0}.at-card{padding:1rem;border:1px solid var(--at-line);border-radius:12px;background:var(--at-card)}.at-card h3{margin:.05rem 0 .55rem;font-size:1rem}.at-card p{margin:.25rem 0}.at-figure{margin:1.1rem 0;padding:.65rem;border:1px solid var(--at-line);border-radius:14px;background:var(--at-card)}.at-figure img{display:block;width:100%;height:auto;border-radius:9px}.at-figure figcaption{padding:.62rem .25rem .1rem;color:#8293a3;font-size:.78rem}.at-path{display:flex;flex-wrap:wrap;gap:.35rem;align-items:center;margin:.8rem 0;font-size:.88rem}.at-path span{padding:.28rem .5rem;border:1px solid var(--at-line);border-radius:7px;background:var(--at-card)}.at-path b{color:var(--at-blue)}.at-check{list-style:none!important;margin:1rem 0!important;padding:0!important}.at-check li{position:relative;margin:.48rem 0;padding:.65rem .8rem .65rem 2.1rem;border:1px solid var(--at-line);border-radius:9px;background:var(--at-card)}.at-check li:before{content:"";position:absolute;left:.82rem;top:1rem;width:.42rem;height:.42rem;border-radius:2px;background:var(--at-green)}.at-end{margin:2.7rem 0 0;padding:1rem 1.05rem;border:1px solid var(--at-line);border-top:2px solid rgba(72,229,143,.58);border-radius:10px;background:var(--at-card)}.at-end p{margin:.35rem 0}@media(max-width:840px){.at-grid{grid-template-columns:1fr}.at-hero{border-radius:15px}.at-table{font-size:.9rem}.at-code code{font-size:.79rem!important}.at-figure{padding:.35rem}}
