:root{--font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--text-color:#333;--app-bg-color:#fff;--border-color:#eee;--link-color:#888;--link-hover-color:#333;--button-bg-color:#f0f0f0;--button-border-color:#ddd;--button-text-color:#555;--button-hover-bg-color:#e0e0e0;--active-color:#f60;--muted-text-color:#666;--placeholder-bg:#f9f9f9;--placeholder-text-bg:#e0e0e0;--story-bg:#fff;--story-border:#eee;--story-shadow:0 1px 2px #0000000d;--story-hover-bg:#f9f9f9;--story-selected-bg:#fff7f2;--comment-bg:#f6f6ef;--comment-border:#e0e0e0;--error-bg:#ffe0e0;--error-border:#f66;--error-text:#c00;--header-padding:20px;--transistion-curve:transform .55s cubic-bezier(.445, 1.02, .445, 1.02);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.dark-mode{--text-color:#abb2bf;--app-bg-color:#21252b;--border-color:#3a3f4b;--link-color:#888;--link-hover-color:#abb2bf;--button-bg-color:#3a3f4b;--button-border-color:#4a505c;--button-text-color:#abb2bf;--button-hover-bg-color:#4a505c;--placeholder-bg:#3a3f4b;--placeholder-text-bg:#4a505c;--story-bg:#21252b;--story-border:#3a3f4b;--story-shadow:0 1px 2px #0003;--story-hover-bg:#2c313a;--story-selected-bg:#3a3f4b;--comment-bg:#2c313a;--comment-border:#3a3f4b;--error-bg:#4a2c2c;--error-border:#8b0000;--error-text:#f66;--muted-text-color:#9da5b4}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}body{font-family:var(--font-family);background-color:var(--app-bg-color);color:var(--text-color);height:100vh;margin:0;padding:0;display:block;overflow:hidden}#app{background-color:var(--app-bg-color);flex-direction:column;flex-grow:1;width:100%;height:100%;margin:0;padding:0;display:flex}.page-title{text-align:center;margin:0;font-size:20px;line-height:20px}.main-layout{flex-direction:row;flex-grow:1;display:flex;overflow:hidden}.story-list,.comments-panel{box-sizing:border-box;flex:1;min-height:0;padding:20px;overflow-y:auto}.story-list{padding-right:10px}.comments-panel{border-left:1px solid var(--border-color);padding-top:10px;padding-left:10px;padding-right:10px}.resizer{cursor:ew-resize;background-color:#0000;flex-shrink:0;width:6px}.btn{background-color:var(--button-bg-color);border:1px solid var(--button-border-color);color:var(--button-text-color);cursor:pointer;border-radius:5px;padding:8px 15px;font-size:1em;line-height:1em;text-decoration:none;transition:background-color .2s,border-color .2s,padding .3s}.btn:hover{background-color:var(--button-hover-bg-color)}.btn.active{background-color:var(--active-color);color:#fff;border-color:var(--active-color)}.tabs{border-bottom:1px solid var(--border-color);app-region:drag;-webkit-user-select:none;user-select:none;padding-left:calc(var(--header-padding) + env(titlebar-area-x,0px));padding-right:calc(var(--header-padding) + 100% - env(titlebar-area-x,0px) - env(titlebar-area-width,100%));flex-wrap:wrap;align-items:center;gap:10px;padding-top:10px;padding-bottom:10px;display:flex}.tabs .btn,.tabs .tab-link{app-region:no-drag}.tabs .tab-spacer{margin-left:auto}.tabs .tab-link{color:var(--active-color);text-decoration:none}.tabs .tab-link:hover{text-decoration:underline}.nav-buttons{gap:10px;display:flex}.story{color:var(--text-color);background-color:var(--story-bg);border:1px solid var(--story-border);box-shadow:var(--story-shadow);cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:5px;margin-bottom:10px;padding:15px;text-decoration:none;transition:background-color .2s;display:block}.story:hover{background-color:var(--story-hover-bg)}.story.selected{border-left:5px solid var(--active-color);background-color:var(--story-selected-bg)}.story .story-title{align-items:center;gap:8px;margin-bottom:5px;font-size:1.1em;font-weight:700;display:flex}.story .story-title a{color:var(--text-color);text-decoration:none}.story .story-title a:hover{text-decoration:underline}.story .story-title .story-title-text{flex:1;min-width:0}:is(.story,.comments-header) .story-meta{color:var(--link-color);margin-top:5px;font-size:.85em}:is(.story,.comments-header) .story-meta a{color:var(--link-color);text-decoration:none}:is(.story,.comments-header) .story-meta a:hover{text-decoration:underline}.save-toggle{border:1px solid var(--button-border-color);color:var(--button-text-color);cursor:pointer;background:0 0;border-radius:4px;padding:3px 8px;font-size:.85em}.save-toggle[aria-pressed=true],.save-toggle.active{border-color:var(--active-color);background-color:var(--active-color);color:#fff}.story .story-title .save-toggle{margin-left:auto}.comments-header h3{align-items:flex-start;gap:8px;display:flex}.comments-header h3 a{flex:1;min-width:0}.comments-container{padding:10px}.comments-header{border-bottom:1px solid var(--border-color);margin-bottom:15px;padding-bottom:10px}.comments-header h3{color:var(--active-color);margin:0}.comments-header h3 a{color:var(--active-color);text-decoration:none}.comments-header h3 a:hover{text-decoration:underline}.comment-item{background-color:var(--comment-bg);border:1px solid var(--comment-border);border-radius:5px;margin-bottom:10px;padding:10px}.comment-item .comment-meta{color:var(--link-color);margin-bottom:5px;font-size:.8em}.comment-item .comment-meta a{color:var(--link-color);text-decoration:none}.comment-item .comment-meta a:hover{text-decoration:underline}.comment-item .comment-text{font-size:.9em;line-height:1.5}.comment-item .comment-text pre{white-space:pre-wrap;overflow:auto}.comment-item .comment-text p{margin:0 0 5px}.comment-item .comment-children{border-left:2px solid var(--active-color);margin-top:10px;padding-left:10px}.comment-item .delayed-message{background-color:var(--placeholder-bg);color:var(--muted-text-color);border-radius:4px;padding:6px 8px;font-style:italic;display:block}.comment-item.delayed-comment{border-color:var(--placeholder-bg);box-shadow:inset 0 0 0 1px var(--placeholder-bg)}.comment-item.delayed-comment .comment-meta{color:var(--muted-text-color)}.story-text{background-color:var(--button-bg-color);border:1px solid var(--button-border-color);border-radius:5px;margin:10px 0 5px;padding:10px;font-size:.9em;line-height:1.5}.story-text pre{white-space:pre-wrap}:is(.comment-text,.story-text) a,:is(.comment-text,.story-text) pre{word-wrap:break-word}.dark-mode .comment-text a,.dark-mode .story-text a{color:#61afef}:is(.dark-mode .comment-text a,.dark-mode .story-text a):hover{text-decoration:underline}.loading,.no-comments,.no-story-selected{text-align:center;color:var(--link-color);-webkit-user-select:none;user-select:none;padding:20px}.no-story-selected{-webkit-user-select:none;user-select:none;margin-top:50px;font-size:1.1em}.story-placeholder,.comment-placeholder{background-color:var(--placeholder-bg);border-color:var(--border-color);animation:1.5s ease-in-out infinite pulse}.placeholder-text{background-color:var(--placeholder-text-bg);color:#0000;border-radius:3px;min-width:100px;height:1em;display:inline-block}.story-title .placeholder-text{width:80%}.story-meta .placeholder-text{width:60%}.story-error,.comment-error{background-color:var(--error-bg);border:1px solid var(--error-border);color:var(--error-text);border-radius:5px;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:10px;padding:15px;display:flex}.story-error .error-message,.comment-error .error-message{flex:1;min-width:0}.story-error .retry-btn,.comment-error .retry-btn{border-color:var(--error-border);color:var(--error-text);background-color:#0000;margin-left:auto;padding:6px 10px;font-size:.9em}.story-error .retry-btn:hover,.comment-error .retry-btn:hover{background-color:var(--error-border);border-color:var(--error-border);color:#fff}.deleted-comment{color:var(--link-color);background-color:var(--button-bg-color);border-radius:5px;margin-bottom:10px;padding:10px;font-style:italic}.load-more-btn{background-color:var(--button-bg-color);border:1px solid var(--button-border-color);cursor:pointer;width:100%;color:var(--button-text-color);-webkit-user-select:none;user-select:none;border-radius:5px;margin-top:10px;padding:12px 20px;font-size:1em;transition:background-color .2s,border-color .2s,color .2s;display:block}.load-more-btn:hover{background-color:var(--button-hover-bg-color)}.load-more-btn:disabled{opacity:.6;cursor:not-allowed}@keyframes pulse{0%{opacity:1}50%{opacity:.7}to{opacity:1}}@media (width>=500px){.hide-on-large-screen{display:none}::-webkit-scrollbar{width:12px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#888;border-radius:6px}::-webkit-scrollbar-thumb:hover{background:#555}.dark-mode ::-webkit-scrollbar-thumb{background:#555}.dark-mode ::-webkit-scrollbar-thumb:hover{background:#777}}@media (width<=1366px){.hide-on-small-screen{display:none}.tabs .btn{padding:8px 10px}}.hide-on-large-screen{display:none}.collapsible-menu{display:none}.collapsible-menu .btn{text-align:left}.hidden{display:none}.overlay{z-index:99;background-color:#00000080;width:100%;height:100%;display:none;position:fixed;top:0;left:0}.overlay.visible{display:block}@media (width<=768px){.hide-on-large-screen{display:block}.hide-on-smaller-screen{display:none}.tabs{--header-padding:10px}.nav-buttons{display:none}.collapsible-menu{background-color:var(--app-bg-color);border:1px solid var(--border-color);z-index:100;flex-direction:column;gap:10px;padding:10px;display:none;position:absolute;top:60px;left:0;right:0}.collapsible-menu.visible{display:flex}.main-layout{display:block}.main-layout .resizer{pointer-events:none;background-color:#0000;width:100%;height:100%;transition:background-color .55s;position:relative;top:-100%}.main-layout .story-list{transition:var(--transistion-curve);width:100%;height:100%;padding-top:0;padding-left:0;padding-right:0;display:block;position:relative;transform:translate(0)}.main-layout .story-list .load-more-btn{width:calc(100% - 20px);margin-left:10px;margin-right:10px}.main-layout .comments-panel{transition:var(--transistion-curve);background-color:var(--app-bg-color);z-index:101;width:100%;height:100%;position:relative;top:-200%;transform:translate(100%)}.main-layout.show-comments .resizer{background-color:#00000040}.main-layout.show-comments .story-list{transform:translate(-30%)}.main-layout.show-comments .comments-panel{border-left:none;padding-left:0;padding-right:0;display:block;transform:translate(0)}.main-layout.no-transition .resizer{display:none}.main-layout.no-transition .story-list{transition:none}.main-layout.no-transition .comments-panel{transition:none;display:none}.main-layout.no-transition.show-comments .story-list{display:none}.main-layout.no-transition.show-comments .comments-panel{display:block;top:0}.story{border-top:0;border-left:none;border-right:none;border-radius:0;margin:0}.comment-item{margin-bottom:4px;padding:4px}.comment-item .comment-children{padding-left:2px}}
