: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: #ff6600;--placeholder-bg: #f9f9f9;--placeholder-text-bg: #e0e0e0;--story-bg: #fff;--story-border: #eee;--story-shadow: 0 1px 2px rgba(0, 0, 0, .05);--story-hover-bg: #f9f9f9;--story-selected-bg: #fff7f2;--comment-bg: #f6f6ef;--comment-border: #e0e0e0;--error-bg: #ffe0e0;--error-border: #ff6666;--error-text: #cc0000;--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 rgba(0, 0, 0, .2);--story-hover-bg: #2c313a;--story-selected-bg: #3a3f4b;--comment-bg: #2c313a;--comment-border: #3a3f4b;--error-bg: #4a2c2c;--error-border: #8b0000;--error-text: #ff6666}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}body{font-family:var(--font-family);margin:0;padding:0;background-color:var(--app-bg-color);color:var(--text-color);height:100vh;display:block;overflow:hidden}#app{height:100%;width:100%;flex-grow:1;margin:0;background-color:var(--app-bg-color);padding:0;display:flex;flex-direction:column}.page-title{margin:0;line-height:20px;font-size:20px;text-align:center}.main-layout{display:flex;flex-direction:row;flex-grow:1;overflow:hidden}.story-list,.comments-panel{flex:1;min-height:0;overflow-y:auto;padding:20px;box-sizing:border-box}.story-list{padding-right:10px}.comments-panel{border-left:1px solid var(--border-color);padding-left:10px;padding-right:10px;padding-top:10px}.resizer{width:6px;background-color:transparent;cursor:ew-resize;flex-shrink:0}.btn{background-color:var(--button-bg-color);border:1px solid var(--button-border-color);color:var(--button-text-color);padding:8px 15px;border-radius:5px;cursor:pointer;font-size:1em;text-decoration:none;line-height:1em;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{display:flex;flex-wrap:wrap;gap:10px;border-bottom:1px solid var(--border-color);align-items:center;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%));padding-top:10px;padding-bottom:10px}.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{display:flex;gap:10px}.story{display:block;color:var(--text-color);background-color:var(--story-bg);border:1px solid var(--story-border);border-radius:5px;padding:15px;margin-bottom:10px;box-shadow:var(--story-shadow);cursor:pointer;-webkit-user-select:none;user-select:none;text-decoration:none;transition:background-color .2s}.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{font-size:1.1em;font-weight:700;margin-bottom:5px}.story .story-title a{color:var(--text-color);text-decoration:none}.story .story-title a:hover{text-decoration:underline}:is(.story,.comments-header) .story-meta{font-size:.85em;color:var(--link-color);margin-top:5px}: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}.comments-container{padding:10px}.comments-header{margin-bottom:15px;border-bottom:1px solid var(--border-color);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;padding:10px;margin-bottom:10px}.comment-item .comment-meta{font-size:.8em;color:var(--link-color);margin-bottom:5px}.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-line;overflow:auto}.comment-item .comment-text p{margin:0 0 5px}.comment-item .comment-children{border-left:2px solid var(--active-color);padding-left:10px;margin-top:10px}.story-text{background-color:var(--button-bg-color);border:1px solid var(--button-border-color);padding:10px;border-radius:5px;margin:10px 0 5px;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;padding:20px;color:var(--link-color);-webkit-user-select:none;user-select:none}.no-story-selected{font-size:1.1em;margin-top:50px;-webkit-user-select:none;user-select:none}.story-placeholder,.comment-placeholder{background-color:var(--placeholder-bg);border-color:var(--border-color);animation:pulse 1.5s infinite ease-in-out}.placeholder-text{background-color:var(--placeholder-text-bg);color:transparent;display:inline-block;height:1em;border-radius:3px;min-width:100px}.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);padding:15px;border-radius:5px;margin-bottom:10px}.deleted-comment{font-style:italic;color:var(--link-color);background-color:var(--button-bg-color);padding:10px;border-radius:5px;margin-bottom:10px}.load-more-btn{display:block;width:100%;background-color:var(--button-bg-color);border:1px solid var(--button-border-color);padding:12px 20px;border-radius:5px;cursor:pointer;font-size:1em;color:var(--button-text-color);transition:background-color .2s,border-color .2s,color .2s;margin-top:10px;-webkit-user-select:none;user-select:none}.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 (min-width: 500px){.hide-on-large-screen{display:none}::-webkit-scrollbar{width:12px}::-webkit-scrollbar-track{background:transparent}::-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 (max-width: 1366px){.hide-on-small-screen{display:none}.tabs .btn{padding:8px 10px}}.hide-on-large-screen,.collapsible-menu{display:none}.collapsible-menu .btn{text-align:left}.hidden{display:none}.overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;z-index:99}.overlay.visible{display:block}@media (max-width: 768px){.hide-on-large-screen{display:block}.hide-on-smaller-screen{display:none}.tabs{--header-padding: 10px}.nav-buttons{display:none}.collapsible-menu{display:none;position:absolute;top:60px;left:0;right:0;background-color:var(--app-bg-color);border:1px solid var(--border-color);z-index:100;flex-direction:column;padding:10px;gap:10px}.collapsible-menu.visible{display:flex}.main-layout{display:block}.main-layout .resizer{position:relative;width:100%;height:100%;background-color:transparent;top:-100%;pointer-events:none;transition:background-color .55s}.main-layout .story-list{position:relative;transform:translate(0);transition:var(--transistion-curve);width:100%;height:100%;display:block;padding-left:0;padding-right:0;padding-top:0}.main-layout .story-list .load-more-btn{margin-left:10px;margin-right:10px;width:calc(100% - 20px)}.main-layout .comments-panel{position:relative;transform:translate(100%);transition:var(--transistion-curve);background-color:var(--app-bg-color);z-index:101;width:100%;height:100%;top:-200%}.main-layout.show-comments .resizer{background-color:#00000040}.main-layout.show-comments .story-list{transform:translate(-30%)}.main-layout.show-comments .comments-panel{transform:translate(0);display:block;border-left:none;padding-left:0;padding-right: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-radius:0;border-left:none;border-right:none;margin:0;border-top:0}.comment-item{padding:4px;margin-bottom:4px}.comment-item .comment-children{padding-left:2px}}