main#main { max-width:var(--container); padding:var(--space-36) var(--web-gutter) var(--space-48); }
.wk { display:flex; flex-wrap:wrap; align-items:flex-start; gap:var(--space-36) var(--space-48); }
.wk-main { flex:999 1 560px; min-width:0; max-width:760px; display:flex; flex-direction:column; gap:var(--space-16); }
.wk-side { flex:1 1 300px; min-width:0; max-width:380px; display:flex; flex-direction:column; gap:var(--space-20); }
.wk-eyebrow, .wk-meta, .wk-k, .wk-lbl, .wk-count { font:600 13px/1.5 var(--font-mono); letter-spacing:.08em; text-transform:uppercase; }
.wk-eyebrow, .wk-k { margin:0; color:var(--dim); }
.wk h1 { margin:0; font:800 clamp(48px, 7vw, 72px)/.86 var(--font-display); text-transform:uppercase; }
.wk-lede { margin:0; max-width:620px; font-size:17px; line-height:1.5; color:var(--dim); }
.wk-play { display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-10) var(--space-16); }
.wk-play[hidden], .wk-caught[hidden], .wk-note[hidden] { display:none; }
.wk-play .oa-btn { text-transform:uppercase; }
.wk-meta { margin:0; color:var(--chalk); }
.wk-length { display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-10) var(--space-16); padding:var(--space-4) 0 var(--space-6); }
.wk-seg { display:inline-flex; flex-wrap:wrap; gap:var(--space-4); padding:var(--space-4); border:1px solid var(--rule); border-radius:var(--radius-10); }
.wk-seg a, .wk-seg > span { display:inline-flex; align-items:center; gap:var(--space-6); min-height:44px; padding:0 var(--space-14); border-radius:var(--radius-6); font:600 13px/1 var(--font-mono); letter-spacing:.08em; text-transform:uppercase; text-decoration:none; color:var(--chalk); box-sizing:border-box; }
.wk-seg a:hover { color:var(--signal); }
.wk-seg a[aria-current="page"] { background:var(--signal); color:var(--night); }
.wk-seg .wk-locked { color:var(--dim); }
.wk-seg .oa-icon { font-size:16px; }
.wk-help { font-size:13px; line-height:1.4; color:var(--dim); }
.wk-lbl { display:flex; flex-wrap:wrap; justify-content:space-between; gap:var(--space-4) var(--space-16); margin:var(--space-8) 0 0; color:var(--chalk); }
.wk-lbl span + span { color:var(--dim); }
.wk-queue, .wk-more { list-style:none; margin:0; padding:0; border-bottom:1px solid var(--rule); }
.wk-item { border-top:1px solid var(--rule); }
.wk-item > .sg-split { border-top:0; }
.wk .take { background:transparent; border:0; border-radius:0; padding:var(--space-16) 0; }
.wk .take.playing { box-shadow:none; }
.wk .takes { gap:0; }
.wk .take.played { opacity:.6; }
.wk-played-tag { color:var(--chalk); }
.wk-end { display:flex; align-items:center; gap:var(--space-14); padding:var(--space-16) 0; border-top:1px solid var(--rule); }
.wk-end p { margin:0; color:var(--dim); font-size:13px; line-height:1.4; }
.wk-end strong { display:block; color:var(--chalk); font:700 17px/1.2 var(--font-display); text-transform:uppercase; }
.wk-tile { display:inline-flex; flex:none; align-items:center; justify-content:center; width:38px; height:38px; border:1px solid var(--rule); border-radius:var(--radius-full); background:var(--raised); color:var(--signal); }
.wk-tile.lg { width:64px; height:64px; }
.wk-tile.lg .oa-icon { font-size:30px; }
.wk-caught { display:flex; flex-wrap:wrap; align-items:flex-start; gap:var(--space-20); padding:var(--space-20); border:1px solid var(--rule); border-radius:var(--radius-16); background:var(--panel); }
.wk-caught > div { flex:1 1 280px; min-width:0; display:flex; flex-direction:column; gap:var(--space-10); }
.wk-caught h2 { margin:0; font:800 32px/1 var(--font-display); text-transform:uppercase; }
.wk-caught p { margin:0; font-size:15px; line-height:1.45; color:var(--chalk); }
.wk-count { color:var(--dim); }
.wk-actions { display:flex; flex-wrap:wrap; gap:var(--space-10); }
.wk-actions .oa-btn { text-transform:uppercase; }
.wk-also { display:flex; flex-direction:column; gap:var(--space-12); margin-top:var(--space-12); }
.wk-also > p { margin:0; font-size:13px; line-height:1.4; color:var(--dim); }
.wk-card { display:flex; flex-direction:column; gap:var(--space-10); padding:var(--space-16); border:1px solid var(--rule); border-radius:var(--radius-14); background:var(--panel); min-width:0; }
.wk-card p { margin:0; font-size:13px; line-height:1.45; color:var(--dim); }
.wk-card h2 { margin:0; font:800 26px/1 var(--font-display); text-transform:uppercase; }
.wk-card ul { list-style:none; margin:0; padding:0; }
.wk-cov { display:flex; justify-content:space-between; gap:var(--space-12); align-items:center; min-height:44px; border-top:1px solid var(--rule); font:500 13px/1.4 var(--font-mono); letter-spacing:.04em; text-transform:uppercase; color:var(--dim); text-decoration:none; }
.wk-cov b { display:block; color:var(--chalk); font:700 17px/1.2 var(--font-display); }
a.wk-cov:hover b { color:var(--signal); }
.wk-card details summary { display:flex; justify-content:space-between; align-items:center; gap:var(--space-8); min-height:44px; cursor:pointer; font:600 13px/1.4 var(--font-mono); letter-spacing:.08em; text-transform:uppercase; color:var(--chalk); }
.wk-card details .oa-icon { font-size:18px; }
.wk-rules li { display:flex; gap:var(--space-8); padding:var(--space-4) 0; color:var(--dim); font-size:13px; line-height:1.45; }
.wk-rules .oa-icon { flex:none; font-size:18px; }
.wk-card .oa-btn { align-self:flex-start; text-transform:uppercase; }
.wk-vh { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
@media (max-width:640px) {
  .wk-seg { width:100%; }
  .wk-seg a, .wk-seg > span { flex:1 1 auto; justify-content:center; }
  .wk-play .oa-btn { width:100%; }
}