/* Shared design for Cocoon archives, articles, pages and widgets. */
body.hw-site {
  --hw-ink:#1d303f; --hw-muted:#637480; --hw-blue:#007e9e; --hw-line:#e3eaee;
  --cocoon-text-color:var(--hw-ink); --cocoon-thin-color:var(--hw-line);
  --cocoon-middle-thickness-color:#8dcedb; --cocoon-xx-thin-color:#f5fbfd;
  color:var(--hw-ink); background:#fff; font-family:'Meiryo','Yu Gothic',sans-serif;
}
.hw-site a { color:var(--hw-blue); }
.hw-site a:focus-visible, .hw-site button:focus-visible,
.hw-site input:focus-visible, .hw-site select:focus-visible, .hw-site textarea:focus-visible {
  outline:3px solid #008fac; outline-offset:4px;
}
.hw-site.hw-home a, .hw-site .hw-home a { color:inherit; }
.hw-site.hw-home a:hover, .hw-site .hw-home a:hover, .hw-site .hw-nav a[aria-current=page] { color:var(--hw-blue); }
.hw-site.hw-home .hw-section-head>a, .hw-site.hw-home .hw-guide a { color:var(--hw-blue); }
.hw-site .hw-home .hw-footer { color:var(--hw-muted); }

/* Keep the configured sidebar and widgets; align their canvas with the home page. */
.hw-site #content { margin-top:28px; }
.hw-site #content-in, .hw-site #footer-in,
.hw-site #content-top-in, .hw-site #content-bottom-in {
  width:100%; max-width:1200px; padding-left:32px; padding-right:32px; box-sizing:border-box;
}
.hw-site #content-in { gap:40px; align-items:flex-start; }
.hw-site #main {
  flex:1; min-width:0; width:auto; padding:0; margin:0; border:0; background:#fff; box-shadow:none;
}
.hw-site.single.no-sidebar #main, .hw-site.page.no-sidebar #main:not(:has(.hw-events)) { max-width:860px; margin-inline:auto; }
.hw-site #sidebar {
  width:290px; flex:0 0 290px; min-width:0; padding:0; margin:0; border:0; background:#fff; box-shadow:none;
}
.hw-site .breadcrumb { font-size:11px; color:var(--hw-muted); background:transparent; box-shadow:none; padding:8px 0; }
.hw-site .breadcrumb a { color:inherit; }
.hw-site #container>.breadcrumb { max-width:1136px; width:calc(100% - 64px); }
.hw-site .archive-title, .hw-site .article-header .entry-title, .hw-site .hw-events>h1 {
  margin:0 0 24px; padding:0; border:0; background:none; color:var(--hw-ink);
  font-size:26px; line-height:1.6; overflow-wrap:anywhere;
}
.hw-site .archive-title { font-size:22px; }

/* Same thumbnail proportions, typography and spacing as the home game library. */
.hw-site #list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px 20px; margin:24px 0 36px; }
.hw-site.no-sidebar #list { grid-template-columns:repeat(4,minmax(0,1fr)); }
.hw-site #list>.entry-card-wrap {
  display:block; width:100%; min-width:0; margin:0; padding:0; border:0;
  background:transparent; color:var(--hw-ink); box-shadow:none; border-radius:8px;
  text-decoration:none; transform:none;
}
.hw-site #list>.entry-card-wrap:hover { color:var(--hw-blue); background:transparent; box-shadow:none; transform:none; }
.hw-site #list .entry-card { display:flex; flex-direction:column; height:100%; padding:0; margin:0; }
.hw-site #list .entry-card::after { content:none; }
.hw-site #list .entry-card-thumb { float:none; width:100%; margin:0; }
.hw-site #list .entry-card-thumb img {
  display:block; width:100%; height:auto; aspect-ratio:460/215; object-fit:cover;
  border:1px solid var(--hw-line); border-radius:8px; box-sizing:border-box;
}
.hw-site #list .entry-card-content { display:flex; flex-direction:column; flex:1; height:auto; margin:0; padding:0; min-width:0; }
.hw-site #list .entry-card-title {
  display:block; margin:12px 0 6px; padding:0; border:0; background:none;
  font-size:15px; line-height:1.7; color:inherit; overflow-wrap:anywhere;
}
.hw-site #list .entry-card-snippet { font-size:12px; line-height:1.8; color:var(--hw-muted); margin:0 0 8px; }
.hw-site #list .entry-card-meta { position:static; margin-top:auto; padding-top:8px; text-align:left; color:var(--hw-muted); }
.hw-site #list .entry-card-info { justify-content:flex-start; gap:4px; font-size:12px; }
.hw-site #list .entry-card-info>* { font-size:11px; }
.hw-site #list>.widget, .hw-site #list>.ad-wrap { grid-column:1/-1; width:100%; }
.hw-site .cat-label, .hw-site .cat-link, .hw-site .tag-link, .hw-site .tagcloud a {
  color:#08748d; background:#e9f7fb; border:0; border-radius:4px; padding:3px 8px;
  font-size:11px; line-height:1.6; text-decoration:none; box-shadow:none;
}
.hw-site .cat-label { top:8px; left:8px; }
.hw-site .tag-link, .hw-site .tagcloud a { color:#7851a0; background:#f3edfa; }

/* Pagination and buttons follow the home page's filters. */
.hw-site .pagination { display:flex; flex-wrap:wrap; gap:8px; justify-content:center; margin:24px 0 36px; }
.hw-site .pagination .page-numbers, .hw-site .page-link .post-page-numbers {
  display:inline-flex; align-items:center; justify-content:center; min-width:42px; height:42px;
  width:auto; margin:0; padding:0 12px; border:1px solid var(--hw-line); border-radius:5px;
  color:var(--hw-muted); background:#fff; box-shadow:none; font-size:13px; text-decoration:none; transform:none;
}
.hw-site .pagination .current, .hw-site .page-link .current { background:#203746; border-color:#203746; color:#fff; }
.hw-site .pagination a:hover, .hw-site .page-link a:hover { background:#e9f7fb; border-color:#8dcedb; color:var(--hw-blue); }
.hw-site .pagination .dots { border-color:transparent; }
.hw-site .pagination-next { margin:28px 0 20px; }
.hw-site .pagination-next-link, .hw-site .comment-btn, .hw-site input[type=submit], .hw-site .wp-block-search__button {
  padding:12px 20px; border:1px solid #8dcedb; border-radius:6px; background:#f5fbfd;
  color:var(--hw-blue); box-shadow:none; font:inherit; font-size:14px; text-decoration:none;
}
.hw-site .pagination-next-link:hover, .hw-site .comment-btn:hover, .hw-site input[type=submit]:hover { background:#e9f7fb; }

/* Article decoration; retain block colours, table structure and gallery layout. */
.hw-site .article { font-size:16px; line-height:1.9; }
.hw-site .article h2:not(.has-background), .hw-site .article h3:not(.has-background),
.hw-site .article h4:not(.has-background), .hw-site .article h5:not(.has-background), .hw-site .article h6:not(.has-background) {
  background:transparent; border:0; box-shadow:none; border-radius:0; line-height:1.6;
}
.hw-site .article h2:not(.has-background) { border-left:5px solid #1fb6d0; padding:0 0 0 13px; font-size:22px; margin-top:36px; }
.hw-site .article h3:not(.has-background) { border-bottom:1px solid var(--hw-line); padding:0 0 10px; font-size:19px; }
.hw-site .article h4:not(.has-background), .hw-site .article h5:not(.has-background), .hw-site .article h6:not(.has-background) { padding:0; font-size:17px; }
.hw-site .article .toc { border:1px solid #dcedf2; border-radius:10px; background:#f5fbfd; box-shadow:none; padding:20px 24px; max-width:100%; }
.hw-site .toc-title { color:var(--hw-ink); background:transparent; font-size:15px; font-weight:bold; }
.hw-site .toc a { color:var(--hw-ink); }
.hw-site .article table:not(.has-background) { background:#fff; }
.hw-site .article table:not(.has-background) th:not(.has-background) { background:#eff8fb; color:var(--hw-ink); }
.hw-site .article table th, .hw-site .article table td { border-color:var(--hw-line); padding:12px; }
.hw-site .article blockquote { border:0; border-left:4px solid #8dcedb; background:#f5fbfd; border-radius:0 8px 8px 0; color:var(--hw-muted); box-shadow:none; }
.hw-site .date-tags, .hw-site .post-date, .hw-site .post-update { color:var(--hw-muted); }
.hw-site .a-wrap { background:transparent; background-image:none; box-shadow:none; transform:none; }
.hw-site .a-wrap:hover { color:var(--hw-blue); background:#f5fbfd; box-shadow:none; transform:none; }
.hw-site .blogcard { border-color:var(--hw-line); border-radius:8px; }
.hw-site .pager-post-navi a { border:1px solid var(--hw-line); border-radius:8px; padding:16px; }
.hw-site .related-entry-card-wrap { border:1px solid var(--hw-line); border-radius:8px; padding:12px; color:var(--hw-ink); }
.hw-site .related-entry-card-thumb img, .hw-site .widget-entry-card-thumb img { border-radius:6px; }
.hw-site .related-entry-heading, .hw-site .comment-title, .hw-site .comment-reply-title,
.hw-site .sidebar h2, .hw-site .sidebar h3, .hw-site .footer h2, .hw-site .footer h3 {
  padding:0 0 0 12px; border:0; border-left:4px solid #1fb6d0; border-radius:0;
  background:transparent; color:var(--hw-ink); font-size:18px; line-height:1.6; box-shadow:none;
}
.hw-site .sidebar .widget { margin-bottom:32px; font-size:14px; }
.hw-site .sidebar a { color:var(--hw-ink); }
.hw-site .sidebar a:hover { color:var(--hw-blue); }
.hw-site .widget li a { border-color:var(--hw-line); box-shadow:none; }
.hw-site .widget-entry-card-title { font-size:13px; line-height:1.7; }
.hw-site .search-edit, .hw-site .wp-block-search__input,
.hw-site .comment-form input:not([type=submit]):not([type=checkbox]), .hw-site .comment-form textarea,
.hw-site .widget select, .hw-site .wpcf7-form-control:not(.wpcf7-submit):not(.wpcf7-acceptance) {
  max-width:100%; border:1px solid var(--hw-line); border-radius:6px; background:#f8fafb;
  color:var(--hw-ink); font:inherit; font-size:14px; box-shadow:none;
}
.hw-site .search-submit { color:var(--hw-blue); }
.hw-site #footer { margin-top:40px; padding:28px 0; border-top:1px solid var(--hw-line); background:#fff; color:var(--hw-muted); font-size:12px; }
.hw-site #footer a { color:inherit; }
.hw-site .footer-bottom { margin-top:0; }
.hw-site .footer-bottom-logo .site-name-text { font-size:20px; color:var(--hw-ink); }
.hw-site .mobile-footer-menu-buttons { background:#fff; color:var(--hw-blue); border-top:1px solid var(--hw-line); box-shadow:none; }
.hw-site .go-to-top-button { background:#fff; border:1px solid #8dcedb; color:var(--hw-blue); border-radius:8px; box-shadow:none; }

/* Existing event template uses the same cards and status colour family. */
.hw-site .hw-events { max-width:none; padding:0; }
.hw-site .hw-event-grid { grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr)); gap:20px; margin-top:24px; }
.hw-site .hw-event-card { padding:16px; border:1px solid var(--hw-line); border-radius:10px; background:#fff; }
.hw-site .hw-event-card h2 { background:none; border:0; padding:0; color:var(--hw-ink); font-size:15px; line-height:1.7; }
.hw-site .hw-event-card p { color:var(--hw-muted); font-size:12px; }
.hw-site .hw-event-label { background:#e9f7fb; color:#08748d; border-radius:4px; padding:2px 8px; font-size:11px; }

@media (max-width:1000px) {
  .hw-site #content-in { gap:28px; }
  .hw-site #sidebar { width:240px; flex-basis:240px; }
  .hw-site.no-sidebar #list { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:834px) {
  .hw-site #content-in { flex-direction:column; }
  .hw-site #main, .hw-site #sidebar { width:100%; flex:auto; }
}
@media (max-width:700px) {
  .hw-site #content { margin-top:22px; }
  .hw-site #content-in, .hw-site #footer-in, .hw-site #content-top-in, .hw-site #content-bottom-in { padding-left:18px; padding-right:18px; }
  .hw-site #container>.breadcrumb { width:calc(100% - 36px); }
  .hw-site #list, .hw-site.no-sidebar #list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px 14px; }
  .hw-site #list .entry-card-title { font-size:13px; margin-top:9px; }
  .hw-site #list .entry-card-info { font-size:11px; }
  .hw-site .archive-title, .hw-site .article-header .entry-title, .hw-site .hw-events>h1 { font-size:21px; }
  .hw-site .article { font-size:15px; }
  .hw-site .article h2:not(.has-background) { font-size:19px; }
  .hw-site .article h3:not(.has-background) { font-size:17px; }
  .hw-site .article .toc { padding:16px; }
  .hw-site .article table th, .hw-site .article table td { padding:8px; }
  .hw-site .pagination { gap:6px; }
  .hw-site .pagination .page-numbers { min-width:36px; height:38px; padding:0 9px; }
}