@font-face{font-family:Golos;src:url('/assets/GolosText.woff2')}.article-site *{box-sizing:border-box}.article-site{margin:0;background:#0e0e10;color:#f4f4ef;font-family:Golos,Arial,sans-serif}.article-site a{color:inherit;text-underline-offset:5px}.article-site a:hover{color:#91a3ff}.article-site a:focus-visible{outline:3px solid #97b7ff;outline-offset:4px}.skip{position:absolute;top:-60px}.skip:focus{top:8px;background:#354dff;padding:12px;z-index:3}.article-header{display:flex;align-items:center;justify-content:space-between;padding:24px 5vw;border-bottom:1px solid #38383a;gap:24px}.article-header img{max-width:100%;height:auto}.article-header nav{display:flex;gap:24px;font-size:14px}.article-index,.recommendations{max-width:1280px;margin:auto;padding:70px 5vw}.article-site .eyebrow{font-size:13px;text-transform:uppercase;letter-spacing:.1em;color:#adadad}.article-index h1{font-size:clamp(38px,7vw,92px);line-height:1;letter-spacing:-.05em;margin:32px 0}.article-index em,.article-footer em{color:#7691ff;font-style:normal}.article-index>p{font-size:20px;color:#ccc}.article-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:24px;margin-top:42px}.article-card{background:#19191c;border:1px solid #37373a;padding:25px}.article-card h2,.article-card h3{font-size:26px;line-height:1.15}.article-card p{color:#bdbdc5;line-height:1.7}.article-card img{width:100%;aspect-ratio:16/10;object-fit:cover}.article-card>a{display:inline-block;margin-top:15px}.article{max-width:880px;margin:0 auto;padding:65px 25px}.article h1{font-size:clamp(34px,5vw,66px);line-height:1.08;letter-spacing:-.04em;margin:28px 0 38px}.article-cover,.article-copy img{max-width:100%;height:auto}.article-cover{width:100%;max-height:550px;object-fit:cover;margin-bottom:30px}.article-copy{font-size:19px;line-height:1.85;overflow-wrap:anywhere}.article-copy p{margin:24px 0}.article-copy h2{font-size:34px;line-height:1.2;margin-top:54px}.article-copy h3{font-size:25px;margin-top:36px}.article-copy a{color:#99adff}.tags{list-style:none;display:flex;flex-wrap:wrap;gap:10px;padding:0;margin-top:40px}.tags li{border:1px solid #555;padding:6px 12px;font-size:13px}.video{aspect-ratio:16/9;margin-top:32px}.video iframe{width:100%;height:100%;border:0}.preview-label{background:#354dff;padding:12px;text-align:center;margin:0}.recommendations{border-top:1px solid #37373a}.article-footer{padding:50px 5vw;border-top:1px solid #38383a}.article-footer p{font-size:clamp(32px,5vw,66px);font-weight:900;line-height:1.05;letter-spacing:-.04em}.article-footer nav{display:flex;gap:24px;flex-wrap:wrap;margin:30px 0}.article-footer small{color:#aaa}.article-admin-list{display:grid;gap:14px}.article-admin-list article{border:1px solid #353540;padding:22px}.article-admin-list h3{margin:0 0 12px}.article-editor .article-help{font-size:13px;line-height:1.7;color:#aaa}.article-editor textarea[name=content]{min-height:330px;font-family:monospace}.article-editor .article-tools{display:flex;gap:12px;flex-wrap:wrap}.article-editor .article-course-choices{display:grid;gap:10px}.article-editor .article-cover-preview{max-width:280px;max-height:180px}.article-editor .fields{margin:22px 0}@media(max-width:680px){.article-header{flex-direction:column;align-items:flex-start}.article-header nav{flex-wrap:wrap;gap:18px}.article-index,.recommendations{padding:45px 22px}.article{padding:42px 22px}.article-copy{font-size:17px}.article-copy h2{font-size:28px}.article-footer nav{flex-direction:column}}

/* Match the main site's black canvas, handwritten accents and open layout. */
@font-face{font-family:StreetSpray;src:url('/assets/RubikSprayPaint-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:SpriteGraffiti;src:url('/assets/SpriteGraffiti.woff2') format('woff2');font-weight:400;font-display:swap}
.article-site{background:#09090c;color:#f4f4f5}
.article-header{position:sticky;top:0;z-index:80;min-height:85px;padding:15px 5vw;background:rgba(9,9,12,.94);backdrop-filter:blur(16px);border-color:#ffffff12}
.article-header>a{display:flex;align-items:center}.article-header img{width:304px;max-width:100%;height:auto}
.article-index{position:relative;padding-top:65px}
.article-index h1{font-family:StreetSpray;font-weight:400;font-size:clamp(56px,8vw,108px);letter-spacing:0;line-height:1.15;margin:20px 0 26px;display:inline-block;transform:rotate(-2deg)}
.article-index h1:after{content:'';display:block;height:9px;margin-top:10px;background:#8294ff;clip-path:polygon(0 37%,98% 0,100% 51%,3% 100%);opacity:.7}
.article-index>p{font-size:17px;color:#b7b7c3}.article-card{background:transparent;border:0;border-top:1px solid #ffffff25;padding:24px 0;transition:border-color .18s ease}
.article-card:hover{border-color:#8294ff}.article-card h2,.article-card h3{font-family:StreetSpray;font-weight:400;font-size:28px;letter-spacing:0}.article-card a{text-decoration:none}
.article-card>a{font-family:SpriteGraffiti;font-size:23px;color:#8294ff}
.article-footer{background:#09090c;border-color:#ffffff20}.article-footer p{font-family:StreetSpray;font-weight:400;letter-spacing:0;line-height:1.15}.article-footer em{color:#8294ff}


@media(max-width:680px){.article-header{min-height:72px;gap:15px;padding:16px 22px;align-items:center}.article-header img{width:270px}.article-header nav{justify-content:center;font-size:12px;gap:18px}.article-index{padding-top:36px}.article-index h1{font-size:60px}}
@media(prefers-reduced-motion:reduce){.article-index,.article{animation:none}.article-card{transition:none}}

.article-header>a{min-width:0}.article-header nav{flex-wrap:wrap}.article-header nav a{min-height:44px;display:inline-flex;align-items:center}.article-card h2 a,.article-card h3 a{text-decoration:underline;text-underline-offset:.16em}.article-copy,.article h1{overflow-wrap:anywhere}

.article-grid { display: block; max-width: 860px; margin-top: 18px; }
.article-index .article-card { display: flex; align-items: flex-start; gap: 24px; }
.article-index .article-card img { width: clamp(64px,18vw,168px); flex: 0 0 auto; aspect-ratio: 1; }
.article-summary { min-width: 0; }
.article-card h2, .article-card h3 { margin: 0; overflow-wrap: anywhere; }
.article-card h2 a, .article-card h3 a { display: inline-flex; align-items: center; min-height: 44px; }
.article-card p { margin: 8px 0 0; }
.article-header { flex-direction: row; align-items: center; }
.article-header nav { flex-wrap: nowrap; gap: 10px; }
.article-admin-list { gap: 0; }
.article-admin-list article { border: 0; border-top: 1px solid #353540; padding: 16px 0; }
.article-admin-list article h3 { margin-bottom: 4px; }
.article-admin-list article p { margin: 0 0 6px; }
.article-admin-list article button, .article-admin-list article a { display: inline-flex; align-items: center; min-height: 44px; }
@media (max-width: 600px) {
  .article-index .article-card { gap: 14px; }
  .article-card h2, .article-card h3 { font-size: 22px; }
  .article-header { min-height: 60px; padding: 8px 16px; gap: 8px; }
  .article-header nav { gap: 0; }
  .article-footer { padding: 22px 5vw; }
  .article-footer nav { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 4px 12px; }
}