@font-face{font-family:'Bebas Neue';src:url(fonts/bebasneue-webfont.woff) format('woff');font-display:swap}
.logo{background:url(img/vipid-logo.png) center/contain no-repeat}
:root{--bar:#000;--bg:#2b2b2b;--bg2:#232323;--card:#fff;--ink:#1d1d1d;--muted:#6b6b6b;--yellow:#ffd012;--cyan:#1ba0d8;--line:#3a3a3a;--paper:#f6f5f1;color-scheme:light}
*{box-sizing:border-box}body{margin:0;background:var(--bg) repeating-linear-gradient(45deg,rgba(255,255,255,.012) 0 2px,transparent 2px 6px);font-family:Verdana,"Helvetica Neue",Arial,sans-serif;color:#ddd;-webkit-print-color-adjust:exact}
a{color:inherit;text-decoration:none}
.bar{background:var(--bar);height:66px;display:flex;align-items:center;padding:0 max(16px,calc((100% - 1180px)/2));gap:28px}
.logo{width:120px;height:59px;background:var(--logo) center/contain no-repeat}
.bar nav{display:flex;gap:22px;font-family:'Bebas Neue',Impact,sans-serif;font-size:20px;letter-spacing:.5px;color:#fff;align-items:center}
.bar nav .on{color:var(--yellow)}.bar nav .dot{color:#777;font-size:12px}
.bar .right{margin-left:auto;font-family:'Bebas Neue';font-size:18px;color:#fff;display:flex;gap:10px;align-items:center}
.search{background:#1a1a1a;border:1px solid #333;color:#999;font:12px Verdana;padding:7px 10px;width:200px;border-radius:2px}
.cats{background:#111;border-bottom:3px solid var(--yellow)}
.cats ul{list-style:none;margin:0 auto;max-width:1180px;padding:0 16px;display:flex;gap:4px;flex-wrap:wrap}
.cats li{position:relative}
.cats li>a{display:block;padding:11px 14px;font-family:'Bebas Neue';font-size:18px;letter-spacing:.6px;color:#e8e8e8}
.cats li.on>a{background:var(--yellow);color:#000}
.cats .sub{font:11px Verdana;color:#9a9a9a;padding:0 14px 8px;display:block;margin-top:-6px}
.wrap{max-width:1180px;margin:0 auto;padding:26px 16px 40px}
h1,h2,h3,.bebas{font-family:'Bebas Neue',Impact,sans-serif;font-weight:400;letter-spacing:.6px}
.sec{display:flex;align-items:baseline;gap:14px;border-bottom:1px solid var(--line);margin:30px 0 14px;padding-bottom:6px}
.sec h2{color:#fff;font-size:30px;margin:0}.sec a{margin-left:auto;color:var(--cyan);font-family:'Bebas Neue';font-size:18px}
.crumb{font:12px Verdana;color:#9a9a9a;margin-bottom:14px}.crumb a{color:var(--cyan)}.crumb b{color:#ccc;font-weight:400}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{background:var(--card);color:var(--ink);box-shadow:0 2px 0 #000}
.thumb{aspect-ratio:16/9;position:relative;overflow:hidden}
.thumb .t{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:'Bebas Neue';font-size:40px;color:#fff;text-shadow:0 0 18px rgba(0,0,0,.6)}
.thumb .tc{position:absolute;left:10px;bottom:9px;font:10px Menlo,monospace;color:#fff;background:rgba(0,0,0,.6);padding:2px 5px}
.tag{display:inline-block;font-family:'Bebas Neue';font-size:15px;background:var(--yellow);color:#000;padding:1px 7px;margin:12px 14px 0}
.card h3{font-size:24px;line-height:1.05;margin:8px 14px 6px;color:#111}
.meta{font:11px Verdana;color:var(--muted);margin:0 14px 14px;display:flex;gap:8px;align-items:center}
.meta .date{color:var(--cyan)}
.mark{width:26px;height:26px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-family:'Bebas Neue';font-size:14px;color:#000;flex:none;position:relative}

.g1{background:linear-gradient(135deg,#0b1d5e,#2b6bff 55%,#9be3ff)}.g2{background:linear-gradient(135deg,#5b0000,#c4161c 60%,#ff9b6a)}
.g3{background:linear-gradient(135deg,#3a2400,#b36b00 55%,#ffd27a)}.g4{background:linear-gradient(135deg,#0e3b2c,#14a37f 60%,#b6ffe1)}
.g5{background:linear-gradient(135deg,#260b47,#7d3cff 55%,#e1b6ff)}.g6{background:linear-gradient(135deg,#111,#444 60%,#999)}
.feature{display:grid;grid-template-columns:1.6fr 1fr;gap:18px}
.feature .big h3{font-size:38px}
.side .card{display:grid;grid-template-columns:150px 1fr;margin-bottom:12px}.side .card .thumb{aspect-ratio:auto;min-height:96px}.side .card h3{font-size:19px;margin-top:10px}
.hubs{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.hub{background:#1b1b1b;border:1px solid #333;padding:14px;border-top:3px solid var(--yellow)}
.hub h3{color:#fff;font-size:22px;margin:0 0 6px}.hub p{font-size:11px;color:#a5a5a5;margin:0 0 8px;line-height:1.5}
.hub ul{list-style:none;padding:0;margin:0;font-size:11.5px;line-height:1.9;color:var(--cyan)}
.archive{display:grid;grid-template-columns:240px 1fr;gap:18px;background:#1b1b1b;border:1px solid #333;padding:16px;align-items:center}
.archive h3{color:var(--yellow);font-size:24px;margin:0}.archive p{font-size:12px;color:#bbb;line-height:1.6;margin:6px 0 0}
.foot{background:#111;margin-top:30px;padding:26px max(16px,calc((100% - 1180px)/2));display:grid;grid-template-columns:repeat(4,1fr) 1.2fr;gap:20px;font-size:12px;color:#bbb;line-height:1.9}
.foot h4{font-family:'Bebas Neue';font-size:20px;color:#fff;margin:0 0 4px;font-weight:400}
.foot .fl{height:60px;background:var(--flogo) right/contain no-repeat}
.legal{background:#0b0b0b;text-align:center;font-size:11px;color:#777;padding:12px}

/* article */
.art{display:grid;grid-template-columns:1fr 300px;gap:24px}
.paper{background:var(--paper);color:var(--ink);padding:28px 34px}
.paper h1{font-size:46px;line-height:1;margin:6px 0 12px;color:#111}
.byline{display:flex;gap:10px;align-items:center;font-size:12px;color:#555;border-top:1px solid #ddd;border-bottom:1px solid #ddd;padding:10px 0;margin-bottom:16px}
.byline b{color:#111}.byline .mark{width:38px;height:38px;font-size:18px}
.paper p{font-size:15px;line-height:1.75;max-width:70ch}
.paper h2{font-size:30px;color:#111;margin:26px 0 6px;border-left:6px solid var(--yellow);padding-left:10px}
.toc{background:#fff;border:1px solid #e3e0d4;padding:12px 16px;font-size:13px;line-height:1.9;margin:16px 0}
.toc b{font-family:'Bebas Neue';font-size:20px;font-weight:400}
.box{background:#111;color:#eee;padding:14px 16px;margin:18px 0;border-left:6px solid var(--yellow)}
.box .bebas{color:var(--yellow);font-size:22px}
.box table{width:100%;border-collapse:collapse;font:12px Menlo,monospace;margin-top:6px}.box td{border-top:1px solid #333;padding:5px 4px}
table.cmp{width:100%;border-collapse:collapse;font-size:12.5px;margin:12px 0}table.cmp th{background:#111;color:#fff;font-family:'Bebas Neue';font-size:16px;font-weight:400;text-align:left;padding:7px}table.cmp td{border-bottom:1px solid #ddd;padding:7px;background:#fff}
.chk{display:inline-block;font:10px Verdana;background:#e8f6ee;color:#11713e;border:1px solid #bfe3cd;padding:1px 6px;margin-left:6px}
.acard{display:grid;grid-template-columns:70px 1fr;gap:14px;background:#fff;border:1px solid #e3e0d4;padding:16px;margin-top:22px}
.acard .mark{width:64px;height:64px;font-size:28px}.acard h4{margin:0;font-family:'Bebas Neue';font-size:24px;font-weight:400}.acard p{font-size:13px;margin:4px 0;line-height:1.6}
.aside .w{background:#1b1b1b;border:1px solid #333;padding:14px;margin-bottom:14px;font-size:12px;color:#bbb;line-height:1.8}
.aside h3{color:#fff;font-size:22px;margin:0 0 6px}
.more{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:10px}
/* author */
.ahead{display:grid;grid-template-columns:130px 1fr 280px;gap:22px;align-items:center;background:#1b1b1b;border:1px solid #333;border-top:4px solid var(--yellow);padding:22px}
.ahead .mark{width:120px;height:120px;font-size:54px}.ahead h1{color:#fff;font-size:52px;margin:0;line-height:1}
.ahead .role{color:var(--yellow);font-family:'Bebas Neue';font-size:22px}.ahead p{font-size:13px;color:#bbb;line-height:1.6;margin:6px 0 0}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:8px}.stats div{background:#111;padding:10px;text-align:center}.stats b{display:block;font-family:'Bebas Neue';font-size:30px;color:#fff;font-weight:400}.stats span{font-size:10px;color:#999}
.cols{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}
.panel{background:var(--paper);color:var(--ink);padding:18px 22px}.panel h2{font-size:26px;margin:0 0 8px;color:#111}.panel p,.panel li{font-size:13px;line-height:1.7}
.tl{list-style:none;padding:0;margin:0;border-left:3px solid var(--yellow)}.tl li{padding:0 0 10px 14px;position:relative}.tl li:before{content:"";position:absolute;left:-7px;top:6px;width:11px;height:11px;background:#111;border-radius:50%}
.tl b{font-family:Menlo,monospace;font-size:11px;color:#777;display:block}
.chips span{display:inline-block;background:#111;color:#eee;font-size:11px;padding:3px 8px;margin:0 6px 6px 0}

.card{display:block}
.logo{width:110px;height:40px}
.cats ul{display:grid;grid-template-columns:repeat(5,1fr);gap:0}
.cats li>a{padding:10px 14px 2px}
.side .card{display:grid;grid-template-columns:150px 1fr;align-items:start}
.side .card .thumb{grid-row:1/4;height:100%}
.side .card .t{font-size:24px}
.side .card .tag{justify-self:start;margin-top:10px}
.side .card h3,.side .card .meta,.side .card .tag{grid-column:2}
@media (max-width:700px){.bar{gap:12px}.bar nav{gap:10px;font-size:17px}.bar .right{display:none}.cats ul{grid-template-columns:repeat(2,1fr)}.cats .sub{display:none}
.feature,.grid,.art,.hubs,.cols,.ahead,.more,.archive,.foot{grid-template-columns:1fr}.paper{padding:18px}.paper h1{font-size:34px}.aside{display:none}.wrap{padding:16px}}

.logo{width:120px;height:40px}

.mark{background-size:cover!important;background-position:center!important}
.thumb img{width:100%;height:100%;object-fit:cover;display:block}
.paper img{max-width:100%;height:auto}
.paper ul,.paper ol{font-size:15px;line-height:1.75;max-width:70ch}
.paper h3{font-size:22px;color:#111;margin:20px 0 4px}
.paper table{width:100%;border-collapse:collapse;font-size:13px;margin:12px 0}.paper table th{background:#111;color:#fff;font-family:'Bebas Neue';font-size:16px;font-weight:400;text-align:left;padding:7px}.paper table td{border-bottom:1px solid #ddd;padding:7px;background:#fff}
.paper a{color:#0b7fb3;text-decoration:underline}
.crumb nav,.crumb p{display:inline;margin:0}.crumb .separator{color:#777}
.pager{display:flex;gap:8px;margin:24px 0}.pager a,.pager span{background:#1b1b1b;border:1px solid #333;color:#ddd;padding:6px 12px;font-family:'Bebas Neue';font-size:18px}.pager .current{background:var(--yellow);color:#000}
.empty{background:#1b1b1b;border:1px solid #333;padding:24px;color:#bbb;font-size:13px}
.foot a{color:#bbb}
/* 1.0.1 fixes after staging screenshots */
.bar .logo{width:120px;height:40px;background:url(img/vipid-logo.png) center/contain no-repeat!important;flex:none}
.bar .search{background:#1a1a1a!important;color:#ccc!important;border:1px solid #333!important;text-transform:none!important;font:12px Verdana,sans-serif!important;height:auto!important;padding:7px 10px!important;border-radius:2px!important;width:220px}
.paper .box table td,.box table td{background:transparent!important;color:#eee!important;border-bottom:0!important;border-top:1px solid #333!important;font:12px Menlo,monospace}
.cats li.on .sub{color:#333}
.foot .fl{height:44px}
/* 1.0.2: Blocksy paints body white; force the Vipid dark ground */
html,body.ivb{background:#2b2b2b repeating-linear-gradient(45deg,rgba(255,255,255,.012) 0 2px,transparent 2px 6px)!important;color:#ddd}
body.ivb .sec h2{color:#fff!important}
body.ivb .ahead h1{color:#fff!important}

/* 1.0.3: Blocksy archive styles turn body into a flex row on author archives; force normal flow */
body.ivb{display:block!important}
body.ivb>.bar,body.ivb>.cats,body.ivb>.wrap,body.ivb>.foot,body.ivb>.legal{width:100%;box-sizing:border-box}
body.ivb>.wrap{max-width:1180px;margin-left:auto;margin-right:auto}
body.ivb .ahead{width:100%}
/* 1.0.4 polish */
body.ivb{margin:0!important;padding:0!important}
body.ivb .panel,body.ivb .panel p,body.ivb .panel li{color:#1d1d1d!important}
body.ivb .card,body.ivb .card h3{color:#111!important}
body.ivb .card .meta span{color:var(--muted)}body.ivb .card .meta .date{color:var(--cyan)}
.vbox{border:2px solid #ffd012;background:#fffbe6;padding:12px 16px;margin:22px 0;font-size:14px;color:#1b1b1b}.vbox b{font-size:16px}.vbox ul{margin:6px 0 0;padding-left:18px}.vbox li{margin:3px 0}.vbox a{font-weight:700}.vbox span{color:#666}
