:root{
  --ink:#e8e7e3; --dim:#8a8984; --faint:#4a4a47; --rule:rgba(255,255,255,.08);
  --sans:-apple-system,BlinkMacSystemFont,"SF Pro Text","Helvetica Neue",sans-serif;
  --mono:'JetBrains Mono',ui-monospace,Menlo,monospace;
}
*{box-sizing:border-box}
html{background:#05070a}
body{margin:0;color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit}
#caustics{position:fixed;inset:0;width:100vw;height:100vh;z-index:0;opacity:.55}
body[data-edition="public"] #caustics{opacity:.38}
body[data-edition="professional"] #caustics{opacity:.45}

.page{position:relative;z-index:1;max-width:680px;margin:0 auto;padding:18vh 24px 120px}
header{display:flex;align-items:flex-end;justify-content:space-between;gap:24px}
h1{font-weight:500;font-size:17px;letter-spacing:-.005em;margin:0}
.sub{margin:4px 0 0;color:var(--dim)}
.note{color:var(--dim);margin:28px 0 40px;font-size:13.5px}

.edition{font-family:var(--mono);font-size:11.5px;color:var(--faint);white-space:nowrap}
.edition button{all:unset;cursor:pointer;color:var(--faint);padding:2px 1px}
.edition button[aria-selected="true"]{color:var(--ink)}
.edition button:hover{color:var(--ink)}

.items{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}
.item{border-bottom:1px solid var(--rule)}
.row{all:unset;box-sizing:border-box;cursor:pointer;width:100%;display:grid;grid-template-columns:36px 1fr auto;gap:12px;align-items:baseline;padding:15px 0}
.row .n{font-family:var(--mono);font-size:11px;color:var(--faint)}
.row .d{font-family:var(--mono);font-size:11px;color:var(--dim)}
.row:hover .t{color:#fff}
a.row{text-decoration:none;color:inherit}
.item.link .row .t::after{content:' \2192';color:var(--faint);font-size:12px;margin-left:6px;transition:color .2s}
.item.link .row:hover .t::after{color:var(--dim)}
.item.empty .row{cursor:default}.item.empty .t,.item.empty .d{color:var(--faint)}
.body{display:none;padding:4px 0 26px 48px}
.item.open .body{display:block;animation:in .35s ease}
@keyframes in{from{opacity:0;transform:translateY(-3px)}to{opacity:1}}
.body p{color:var(--dim);margin:12px 0 0;font-size:13.5px}
video,.body img{width:100%;display:block;border-radius:3px;background:#000}

.chapters{list-style:none;padding:0;margin:0;columns:2;column-gap:28px;color:var(--dim)}
.chapters li{padding:3px 0;break-inside:avoid}
.chapters li span{font-family:var(--mono);font-size:10.5px;color:var(--faint);display:inline-block;width:24px}
.links{display:flex;gap:18px}
.links a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--faint);padding-bottom:1px}
.links a:hover{border-color:var(--ink)}

.tl{list-style:none;padding:0;margin:0;max-height:62vh;overflow:auto;scrollbar-width:thin}
.tl li{display:grid;grid-template-columns:92px 1fr;gap:14px;padding:4px 0;font-size:13.5px;color:var(--dim)}
.tl li.major{color:var(--ink)}
.tl .d{font-family:var(--mono);font-size:10.5px;color:var(--faint);padding-top:2px}

.src{width:100%;border-collapse:collapse;font-size:13px}
.src td{padding:6px 0;color:var(--dim)}
.src td:first-child{color:var(--ink)}
.src td:last-child{text-align:right;font-family:var(--mono);font-size:10.5px}
.src .wait{color:var(--faint)}

footer{margin-top:60px;color:var(--faint);font-size:12px}
@media (max-width:600px){.page{padding-top:10vh}.chapters{columns:1}.body{padding-left:0}}
.profile h2{font-weight:500;font-size:13px;font-family:var(--mono);letter-spacing:.02em;color:var(--ink);margin:30px 0 4px;text-transform:lowercase}
.profile h2:first-child{margin-top:8px}
.profile p{color:#bdbcb7;font-size:14.5px;line-height:1.7}
.tl em{font-style:normal;color:var(--faint);font-size:12px}
.profile em{font-style:italic}
.edition,#status{display:none!important}
