*{margin:0;padding:0;box-sizing:border-box}:root{--bg-primary: #09090b;--bg-secondary: #18181b;--bg-card: #1c1c21;--bg-card-hover: #27272a;--text-primary: #fafafa;--text-secondary: #a1a1aa;--text-muted: #71717a;--accent: #f43f5e;--accent-hover: #fb7185;--accent-subtle: rgba(244, 63, 94, .1);--border: #27272a;--border-hover: #3f3f46;--radius: 12px;--radius-lg: 16px;--sidebar-width: 220px}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:var(--bg-primary);color:var(--text-primary);min-height:100vh;line-height:1.6;-webkit-font-smoothing:antialiased}.container{max-width:720px;margin:0 auto;padding:1.5rem}header{text-align:center;padding:2.5rem 0 2rem;margin-bottom:1.5rem}h1{font-size:2rem;font-weight:800;letter-spacing:-.03em;margin-bottom:.25rem;color:var(--text-primary)}h1 span{background:linear-gradient(135deg,var(--accent) 0%,var(--accent-hover) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.tagline{color:var(--text-muted);font-size:.95rem;font-weight:400}.controls{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center;margin-bottom:1.5rem}.category-select{padding:.625rem 1rem;font-size:.875rem;background:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;min-width:180px;transition:border-color .15s}.category-select:hover{border-color:var(--border-hover)}.category-select:focus{outline:none;border-color:var(--accent)}.stumble-btn,.shuffle-btn{padding:.625rem 1.5rem;font-size:.875rem;font-weight:600;background:var(--accent);color:#fff;border:none;border-radius:var(--radius);cursor:pointer;transition:all .15s}.stumble-btn:hover,.shuffle-btn:hover{background:var(--accent-hover)}.stumble-btn:disabled{opacity:.6;cursor:not-allowed}.shuffle-btn{background:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border)}.shuffle-btn:hover{background:var(--bg-card-hover);border-color:var(--border-hover)}.content-card{background:var(--bg-card);border-radius:var(--radius-lg);padding:1.25rem;margin-bottom:1rem;border:1px solid var(--border);transition:all .15s}.content-card:hover{background:var(--bg-card-hover);border-color:var(--border-hover)}.content-card h2{font-size:1.125rem;font-weight:600;margin-bottom:.5rem;line-height:1.4;letter-spacing:-.01em}.content-card h2 a{color:var(--text-primary);text-decoration:none;transition:color .15s}.content-card h2 a:hover{color:var(--accent)}.meta{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:.75rem;font-size:.8rem;color:var(--text-muted)}.meta span{display:inline-flex;align-items:center;gap:.25rem}.category-tag{background:var(--accent-subtle);padding:.2rem .6rem;border-radius:6px;font-size:.75rem;font-weight:500;color:var(--accent);border:none}.description{color:var(--text-secondary);font-size:.9rem;margin-bottom:.75rem;line-height:1.5}.visit-link{display:inline-flex;align-items:center;gap:.375rem;color:var(--accent);text-decoration:none;font-size:.875rem;font-weight:500;transition:color .15s}.visit-link:hover{color:var(--accent-hover)}.stats{text-align:center;padding:.5rem;color:var(--text-muted);font-size:.8rem}.history{margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid var(--border)}.history h2{font-size:.8rem;font-weight:500;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);margin-bottom:.75rem}.hidden{display:none}.placeholder-text{text-align:center;color:var(--text-muted);padding:2rem 1rem}.mode-nav{display:inline-flex;gap:.25rem;justify-content:center;margin-top:1rem;background:var(--bg-secondary);padding:.25rem;border-radius:var(--radius)}.mode-nav a{color:var(--text-muted);text-decoration:none;padding:.5rem 1rem;border-radius:calc(var(--radius) - 4px);font-size:.875rem;font-weight:500;transition:all .15s}.mode-nav a:hover{color:var(--text-primary)}.mode-nav a.active{color:var(--text-primary);background:var(--bg-card)}.embed-container{margin:.75rem 0;border-radius:var(--radius);overflow:hidden;background:var(--bg-secondary)}.embed-frame{width:100%;aspect-ratio:16 / 9;border:none}.art-image-container{display:block;margin:.75rem 0;border-radius:var(--radius);overflow:hidden;background:var(--bg-secondary)}.art-image{width:100%;max-height:500px;object-fit:contain;display:block}.link-preview{display:flex;gap:1rem;padding:.875rem;background:var(--bg-secondary);border-radius:var(--radius);margin:.75rem 0;border:1px solid var(--border);transition:border-color .15s;text-decoration:none}.link-preview:hover{border-color:var(--border-hover)}.link-preview-icon{flex-shrink:0;width:48px;height:48px;background:var(--bg-card-hover);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:1.25rem}.link-preview-content{flex:1;min-width:0}.link-preview-domain{font-size:.75rem;color:var(--text-muted);margin-bottom:.125rem}.link-preview-title{font-size:.875rem;font-weight:500;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.history-list{display:flex;flex-direction:column;gap:.375rem}.history-item{padding:.5rem .75rem;background:var(--bg-secondary);border-radius:8px;font-size:.8rem}.history-item a{color:var(--text-secondary);text-decoration:none;transition:color .15s}.history-item a:hover{color:var(--text-primary)}footer{text-align:center;padding:2rem 1rem;color:var(--text-muted);font-size:.8rem;margin-top:2rem}footer p+p{margin-top:.25rem}.feed{display:flex;flex-direction:column;gap:.75rem}.feed-item{background:var(--bg-card);border-radius:var(--radius-lg);padding:1.25rem;border:1px solid var(--border);transition:all .15s}.feed-item:hover{background:var(--bg-card-hover);border-color:var(--border-hover)}.feed-item.validating{opacity:.5}.feed-item.invalid{display:none}.loading-indicator{text-align:center;padding:2rem;color:var(--text-muted);font-size:.875rem}.load-more-container{min-height:60px;display:flex;align-items:center;justify-content:center}.desktop-header{display:none}@media(min-width:601px){.desktop-header{position:fixed;top:0;left:var(--sidebar-width);right:0;z-index:99;background:#09090be6;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:.75rem 2rem;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border);transform:translateY(-100%);opacity:0;transition:transform .3s ease,opacity .3s ease;pointer-events:none}.desktop-header.header-visible{transform:translateY(0);opacity:1;pointer-events:auto}.desktop-header-title{font-size:1rem;font-weight:800;letter-spacing:-.02em}.desktop-header-title span{background:linear-gradient(135deg,var(--accent) 0%,var(--accent-hover) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.desktop-header .mode-toggle{display:flex;gap:.25rem;background:var(--bg-secondary);padding:.2rem;border-radius:8px}.desktop-header .mode-toggle a{color:var(--text-muted);text-decoration:none;padding:.4rem .75rem;border-radius:6px;font-size:.8rem;font-weight:500;transition:all .15s}.desktop-header .mode-toggle a:hover{color:var(--text-primary)}.desktop-header .mode-toggle a.active{color:var(--text-primary);background:var(--bg-card)}body{display:flex}.sidebar{position:fixed;left:0;top:0;bottom:0;width:var(--sidebar-width);background:var(--bg-secondary);border-right:1px solid var(--border);padding:1.5rem 1rem;overflow-y:auto;display:flex;flex-direction:column;z-index:100}.sidebar-header{text-align:center;margin-bottom:1.5rem}.sidebar-header h1{font-size:1.25rem;margin-bottom:.25rem}.sidebar-header .tagline{font-size:.8rem}.sidebar-nav{display:none}.category-list-title{font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted);padding:.5rem;margin-top:.5rem;display:flex;justify-content:space-between;align-items:center}.sort-toggle{background:none;border:none;color:var(--text-muted);cursor:pointer;font-size:.65rem;padding:.2rem .4rem;border-radius:4px;opacity:.6;transition:all .15s}.sort-toggle:hover{opacity:1;background:var(--bg-tertiary)}.sort-toggle.active{opacity:1;color:var(--accent);background:var(--bg-tertiary)}.category-list{display:flex;flex-direction:column;gap:.125rem;flex:1;overflow-y:auto}.category-item{padding:.5rem .75rem;border-radius:8px;cursor:pointer;color:var(--text-secondary);font-size:.8rem;transition:all .15s;border:none;background:none;text-align:left;width:100%;display:flex;justify-content:space-between;align-items:center}.category-item:hover{background:var(--bg-card);color:var(--text-primary)}.category-item.active{background:var(--accent-subtle);color:var(--accent)}.category-item .count{font-size:.7rem;color:var(--text-muted)}.category-item.active .count{color:var(--accent);opacity:.7}.sidebar-shuffle{margin-top:1rem;width:100%;padding:.5rem 1rem;font-size:.8rem}.sidebar-stats{margin-top:1rem;font-size:.7rem;text-align:center}.main-content{margin-left:var(--sidebar-width);flex:1;padding:2.5rem;min-height:100vh}.container{max-width:none;padding:0}.feed{max-width:980px;margin:0 auto}@media(min-width:1440px){.feed{max-width:1080px}}@media(min-width:1800px){.feed{max-width:1200px}}.feed-item{padding:1.5rem 2rem;margin-bottom:1.25rem}.feed-item h2{font-size:1.25rem}.feed-item .description{font-size:.95rem}.mobile-header,.swipe-indicator{display:none}footer{display:none}}@media(max-width:600px){html,body{height:100%;overflow:hidden}.sidebar,.category-select{display:none!important}.mobile-header{position:fixed;top:0;left:0;right:0;z-index:100;background:#09090bd9;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);padding:.5rem 1rem;display:flex;align-items:center;justify-content:space-between;transition:transform .3s ease,opacity .3s ease}.mobile-header.header-hidden{transform:translateY(-100%);opacity:0;pointer-events:none}.mobile-title{font-size:.95rem;font-weight:800;letter-spacing:-.02em}.mobile-title span{background:linear-gradient(135deg,var(--accent) 0%,var(--accent-hover) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.mode-toggle{display:flex;gap:.125rem;background:var(--bg-secondary);padding:.15rem;border-radius:6px}.mode-toggle a{color:var(--text-muted);text-decoration:none;padding:.3rem .5rem;border-radius:5px;font-size:.7rem;font-weight:500;transition:all .15s}.mode-toggle a:hover{color:var(--text-primary)}.mode-toggle a.active{color:var(--text-primary);background:var(--bg-card)}.main-content{height:100vh;padding:0}.feed{height:100vh;overflow-y:scroll;scroll-snap-type:y mandatory;-webkit-overflow-scrolling:touch;gap:0}.feed-item{height:100vh;min-height:100vh;max-height:100vh;scroll-snap-align:start;scroll-snap-stop:always;display:flex;flex-direction:column;justify-content:center;padding:3.5rem 1.5rem 2rem;margin:0;border-radius:0;border:none;border-bottom:1px solid var(--border);overflow:hidden}.feed-item:hover{background:var(--bg-card)}.feed-item h2{font-size:1.5rem;margin-bottom:.5rem;line-height:1.3}.feed-item .meta{margin-bottom:1rem}.feed-item.embed-card .embed-container{flex:1;display:flex;align-items:center;max-height:45vh;margin:.75rem 0}.feed-item.embed-card .embed-frame{max-height:100%}.feed-item.embed-card .description{font-size:1rem;line-height:1.5;margin-bottom:.75rem}.feed-item.text-card{justify-content:flex-start;padding-top:4rem}.feed-item.text-card h2{font-size:1.85rem;line-height:1.2;margin-bottom:1rem}.feed-item.text-card .meta{margin-bottom:1.25rem}.feed-item.text-card .link-preview{flex-direction:row;align-items:center;padding:1.25rem 1.5rem;margin:0 0 1.5rem;gap:1rem;background:var(--bg-card)}.feed-item.text-card .link-preview-icon{width:56px;height:56px;font-size:1.75rem;flex-shrink:0}.feed-item.text-card .link-preview-content{text-align:left;flex:1}.feed-item.text-card .link-preview-domain{font-size:.8rem;margin-bottom:.25rem}.feed-item.text-card .link-preview-title{white-space:normal;font-size:1rem;font-weight:600}.feed-item.text-card .description{font-size:1.35rem;line-height:1.65;color:var(--text-primary);flex:1;margin:0}.feed-item.text-card .visit-link{margin-top:auto;padding-top:1.5rem;font-size:1rem}.controls:not(.mobile-header .controls){display:none}.stats:not(.mobile-header .stats){display:none}footer{display:none}.load-more-container{display:none}.swipe-indicator{position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%);color:var(--text-muted);font-size:.75rem;opacity:.8;display:flex;flex-direction:column;align-items:center;gap:.25rem;pointer-events:none;z-index:50;animation:bounce 2s ease-in-out infinite}.swipe-indicator:before{content:"";width:3px;height:16px;background:var(--text-muted);border-radius:2px;opacity:.6}@keyframes bounce{0%,to{transform:translate(-50%) translateY(0)}50%{transform:translate(-50%) translateY(-6px)}}.swipe-indicator.hidden{display:none}}.stumble-container{display:flex;align-items:center;justify-content:center;gap:1rem;min-height:60vh;padding:1rem}.stumble-content{flex:1;max-width:900px;display:flex;align-items:center;justify-content:center}.stumble-card{width:100%;min-height:400px;display:flex;flex-direction:column}.stumble-placeholder{display:flex;align-items:center;justify-content:center;min-height:300px;color:var(--text-muted);text-align:center;font-size:1.1rem}.nav-arrow{width:56px;height:56px;border-radius:50%;border:1px solid var(--border);background:var(--bg-secondary);color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;flex-shrink:0}.nav-arrow:hover:not(:disabled){background:var(--bg-card-hover);border-color:var(--border-hover);color:var(--text-primary)}.nav-arrow:disabled{opacity:.3;cursor:not-allowed}.nav-arrow svg{width:24px;height:24px}.stumble-position{text-align:center;padding:1rem;color:var(--text-muted);font-size:.85rem}@media(min-width:601px){.stumble-mode .stumble-container{padding:2rem}.stumble-content{max-width:1000px}.nav-arrow{width:64px;height:64px}.nav-arrow svg{width:28px;height:28px}.stumble-card{min-height:500px;padding:2rem}.stumble-card h2{font-size:1.5rem}.stumble-card .embed-container{margin:1.5rem 0}.stumble-card .description{font-size:1.1rem;line-height:1.7}}@media(max-width:600px){.stumble-mode{height:100vh;display:flex;flex-direction:column}.stumble-container{flex:1;padding:.5rem;gap:.5rem}.nav-arrow{width:44px;height:44px}.nav-arrow svg{width:20px;height:20px}.stumble-card{min-height:auto;padding:1rem;max-height:calc(100vh - 140px);overflow-y:auto}.stumble-position{padding:.5rem;font-size:.75rem}}
