/* ==UserStyle==
@name HackerNews Restyle
@description HackerNews Restyle
@author Rensatsu
@namespace https://ren-user-css.pages.dev/hackernews.user.css
@version 1.3.20251027190042
==/UserStyle== */
@-moz-document domain("news.ycombinator.com") {
  :root {
    --color-primary: #000;
    --color-sub: hsl(14, 60%, 80%);
    --color-irrelevant: hsl(30, 36%, 80%);
    --color-header: #ffab91;
    --color-logo: #ff6600;
    --color-bg-main: hsl(10, 10%, 95%);
    --color-bg1: hsl(14, 80%, 97%);
    --color-bg2: hsl(14, 100%, 99%);
    --font-family: sans-serif;
  }
  body,
  #hnmain {
    background-color: var(--color-bg-main);
  }
  body,
  .title {
    font-size: 19px !important;
  }
  .pagetop {
    font-size: 15px !important;
  }
  body,
  .title,
  .pagetop,
  .yclinks,
  td > center > a,
  input[type="button"],
  input[type="submit"],
  .subtext {
    font-family: var(--font-family) !important;
  }
  #hnmain,
  .itemlist,
  .fatitem {
    width: 960px;
  }
  #hnmain {
    border: 1px solid var(--color-header);
    background: var(--color-bg1);
  }
  td[bgcolor="#ff6600"] {
    background-color: var(--color-header);
  }
  td[bgcolor="#ff6600"] > table {
    padding: 15px !important;
  }
  td[style="width:18px;padding-right:4px"] {
    padding: 0 10px 0 0 !important;
  }
  #pagespace {
    height: 0 !important;
  }
  /* items list */
  html[op="news"] #hnmain tbody,
  html[op="newest"] #hnmain tbody,
  html[op="front"] #hnmain tbody,
  html[op="ask"] #hnmain tbody,
  html[op="jobs"] #hnmain tbody,
  html[op="show"] #hnmain tbody {
    /* fix main table width */
    /* header */
    /* footer */
    /* spacer */
    /* background */
    /* link 'more' */
  }
  html[op="news"] #hnmain tbody > tr > td > table,
  html[op="newest"] #hnmain tbody > tr > td > table,
  html[op="front"] #hnmain tbody > tr > td > table,
  html[op="ask"] #hnmain tbody > tr > td > table,
  html[op="jobs"] #hnmain tbody > tr > td > table,
  html[op="show"] #hnmain tbody > tr > td > table {
    width: 100%;
  }
  html[op="news"] #hnmain tbody > .athing::after,
  html[op="newest"] #hnmain tbody > .athing::after,
  html[op="front"] #hnmain tbody > .athing::after,
  html[op="ask"] #hnmain tbody > .athing::after,
  html[op="jobs"] #hnmain tbody > .athing::after,
  html[op="show"] #hnmain tbody > .athing::after {
    padding: 40px 0 0 0 !important;
    content: "";
    display: block;
  }
  html[op="news"] #hnmain tbody > .athing > td:nth-child(1),
  html[op="newest"] #hnmain tbody > .athing > td:nth-child(1),
  html[op="front"] #hnmain tbody > .athing > td:nth-child(1),
  html[op="ask"] #hnmain tbody > .athing > td:nth-child(1),
  html[op="jobs"] #hnmain tbody > .athing > td:nth-child(1),
  html[op="show"] #hnmain tbody > .athing > td:nth-child(1) {
    vertical-align: middle;
    width: 40px;
  }
  html[op="news"] #hnmain tbody > .athing > td:nth-child(1) > .rank,
  html[op="newest"] #hnmain tbody > .athing > td:nth-child(1) > .rank,
  html[op="front"] #hnmain tbody > .athing > td:nth-child(1) > .rank,
  html[op="ask"] #hnmain tbody > .athing > td:nth-child(1) > .rank,
  html[op="jobs"] #hnmain tbody > .athing > td:nth-child(1) > .rank,
  html[op="show"] #hnmain tbody > .athing > td:nth-child(1) > .rank {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    font-size: 14px;
    width: 55px;
    color: var(--color-sub);
  }
  html[op="news"] #hnmain tbody > .athing > td:nth-child(3) > a,
  html[op="newest"] #hnmain tbody > .athing > td:nth-child(3) > a,
  html[op="front"] #hnmain tbody > .athing > td:nth-child(3) > a,
  html[op="ask"] #hnmain tbody > .athing > td:nth-child(3) > a,
  html[op="jobs"] #hnmain tbody > .athing > td:nth-child(3) > a,
  html[op="show"] #hnmain tbody > .athing > td:nth-child(3) > a {
    color: var(--color-primary) !important;
  }
  html[op="news"] #hnmain tbody > .athing > .title,
  html[op="newest"] #hnmain tbody > .athing > .title,
  html[op="front"] #hnmain tbody > .athing > .title,
  html[op="ask"] #hnmain tbody > .athing > .title,
  html[op="jobs"] #hnmain tbody > .athing > .title,
  html[op="show"] #hnmain tbody > .athing > .title {
    letter-spacing: 0.25px;
  }
  html[op="news"] #hnmain tbody > .athing > .title > .sitebit,
  html[op="newest"] #hnmain tbody > .athing > .title > .sitebit,
  html[op="front"] #hnmain tbody > .athing > .title > .sitebit,
  html[op="ask"] #hnmain tbody > .athing > .title > .sitebit,
  html[op="jobs"] #hnmain tbody > .athing > .title > .sitebit,
  html[op="show"] #hnmain tbody > .athing > .title > .sitebit {
    padding: 0 0 0 10px !important;
  }
  html[op="news"] #hnmain tbody > .athing > .title > .sitebit,
  html[op="newest"] #hnmain tbody > .athing > .title > .sitebit,
  html[op="front"] #hnmain tbody > .athing > .title > .sitebit,
  html[op="ask"] #hnmain tbody > .athing > .title > .sitebit,
  html[op="jobs"] #hnmain tbody > .athing > .title > .sitebit,
  html[op="show"] #hnmain tbody > .athing > .title > .sitebit,
  html[op="news"] #hnmain tbody > .athing > .title > .sitebit > a,
  html[op="newest"] #hnmain tbody > .athing > .title > .sitebit > a,
  html[op="front"] #hnmain tbody > .athing > .title > .sitebit > a,
  html[op="ask"] #hnmain tbody > .athing > .title > .sitebit > a,
  html[op="jobs"] #hnmain tbody > .athing > .title > .sitebit > a,
  html[op="show"] #hnmain tbody > .athing > .title > .sitebit > a {
    color: var(--color-irrelevant);
    letter-spacing: 1px;
  }
  html[op="news"] #hnmain tbody > .athing > .votelinks,
  html[op="newest"] #hnmain tbody > .athing > .votelinks,
  html[op="front"] #hnmain tbody > .athing > .votelinks,
  html[op="ask"] #hnmain tbody > .athing > .votelinks,
  html[op="jobs"] #hnmain tbody > .athing > .votelinks,
  html[op="show"] #hnmain tbody > .athing > .votelinks {
    visibility: collapse;
    width: 0 !important;
    overflow: hidden !important;
  }
  html[op="news"] #hnmain tbody > .athing > .votelinks > *,
  html[op="newest"] #hnmain tbody > .athing > .votelinks > *,
  html[op="front"] #hnmain tbody > .athing > .votelinks > *,
  html[op="ask"] #hnmain tbody > .athing > .votelinks > *,
  html[op="jobs"] #hnmain tbody > .athing > .votelinks > *,
  html[op="show"] #hnmain tbody > .athing > .votelinks > * {
    display: none;
  }
  html[op="news"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext,
  html[op="newest"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext,
  html[op="front"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext,
  html[op="ask"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext,
  html[op="jobs"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext,
  html[op="show"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext {
    padding: 0 0 10px 0;
  }
  html[op="news"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext,
  html[op="newest"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext,
  html[op="front"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext,
  html[op="ask"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext,
  html[op="jobs"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext,
  html[op="show"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext,
  html[op="news"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext a,
  html[op="newest"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext a,
  html[op="front"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext a,
  html[op="ask"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext a,
  html[op="jobs"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext a,
  html[op="show"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext a {
    color: var(--color-sub);
    font-size: 14px;
  }
  html[op="news"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext .score,
  html[op="newest"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext .score,
  html[op="front"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext .score,
  html[op="ask"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext .score,
  html[op="jobs"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext .score,
  html[op="show"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext .score,
  html[op="news"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext a[href^="item?"],
  html[op="newest"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext a[href^="item?"],
  html[op="front"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext a[href^="item?"],
  html[op="ask"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext a[href^="item?"],
  html[op="jobs"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext a[href^="item?"],
  html[op="show"] #hnmain tbody > tr:not(.athing):not(.spacer) .subtext a[href^="item?"] {
    color: var(--color-sub);
  }
  html[op="news"] #hnmain tbody > tr.spacer,
  html[op="newest"] #hnmain tbody > tr.spacer,
  html[op="front"] #hnmain tbody > tr.spacer,
  html[op="ask"] #hnmain tbody > tr.spacer,
  html[op="jobs"] #hnmain tbody > tr.spacer,
  html[op="show"] #hnmain tbody > tr.spacer {
    height: 10px !important;
  }
  html[op="news"] #hnmain tbody > tr:nth-child(6n + 1),
  html[op="newest"] #hnmain tbody > tr:nth-child(6n + 1),
  html[op="front"] #hnmain tbody > tr:nth-child(6n + 1),
  html[op="ask"] #hnmain tbody > tr:nth-child(6n + 1),
  html[op="jobs"] #hnmain tbody > tr:nth-child(6n + 1),
  html[op="show"] #hnmain tbody > tr:nth-child(6n + 1),
  html[op="news"] #hnmain tbody > tr:nth-child(6n + 2),
  html[op="newest"] #hnmain tbody > tr:nth-child(6n + 2),
  html[op="front"] #hnmain tbody > tr:nth-child(6n + 2),
  html[op="ask"] #hnmain tbody > tr:nth-child(6n + 2),
  html[op="jobs"] #hnmain tbody > tr:nth-child(6n + 2),
  html[op="show"] #hnmain tbody > tr:nth-child(6n + 2),
  html[op="news"] #hnmain tbody > tr:nth-child(6n + 3),
  html[op="newest"] #hnmain tbody > tr:nth-child(6n + 3),
  html[op="front"] #hnmain tbody > tr:nth-child(6n + 3),
  html[op="ask"] #hnmain tbody > tr:nth-child(6n + 3),
  html[op="jobs"] #hnmain tbody > tr:nth-child(6n + 3),
  html[op="show"] #hnmain tbody > tr:nth-child(6n + 3) {
    background: none !important;
  }
  html[op="news"] #hnmain tbody > tr:nth-child(6n + 4),
  html[op="newest"] #hnmain tbody > tr:nth-child(6n + 4),
  html[op="front"] #hnmain tbody > tr:nth-child(6n + 4),
  html[op="ask"] #hnmain tbody > tr:nth-child(6n + 4),
  html[op="jobs"] #hnmain tbody > tr:nth-child(6n + 4),
  html[op="show"] #hnmain tbody > tr:nth-child(6n + 4),
  html[op="news"] #hnmain tbody > tr:nth-child(6n + 5),
  html[op="newest"] #hnmain tbody > tr:nth-child(6n + 5),
  html[op="front"] #hnmain tbody > tr:nth-child(6n + 5),
  html[op="ask"] #hnmain tbody > tr:nth-child(6n + 5),
  html[op="jobs"] #hnmain tbody > tr:nth-child(6n + 5),
  html[op="show"] #hnmain tbody > tr:nth-child(6n + 5),
  html[op="news"] #hnmain tbody > tr:nth-child(6n),
  html[op="newest"] #hnmain tbody > tr:nth-child(6n),
  html[op="front"] #hnmain tbody > tr:nth-child(6n),
  html[op="ask"] #hnmain tbody > tr:nth-child(6n),
  html[op="jobs"] #hnmain tbody > tr:nth-child(6n),
  html[op="show"] #hnmain tbody > tr:nth-child(6n) {
    background: none !important;
  }
  html[op="news"] #hnmain tbody > tr:last-child,
  html[op="newest"] #hnmain tbody > tr:last-child,
  html[op="front"] #hnmain tbody > tr:last-child,
  html[op="ask"] #hnmain tbody > tr:last-child,
  html[op="jobs"] #hnmain tbody > tr:last-child,
  html[op="show"] #hnmain tbody > tr:last-child {
    background: none !important;
  }
  html[op="news"] #hnmain tbody > tr:last-child .morelink,
  html[op="newest"] #hnmain tbody > tr:last-child .morelink,
  html[op="front"] #hnmain tbody > tr:last-child .morelink,
  html[op="ask"] #hnmain tbody > tr:last-child .morelink,
  html[op="jobs"] #hnmain tbody > tr:last-child .morelink,
  html[op="show"] #hnmain tbody > tr:last-child .morelink {
    background: var(--color-header);
    width: calc(100% - 41px);
    display: block;
    padding: 10px;
    box-sizing: border-box;
    border-radius: 40px;
    text-align: center;
    transition: background-color 0.2s;
    color: var(--color-primary);
  }
  html[op="news"] #hnmain tbody > tr:last-child .morelink:hover,
  html[op="newest"] #hnmain tbody > tr:last-child .morelink:hover,
  html[op="front"] #hnmain tbody > tr:last-child .morelink:hover,
  html[op="ask"] #hnmain tbody > tr:last-child .morelink:hover,
  html[op="jobs"] #hnmain tbody > tr:last-child .morelink:hover,
  html[op="show"] #hnmain tbody > tr:last-child .morelink:hover {
    background: var(--color-logo);
  }
  /* single item view: header */
  .fatitem {
    background: var(--color-bg1);
    border-bottom: 1px solid var(--color-header);
  }
  .fatitem,
  .fatitem td {
    font-family: var(--font-family);
  }
  .fatitem > tbody > tr:nth-child(2) .subtext,
  .fatitem > tbody > tr:nth-child(2) .subtext a {
    color: var(--color-sub);
    font-size: 13px !important;
  }
  .fatitem > tbody > tr:nth-child(4) td {
    color: var(--color-primary) !important;
    font-size: 16px;
  }
  .fatitem .title > .sitebit,
  .fatitem .title > .sitebit > a {
    color: var(--color-irrelevant);
    letter-spacing: 1px;
  }
  /* single item view: comments */
  .comtr,
  .comtr td,
  .comment,
  .comhead {
    font-family: var(--font-family);
  }
  .comment-tree {
    background: var(--color-bg2);
    width: 100%;
  }
  .comment {
    line-height: 1.5;
  }
  .fatitem + br,
  .fatitem + br + br,
  .comment-tree + br,
  .comment-tree + br + br {
    display: none;
  }
  .comtr,
  .comtr td,
  .comment,
  .comment-tree .comhead {
    font-size: 15px;
  }
  .comtr .comhead a {
    color: var(--color-sub);
  }
  .comtr .comhead .age {
    padding: 0 0 0 10px;
  }
  .comtr .reply {
    opacity: 0;
    pointer-events: none;
  }
  .comtr .reply u,
  .comtr .reply u a {
    text-decoration: none !important;
  }
  .comtr .reply u a {
    opacity: 0.5;
    background: #ddd;
    padding: 0 5px;
  }
  .comtr .cdd,
  .comtr .cce {
    color: var(--color-irrelevant);
  }
}