:root{--color-bg: #0d0d0d;--color-bg-elevated: #121212;--color-bg-card: #161616;--color-bg-card-hover: #1d1d1d;--color-border: #232323;--color-border-subtle: #1a1a1a;--color-text-primary: #c4c4cc;--color-text-secondary: #666676;--color-text-tertiary: #444450;--color-text-accent: #ff6600;--color-text-link: #c8680a;--color-text-link-hover: #e07820;--color-accent: #ff6600;--color-accent-dim: rgba(255, 102, 0, .15);--color-accent-glow: rgba(255, 102, 0, .08);--color-scramble: #ff6600;--space-xs: 4px;--space-sm: 8px;--space-md: 16px;--space-lg: 24px;--space-xl: 32px;--space-2xl: 48px;--font-family: "Space Grotesk", system-ui, -apple-system, sans-serif;--font-size-xs: 11px;--font-size-sm: 13px;--font-size-base: 15px;--font-size-md: 17px;--font-size-lg: 20px;--font-size-xl: 24px;--font-size-2xl: 32px;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--line-height-tight: 1.2;--line-height-normal: 1.5;--line-height-relaxed: 1.7;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px;--radius-xl: 20px;--transition-fast: .12s ease;--transition-base: .2s ease;--transition-slow: .35s ease;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}html{font-size:16px;-webkit-text-size-adjust:100%;scroll-behavior:smooth;scrollbar-gutter:stable}body{font-family:var(--font-family);font-size:var(--font-size-base);font-weight:var(--font-weight-normal);line-height:var(--line-height-normal);color:var(--color-text-primary);background-color:var(--color-bg);min-height:100dvh;overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100dvh;display:flex;flex-direction:column}a{color:inherit;text-decoration:none}button{font-family:inherit;cursor:pointer;border:none;background:none}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:2px}@keyframes fade-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-up{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse-glow{0%,to{opacity:.6}50%{opacity:1}}@keyframes shimmer{0%{background-position:-200% center}to{background-position:200% center}}.animate-fade-in{animation:fade-in .3s ease both}.animate-slide-up{animation:slide-up .4s cubic-bezier(.16,1,.3,1) both}.hack-reveal{display:inline}.hack-char{display:inline;transition:color var(--transition-fast)}.hack-char--scrambled{color:var(--color-scramble);opacity:.7}.hack-char--revealed{color:inherit}.feed-header{position:sticky;top:0;z-index:100;background-color:#0a0a0feb;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-between;padding:var(--space-sm) var(--space-md);padding-top:calc(var(--space-sm) + var(--safe-top));min-height:56px}.feed-header__brand{display:flex;align-items:center;gap:var(--space-xs);flex-shrink:0;min-width:0}.feed-header__brand-text{display:flex;flex-direction:column;gap:1px;min-width:0}.feed-header__brand-title{display:flex;align-items:center;gap:var(--space-xs);white-space:nowrap}.feed-header__tagline{font-size:10px;color:var(--color-text-tertiary);letter-spacing:.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0;opacity:.7}.feed-header__tagline-link{color:var(--color-accent);text-decoration:none;opacity:.85}.feed-header__tagline-link:hover{opacity:1;text-decoration:underline}@media (max-width: 360px){.feed-header__tagline{display:none}}.feed-header__logo{height:28px;width:auto;display:block;object-fit:contain}.feed-header__name{font-size:var(--font-size-md);font-weight:var(--font-weight-bold);color:var(--color-text-primary);letter-spacing:-.02em}.feed-header__hckr{font-size:var(--font-size-md);font-weight:var(--font-weight-bold);color:var(--color-accent);letter-spacing:.04em}.feed-header__nav{display:flex;gap:2px}.feed-header__tab{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-tertiary);padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);transition:color var(--transition-fast),background-color var(--transition-fast)}.feed-header__tab:active{background-color:var(--color-bg-elevated);color:var(--color-text-primary)}.feed-header__tab--active{color:var(--color-accent);background-color:var(--color-accent-dim)}@media (hover: hover){.feed-header__tab:hover{color:var(--color-text-primary);background-color:var(--color-bg-elevated)}.feed-header__tab--active:hover{color:var(--color-accent);background-color:var(--color-accent-dim)}}.story-card{padding:var(--space-md) var(--space-md);border-bottom:1px solid var(--color-border-subtle);cursor:pointer;transition:background-color var(--transition-fast);user-select:none;-webkit-user-select:none}.story-card:active{background-color:var(--color-bg-card-hover)}@media (hover: hover){.story-card:hover{background-color:var(--color-bg-card)}}.story-card__body{display:flex;flex-direction:column;gap:var(--space-xs);margin-bottom:var(--space-sm)}.story-card__title{font-size:var(--font-size-md);font-weight:var(--font-weight-semibold);line-height:var(--line-height-tight);color:var(--color-text-primary);letter-spacing:-.01em}.story-card__domain{font-size:var(--font-size-xs);color:var(--color-text-tertiary);font-weight:var(--font-weight-medium);text-transform:lowercase}.story-card__meta{display:flex;align-items:center;gap:var(--space-xs);font-size:var(--font-size-sm);color:var(--color-text-secondary)}.story-card__score{color:var(--color-accent);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm)}.story-card__sep{color:var(--color-text-tertiary);font-size:var(--font-size-xs)}.story-card__comments{color:var(--color-text-secondary)}.story-card__age{color:var(--color-text-tertiary)}.loading-state{display:flex;flex-direction:column}.loading-skeleton{padding:var(--space-md);border-bottom:1px solid var(--color-border-subtle);display:flex;flex-direction:column;gap:var(--space-sm);animation:fade-in .4s ease both}.loading-skeleton__title{height:18px;border-radius:var(--radius-sm);background:linear-gradient(90deg,var(--color-bg-card) 0%,var(--color-bg-card-hover) 50%,var(--color-bg-card) 100%);background-size:200% 100%;animation:shimmer 1.5s infinite linear}.loading-skeleton__title--short{height:14px}.loading-skeleton__meta{height:12px;width:50%;border-radius:var(--radius-sm);background:linear-gradient(90deg,var(--color-bg-card) 0%,var(--color-bg-card-hover) 50%,var(--color-bg-card) 100%);background-size:200% 100%;animation:shimmer 1.5s infinite linear}.error-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-md);padding:var(--space-2xl) var(--space-lg);min-height:200px;text-align:center}.error-state__icon{font-size:32px;opacity:.5}.error-state__message{font-size:var(--font-size-base);color:var(--color-text-secondary);max-width:280px}.error-state__retry{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-accent);border:1px solid var(--color-accent-dim);padding:var(--space-sm) var(--space-lg);border-radius:var(--radius-md);background:var(--color-accent-glow);transition:background-color var(--transition-fast)}.error-state__retry:active{background-color:var(--color-accent-dim)}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-md);padding:var(--space-2xl) var(--space-lg);min-height:200px}.empty-state__icon{font-size:32px;color:var(--color-text-tertiary)}.empty-state__message{font-size:var(--font-size-base);color:var(--color-text-tertiary)}.feed-page{display:flex;flex-direction:column;min-height:100dvh;background-color:var(--color-bg)}.feed-page__list{flex:1;min-height:100dvh;padding-bottom:calc(var(--space-xl) + var(--safe-bottom))}.feed-page__loading-more{padding:var(--space-md) 0}.feed-page__sentinel{height:1px;visibility:hidden}.preview-card{display:block;position:relative;border:1px solid var(--color-border);border-radius:var(--radius-lg);background-color:var(--color-bg-card);overflow:hidden;transition:border-color var(--transition-fast),background-color var(--transition-fast);text-decoration:none}.preview-card:active{background-color:var(--color-bg-card-hover);border-color:var(--color-accent-dim)}@media (hover: hover){.preview-card:hover{border-color:#ff66004d;background-color:var(--color-bg-card-hover)}}.preview-card__content{padding:var(--space-md);display:flex;flex-direction:column;gap:var(--space-xs)}.preview-card__meta{display:flex;align-items:center;justify-content:space-between}.preview-card__domain{font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);color:var(--color-accent);text-transform:uppercase;letter-spacing:.06em}.preview-card__arrow{font-size:var(--font-size-base);color:var(--color-text-tertiary)}.preview-card__title{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);line-height:var(--line-height-tight)}.preview-card__description{font-size:var(--font-size-sm);color:var(--color-text-secondary);line-height:var(--line-height-relaxed);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.preview-card__url{font-size:var(--font-size-xs);color:var(--color-text-tertiary);word-break:break-all}.preview-card__image-wrap{width:100%;aspect-ratio:2 / 1;overflow:hidden;background-color:var(--color-bg-elevated)}.preview-card__image{width:100%;height:100%;object-fit:cover;display:block}.preview-card__accent{position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(to bottom,var(--color-accent),transparent);opacity:.6}.comment-item{padding:var(--space-sm) var(--space-md);padding-left:calc(var(--space-md) + calc(var(--depth, 0) * 16px));border-bottom:1px solid var(--color-border-subtle);position:relative}.comment-item:before{content:"";position:absolute;left:calc(var(--space-md) + calc(var(--depth, 0) * 16px) - 8px);top:0;bottom:0;width:1px;background:var(--color-border);opacity:calc(1 - var(--depth, 0) * .2)}.comment-item:first-child:before{display:none}.comment-item__header{display:flex;align-items:center;gap:var(--space-sm);margin-bottom:var(--space-xs)}.comment-item__author{font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);color:var(--color-text-accent)}.comment-item__age{font-size:var(--font-size-xs);color:var(--color-text-tertiary)}.comment-item__body{font-size:var(--font-size-sm);line-height:var(--line-height-relaxed);color:var(--color-text-secondary)}.comment-item__body p{margin-bottom:var(--space-sm)}.comment-item__body p:last-child{margin-bottom:0}.comment-item__body a{color:var(--color-text-link);text-decoration:underline;text-underline-offset:2px;word-break:break-all;transition:color var(--transition-fast)}.comment-item__body a:hover,.comment-item__body a:focus{color:var(--color-text-link-hover)}.comment-item__body pre,.comment-item__body code{font-family:Courier New,monospace;font-size:var(--font-size-xs);background-color:var(--color-bg-card);padding:2px 4px;border-radius:var(--radius-sm);color:var(--color-text-primary)}.comment-item__body pre{padding:var(--space-sm);overflow-x:auto;white-space:pre-wrap;word-break:break-word}.story-page{min-height:100dvh;display:flex;flex-direction:column;background-color:var(--color-bg)}.story-page__header{position:sticky;top:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:var(--space-sm) var(--space-md);padding-top:calc(var(--space-sm) + var(--safe-top));background-color:#0a0a0feb;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--color-border);min-height:56px}.story-page__back{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);transition:color var(--transition-fast);min-height:44px;display:flex;align-items:center}.story-page__back:active{color:var(--color-text-primary)}.story-page__open{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-accent);padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);border:1px solid var(--color-accent-dim);background:var(--color-accent-glow);min-height:36px;display:flex;align-items:center}.story-page__content{padding:var(--space-lg) var(--space-md);border-bottom:1px solid var(--color-border)}.story-page__title{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);line-height:var(--line-height-tight);color:var(--color-text-primary);letter-spacing:-.02em;margin-bottom:var(--space-md)}.story-page__meta{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-xs);font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-bottom:var(--space-lg)}.story-page__score{color:var(--color-accent);font-weight:var(--font-weight-semibold)}.story-page__author{color:var(--color-text-accent);font-weight:var(--font-weight-medium)}.story-page__karma{color:var(--color-text-secondary)}.story-page__age{color:var(--color-text-tertiary)}.story-page__sep{color:var(--color-text-tertiary);font-size:var(--font-size-xs)}.story-page__preview{margin-bottom:var(--space-md)}.story-page__text{font-size:var(--font-size-base);line-height:var(--line-height-relaxed);color:var(--color-text-secondary);margin-top:var(--space-md)}.story-page__text p{margin-bottom:var(--space-md)}.story-page__text a{color:var(--color-text-link);text-decoration:underline;text-underline-offset:2px;transition:color var(--transition-fast)}.story-page__text a:hover,.story-page__text a:focus{color:var(--color-text-link-hover)}.story-page__text pre,.story-page__text code{font-family:Courier New,monospace;font-size:var(--font-size-xs);background-color:var(--color-bg-card);border-radius:var(--radius-sm)}.story-page__comments-header{padding:var(--space-sm) var(--space-md);border-bottom:1px solid var(--color-border)}.story-page__comments-count{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-tertiary);text-transform:uppercase;letter-spacing:.05em}.story-page__comments{flex:1}.story-page__no-comments{padding:var(--space-xl) var(--space-md);font-size:var(--font-size-sm);color:var(--color-text-tertiary);text-align:center}.story-page__comments-loading{padding:var(--space-sm) 0}.story-page__sentinel{height:1px;visibility:hidden}.story-page__footer{height:calc(var(--space-xl) + var(--safe-bottom))}.app{min-height:100dvh;max-width:680px;margin:0 auto;position:relative}
