:root {
--green:#45ff88; --green-dim:#1f8a4f; --green-glow:rgba(69,255,136,.18);
--amber:#ffc857; --red:#ff5c70; --cyan:#5de7ff; --blue:#6aa9ff; --violet:#b69bff;
--bg:#05080b; --bg-soft:#0a1016;
--panel:rgba(10,16,19,.85); --panel2:rgba(12,19,22,.9);
--border:rgba(120,160,170,.18); --border-hot:rgba(93,231,255,.34);
--text:#dce8ea; --muted:#728087;
--easy:#45ff88; --medium:#ffc857; --hard:#ff5c70; --insane:#b69bff;
--linux:#45ff88; --windows:#5de7ff;
--pixel:'VT323',monospace; --term:'VT323',monospace;
--mono:'Share Tech Mono',monospace; --font-body:'Outfit',system-ui,sans-serif;
--psh:4px 4px 0 rgba(0,0,0,.55);
--notch:polygon(0 5px,5px 5px,5px 0,calc(100% - 5px) 0,calc(100% - 5px) 5px,100% 5px,100% calc(100% - 5px),calc(100% - 5px) calc(100% - 5px),calc(100% - 5px) 100%,5px 100%,5px calc(100% - 5px),0 calc(100% - 5px));
--px:polygon(0 12px,6px 12px,6px 6px,12px 6px,12px 0,calc(50% - 41px) 0,calc(50% - 41px) 5px,calc(50% - 35px) 5px,calc(50% - 35px) 10px,calc(50% - 29px) 10px,calc(50% - 29px) 15px,calc(50% - 11px) 15px,calc(50% - 11px) 10px,calc(50% - 5px) 10px,calc(50% - 5px) 5px,calc(50% + 1px) 5px,calc(50% + 1px) 0,calc(100% - 12px) 0,calc(100% - 12px) 6px,calc(100% - 6px) 6px,calc(100% - 6px) 12px,100% 12px,100% calc(50% - 5px),calc(100% - 5px) calc(50% - 5px),calc(100% - 5px) calc(50% + 1px),calc(100% - 10px) calc(50% + 1px),calc(100% - 10px) calc(50% + 7px),calc(100% - 15px) calc(50% + 7px),calc(100% - 15px) calc(50% + 25px),calc(100% - 10px) calc(50% + 25px),calc(100% - 10px) calc(50% + 31px),calc(100% - 5px) calc(50% + 31px),calc(100% - 5px) calc(50% + 37px),100% calc(50% + 37px),100% calc(100% - 12px),calc(100% - 6px) calc(100% - 12px),calc(100% - 6px) calc(100% - 6px),calc(100% - 12px) calc(100% - 6px),calc(100% - 12px) 100%,calc(50% + 41px) 100%,calc(50% + 41px) calc(100% - 5px),calc(50% + 35px) calc(100% - 5px),calc(50% + 35px) calc(100% - 10px),calc(50% + 29px) calc(100% - 10px),calc(50% + 29px) calc(100% - 15px),calc(50% + 11px) calc(100% - 15px),calc(50% + 11px) calc(100% - 10px),calc(50% + 5px) calc(100% - 10px),calc(50% + 5px) calc(100% - 5px),calc(50% - 1px) calc(100% - 5px),calc(50% - 1px) 100%,12px 100%,12px calc(100% - 6px),6px calc(100% - 6px),6px calc(100% - 12px),0 calc(100% - 12px),0 calc(50% + 5px),5px calc(50% + 5px),5px calc(50% - 1px),10px calc(50% - 1px),10px calc(50% - 7px),15px calc(50% - 7px),15px calc(50% - 25px),10px calc(50% - 25px),10px calc(50% - 31px),5px calc(50% - 31px),5px calc(50% - 37px),0 calc(50% - 37px));
--px2:polygon(0 12px,6px 12px,6px 6px,12px 6px,12px 0,calc(50% + 1px) 0,calc(50% + 1px) 5px,calc(50% + 7px) 5px,calc(50% + 7px) 10px,calc(50% + 13px) 10px,calc(50% + 13px) 15px,calc(50% + 31px) 15px,calc(50% + 31px) 10px,calc(50% + 37px) 10px,calc(50% + 37px) 5px,calc(50% + 43px) 5px,calc(50% + 43px) 0,calc(100% - 12px) 0,calc(100% - 12px) 6px,calc(100% - 6px) 6px,calc(100% - 6px) 12px,100% 12px,100% calc(100% - 12px),calc(100% - 6px) calc(100% - 12px),calc(100% - 6px) calc(100% - 6px),calc(100% - 12px) calc(100% - 6px),calc(100% - 12px) 100%,calc(50% - 1px) 100%,calc(50% - 1px) calc(100% - 5px),calc(50% - 7px) calc(100% - 5px),calc(50% - 7px) calc(100% - 10px),calc(50% - 13px) calc(100% - 10px),calc(50% - 13px) calc(100% - 15px),calc(50% - 31px) calc(100% - 15px),calc(50% - 31px) calc(100% - 10px),calc(50% - 37px) calc(100% - 10px),calc(50% - 37px) calc(100% - 5px),calc(50% - 43px) calc(100% - 5px),calc(50% - 43px) 100%,12px 100%,12px calc(100% - 6px),6px calc(100% - 6px),6px calc(100% - 12px),0 calc(100% - 12px));
--px3:polygon(0 12px,6px 12px,6px 6px,12px 6px,12px 0,calc(50% - 21px) 0,calc(50% - 21px) 5px,calc(50% - 15px) 5px,calc(50% - 15px) 10px,calc(50% - 9px) 10px,calc(50% - 9px) 15px,calc(50% + 9px) 15px,calc(50% + 9px) 10px,calc(50% + 15px) 10px,calc(50% + 15px) 5px,calc(50% + 21px) 5px,calc(50% + 21px) 0,calc(100% - 12px) 0,calc(100% - 12px) 6px,calc(100% - 6px) 6px,calc(100% - 6px) 12px,100% 12px,100% calc(50% - 41px),calc(100% - 5px) calc(50% - 41px),calc(100% - 5px) calc(50% - 35px),calc(100% - 10px) calc(50% - 35px),calc(100% - 10px) calc(50% - 29px),calc(100% - 15px) calc(50% - 29px),calc(100% - 15px) calc(50% - 11px),calc(100% - 10px) calc(50% - 11px),calc(100% - 10px) calc(50% - 5px),calc(100% - 5px) calc(50% - 5px),calc(100% - 5px) calc(50% + 1px),100% calc(50% + 1px),100% calc(100% - 12px),calc(100% - 6px) calc(100% - 12px),calc(100% - 6px) calc(100% - 6px),calc(100% - 12px) calc(100% - 6px),calc(100% - 12px) 100%,12px 100%,12px calc(100% - 6px),6px calc(100% - 6px),6px calc(100% - 12px),0 calc(100% - 12px),0 calc(50% + 41px),5px calc(50% + 41px),5px calc(50% + 35px),10px calc(50% + 35px),10px calc(50% + 29px),15px calc(50% + 29px),15px calc(50% + 11px),10px calc(50% + 11px),10px calc(50% + 5px),5px calc(50% + 5px),5px calc(50% - 1px),0 calc(50% - 1px));
--px4:polygon(0 12px,6px 12px,6px 6px,12px 6px,12px 0,calc(100% - 12px) 0,calc(100% - 12px) 6px,calc(100% - 6px) 6px,calc(100% - 6px) 12px,100% 12px,100% calc(50% + 1px),calc(100% - 5px) calc(50% + 1px),calc(100% - 5px) calc(50% + 7px),calc(100% - 10px) calc(50% + 7px),calc(100% - 10px) calc(50% + 13px),calc(100% - 15px) calc(50% + 13px),calc(100% - 15px) calc(50% + 31px),calc(100% - 10px) calc(50% + 31px),calc(100% - 10px) calc(50% + 37px),calc(100% - 5px) calc(50% + 37px),calc(100% - 5px) calc(50% + 43px),100% calc(50% + 43px),100% calc(100% - 12px),calc(100% - 6px) calc(100% - 12px),calc(100% - 6px) calc(100% - 6px),calc(100% - 12px) calc(100% - 6px),calc(100% - 12px) 100%,12px 100%,12px calc(100% - 6px),6px calc(100% - 6px),6px calc(100% - 12px),0 calc(100% - 12px),0 calc(50% - 1px),5px calc(50% - 1px),5px calc(50% - 7px),10px calc(50% - 7px),10px calc(50% - 13px),15px calc(50% - 13px),15px calc(50% - 31px),10px calc(50% - 31px),10px calc(50% - 37px),5px calc(50% - 37px),5px calc(50% - 43px),0 calc(50% - 43px));
--px5:polygon(0 12px,6px 12px,6px 6px,12px 6px,12px 0,calc(50% - 53px) 0,calc(50% - 53px) 5px,calc(50% - 47px) 5px,calc(50% - 47px) 10px,calc(50% - 41px) 10px,calc(50% - 41px) 15px,calc(50% - 23px) 15px,calc(50% - 23px) 10px,calc(50% - 17px) 10px,calc(50% - 17px) 5px,calc(50% - 11px) 5px,calc(50% - 11px) 0,calc(100% - 12px) 0,calc(100% - 12px) 6px,calc(100% - 6px) 6px,calc(100% - 6px) 12px,100% 12px,100% calc(100% - 12px),calc(100% - 6px) calc(100% - 12px),calc(100% - 6px) calc(100% - 6px),calc(100% - 12px) calc(100% - 6px),calc(100% - 12px) 100%,calc(50% + 29px) 100%,calc(50% + 29px) calc(100% - 5px),calc(50% + 23px) calc(100% - 5px),calc(50% + 23px) calc(100% - 10px),calc(50% + 17px) calc(100% - 10px),calc(50% + 17px) calc(100% - 15px),calc(50% - 1px) calc(100% - 15px),calc(50% - 1px) calc(100% - 10px),calc(50% - 7px) calc(100% - 10px),calc(50% - 7px) calc(100% - 5px),calc(50% - 13px) calc(100% - 5px),calc(50% - 13px) 100%,12px 100%,12px calc(100% - 6px),6px calc(100% - 6px),6px calc(100% - 12px),0 calc(100% - 12px),0 calc(50% + 35px),5px calc(50% + 35px),5px calc(50% + 29px),10px calc(50% + 29px),10px calc(50% + 23px),15px calc(50% + 23px),15px calc(50% + 5px),10px calc(50% + 5px),10px calc(50% - 1px),5px calc(50% - 1px),5px calc(50% - 7px),0 calc(50% - 7px));
--px6:polygon(0 12px,6px 12px,6px 6px,12px 6px,12px 0,calc(100% - 12px) 0,calc(100% - 12px) 6px,calc(100% - 6px) 6px,calc(100% - 6px) 12px,100% 12px,100% calc(50% - 35px),calc(100% - 5px) calc(50% - 35px),calc(100% - 5px) calc(50% - 29px),calc(100% - 10px) calc(50% - 29px),calc(100% - 10px) calc(50% - 23px),calc(100% - 15px) calc(50% - 23px),calc(100% - 15px) calc(50% - 5px),calc(100% - 10px) calc(50% - 5px),calc(100% - 10px) calc(50% + 1px),calc(100% - 5px) calc(50% + 1px),calc(100% - 5px) calc(50% + 7px),100% calc(50% + 7px),100% calc(100% - 12px),calc(100% - 6px) calc(100% - 12px),calc(100% - 6px) calc(100% - 6px),calc(100% - 12px) calc(100% - 6px),calc(100% - 12px) 100%,calc(50% + 3px) 100%,calc(50% + 3px) calc(100% - 5px),calc(50% - 3px) calc(100% - 5px),calc(50% - 3px) calc(100% - 10px),calc(50% - 9px) calc(100% - 10px),calc(50% - 9px) calc(100% - 15px),calc(50% - 27px) calc(100% - 15px),calc(50% - 27px) calc(100% - 10px),calc(50% - 33px) calc(100% - 10px),calc(50% - 33px) calc(100% - 5px),calc(50% - 39px) calc(100% - 5px),calc(50% - 39px) 100%,12px 100%,12px calc(100% - 6px),6px calc(100% - 6px),6px calc(100% - 12px),0 calc(100% - 12px));
--px7:polygon(0 12px,6px 12px,6px 6px,12px 6px,12px 0,calc(50% - 9px) 0,calc(50% - 9px) 5px,calc(50% - 3px) 5px,calc(50% - 3px) 10px,calc(50% + 3px) 10px,calc(50% + 3px) 15px,calc(50% + 21px) 15px,calc(50% + 21px) 10px,calc(50% + 27px) 10px,calc(50% + 27px) 5px,calc(50% + 33px) 5px,calc(50% + 33px) 0,calc(100% - 12px) 0,calc(100% - 12px) 6px,calc(100% - 6px) 6px,calc(100% - 6px) 12px,100% 12px,100% calc(50% - 1px),calc(100% - 5px) calc(50% - 1px),calc(100% - 5px) calc(50% + 5px),calc(100% - 10px) calc(50% + 5px),calc(100% - 10px) calc(50% + 11px),calc(100% - 15px) calc(50% + 11px),calc(100% - 15px) calc(50% + 29px),calc(100% - 10px) calc(50% + 29px),calc(100% - 10px) calc(50% + 35px),calc(100% - 5px) calc(50% + 35px),calc(100% - 5px) calc(50% + 41px),100% calc(50% + 41px),100% calc(100% - 12px),calc(100% - 6px) calc(100% - 12px),calc(100% - 6px) calc(100% - 6px),calc(100% - 12px) calc(100% - 6px),calc(100% - 12px) 100%,calc(50% + 11px) 100%,calc(50% + 11px) calc(100% - 5px),calc(50% + 5px) calc(100% - 5px),calc(50% + 5px) calc(100% - 10px),calc(50% - 1px) calc(100% - 10px),calc(50% - 1px) calc(100% - 15px),calc(50% - 19px) calc(100% - 15px),calc(50% - 19px) calc(100% - 10px),calc(50% - 25px) calc(100% - 10px),calc(50% - 25px) calc(100% - 5px),calc(50% - 31px) calc(100% - 5px),calc(50% - 31px) 100%,12px 100%,12px calc(100% - 6px),6px calc(100% - 6px),6px calc(100% - 12px),0 calc(100% - 12px),0 calc(50% + 37px),5px calc(50% + 37px),5px calc(50% + 31px),10px calc(50% + 31px),10px calc(50% + 25px),15px calc(50% + 25px),15px calc(50% + 7px),10px calc(50% + 7px),10px calc(50% + 1px),5px calc(50% + 1px),5px calc(50% - 5px),0 calc(50% - 5px));
--px8:polygon(0 12px,6px 12px,6px 6px,12px 6px,12px 0,calc(50% + 7px) 0,calc(50% + 7px) 5px,calc(50% + 13px) 5px,calc(50% + 13px) 10px,calc(50% + 19px) 10px,calc(50% + 19px) 15px,calc(50% + 37px) 15px,calc(50% + 37px) 10px,calc(50% + 43px) 10px,calc(50% + 43px) 5px,calc(50% + 49px) 5px,calc(50% + 49px) 0,calc(100% - 12px) 0,calc(100% - 12px) 6px,calc(100% - 6px) 6px,calc(100% - 6px) 12px,100% 12px,100% calc(100% - 12px),calc(100% - 6px) calc(100% - 12px),calc(100% - 6px) calc(100% - 6px),calc(100% - 12px) calc(100% - 6px),calc(100% - 12px) 100%,12px 100%,12px calc(100% - 6px),6px calc(100% - 6px),6px calc(100% - 12px),0 calc(100% - 12px),0 calc(50% + 5px),5px calc(50% + 5px),5px calc(50% - 1px),10px calc(50% - 1px),10px calc(50% - 7px),15px calc(50% - 7px),15px calc(50% - 25px),10px calc(50% - 25px),10px calc(50% - 31px),5px calc(50% - 31px),5px calc(50% - 37px),0 calc(50% - 37px));
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:80px; scrollbar-gutter:stable;
background-color:#05080c;
background-image:radial-gradient(150% 100% at 50% -8%, #0c141a, #05080c 74%);
background-attachment:fixed;
-webkit-text-size-adjust:100%; -moz-text-size-adjust:100%; text-size-adjust:100%; }
body {
color:var(--text); font-family:var(--font-body); line-height:1.65;
min-height:100vh; -webkit-font-smoothing:antialiased;
}
body::before {
content:''; position:fixed; inset:0; z-index:-2; pointer-events:none; opacity:.5;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24'%3E%3Crect width='2' height='2' fill='%23789aa6' fill-opacity='0.045'/%3E%3C/svg%3E");
}
body::after {
content:''; position:fixed; inset:0; z-index:-1; pointer-events:none;
background:radial-gradient(135% 120% at 50% 38%, transparent 60%, rgba(2,4,6,.35));
}
#bg { position:fixed; inset:0; width:100vw; height:100vh; z-index:-1; pointer-events:none; }
.scrolldim { position:fixed; inset:0; z-index:6; pointer-events:none; opacity:0; transition:opacity .18s linear;
background:linear-gradient(to bottom,var(--bg) 0,rgba(5,8,11,0) 42%); }
img { image-rendering:auto; height:auto; }
a { color:var(--cyan); text-decoration:none; transition:color .15s; }
a:hover { color:var(--green); }
html { scrollbar-width:thin; scrollbar-color:var(--green-dim) #0a1016; }
::-webkit-scrollbar { width:13px; height:13px; }
::-webkit-scrollbar-track { background:#0a1016; box-shadow:inset 2px 0 0 rgba(0,0,0,.45); }
::-webkit-scrollbar-thumb {
background:var(--green-dim); border:3px solid #05080b;
box-shadow:inset 1px 1px 0 rgba(69,255,136,.4),inset -1px -1px 0 rgba(0,0,0,.5);
}
::-webkit-scrollbar-thumb:hover { background:var(--green); box-shadow:inset 1px 1px 0 rgba(140,255,190,.45),inset -1px -1px 0 rgba(0,0,0,.5); }
::-webkit-scrollbar-corner { background:transparent; }
.topbar {
position:sticky; top:0; z-index:100;
display:flex; align-items:center; gap:18px;
padding:11px 26px; background:#070b0e; border-bottom:1px solid var(--border);
line-height:normal;
}
.brand {
font-family:var(--pixel); font-weight:800; font-size:21px; line-height:1;
color:var(--green); text-shadow:0 0 16px var(--green-glow); white-space:nowrap;
}
.brand-mark { color:var(--amber); }
.topnav { display:flex; gap:18px; margin-left:12px; font-family:var(--pixel); font-weight:700; font-size:18px; }
.topnav a { color:var(--muted); letter-spacing:.02em; text-transform:lowercase; white-space:nowrap; }
.topnav a:hover { color:var(--cyan); }
.spacer { flex:1; }
.lang {
font-family:var(--pixel); font-weight:700; font-size:17px; display:flex;
border:1px solid var(--border); clip-path:var(--notch); box-shadow:var(--psh);
}
.lang span, .lang a { padding:4px 12px; cursor:pointer; color:var(--muted); }
.lang .on { background:rgba(93,231,255,.12); color:var(--cyan); }
.lang a:hover { color:var(--cyan); }
.wrap { max-width:1180px; margin:0 auto; padding:2.4rem 1.6rem 4rem; }
.wu-head h1 {
font-family:var(--pixel); font-weight:800; font-size:clamp(2.4rem,6vw,4rem);
color:var(--green); line-height:.9; text-shadow:0 0 26px var(--green-glow),0 2px 8px rgba(0,0,0,.55);
}
.facts { display:flex; flex-wrap:wrap; gap:.5rem; margin:1.1rem 0 .7rem; }
.chip {
font-family:var(--pixel); font-weight:700; font-size:.95rem; letter-spacing:.04em;
padding:.18rem .7rem; border:1px solid var(--border); background:rgba(255,255,255,.03);
clip-path:var(--notch); color:var(--muted);
}
.chip-diff.diff-easy, .chip-diff.diff-facil { color:var(--easy); border-color:rgba(69,255,136,.45); }
.chip-diff.diff-medium, .chip-diff.diff-medio, .chip-diff.diff-media { color:var(--medium); border-color:rgba(255,200,87,.5); }
.chip-diff.diff-hard, .chip-diff.diff-dificil { color:var(--hard); border-color:rgba(255,92,112,.5); }
.chip-diff.diff-insane { color:var(--insane); border-color:rgba(182,155,255,.5); }
.chip-os.os-linux { color:var(--linux); border-color:rgba(69,255,136,.4); }
.chip-os.os-windows { color:var(--windows); border-color:rgba(93,231,255,.4); }
.chip-ip { color:var(--muted); }
.ip-note {
display:flex; gap:.5rem; align-items:flex-start;
margin:0 0 1.1rem; padding:.55rem .8rem;
border:1px solid rgba(255,200,87,.28); border-left:3px solid var(--medium);
background:rgba(255,200,87,.05); border-radius:4px;
font-size:.86rem; line-height:1.5; color:var(--muted); max-width:70ch;
}
.ip-note-ico { color:var(--medium); font-weight:700; flex:0 0 auto; line-height:1.5; }
.tags { display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:1.4rem; }
.tag { font-family:var(--pixel); font-weight:500; font-size:.95rem; color:var(--muted); }
.tag:hover { color:var(--cyan); }
.wu-grid { display:grid; grid-template-columns:230px 1fr; gap:2.6rem; align-items:start; }
.toc {
position:sticky; top:92px; align-self:start;
font-family:var(--mono); font-size:.84rem;
border-left:1px solid var(--border); padding-left:1rem;
max-height:calc(100vh - 120px); overflow-y:auto;
}
.toc-title { font-family:var(--pixel); font-weight:800; color:var(--green); text-transform:uppercase; letter-spacing:.12em; font-size:.85rem; margin-bottom:.7rem; }
.toc ul { list-style:none; display:flex; flex-direction:column; gap:.35rem; }
.toc a { color:var(--muted); display:block; line-height:1.35; }
.toc a:hover, .toc a.active { color:var(--cyan); }
.toc li.lvl-3 { padding-left:.9rem; font-size:.8rem; }
.toc a.active { border-left:2px solid var(--green); margin-left:-1rem; padding-left:calc(1rem - 2px); }
.wu-body { min-width:0; }
.wu-body h2 {
font-family:var(--pixel); font-weight:800; font-size:1.9rem; color:var(--green);
margin:2.6rem 0 .9rem; padding-bottom:.4rem; border-bottom:1px solid var(--border);
}
.wu-body h3 { font-family:var(--pixel); font-weight:700; font-size:1.45rem; color:var(--cyan); margin:1.9rem 0 .7rem; }
.wu-body h4 { font-family:var(--pixel); font-weight:700; font-size:1.2rem; color:var(--text); margin:1.3rem 0 .6rem; }
.wu-body p { margin:.9rem 0; }
.wu-body ul, .wu-body ol { margin:.9rem 0 .9rem 1.4rem; }
.wu-body li { margin:.35rem 0; line-height:1.5; }
.wu-body strong { color:#fff; }
.wu-body img { max-width:100%; border:1px solid var(--border); clip-path:var(--notch); margin:1.2rem 0; display:block; box-shadow:var(--psh); }
.wu-body a { text-decoration:underline; text-underline-offset:2px; }
.wu-body code { font-family:var(--mono); font-size:.9em; background:rgba(93,231,255,.1); color:var(--cyan); padding:.1rem .4rem; }
.wu-body blockquote {
border-left:3px solid var(--amber); background:rgba(255,200,87,.06);
padding:.8rem 1.1rem; margin:1.2rem 0; color:var(--text);
}
.wu-body table { width:100%; border-collapse:collapse; margin:1.2rem 0; font-family:var(--mono); font-size:.88rem; }
.wu-body th, .wu-body td { border:1px solid var(--border); padding:.5rem .8rem; text-align:left; }
.wu-body th { background:rgba(93,231,255,.08); color:var(--cyan); }
.wu-body hr { border:none; border-top:1px solid var(--border); margin:2rem 0; }
.cheat-jump { display:flex; align-items:center; gap:.6rem; margin:1rem 0 1.5rem;
padding:.62rem .95rem; text-decoration:none; font-family:var(--mono); font-size:.9rem;
color:var(--amber); border:1px solid rgba(255,200,87,.42); clip-path:var(--notch);
background:rgba(255,200,87,.06); box-shadow:var(--psh);
transition:background .15s, transform .12s; }
.cheat-jump:hover { background:rgba(255,200,87,.14); transform:translateY(-1px); }
.cheat-jump .cj-ic { font-size:1rem; line-height:1; }
.cheat-jump .cj-txt { flex:1; }
.cheat-jump .cj-go { font-family:var(--pixel); font-weight:700; font-size:1.15rem; line-height:1; }
figure.code { position:relative; margin:1.1rem 0; }
figure.code pre {
background:#070d12; border:1px solid var(--border); clip-path:var(--notch);
padding:2.2rem 1.1rem 1rem; overflow-x:auto; box-shadow:var(--psh);
}
figure.code code { font-family:var(--mono); font-size:.9rem; line-height:1.3; color:var(--green); background:none; padding:0; }
.copy-btn {
position:absolute; top:.45rem; right:.5rem; z-index:2;
font-family:var(--mono); font-size:.72rem; color:var(--green);
background:#070b0e; border:1px solid var(--green-dim); clip-path:var(--notch);
padding:.2rem .6rem; cursor:pointer; opacity:.75; transition:all .15s;
}
.copy-btn::before { content:"\29C9\00a0"; }
figure.code:hover .copy-btn, .copy-btn:focus-visible { opacity:1; }
.copy-btn:hover { color:var(--cyan); border-color:var(--border-hot); }
figure.code code .cl { display:block; min-width:max-content; cursor:pointer; border-radius:2px; transition:background .12s; }
figure.code code .cl:hover { background:rgba(69,255,136,.12); }
figure.code code .cl.ok { background:rgba(69,255,136,.30); color:var(--green); }
figure.code code .cl-ic { position:sticky; right:.2rem; margin-left:2ch; opacity:0; color:var(--muted); pointer-events:none; }
figure.code code .cl:hover .cl-ic { opacity:.85; color:var(--cyan); }
figure.code code .cl.ok .cl-ic { opacity:0; }
.copy-btn.ok { color:var(--green); border-color:var(--green); opacity:1; }
@media (hover:none) and (pointer:coarse) { figure.code code .cl-ic { opacity:.4; } }
.cheatsheet { margin-top:3rem; border:1px solid var(--green-dim); clip-path:var(--notch); background:rgba(69,255,136,.04); box-shadow:var(--psh); }
.cheat-toggle {
list-style:none; cursor:pointer; user-select:none;
display:flex; align-items:center; gap:.7rem; padding:.95rem 1.3rem;
font-family:var(--pixel); font-weight:800; color:var(--green);
}
.cheat-toggle::-webkit-details-marker { display:none; }
.cheat-toggle::before { content:"\25B8"; font-size:1rem; color:var(--green); transition:transform .15s; }
.cheatsheet[open] .cheat-toggle::before { transform:rotate(90deg); }
.cheat-toggle:hover, .cheat-toggle:hover::before { color:var(--cyan); }
.cheat-toggle-title { font-size:1.5rem; line-height:1; }
.cheat-toggle-meta { font-family:var(--mono); font-weight:400; font-size:.78rem; color:var(--muted); margin-left:auto; }
.cheatsheet[open] .cheat-toggle { border-bottom:1px solid var(--green-dim); }
.cheat-body { padding:1.2rem 1.3rem 1.4rem; }
.cheat-actions { display:flex; justify-content:flex-end; margin-bottom:1rem; }
.copy-all {
font-family:var(--pixel); font-weight:700; font-size:1rem; cursor:pointer;
color:#04070a; background:var(--green); border:none; clip-path:var(--notch); padding:.4rem .9rem;
}
.copy-all:hover { background:var(--cyan); }
.copy-all.ok { background:var(--cyan); }
.cheat-list { list-style:none; display:flex; flex-direction:column; gap:.6rem; }
.cheat-subcat { font-family:var(--mono); font-size:.72rem; text-transform:uppercase; letter-spacing:.1em; color:var(--green-dim); margin:.5rem 0 -.1rem; padding:.1rem 0 .3rem; border-bottom:1px dashed var(--border); display:flex; align-items:center; gap:.5rem; }
.cheat-subcat::before { content:"▸"; color:var(--amber); }
.cheat-subcat:first-child { margin-top:0; }
.cheat-cmd {
position:relative; width:100%; text-align:left; display:flex; flex-direction:column; gap:.35rem;
background:var(--panel2); border:1px solid var(--border); clip-path:var(--notch); box-shadow:var(--psh);
padding:.7rem .9rem; cursor:pointer; transition:border-color .12s; font-family:var(--font-body);
}
.cheat-cmd:hover { border-color:var(--border-hot); }
.cheat-cmd.copied { border-color:var(--green); }
.cheat-purpose { font-family:var(--pixel); font-weight:700; font-size:1.05rem; color:var(--amber); padding-right:5.5rem; }
.cheat-code { font-family:var(--mono); font-size:.85rem; color:var(--green); background:none; padding:0; white-space:pre-wrap; word-break:break-word; }
.cheat-cmd::after { content:"copiar"; position:absolute; top:.7rem; right:.9rem; font-family:var(--mono); font-size:.72rem; color:var(--muted); }
.cheat-cmd.copied::after { content:"copiado ✓"; color:var(--green); }
.cmd-search { margin-top:1.6rem; }
.cf-search.typing .cf-cur { display:none; }
.cmd-results { margin-top:1.2rem; display:flex; flex-direction:column; gap:.7rem; }
.cmd-count { font-family:var(--mono); font-size:.85rem; color:var(--muted); letter-spacing:.04em; }
.cmd-hit { display:flex; flex-direction:column; gap:.4rem; }
.cmd-hit .cmd-btn { padding-right:5.5rem; }
.cmd-hit .cmd-btn .cheat-code { white-space:pre-wrap; word-break:break-word; }
.cmd-meta { display:flex; flex-wrap:wrap; align-items:baseline; gap:.4rem 1rem; padding:0 .2rem; }
.cmd-purpose { font-family:var(--font-body); font-size:.9rem; color:var(--text); }
.cmd-loc { font-family:var(--mono); font-size:.75rem; color:var(--green-dim); text-decoration:none; white-space:nowrap; }
.cmd-loc:hover { color:var(--green); text-decoration:underline; }
.quiz { margin-top:3rem; padding:1.6rem; border:1px solid var(--border); clip-path:var(--notch); background:var(--panel); box-shadow:var(--psh); }
.quiz > h2 { font-family:var(--pixel); font-weight:800; color:var(--green); font-size:1.6rem; margin-bottom:1.2rem; border:none; padding:0; }
.q { margin-bottom:1.6rem; }
.q-text { font-weight:600; margin-bottom:.7rem; }
.q-opts { display:flex; flex-direction:column; gap:.5rem; }
.q-opt {
text-align:left; font-family:var(--font-body); font-size:.95rem; color:var(--text);
background:rgba(255,255,255,.03); border:1px solid var(--border); clip-path:var(--notch);
padding:.6rem .9rem; cursor:pointer; transition:all .15s;
}
.q-opt:hover { border-color:var(--border-hot); }
.q-opt.correct { border-color:var(--green); background:rgba(69,255,136,.12); color:#fff; }
.q-opt.wrong { border-color:var(--red); background:rgba(255,92,112,.12); }
.q-explain { margin-top:.6rem; font-size:.9rem; color:var(--muted); border-left:2px solid var(--green-dim); padding-left:.8rem; display:none; }
.q-explain.show { display:block; }
.concept-link { color:var(--amber); border-bottom:1px dashed var(--amber); cursor:help; font-weight:600; }
.concept-link:hover { color:var(--amber); background:rgba(255,200,87,.1); }
.concept-pop {
position:absolute; z-index:200; max-width:360px; width:max-content;
background:var(--bg-soft); border:1px solid var(--border-hot); clip-path:var(--notch);
padding:1rem 1.1rem; box-shadow:6px 6px 0 rgba(0,0,0,.6),0 0 22px rgba(93,231,255,.12);
font-size:.9rem; line-height:1.55;
}
.concept-pop h1, .concept-pop h2, .concept-pop h3 { font-family:var(--pixel); font-weight:700; color:var(--cyan); font-size:1.2rem; margin:0 0 .5rem; border:none; padding:0; }
.concept-pop p { margin:.5rem 0; }
.concept-pop code { font-family:var(--mono); font-size:.85em; background:rgba(93,231,255,.1); color:var(--cyan); padding:.05rem .35rem; }
.concept-pop .more { display:inline-block; margin-top:.5rem; font-family:var(--mono); font-size:.8rem; }
.concept-page, .writeup { animation:fade .3s ease; }
@keyframes fade { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }
.concept-page h1 { font-family:var(--pixel); font-weight:800; color:var(--green); font-size:2.4rem; margin:.6rem 0 1.2rem; }
.concept-page h2 { font-family:var(--pixel); font-weight:700; color:var(--cyan); font-size:1.5rem; margin:1.8rem 0 .7rem; }
.attack-tags { display:flex; flex-wrap:wrap; align-items:center; gap:.45rem; margin:-.6rem 0 1.4rem; }
.attack-k { font-family:var(--pixel); font-weight:700; font-size:.8rem; color:var(--muted); letter-spacing:.05em; }
a.attack-chip { font-family:var(--mono); font-size:.74rem; padding:.16rem .55rem; border:1px solid var(--amber); color:var(--amber); text-decoration:none; clip-path:var(--notch); background:rgba(255,183,77,.08); }
a.attack-chip:hover { background:var(--amber); color:#0b1218; }
.concept-page p { margin:.9rem 0; }
.concept-page code { font-family:var(--mono); font-size:.9em; background:rgba(93,231,255,.1); color:var(--cyan); padding:.1rem .4rem; }
.concept-page pre { background:#070d12; border:1px solid var(--border); clip-path:var(--notch); padding:1rem; overflow-x:auto; box-shadow:var(--psh); }
.concept-page pre code { color:var(--green); background:none; }
.back { font-family:var(--pixel); font-weight:700; font-size:1rem; color:var(--muted); }
.back:hover { color:var(--cyan); }
.concept-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:1rem; margin-top:1.5rem; align-items:stretch; }
.cat h1 { font-family:var(--pixel); font-weight:800; font-size:clamp(2.2rem,5vw,3.2rem); color:var(--green); line-height:.95; text-shadow:0 0 22px var(--green-glow); }
.cat-intro { color:var(--muted); font-family:var(--font-body); margin:.6rem 0 0; max-width:62ch; }
.folders { display:flex; flex-direction:column; gap:2.4rem; margin-top:1.9rem; }
.folder-head {
display:flex; align-items:center; gap:.7rem;
font-family:var(--pixel); font-weight:800; font-size:1.55rem; color:var(--green);
border-bottom:1px solid var(--border); padding-bottom:.5rem; margin-bottom:1.1rem;
}
.folder-tab {
width:22px; height:16px; flex:none; background:var(--amber);
clip-path:polygon(0 0,9px 0,12px 4px,22px 4px,22px 16px,0 16px);
box-shadow:2px 2px 0 rgba(0,0,0,.5);
}
.folder-count { font-family:var(--mono); font-weight:400; font-size:.82rem; color:var(--muted); }
.folder-count::before { content:"·"; margin-right:.45rem; color:var(--green-dim); }
.cat-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:1rem; align-items:stretch; }
.cat-card, .concept-card {
--acc:var(--green); --accrgb:69,255,136;
--ol:drop-shadow(2px 0 0 rgba(112,142,156,.15)) drop-shadow(-2px 0 0 rgba(112,142,156,.15)) drop-shadow(0 2px 0 rgba(112,142,156,.15)) drop-shadow(0 -2px 0 rgba(112,142,156,.15));
position:relative; display:flex; flex-direction:column; gap:.55rem; min-height:112px;
padding:1.15rem 1.2rem 1rem;
background-color:rgba(13,19,23,.42);
clip-path:var(--px);
box-shadow:inset 3px 3px 0 rgba(93,231,255,.02),inset -4px -4px 0 rgba(0,0,0,.18);
filter:var(--ol);
transition:transform .13s,filter .13s,box-shadow .13s;
}
.cat-card:hover, .concept-card:hover {
transform:translate(-1px,-3px);
box-shadow:inset 5px 5px 0 rgba(93,231,255,.08),inset -6px -6px 0 rgba(0,0,0,.55);
filter:var(--ol) drop-shadow(6px 9px 0 rgba(0,0,0,.6)) drop-shadow(0 0 9px rgba(var(--accrgb),.25));
}
.cat-card h3, .concept-card h3 {
font-family:var(--pixel); font-weight:700; font-size:1.5rem; color:var(--text);
margin:0; line-height:1.08; padding-bottom:.14em; transition:color .13s,text-shadow .13s;
display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-clamp:2; overflow:hidden;
}
.cat-card:hover h3, .concept-card:hover h3 { color:var(--acc); text-shadow:0 0 14px rgba(var(--accrgb),.3); }
.cat-card.win { --acc:var(--cyan); --accrgb:93,231,255; }
.cat-card.f1, .concept-card.f1 { clip-path:var(--px2); }
.cat-card.f2, .concept-card.f2 { clip-path:var(--px3); }
.cat-card.f3, .concept-card.f3 { clip-path:var(--px4); }
.cat-card.f4, .concept-card.f4 { clip-path:var(--px5); }
.cat-card.f5, .concept-card.f5 { clip-path:var(--px6); }
.cat-card.f6, .concept-card.f6 { clip-path:var(--px7); }
.cat-card.f7, .concept-card.f7 { clip-path:var(--px8); }
.cat-badges { margin-top:auto; display:flex; flex-wrap:wrap; gap:.35rem; align-items:center; }
.tool-card h3 { font-size:1.22rem; display:flex; align-items:baseline; flex-wrap:wrap; gap:.15rem .4rem; }
.cat-tlead { font-family:var(--font-body); font-size:.9rem; line-height:1.45; color:var(--muted); margin:0; }
.cat-tmeta { font-family:var(--mono); font-size:.66rem; text-transform:uppercase; letter-spacing:.05em; color:var(--green); padding:.06rem .42rem; border:1px solid var(--green-dim); }
.cat-tmeta.cmds { color:var(--muted); border-color:var(--border); }
.cat-os { align-self:flex-start; font-family:var(--mono); font-size:.68rem; text-transform:uppercase; letter-spacing:.08em; padding:.08rem .45rem; border:1px solid var(--border); flex:none; }
.cat-os.os-windows { color:var(--windows); }
.cat-os.os-linux { color:var(--linux); }
.cat-dom { font-family:var(--mono); font-size:.68rem; text-transform:uppercase; letter-spacing:.08em; padding:.08rem .45rem; border:1px solid var(--border); color:var(--muted); flex:none; }
.cat-dom.dom-active-directory { color:var(--windows); }
.cat-dom.dom-web { color:var(--amber); }
.cat-dom.dom-infraestructura { color:var(--linux); }
.cat-svc { font-family:var(--mono); font-size:.68rem; text-transform:uppercase; letter-spacing:.08em; padding:.08rem .45rem; border:1px solid rgba(201,166,255,.35); color:#c9a6ff; flex:none; }
.cat-soon { font-family:var(--mono); font-size:.85rem; color:var(--muted); letter-spacing:.05em; opacity:.8; }
.concept-machines { margin-top:2.4rem; padding-top:1.3rem; border-top:1px solid var(--border); }
.concept-machines h2 { font-family:var(--pixel); font-weight:700; color:var(--cyan); font-size:1.4rem; margin:0 0 .9rem; }
.cm-list { list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:.55rem; }
.cm-list li { display:flex; align-items:baseline; gap:.5rem; border:1px solid var(--border); background:var(--panel); clip-path:var(--notch); padding:.4rem .8rem .3rem; box-shadow:var(--psh); }
.cm-list a { color:var(--amber); text-decoration:none; font-family:var(--pixel); font-weight:700; font-size:1.2rem; line-height:1; }
.cm-list a:hover { color:var(--green); }
.cm-plat { font-family:var(--mono); font-size:.6rem; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); }
.view-toggle { display:flex; align-items:center; gap:.5rem; margin-top:1.5rem; }
.vt-btn {
font-family:var(--mono); font-size:.8rem; text-transform:uppercase; letter-spacing:.06em;
color:var(--muted); background:rgba(7,13,18,.6); border:1px solid var(--border);
padding:.32rem .85rem; cursor:pointer; clip-path:var(--notch); transition:color .13s,border-color .13s,background .13s;
}
.vt-btn:hover { color:var(--green); border-color:var(--border-hot); }
.vt-btn.on { color:#071016; background:var(--green); border-color:var(--green); font-weight:700; }
.tree-view { margin-top:1.9rem; display:flex; flex-direction:column; gap:1rem; }
.tfold { border:1px solid var(--border); clip-path:var(--notch); background:rgba(7,13,18,.35); }
.tfold > summary.folder-head { cursor:pointer; list-style:none; margin:0; padding:.7rem 1.1rem; border-bottom:0; }
.tfold > summary.folder-head::-webkit-details-marker { display:none; }
.tfold > summary.folder-head::after { content:"\25B8"; margin-left:auto; color:var(--green-dim); transition:transform .15s; }
.tfold[open] > summary.folder-head::after { transform:rotate(90deg); }
.tfold-body { padding:.3rem 1.1rem 1.1rem; }
.tfold.tl1 > summary.folder-head { font-size:1.5rem; color:var(--green); }
.tfold.tl2 > summary.folder-head { font-size:1.2rem; color:var(--cyan); }
.tfold.tl2 > summary.folder-head .folder-tab { background:var(--cyan); }
.tfold.tl3 > summary.folder-head { font-size:1.05rem; color:var(--amber); }
.tfold.tl3 > summary.folder-head .folder-tab { background:var(--amber); }
.tfold .tfold { margin-top:.7rem; background:rgba(7,13,18,.22); }
.node-relations { margin-top:2.4rem; padding-top:1.3rem; border-top:1px solid var(--border); display:flex; flex-direction:column; gap:.75rem; }
.rel-row { display:flex; flex-wrap:wrap; align-items:baseline; gap:.35rem .6rem; }
.rel-k { font-family:var(--mono); font-size:.68rem; text-transform:uppercase; letter-spacing:.08em; color:var(--green-dim); min-width:9.5rem; flex:none; }
.rel-vals { display:flex; flex-wrap:wrap; gap:.4rem; }
.rel-chip { font-family:var(--mono); font-size:.74rem; padding:.16rem .55rem; border:1px solid var(--border); color:var(--muted); text-decoration:none; clip-path:var(--notch); background:rgba(7,13,18,.4); }
a.rel-chip:hover { border-color:var(--border-hot); color:var(--green); }
.rc-tactic { color:var(--green-dim); letter-spacing:.04em; }
.rc-proto { color:#c9a6ff; border-color:rgba(201,166,255,.35); }
.rc-concept { color:var(--cyan); }
.rc-vuln { color:var(--amber); }
.rc-tool { color:var(--muted); }
.rc-case { color:var(--amber); font-family:var(--pixel); font-size:1.02rem; padding:.05rem .5rem; }
.cat-controls { margin-top:1.6rem; display:flex; flex-flow:row wrap; gap:.85rem; align-items:center; }
.cat-controls .cf-search { flex:1 1 300px; }
.cf-search {
display:flex; align-items:center; gap:.5rem; max-width:min(560px,100%);
font-family:var(--term); font-size:1.15rem;
border:1px solid var(--border); background:rgba(7,13,18,.6); padding:.45rem .8rem; clip-path:var(--notch);
}
.cf-search:focus-within { border-color:var(--border-hot); }
.cf-prompt { color:var(--green-dim); }
.cf-input { flex:1; min-width:0; background:transparent; border:0; outline:0; color:var(--green); font-family:var(--term); font-size:1.15rem; }
.cf-input::placeholder { color:var(--green-dim); opacity:.7; }
.cf-cur { width:8px; height:15px; background:var(--green); animation:cf-blink 1s steps(1) infinite; flex:none; }
.cat-controls.typing .cf-cur { display:none; }
.cat-layout { font-family:var(--pixel); font-weight:700; font-size:1rem; letter-spacing:.02em;
color:var(--muted); background:rgba(7,13,18,.4); border:1px solid var(--border);
clip-path:var(--notch); padding:.42rem .85rem; cursor:pointer; white-space:nowrap; flex:none;
transition:color .15s,border-color .15s; }
.cat-layout:hover, .cat-layout.on { color:var(--green); border-color:var(--green-dim); }
.cat-grid.list { grid-template-columns:1fr; gap:.5rem; }
.cat-grid.list .cat-card, .cat-grid.list .concept-card {
flex-flow:row wrap; align-items:center; gap:.25rem .9rem; min-height:0; padding:.6rem 1rem; }
.cat-grid.list .cat-card h3, .cat-grid.list .concept-card h3 {
font-size:1.15rem; -webkit-line-clamp:1; line-clamp:1; min-height:0; flex:0 1 auto;
line-height:1.25; padding-bottom:0; }
.cat-grid.list .cat-tlead { flex:1 1 12rem; margin:0; overflow:hidden;
display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:1; line-clamp:1; }
.cat-grid.list .cat-badges { margin:0 0 0 auto; }
.cat-grid.list .tool-card-meta, .cat-grid.list .cat-card-meta { margin:0; }
@media (max-width:680px) {
.cat-grid.list .cat-card, .cat-grid.list .concept-card { padding:.5rem .8rem; }
.cat-grid.list .cat-card h3, .cat-grid.list .concept-card h3 { font-size:1.05rem; flex-basis:100%; }
.cat-grid.list .cat-tlead { flex-basis:100%; }
}
@keyframes cf-blink { 50% { opacity:0; } }
.cf-row { display:flex; align-items:center; flex-wrap:wrap; gap:.5rem .55rem; }
.cf-label { font-family:var(--term); font-size:1rem; color:var(--green-dim); margin-right:.2rem; }
.cf-chip {
font-family:var(--pixel); font-weight:700; font-size:1rem; letter-spacing:.02em;
color:var(--muted); border:1px solid var(--border); padding:.12rem .65rem; cursor:pointer;
transition:color .12s,border-color .12s,background .12s; user-select:none;
}
.cf-chip:hover { color:var(--cyan); border-color:var(--border-hot); }
.cf-chip.on { color:#06120b; background:var(--green); border-color:var(--green); }
.cat-noresults { font-family:var(--mono); font-size:.95rem; color:var(--muted); letter-spacing:.04em; }
.tool-card { min-height:118px; text-decoration:none; }
.tool-blurb { font-family:var(--font-body); font-size:.92rem; line-height:1.4; margin:0; color:#c4d2cf; }
.tool-ref-note { font-family:var(--font-body); font-size:.86rem; color:var(--muted); margin:1.6rem 0 0; padding-top:1rem; border-top:1px solid var(--border); font-style:italic; }
.tool-seen-note { font-family:var(--font-body); font-size:.84rem; color:var(--muted); margin:.1rem 0 .8rem; font-style:italic; }
.tool-card-meta { margin-top:auto; font-family:var(--mono); font-size:.68rem; text-transform:uppercase; letter-spacing:.06em; color:var(--green-dim); }
.tool-lolbin { display:inline-block; vertical-align:middle; margin-left:.5rem; font-family:var(--mono); font-size:.6rem; font-weight:700; letter-spacing:.08em; padding:.1rem .38rem; border:1px solid var(--amber); color:var(--amber); background:rgba(255,183,77,.08); clip-path:var(--notch); }
.tool-page h1 .tool-lolbin { font-size:.72rem; transform:translateY(-.3rem); }
.tool-lolbin-note { font-family:var(--font-body); font-size:.88rem; line-height:1.55; color:var(--muted); margin:0 0 1.3rem; padding:.7rem .95rem; border-left:3px solid var(--amber); background:rgba(255,183,77,.05); }
.tool-page { max-width:820px; }
.tool-page h1 { font-family:var(--pixel); font-weight:800; color:var(--amber); font-size:2.4rem; margin:.4rem 0 .6rem; }
.tool-lead { font-family:var(--font-body); font-size:1.02rem; line-height:1.5; color:#c4d2cf; margin:0 0 1.1rem; }
.tool-desc { margin:0 0 1.4rem; }
.tool-desc p { font-family:var(--font-body); font-size:.96rem; line-height:1.65; color:#b7c6c2; margin:0; }
.tool-facts { display:flex; flex-direction:column; gap:.7rem; border:1px solid var(--border); clip-path:var(--notch); background:var(--panel); box-shadow:var(--psh); padding:1.1rem 1.3rem; }
.tool-line { font-family:var(--font-body); font-size:.9rem; line-height:1.5; margin:0; color:#9fb0ad; }
.tool-line .tool-k { font-family:var(--mono); font-size:.72rem; text-transform:uppercase; letter-spacing:.07em; color:var(--green-dim); margin-right:.5rem; }
.tool-line a.concept-link { font-size:.88rem; }
.tool-flags { font-family:var(--mono); font-size:.82rem; color:var(--amber); word-break:break-word; }
.tool-block { margin-top:1.7rem; }
.tool-block > h2 { font-family:var(--pixel); font-weight:700; color:var(--green); font-size:1.35rem; letter-spacing:.02em; margin:0 0 .7rem; display:flex; align-items:baseline; gap:.6rem; }
.tool-block > h2 .sheet-meta { font-family:var(--mono); font-size:.72rem; color:var(--muted); font-weight:400; }
.tool-code { font-family:var(--mono); font-size:.82rem; line-height:1.4; color:#d6e2df; background:var(--panel); border:1px solid var(--border); clip-path:var(--notch); box-shadow:var(--psh); padding:.9rem 1.1rem; margin:0; overflow-x:auto; white-space:pre; }
.tool-use .cheat-list { margin:0; }
.tool-links { display:flex; flex-wrap:wrap; align-items:center; gap:.6rem; margin-top:.9rem; }
.tool-link, .tool-arch { display:inline-flex; align-items:center; gap:.5rem; font-family:var(--mono); font-size:.8rem; padding:.4rem .7rem; border:1px solid var(--green-dim); clip-path:var(--notch); background:rgba(69,255,136,.04); color:#c4d2cf; text-decoration:none; }
.tool-link:hover { color:var(--cyan); border-color:var(--cyan); }
.tool-link-k { font-size:.62rem; text-transform:uppercase; letter-spacing:.06em; color:var(--green-dim); }
.tool-arch .arch-chip { font-family:var(--mono); font-size:.78rem; color:var(--green); text-decoration:none; padding:.06rem .5rem; border:1px solid var(--green-dim); clip-path:var(--notch); background:rgba(7,13,18,.45); }
.tool-arch .arch-chip:hover { color:var(--cyan); border-color:var(--cyan); }
.cert-card { min-height:170px; }
.cert-prov { font-family:var(--font-body); font-size:.82rem; margin:0; color:#9fb0ad; }
.cert-prov .tool-k { font-family:var(--mono); font-size:.7rem; text-transform:uppercase; letter-spacing:.07em; color:var(--green-dim); margin-right:.35rem; }
.cert-go { margin-top:auto; align-self:flex-start; font-family:var(--mono); font-size:.8rem; color:var(--green); text-decoration:none; border-bottom:1px solid var(--green-dim); }
.cert-go:hover { border-color:var(--green); }
.cert-soon { margin-top:auto; font-family:var(--mono); font-size:.75rem; color:var(--muted); opacity:.85; }
.cert-facts { display:grid; grid-template-columns:1fr 1fr; gap:.3rem .6rem; }
.cert-fact { display:flex; flex-direction:column; line-height:1.2; }
.cf-k { font-family:var(--mono); font-size:.6rem; text-transform:uppercase; letter-spacing:.06em; color:var(--green-dim); }
.cf-v { font-family:var(--font-body); font-size:.8rem; color:#c4d2cf; }
.cert-facts-card { margin:.1rem 0 .2rem; }
.cert-facts-page { max-width:520px; margin:.4rem 0 1.4rem; padding:.9rem 1rem; border:1px solid var(--border); clip-path:var(--notch); background:rgba(7,13,18,.4); gap:.6rem 1rem; }
.cert-facts-page .cf-v { font-size:.92rem; }
.cert-page .cert-prov { margin:.2rem 0 .4rem; }
.cert-note { font-family:var(--font-body); font-size:.88rem; color:var(--muted); margin:.2rem 0 .6rem; }
.cert-list { line-height:1.6; }
.cert-list li { margin:.25rem 0; }
.cov-table { width:100%; max-width:640px; border-collapse:collapse; margin:.2rem 0 1.4rem; font-family:var(--font-body); font-size:.9rem; }
.cov-table td { padding:.4rem .6rem; border-bottom:1px solid var(--border); color:#c4d2cf; }
.cov-table td:last-child { text-align:right; white-space:nowrap; width:1%; }
.cov { font-family:var(--mono); font-size:.66rem; text-transform:uppercase; letter-spacing:.06em; padding:.14rem .5rem; clip-path:var(--notch); border:1px solid; }
.cov-full { color:#7ee0a8; border-color:#2f7d52; background:rgba(126,224,168,.08); }
.cov-partial { color:var(--amber); border-color:var(--amber); background:rgba(255,183,77,.08); }
.cov-none { color:#e08a8a; border-color:#7d3535; background:rgba(224,138,138,.08); }
.cheat-card { min-height:140px; text-decoration:none; }
.cheat-card h3 { color:var(--green); }
.cheat-master { max-width:900px; }
.cheat-master > h1 { margin:.3rem 0 .5rem; }
.cheat-master .cat-intro { margin-bottom:1.4rem; }
.sheet-list { display:flex; flex-direction:column; gap:1rem; margin-top:1.6rem; }
.sheet { border:1px solid var(--green-dim); clip-path:var(--notch); background:rgba(69,255,136,.04); box-shadow:var(--psh); }
.sheet-head { display:flex; align-items:center; gap:.7rem; cursor:pointer; list-style:none; padding:1rem 1.3rem; font-family:var(--pixel); font-weight:800; color:var(--green); }
.sheet-head::-webkit-details-marker { display:none; }
.sheet-head::before { content:"\25B8"; font-size:1rem; color:var(--green); transition:transform .15s; }
.sheet[open] .sheet-head::before { transform:rotate(90deg); }
.sheet-head:hover, .sheet-head:hover::before { color:var(--cyan); }
.sheet-name { font-size:1.5rem; line-height:1; }
.sheet-meta { font-family:var(--mono); font-weight:400; font-size:.78rem; color:var(--muted); margin-left:auto; }
.sheet[open] .sheet-head { border-bottom:1px solid var(--green-dim); }
.sheet-group { display:flex; flex-direction:column; gap:1rem; }
.sheet-group-head { font-family:var(--pixel); font-weight:800; font-size:1.1rem; letter-spacing:.06em; text-transform:uppercase; color:var(--amber); margin:1.7rem 0 .1rem; padding-bottom:.4rem; border-bottom:1px solid var(--border); display:flex; align-items:center; gap:.55rem; }
.sheet-group-head::before { content:""; width:22px; height:16px; flex:none; background:var(--amber); clip-path:polygon(0 0,9px 0,12px 4px,22px 4px,22px 16px,0 16px); box-shadow:2px 2px 0 rgba(0,0,0,.5); }
.sheet-group:first-child .sheet-group-head { margin-top:.3rem; }
.related { margin:2.5rem 0 1rem; padding-top:1.4rem; border-top:1px solid var(--green-dim); }
.related h2 { font-family:var(--pixel); font-size:1.5rem; color:var(--green); margin:0 0 1rem; }
.related ul { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:.7rem; }
.related li a {
display:block; padding:.7rem 1rem; text-decoration:none; color:var(--text);
font-family:var(--mono); font-size:.92rem; border:1px solid var(--green-dim);
clip-path:var(--notch); background:rgba(69,255,136,.04); box-shadow:var(--psh);
transition:color .15s, border-color .15s;
}
.related li a::before { content:"> "; color:var(--green); }
.related li a:hover { color:var(--cyan); border-color:var(--cyan); }
.site-footer {
text-align:center; padding:2.2rem 1rem; border-top:1px solid var(--border);
display:flex; flex-direction:column; align-items:center; gap:.45rem;
font-family:var(--term); color:var(--muted); letter-spacing:.1em;
}
.site-footer .foot-brand { font-family:var(--pixel); font-weight:800; font-size:1.5rem; line-height:1;
color:var(--green); text-shadow:0 0 16px var(--green-glow); }
.site-footer .foot-copy { font-size:1.15rem; color:var(--text); letter-spacing:.06em; }
.site-footer .foot-copy .yr { color:var(--cyan); }
.site-footer .foot-sub { font-size:.95rem; color:var(--muted); letter-spacing:.14em; }
.site-footer .foot-sub a { color:var(--amber); }
.site-footer .foot-sub a:hover { color:var(--cyan); }
.site-footer .brand-mark { color:var(--amber); }
.site-footer .sep { color:var(--green-dim); }
.coffee-hd { display:inline-flex; align-items:center; gap:7px; font-family:var(--pixel); font-weight:700; font-size:17px;
letter-spacing:.02em; line-height:1; color:var(--amber); text-decoration:none; padding:5px 12px;
border:1px solid rgba(255,200,87,.55); clip-path:var(--notch); background:rgba(255,200,87,.07);
box-shadow:var(--psh); transition:color .15s,background .15s,transform .13s,box-shadow .15s; }
.coffee-hd .cf-ico { font-size:18px; line-height:1; display:inline-block; transform:translateY(.5px);
filter:drop-shadow(0 0 6px rgba(255,200,87,.35)); }
.coffee-hd .cf-txt { white-space:nowrap; }
.coffee-hd:hover { color:var(--bg); background:var(--amber); transform:translateY(-2px); box-shadow:4px 6px 0 rgba(0,0,0,.5),0 0 18px rgba(255,200,87,.4); }
.coffee-hd:hover .cf-ico { filter:none; }
@media (max-width:520px){ .coffee-hd .cf-txt { display:none; } .coffee-hd { padding:5px 10px; } }
@media (max-width:860px) {
.wu-grid { grid-template-columns:1fr; }
.toc { position:static; max-height:none; border-left:none; border-bottom:1px solid var(--border); padding:0 0 1rem; margin-bottom:1rem; }
.toc ul { flex-flow:row wrap; gap:.3rem .9rem; }
}
@media (max-width:960px) {
.topbar { flex-wrap:wrap; gap:9px 16px; padding:10px 20px; }
.topbar .spacer { display:none; }
.topnav { order:3; width:100%; margin-left:0; gap:18px; white-space:nowrap;
overflow-x:auto; -webkit-overflow-scrolling:touch; padding-bottom:2px; scrollbar-width:none; }
.topnav::-webkit-scrollbar { display:none; }
.coffee-hd { margin-left:auto; }
}
@media (max-width:680px) {
.topbar { padding:10px 15px; }
.brand { font-size:17px; }
.topnav { gap:16px; font-size:16px; }
}
.skip-link {
position:fixed; top:8px; left:8px; z-index:1000;
transform:translateY(-150%); transition:transform .15s ease;
background:var(--acc); color:#05080b; font-weight:700;
padding:9px 14px; border-radius:8px; text-decoration:none;
}
.skip-link:focus { transform:translateY(0); outline:none; }
a:focus-visible, button:focus-visible, input:focus-visible,
summary:focus-visible, [tabindex]:focus-visible, .cheat-cmd:focus-visible {
outline:2px solid var(--acc); outline-offset:2px; border-radius:3px;
}
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after {
animation-duration:.001ms !important; animation-iteration-count:1 !important;
transition-duration:.001ms !important; scroll-behavior:auto !important;
}
}