@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--ink:#f0eee8;--muted:#969993;--accent:#d7ed9d;--line:rgba(235,238,225,.17);font-family:'Manrope',sans-serif;background:#090b0d;color:var(--ink)}*{box-sizing:border-box}body{margin:0;overflow:hidden}button,select,input{font:inherit}button{color:inherit;cursor:pointer}#gallery{position:fixed;inset:0}#gallery canvas{display:block;width:100%;height:100%}.topbar{position:fixed;top:0;left:0;right:0;display:flex;align-items:flex-start;justify-content:space-between;padding:30px 38px;pointer-events:none}.brand,.top-actions{pointer-events:auto}.brand{display:flex;gap:11px;align-items:center;color:var(--ink);text-decoration:none;font-size:17px;font-weight:700;letter-spacing:.06em;line-height:1}.brand-mark{color:var(--accent);font-size:33px;font-weight:400}.brand-light{font-weight:400}.brand small{display:block;font:9px 'Manrope',sans-serif;letter-spacing:.16em;color:var(--muted);margin-top:7px}.top-actions{display:flex;align-items:center;gap:21px}.live,.eyebrow,.hud-caption,.volume label,.side-label,.welcome-top,.welcome-footer,.stats span,.guide-row strong{font:10px 'Manrope',sans-serif;letter-spacing:.12em}.live{color:#b9bdb3}.live i{display:inline-block;width:6px;height:6px;background:var(--accent);border-radius:50%;margin-right:7px;box-shadow:0 0 9px #d7ed9d}.icon-button,.close{background:transparent;border:1px solid var(--line);border-radius:50%;width:35px;height:35px;font-size:16px}.icon-button:hover,.close:hover{border-color:var(--accent)}.side-label{position:fixed;left:38px;top:50%;transform:translate(-50%,-50%) rotate(-90deg);color:#777e75;white-space:nowrap;font-size:9px}.side-label span{color:var(--accent);padding:0 12px}.hud-bottom{position:fixed;bottom:0;left:0;right:0;display:flex;align-items:end;gap:42px;padding:28px 38px;border-top:1px solid var(--line);background:linear-gradient(transparent,rgba(8,10,10,.75));pointer-events:none}.hud-bottom>*{pointer-events:auto}.hud-item{display:flex;flex-direction:column;gap:8px}.hud-caption{color:var(--muted);font-size:9px}.hud-item strong{font:20px 'Space Grotesk',sans-serif}.hud-item strong small{font:9px 'Manrope',sans-serif;color:#b6bbb0;letter-spacing:.1em}.interval select{border:0;padding:0;background:transparent;color:var(--ink);font:12px 'Manrope',sans-serif}.volume{margin-left:auto;display:flex;align-items:center;gap:13px;font:10px 'Manrope',sans-serif;color:#c2c7b9}.volume label span{font-size:16px;margin-right:7px;color:var(--accent)}input[type=range]{accent-color:var(--accent);width:115px;height:3px}.status{position:fixed;bottom:102px;left:50%;transform:translateX(-50%);color:#a5aa9f;font:10px 'Manrope',sans-serif;letter-spacing:.04em;background:#111612b8;padding:8px 12px;border-radius:3px;pointer-events:none}.status:empty{display:none}.crosshair{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);color:#b9c9a8;opacity:.5;font-size:17px;pointer-events:none}.overlay{position:fixed;inset:0;background:rgba(3,5,5,.75);display:grid;place-items:center;padding:20px;z-index:5;backdrop-filter:blur(8px)}[hidden]{display:none!important}.welcome-card,.help-card{position:relative;background:#121613;border:1px solid #3b4438;width:min(640px,100%);padding:30px 44px 26px;box-shadow:0 20px 100px #0009}.welcome-top,.welcome-footer{display:flex;justify-content:space-between;gap:12px;color:#9ca597;font-size:9px}.welcome-symbol{font-size:48px;color:var(--accent);margin-top:30px}.eyebrow{color:var(--accent);font-size:10px}.welcome-card h1{font:500 clamp(43px,7vw,70px)/1.03 'Space Grotesk',sans-serif;letter-spacing:-.035em;margin:17px 0 20px}.welcome-card h1 em{font-weight:500;color:#d7ed9d}.intro{color:#a9b0a6;font-size:14px;line-height:1.8;max-width:410px}.enter{display:flex;align-items:center;justify-content:space-between;width:100%;margin:30px 0 22px;padding:18px 20px;border:0;background:var(--accent);color:#182014;font:500 11px 'Manrope',sans-serif;letter-spacing:.1em}.enter span{font-size:18px}.enter:hover{background:#e5f8b5}.welcome-footer{border-top:1px solid var(--line);padding-top:18px;font-size:8px}.help-card{width:min(480px,100%);padding:42px}.help-card h2{font:500 38px 'Space Grotesk',sans-serif;margin:10px 0 25px}.close{position:absolute;right:20px;top:20px;font-size:22px}.guide-row{display:grid;grid-template-columns:90px 1fr;gap:20px;border-top:1px solid var(--line);padding:16px 0;font-size:13px;color:#d0d6ca}.guide-row strong{color:var(--accent)}.guide-note{font-size:12px;line-height:1.7;color:#9da69a}.post-card{position:fixed;right:36px;top:105px;width:315px;max-height:65vh;overflow:auto;background:#131815ee;border:1px solid #495447;padding:25px;z-index:2}.post-card .eyebrow{display:flex;justify-content:space-between;padding-right:35px}.author{display:flex;gap:12px;align-items:center;margin-top:24px}.author img{width:42px;height:42px;border-radius:50%;background:#344437;object-fit:cover}.author strong,.author small{display:block}.author strong{font-size:14px}.author small{color:#9ea99c;margin-top:4px;font-size:11px}.post-card p{font-size:13px;line-height:1.6;color:#d8ddd4;overflow-wrap:anywhere}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:15px 0;margin:20px 0}.stats strong,.stats span{display:block}.stats strong{font:18px 'Space Grotesk',sans-serif}.stats span{color:#929e90;font-size:8px;margin-top:5px}.post-card a{font:10px 'Manrope',sans-serif;letter-spacing:.08em;color:var(--accent);text-decoration:none}@media(max-width:650px){.topbar{padding:20px}.live{font-size:0}.side-label{display:none}.hud-bottom{padding:18px 20px;gap:18px}.volume label{font-size:0}.volume label span{font-size:16px}.volume input{width:75px}.volume{gap:6px}.status{bottom:85px;width:max-content;max-width:90%;text-align:center}.welcome-card{padding:25px}.welcome-footer span:last-child{display:none}.post-card{top:80px;right:15px;width:min(300px,calc(100% - 30px))}.interval select{font-size:10px}}

.post-card{width:min(400px,calc(100% - 72px));max-height:min(70vh,700px);padding:20px;background:#161e27;border:1px solid #33404d;border-radius:12px;color:#f1f3f5;box-shadow:0 12px 36px #0006;font-family:'Manrope',sans-serif}
.post-card .close{top:14px;right:14px;width:32px;height:32px;border:0;color:#9ba8b4;font-size:24px;line-height:1}
.post-card .close:hover{background:#263441;color:#f1f3f5}
.post-card .close:focus-visible,.post-card a:focus-visible{outline:2px solid #1185fe;outline-offset:3px}
.post-card .author{gap:12px;margin:0;padding-right:38px;min-width:0}
.post-card .author img{width:48px;height:48px;background:#33404d;flex:none}
.post-card .author div{min-width:0}
.post-card .author strong,.post-card .author small{overflow-wrap:anywhere}
.post-card .author strong{font-size:15px;line-height:1.3}
.post-card .author small{margin-top:2px;color:#9ba8b4;font-size:14px;line-height:1.3}
.post-card p{margin:18px 0;color:#f1f3f5;font-size:16px;line-height:1.5;white-space:pre-wrap}
.post-card .stats{display:flex;justify-content:space-between;gap:12px;margin:0 0 16px;padding:14px 0;border-color:#33404d}
.post-card .stats div{display:flex;align-items:center;gap:6px;min-width:0;color:#9ba8b4}
.post-card .stats svg{width:19px;height:19px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.post-card .stats strong{font:400 13px 'Manrope',sans-serif}
.post-card .stat-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.post-card a{color:#5caaff;font:500 14px 'Manrope',sans-serif;letter-spacing:0;text-decoration:none}
.post-card a:hover{text-decoration:underline}
@media(max-width:650px){.post-card{top:80px;right:15px;width:calc(100% - 30px);max-height:calc(100dvh - 180px);padding:16px}.post-card p{font-size:15px}.post-card .stats{gap:8px}}

.hud-bottom{display:grid;grid-template-columns:auto repeat(4,minmax(100px,1fr));align-items:end;gap:clamp(16px,3vw,38px);padding:20px 38px}
.hud-control{min-width:0;display:flex;flex-direction:column;gap:8px;color:#c2c7b9}
.hud-control label{font:9px 'Manrope',sans-serif;letter-spacing:.12em;color:var(--muted);white-space:nowrap}
.hud-control>div{display:flex;align-items:center;gap:8px;min-width:0}
.hud-control input[type=range]{flex:1;width:auto;min-width:0;margin:0}
.hud-control output{min-width:3.4em;text-align:right;font:11px 'Manrope',sans-serif}
@media(max-width:650px){
  .hud-bottom{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 16px;padding:12px 20px}
  .hud-control{gap:6px}
  .hud-control label{font-size:8px}
  .hud-control output{font-size:10px;min-width:3em}
  .status{bottom:125px}
  .post-card{max-height:calc(100dvh - 215px)}
}

.top-actions{gap:12px}
.account-button,#feed-source{border:1px solid var(--line);border-radius:18px;background:#121613d9;color:var(--ink);padding:8px 12px;font:11px 'Manrope',sans-serif}
.account-button:hover,#feed-source:hover{border-color:var(--accent)}
.account-button:focus-visible,#feed-source:focus-visible,.account-card input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.account-card p{font-size:13px;line-height:1.6;color:#b8c0b4}
.account-card form{display:flex;flex-direction:column;gap:10px;margin-top:22px}
.account-card label{font:10px 'Manrope',sans-serif;letter-spacing:.1em;color:var(--muted);text-transform:uppercase}
.account-card input{width:100%;padding:12px;border:1px solid var(--line);border-radius:3px;background:#090d0a;color:var(--ink)}
.account-card #account-error{color:#ffb8ad;margin:0}
.account-card #account-error:empty{display:none}
.account-card .enter{margin:8px 0 0}
@media(max-width:650px){.top-actions{gap:7px}.account-button,#feed-source{font-size:10px;padding:7px 9px}.account-card{padding:30px 25px}}