:root{--ink:#111;--bg:#eceef0;--win:#ffffff;--bar:#f2f2f2;--accent:#2b2b2b;--accent2:#555;--line:#cfd1d4;--chrome:#1c1c1c;
box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
*{box-sizing:border-box}
html{height:100%}
body{margin:0;min-height:100%;background:var(--bg);color:var(--ink);font-family:"Segoe UI",Tahoma,Arial,sans-serif;font-size:14px}

header.top{background:var(--chrome);color:#fff;display:flex;flex-wrap:wrap;align-items:center;gap:1rem;padding:0 1rem;height:46px;position:sticky;top:0;z-index:9}
header.top .name{font-weight:600;font-size:1rem;letter-spacing:.02em}
header.top .name b{color:#bbb}
nav.tabs{display:flex;height:100%;margin-left:auto}
nav.tabs button{all:unset;cursor:pointer;color:#ccc;padding:0 1rem;height:100%;display:flex;align-items:center;font-size:.85rem;border-bottom:3px solid transparent}
nav.tabs button.on,nav.tabs button:hover{color:#fff;border-color:var(--accent2);background:#333}

main{max-width:980px;margin:0 auto;padding:1.4rem 1rem 3rem}
section{display:none}
section.on{display:block}

.win{background:var(--win);border:1px solid var(--line);margin:0 0 1rem;box-shadow:0 1px 3px rgba(0,0,0,.12)}
.win .title{background:var(--bar);border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:0 0 0 .8rem;height:32px}
.win .title span.t{font-size:.8rem;color:#333}
.win .title .btns{display:flex;height:100%}
.win .title .btns b{all:unset;width:34px;height:100%;display:flex;align-items:center;justify-content:center;font-size:.75rem;color:#333}
.win .title .btns b:hover{background:#ddd}
.win .title .btns b.x:hover{background:#333;color:#fff}
.win .inner{padding:1rem 1.1rem}
.win .inner h2,.win .inner h3{margin-top:0;font-weight:600}
.win .inner p,.win .inner li{line-height:1.65}

.logo-win .inner{background:#f7f7f7;padding:1.6rem 1rem;text-align:center;border-top:4px solid var(--accent)}
pre.ascii{display:inline-block;margin:0;text-align:left;color:var(--accent);font-weight:700;
font-family:"Consolas","Courier New",monospace;font-size:clamp(5px,2.1vw,16px);line-height:1.05}
.logo-win .tag{color:#555;margin-top:.6rem;font-size:.85rem}

.term{background:#0c0c0c;color:#ccc;padding:.9rem 1rem;font-family:"Consolas","Courier New",monospace;font-size:.82rem;overflow-x:auto;white-space:pre}
.term .ok{color:#8fd68f}

.feat{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:1rem}
.feat .card{border:1px solid var(--line);padding:1rem;text-align:center;background:#fafafa}
.feat .ic{font-size:1.6rem}

.vbtn{all:unset;cursor:pointer;background:var(--accent);color:#fff;padding:.6rem 1.2rem;font-size:.9rem;display:inline-block}
.vbtn:hover{background:#000}

.versions{display:none;margin-top:1rem}
.versions.show{display:block}

.vcard{border-top:1px solid var(--line);padding:1rem 0}
.vcard:first-child{border-top:none}
.vcard h3{margin:0 0 .3rem}
.vcard p{margin:.2rem 0 .5rem;color:#333}
.vcard .meta{color:#666;font-size:.85rem;margin-bottom:.6rem}
.vcard a{text-decoration:none;background:var(--accent);color:#fff;padding:.45rem 1rem;font-size:.85rem}
.vcard a:hover{background:#000}

table{width:100%;border-collapse:collapse;font-size:.88rem}
td,th{border:1px solid var(--line);padding:.45rem .6rem;text-align:left}
th{background:var(--bar)}

.tree{font-family:"Consolas","Courier New",monospace;color:#333;background:#f7f7f7;padding:1rem;white-space:pre;font-size:.85rem}

.props{display:grid;grid-template-columns:160px 1fr;gap:.4rem .8rem;font-size:.85rem}
.props dt{color:#555}
.props dd{margin:0;color:#111}

.status{background:var(--accent);color:#fff;font-size:.78rem;padding:.35rem .9rem;display:flex;justify-content:space-between}

footer{text-align:center;color:#666;font-size:.8rem;padding:1.4rem 1rem}
footer a{color:var(--accent2)}

@media(max-width:560px){header.top{flex-direction:column;height:auto;align-items:flex-start;padding:.6rem}nav.tabs{margin-left:0;height:auto;flex-wrap:wrap}nav.tabs button{height:34px}}
