:root{color-scheme:dark;--bg:#001935;--panel:#0b2a4d;--fg:#e8eef5;--accent:#2f8cff;--muted:#8aa0b8;--like:#ff5c7a;--reblog:#3ddc84;--idle-opacity: .25;--panel-h: calc(96px + env(safe-area-inset-bottom)) }*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--fg);font:14px/1.4 system-ui,sans-serif;overscroll-behavior:none}button,select,.btn{background:var(--panel);color:var(--fg);border:1px solid #25476f;border-radius:6px;padding:6px 10px;font:inherit;cursor:pointer;text-decoration:none}button.on{background:var(--accent);color:#fff;border-color:var(--accent)}button:disabled{opacity:.6;cursor:default}a{color:#7cc4ff}.center{height:100%;display:flex;flex-direction:column;gap:16px;align-items:center;justify-content:center}.app{height:100dvh;display:flex;flex-direction:column;padding-top:env(safe-area-inset-top);padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}.bar{display:flex;gap:8px;align-items:center;padding:6px 8px;background:var(--panel);flex:0 0 auto}.bar .title{font-size:16px}.grow{flex:1}.main{flex:1;min-height:0;display:flex;flex-direction:column}.split{flex:1;min-height:0;display:flex}.split{flex-direction:row}.post{order:1}.splitter{order:2}.thumbs{order:3}.thumbs{touch-action:pan-y;padding-bottom:var(--panel-h);overflow:auto;min-height:0;min-width:0;overscroll-behavior:contain}.grid{display:grid;gap:3px;padding:3px}.thumb{position:relative;padding:0;aspect-ratio:1;overflow:hidden;border:2px solid transparent;border-radius:4px;background:#000}.thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:object-position .4s ease-out}.thumb.focused{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent)}.thumb:not(.focused) img{opacity:.92}.thumb .names{position:absolute;left:0;right:0;bottom:0;padding:2px 4px;font-size:11px;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 0 3px #000,0 0 6px #000,0 1px 2px #000}.thumb .names>div{overflow:hidden;text-overflow:ellipsis}.rb-icon{color:#7cc4ff;margin-right:2px}.thumb .badges{position:absolute;top:2px;right:3px;display:flex;flex-direction:column;align-items:flex-end;gap:2px;font-size:14px;text-shadow:0 0 3px #000}.thumb .badge-row{display:flex;gap:3px}.thumb .image-dots{gap:3px}.thumb .image-dots .dot,.thumb .image-dots .dot.on{width:4px;height:4px}.ic-like{color:var(--like)}.ic-reblog{color:var(--reblog)}.act:not(.active) .ic-like,.act:not(.active) .ic-reblog{color:var(--muted)}.act{background:#ffffff1a;border-color:#ffffff40}.act.like.active{border-color:var(--like);background:#ff5c7a26}.act.reblog.active{border-color:var(--reblog);background:#3ddc8426}.act.slideshow.active{border-color:var(--accent);background:#2f8cff26}.status{padding:12px;text-align:center;color:var(--muted)}.status.error{color:#ff8c8c}.splitter{flex:0 0 18px;position:relative;background:#25476f;touch-action:none;cursor:col-resize}.splitter:before{content:"";position:absolute;top:50%;left:50%;width:8px;height:32px;transform:translate(-50%,-50%);border-radius:2px;background:linear-gradient(to right,#9bb6d4 0 2px,transparent 2px 6px,#9bb6d4 6px 8px)}.splitter:hover,.splitter:active{background:var(--accent)}.splitter:hover:before,.splitter:active:before{background:linear-gradient(to right,#fff 0 2px,transparent 2px 6px,#fff 6px 8px)}.post{flex:1 1 0;min-height:0;min-width:0;padding-bottom:var(--panel-h);overflow:auto;background:#00101f}.post.empty{display:flex;align-items:center;justify-content:center;color:var(--muted)}.post .meta{padding:8px 10px;display:flex;flex-direction:row-reverse;flex-wrap:wrap;gap:4px 10px;align-items:flex-start}.date{color:#fff;font-size:12px;margin-left:8px;text-shadow:0 0 3px #000,0 0 6px #000}.actions{display:flex;gap:8px;flex:none}.trail{margin:0;padding:0;list-style:none;text-align:left;flex:1 1 10em;min-width:0}.trail li{padding:2px 0;font-size:15px}.trail li a{font-weight:600}.post .img{display:block;width:100%;height:auto;cursor:zoom-in}.media{position:fixed;top:0;right:0;bottom:0;left:0;padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);z-index:8;background:#000;display:flex;align-items:center;justify-content:center}.media-img{max-width:100%;max-height:100%;object-fit:contain;-webkit-user-select:none;user-select:none}.media-img.slideshow-anim{transition:width 5s ease-in-out,height 5s ease-in-out,object-position 5s ease-in-out}.media-head{position:absolute;top:0;left:0;right:0;display:flex;justify-content:flex-end;gap:10px;align-items:center;padding:8px 12px;padding-top:calc(8px + env(safe-area-inset-top));padding-left:calc(12px + env(safe-area-inset-left));padding-right:calc(12px + env(safe-area-inset-right));z-index:1;pointer-events:none}.media-right{display:flex;flex-direction:column;align-items:flex-end;gap:8px}.image-dots{display:flex;align-items:center;gap:6px;pointer-events:none;transition:opacity .4s ease}.image-dots .dot{width:6px;height:6px;border-radius:50%;background:#fff;box-shadow:0 0 0 1px #0006;transition:width .2s ease,height .2s ease}.image-dots .dot.on{width:11px;height:11px}.media-title{position:absolute;top:0;left:0;z-index:1;padding:8px 12px;padding-top:calc(8px + env(safe-area-inset-top));padding-left:calc(12px + env(safe-area-inset-left));font-size:14px;font-weight:600;color:#fff;text-shadow:0 0 3px #000,0 0 6px #000,0 1px 2px #000;pointer-events:none;transition:opacity .4s ease}.toast{position:fixed;left:50%;bottom:16px;transform:translate(-50%);background:#222;padding:8px 14px;border-radius:8px;z-index:10}.feed-tabs{display:none;gap:6px}@media (min-width: 700px){.feed-select{display:none}.feed-tabs{display:flex}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes slide-in-left{0%{opacity:0;transform:translate(-24px)}to{opacity:1;transform:none}}@keyframes slide-in-right{0%{opacity:0;transform:translate(24px)}to{opacity:1;transform:none}}.post{animation:slide-in-left .4s ease-out}.media{animation:fade-in .4s ease-out}.split.blog{animation:slide-in-right .45s ease-out}.toast{animation:fade-in .4s ease-out}.thumb{transition:border-color .3s,box-shadow .3s}.post-body.from-right,.media-img.from-right{animation:slide-in-right .4s ease-out}.post-body.from-left,.media-img.from-left{animation:slide-in-left .4s ease-out}@keyframes spin{to{transform:rotate(360deg)}}.reload-spinner{position:fixed;left:50%;top:50%;z-index:2;width:96px;height:96px;margin:-48px 0 0 -48px;box-sizing:border-box;padding:16px;border-radius:50%;background:#00101fa6;border:1px solid rgba(255,255,255,.4);pointer-events:none}.reload-spinner img{display:block;width:64px;height:64px;animation:spin 1.2s linear infinite}@media (prefers-reduced-motion: reduce){.post,.media,.split.blog,.toast,.post-body,.media-img{animation:none}.reload-spinner img{animation-duration:2s}.thumb,.thumb img,.media-img.slideshow-anim{transition:none}}.pull{overflow:hidden;text-align:center;color:var(--muted);font-size:12px;display:flex;align-items:center;justify-content:center}.media-names{display:flex;position:absolute;left:0;right:0;bottom:0;z-index:1;padding:12px;padding-bottom:calc(2px + env(safe-area-inset-bottom));padding-right:calc(min(380px,50%) + env(safe-area-inset-right));padding-left:calc(12px + env(safe-area-inset-left));text-align:left;pointer-events:none;text-shadow:0 0 4px #000,0 0 8px #000,0 1px 2px #000}.media-names a{pointer-events:auto;font-weight:600}.confirm-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;background:#0009;display:flex;align-items:center;justify-content:center;animation:fade-in .2s ease-out}.confirm{background:var(--panel);border:1px solid #25476f;border-radius:10px;padding:16px 18px;min-width:260px;max-width:90vw}.confirm p{margin:0 0 14px}.confirm-actions{display:flex;justify-content:flex-end;gap:8px}.control-panel{position:fixed;left:0;right:0;bottom:0;z-index:9;height:var(--panel-h);box-sizing:border-box;display:flex;justify-content:flex-end;align-items:flex-start;gap:10px;padding:8px 12px 0;padding-left:calc(12px + env(safe-area-inset-left));padding-right:calc(12px + env(safe-area-inset-right));background:transparent;pointer-events:none}.control-panel button{pointer-events:auto;flex:0 1 64px;aspect-ratio:1;min-width:0;padding:0;border-radius:26px;display:flex;align-items:center;justify-content:center;background:#00101fa6;border-color:#fff6}.control-panel button:active{background:var(--accent)}.control-panel .cp-icon{display:flex}.control-panel .cp-icon svg{width:52px;height:52px}.control-panel .cp-icon-enter{transform:translateY(-2px) scale(.85)}@media (max-width: 699px){.control-panel{align-items:flex-end;padding-bottom:calc(8px + env(safe-area-inset-bottom))}}.media-head .actions button,.media-head .act,.media-head .count{pointer-events:auto}.media-head .act{background:#00101fa6;border-color:#fff6}.media-head .act.like.active{background:#4b2638;border-color:var(--like)}.media-head .act.reblog.active{background:#14452f;border-color:var(--reblog)}.media-head .act.slideshow.active{background:#123a66;border-color:var(--accent)}.media-head .count{text-shadow:0 0 4px #000,0 0 8px #000}.control-panel button,.media-head .act,.media-names{transition:opacity .4s ease}.app.idle .control-panel button,.app.idle .media-head .act,.app.idle .media-names,.app.idle .media-title,.app.idle .media .image-dots{opacity:var(--idle-opacity)}