.detail-page{position:fixed;inset:0;overflow-y:auto;background:linear-gradient(to bottom,#333,#111);color:#fff;z-index:3;animation:detail-slide-in .34s cubic-bezier(.2,.8,.2,1);overscroll-behavior:contain}.detail-inner{max-width:1000px;margin-inline:auto}.detail-topbar{position:sticky;top:0;z-index:4;display:grid;grid-template-columns:42px 1fr 42px;align-items:center;padding:16px;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:linear-gradient(to bottom,#000000a6,#0000)}.back-btn{width:42px;height:42px;border:0;border-radius:50px;background:#ffffff14;color:#fff;font-size:1rem;cursor:pointer;transition:transform .18s ease,background .18s ease}.back-btn:hover{transform:scale(1.08);background:#ffffff2e}.detail-hero{display:grid;grid-template-columns:320px 1fr;gap:40px;padding:40px 48px 32px}.detail-cover-wrapper{position:relative}.detail-cover{width:100%;aspect-ratio:1;display:block;object-fit:cover;background:#222;border-radius:12px}.detail-heading-wrapper{justify-self:center;display:flex}.detail-heading{display:inline-flex;gap:12px;align-items:center}.detail-heading-info{color:#aaa;font-size:.8rem}.detail-heading-name{font-size:1.3rem;color:#fff}.detail-meta{min-width:0}.detail-type{font-size:.8rem;letter-spacing:.12em;opacity:.72;margin-bottom:10px}.detail-title{color:var(--accent, red);font-family:Segoe UI,Arial,sans-serif;margin:0;font-size:clamp(2.5rem,6vw,5rem);line-height:.95;font-weight:400}.detail-description{margin-top:22px;max-width:720px;line-height:1.7;opacity:.82;font-size:1rem}.detail-content{padding:16px 48px}.fullbleed-section{margin-left:-48px;margin-right:-48px;padding-left:48px;padding-right:48px;margin-top:16px}@keyframes detail-slide-in{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes detail-slide-out{to{transform:translate(100%);opacity:.98}}@keyframes album-slide-in{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes album-slide-out{to{transform:translate(100%);opacity:.98}}@keyframes slide-in{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes slide-out{to{transform:translate(100%)}}.detail-page.closing{animation:detail-slide-out .28s cubic-bezier(.4,0,1,1) forwards}@media(max-width:768px){.detail-topbar{padding:16px}.detail-hero{grid-template-columns:1fr;gap:24px;padding:24px 20px 20px}.detail-cover{max-width:280px;margin:auto}.detail-title{font-size:2.5rem}.detail-content{padding:16px 20px}.fullbleed-section{margin-left:-44px;margin-right:-20px;padding-left:20px;padding-right:18px}}.detail-date{display:flex;flex-direction:column;align-items:center;min-width:56px;padding:6px 8px;border-radius:6px;background:transparent}.detail-date .day{font-size:1.25rem;font-weight:700;color:#fff;line-height:1}.detail-date .month{font-size:.85rem;font-weight:700;color:#ee0;text-transform:uppercase;margin-top:2px}.detail-date .year{font-size:.75rem;color:var(--text-muted, #9b9b9b);margin-top:2px}.day{color:#fff;font-weight:700;line-height:1}.month{color:#ee0;font-weight:700;text-transform:uppercase}.year{color:var(--text-muted, #9b9b9b)}:root{--bg: #181818;--fg: rgba(255,255,255,.92);--muted: rgba(255,255,255,.72);--text-body: #cccccc;--text-muted: #9b9b9b;--accent: red;--accent-yellow: #ffd400;--space-1: 8px;--space-sm: 12px;--space-2: 16px;--space-3: 24px;--bp-mobile: 768px}html{overflow-y:scroll}html,body{overflow-x:clip;font-family:Verdana,sans-serif;font-size:15px;line-height:1.5}body{margin:0;background-color:#111;color:var(--text-body)}.web-link{display:flex;align-items:center;gap:12px;color:#ffffffe0;text-decoration:none;transition:transform .25s ease,color .25s ease;font-size:.98rem}.web-link:hover{color:#fff;transform:translateY(-2px)}.component-wrapper{padding:8px 16px;margin-bottom:16px}h1,h2,h3,h4,h5,h6{font-family:Segoe UI,Arial,sans-serif;font-weight:400;margin:10px 0}.my-h1{font-family:monospace;color:red;font-size:3rem}.my-h2{font-family:monospace;color:red;font-size:1.8rem}.my-h3{font-family:monospace;color:red;padding-top:8px;padding-left:10px}@media(max-width:700px){.component-wrapper{padding-left:24px}.my-h1{font-size:1.8rem}.my-h2{font-size:1.5rem}.my-h3{font-size:1.3rem}}@media(max-width:1024px)and (orientation:portrait){.my-h1{font-size:32px}}@media(max-width:1024px)and (orientation:landscape){.my-h1{font-size:40px}}
