/* Personal pixel desktop theme — shared by the public site and editor. */
:root {
  --retro-navy: #000080;
  --retro-blue: #0b3d9e;
  --retro-face: #c0c0c0;
  --retro-light: #ffffff;
  --retro-mid: #808080;
  --retro-dark: #202020;
  --retro-ink: #111111;
  --retro-paper: #efeee7;
  --retro-link: #0000a9;
  --retro-font: Tahoma, "Microsoft YaHei", "Segoe UI", sans-serif;
}

body.retro-home,
body.retro-archive,
body.retro-post,
body.retro-admin {
  min-height: 100dvh;
  color: var(--retro-ink);
  font-family: var(--retro-font);
  background-color: #2768bc;
  background-image: linear-gradient(rgba(16, 65, 145, .08), rgba(16, 65, 145, .08)), url("./pixel-desktop-wallpaper.png");
  background-position: center center;
  background-size: cover;
  background-attachment: fixed;
}

.retro-home *,
.retro-archive *,
.retro-post *,
.retro-admin * { border-radius: 0 !important; }

.retro-home a,
.retro-archive a,
.retro-post a,
.retro-admin a { color: var(--retro-link); }

.retro-home .topbar,
.retro-archive .topbar,
.retro-post .topbar,
.retro-admin .topbar {
  min-height: 34px;
  color: var(--retro-ink);
  border-top: 2px solid var(--retro-light);
  border-left: 2px solid var(--retro-light);
  border-right: 2px solid var(--retro-dark);
  border-bottom: 2px solid var(--retro-dark);
  background: var(--retro-face);
  box-shadow: inset 1px 1px #dfdfdf, inset -1px -1px #555;
}

.retro-home .topbar { position: fixed; z-index: 30; inset: 0 0 auto; }
.retro-archive .topbar,
.retro-post .topbar,
.retro-admin .topbar { position: sticky; z-index: 30; top: 0; }

.retro-home .topbar-brand,
.retro-home .topbar .brand,
.retro-archive .brand,
.retro-post .brand,
.retro-admin .brand {
  color: var(--retro-ink) !important;
  font-weight: 800;
  letter-spacing: 0;
}

.retro-home .topbar-brand-mark,
.retro-archive .brand-mark,
.retro-admin .brand-mark {
  color: #fff;
  border: 1px solid #111;
  background: var(--retro-navy);
}

.retro-home .menu-list a,
.retro-home .topbar-meta,
.retro-archive .topbar-actions a,
.retro-post .back,
.retro-admin .home-link {
  color: var(--retro-ink) !important;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
}

.retro-home .menu-list a:hover,
.retro-archive .topbar-actions a:hover,
.retro-post .back:hover,
.retro-admin .home-link:hover { color: #fff !important; background: var(--retro-navy); }

.retro-home .desktop-icons {
  position: fixed;
  z-index: 10;
  top: 57px;
  left: 13px;
  display: grid;
  gap: 11px;
  width: 93px;
}

.retro-home .desktop-icon {
  gap: 4px;
  color: #fff !important;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.18;
  text-align: center;
  text-decoration: none;
  text-shadow: 1px 1px #12396c;
}

.retro-home .desktop-icon:hover { outline: 1px dotted #fff; background: rgba(0, 0, 128, .48); }

.retro-home .icon-tile {
  width: 42px;
  height: 37px;
  color: #fff;
  border: 2px outset #e4e4e4;
  background: linear-gradient(135deg, #0870c7 0 52%, #00275f 53%);
  box-shadow: 2px 2px 0 rgba(0, 0, 0, .35);
  font-family: "Courier New", monospace;
  font-size: 22px;
  line-height: 33px;
}

.retro-home .icon-daily { background: linear-gradient(135deg, #f4d869 0 45%, #d48725 46%); }
.retro-home .icon-projects { background: linear-gradient(135deg, #1a1d22 0 46%, #00a164 47%); }
.retro-home .icon-photos { background: linear-gradient(135deg, #63b7e2 0 50%, #57a657 51%); }
.retro-home .icon-notes { background: linear-gradient(135deg, #eeeef1 0 51%, #9daed0 52%); color: #153b72; }
.retro-home .icon-contact { background: linear-gradient(135deg, #f8ed99 0 47%, #b6771a 48%); color: #5b3700; }

.retro-home .workspace {
  display: grid;
  grid-template-areas: "journal journal about" "lower lower about";
  grid-template-columns: minmax(0, 1.16fr) minmax(0, .96fr) minmax(265px, .72fr);
  gap: 17px;
  width: min(1260px, calc(100% - 150px));
  margin: 57px auto 65px;
}

.retro-home .journal-window { grid-area: journal; }
.retro-home .about-window { grid-area: about; align-self: start; }
.retro-home .lower-windows { grid-area: lower; display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(240px, .72fr); gap: 17px; }

.retro-home .window,
.retro-archive .window,
.retro-post .window,
.retro-admin .window {
  overflow: hidden;
  border: 2px solid var(--retro-dark) !important;
  outline: 2px solid var(--retro-light);
  background: var(--retro-face) !important;
  box-shadow: 4px 4px 0 rgba(0, 0, 0, .42), inset 1px 1px #fff, inset -1px -1px #777 !important;
}

.retro-home .window-bar,
.retro-archive .window-bar,
.retro-post .window-bar,
.retro-admin .window-bar {
  display: flex;
  align-items: center;
  min-height: 27px;
  padding: 3px 5px;
  color: #fff !important;
  border: 0 !important;
  background: linear-gradient(90deg, var(--retro-navy), #1d43a2) !important;
  font-family: var(--retro-font);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .02em;
}

.retro-home .traffic-lights,
.retro-archive .light,
.retro-post .dot,
.retro-admin .dot { display: none !important; }

.retro-home .window-bar::before,
.retro-archive .window-bar::before,
.retro-post .window-bar::before,
.retro-admin .window-bar::before {
  display: grid;
  width: 15px;
  height: 15px;
  margin-right: 6px;
  color: #dff3ff;
  border: 1px solid #dff3ff;
  background: #0e6cc6;
  box-shadow: inset 1px 1px #6fcbff, inset -1px -1px #00357c;
  content: "▣";
  place-items: center;
  font-size: 10px;
}

.retro-home .window-name,
.retro-home .window-title,
.retro-post .bar-title,
.retro-admin .window-title { color: #fff !important; }

.retro-home .window-tools { margin-left: auto; color: transparent !important; }
.retro-home .window-tools::after { color: #111; content: "— □ ×"; letter-spacing: 3px; text-shadow: 1px 1px #fff; }

.retro-home .search-box {
  min-height: 21px;
  margin-left: auto;
  padding: 3px 7px;
  color: #626262;
  border: 2px inset #eee;
  background: #fff;
  font-size: 12px;
}

.retro-home .journal-content,
.retro-home .about-content,
.retro-home .project-body,
.retro-home .note-body { background: var(--retro-paper); }

.retro-home .journal-sidebar {
  padding: 8px;
  border-right: 2px groove #ddd;
  background: var(--retro-face);
}

.retro-home .filter-button {
  min-height: 30px;
  padding: 6px 7px;
  color: #111 !important;
  border-bottom: 1px solid transparent;
  font-size: 13px;
  font-weight: 700;
}

.retro-home .filter-button:hover,
.retro-home .filter-button.is-active { color: #fff !important; border: 2px inset #eee; background: var(--retro-navy) !important; }

.retro-home .journal-list { padding: 9px 13px; }
.retro-home .list-heading { padding: 0 0 5px; border-bottom: 1px solid #9d9d9d; }
.retro-home .entry { min-height: 66px; padding: 8px 3px; border-bottom: 1px solid #c0c0c0; }
.retro-home .entry:hover { color: #fff; background: #000080; }
.retro-home .entry:hover h3,
.retro-home .entry:hover p,
.retro-home .entry:hover .entry-date { color: #fff !important; }
.retro-home .entry-cover { border: 2px outset #fff; }
.retro-home .entry h3 { color: #111; font-size: 15px; }
.retro-home .entry p { color: #4a4a4a; font-size: 12px; }
.retro-home .entry-type { border: 1px solid #888; border-radius: 0; font-size: 11px; }
.retro-home .list-footer { color: #555; }
.retro-home .pager span { color: #111; border: 2px outset #e2e2e2; background: var(--retro-face); }
.retro-home .pager .is-current { color: #fff; border-style: inset; background: var(--retro-navy); }

.retro-home .about-content { display: block; padding: 12px; }
.retro-home .model-card { float: left; width: min(42%, 150px); min-height: 210px; margin: 0 12px 10px 0; border: 2px inset #eee; background: linear-gradient(135deg, #bce3f8, #e9f5ff); }
.retro-home #profile-model { min-height: 192px; }
.retro-home .model-status { color: #000080; font-size: 11px; font-weight: 800; }
.retro-home .about-copy { min-width: 0; padding: 2px 0; }
.retro-home .about-copy h2 { margin: 0 0 7px; color: #000080; font-size: clamp(22px, 2vw, 31px); }
.retro-home .identity-tag { padding: 2px 5px; color: #222; border: 1px solid #888; background: #eee; font-size: 11px; }
.retro-home .about-copy p { color: #222; font-size: 13px; line-height: 1.65; }
.retro-home .about-contact { clear: both; margin: 7px 0 0; padding-top: 8px; border-top: 1px solid #aaa; color: #333; font-size: 12px; }
.retro-home .stat-row { clear: both; display: grid; grid-template-columns: repeat(2, 1fr); gap: 5px; padding: 8px; border-top: 2px groove #eee; background: var(--retro-face); }
.retro-home .stat { padding: 6px; border: 2px inset #eee; background: #e8e8e8 !important; }
.retro-home .stat span { color: #333; font-size: 11px; }
.retro-home .stat strong { color: var(--retro-navy); font-size: 20px; }

.retro-home .software-preview { border: 2px inset #e5e5e5; background: #02295f; }
.retro-home .software-preview::before { background: linear-gradient(135deg, rgba(0, 90, 159, .2), rgba(0, 0, 0, .33)); }
.retro-home .project-meta span { color: #fff; border: 1px solid #507092; background: #153c60; }
.retro-home .project-link { color: #fff !important; border: 2px outset #e2e2e2; background: #0b3d9e; }
.retro-home .note-window { background: #fff2a8 !important; }
.retro-home .note-body { min-height: 100%; background: #fff2a8; }
.retro-home .note-list { color: #553d14; font-family: "Microsoft YaHei", sans-serif; }
.retro-home .note-list li { border-bottom-color: rgba(116, 83, 19, .23); }

.retro-home .dock {
  position: fixed;
  z-index: 40;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  justify-content: flex-start;
  gap: 5px;
  min-height: 41px;
  padding: 4px 7px 4px 89px;
  border: 2px outset #eee;
  background: var(--retro-face);
}

.retro-home .dock::before { align-self: stretch; padding: 6px 10px; color: #111; border: 2px outset #eee; background: #d7d7d7; content: "▣  开始"; font-size: 13px; font-weight: 800; }
.retro-home .dock a { width: 34px; height: 30px; color: #111; border: 2px outset #eee; background: #d7d7d7; font-family: "Courier New", monospace; line-height: 26px; text-align: center; text-decoration: none; }
.retro-home .dock a:hover { border-style: inset; color: #fff; background: var(--retro-navy); }

/* Archive, post and publishing editor use the same window language. */
.retro-archive main,
.retro-post main,
.retro-admin main { width: min(1120px, calc(100% - 42px)); margin: 32px auto 56px; }

.retro-archive .eyebrow,
.retro-admin .eyebrow { color: #fff; font-family: "Courier New", monospace; font-size: 12px; font-weight: 800; text-shadow: 1px 1px #00306d; }
.retro-archive h1,
.retro-post h1,
.retro-admin h1 { color: #000080; text-shadow: 1px 1px #fff; }
.retro-archive .lead,
.retro-admin .lead { color: #fff; text-shadow: 1px 1px #00306d; }

.retro-archive .category-nav { gap: 6px; }
.retro-archive .category-nav a,
.retro-archive .compose-link,
.retro-archive .back-link,
.retro-admin button,
.retro-admin .add-images,
.retro-admin .publish,
.retro-post .project-link {
  color: #111 !important;
  border: 2px outset #eee !important;
  background: var(--retro-face) !important;
  box-shadow: none !important;
  font-weight: 800;
}

.retro-archive .category-nav a:hover,
.retro-archive .category-nav a.is-active,
.retro-archive .compose-link:hover,
.retro-admin button:hover,
.retro-admin .add-images:hover,
.retro-admin .publish:hover,
.retro-post .project-link:hover { color: #fff !important; border-style: inset !important; background: var(--retro-navy) !important; }

.retro-archive .content { padding: 10px; background: var(--retro-paper); }
.retro-archive .content-card { min-height: 92px; padding: 8px; border-bottom: 1px solid #aaa; }
.retro-archive .content-card:hover { color: #fff !important; background: var(--retro-navy); }
.retro-archive .content-card:hover h2,
.retro-archive .content-card:hover p,
.retro-archive .content-card:hover .arrow { color: #fff !important; }
.retro-archive .cover { border: 2px outset #eee; }
.retro-archive .empty { border: 2px inset #eee; background: #fff; }

.retro-post .window { background: var(--retro-paper) !important; }
.retro-post article { color: #222; }
.retro-post .category { color: #fff; border: 1px solid #000064; background: var(--retro-navy); }
.retro-post .meta { color: #4d4d4d; }
.retro-post .cover img,
.retro-post .gallery img,
.retro-post .photo-card { border: 4px solid #fff !important; box-shadow: 3px 3px 0 rgba(0, 0, 0, .35) !important; }
.retro-post .photo-card:hover { box-shadow: 6px 7px 0 rgba(0, 0, 0, .4) !important; }
.retro-post .body { color: #222; }
.retro-post .lightbox { background: rgba(0, 0, 50, .9); }
.retro-post .lightbox-control { color: #111; border: 2px outset #eee; background: var(--retro-face); }

.retro-admin .desktop { gap: 18px; }
.retro-admin .window { background: var(--retro-paper) !important; }
.retro-admin form,
.retro-admin .side-content,
.retro-admin .manager-content { background: var(--retro-paper); }
.retro-admin label { color: #111; font-weight: 800; }
.retro-admin input,
.retro-admin textarea,
.retro-admin select { color: #111; border: 2px inset #eee !important; background: #fff !important; box-shadow: none !important; }
.retro-admin .upload-box,
.retro-admin .identity,
.retro-admin .access-note,
.retro-admin .published-item { border: 2px inset #eee !important; background: #fff !important; box-shadow: none !important; }
.retro-admin .identity-mark { color: #fff; border: 2px outset #eee; background: var(--retro-navy); }
.retro-admin .preview-list img { border: 2px outset #eee; }
.retro-admin .preview-remove { color: #fff !important; border: 2px outset #eee !important; background: #800000 !important; }
.retro-admin .delete-post { color: #fff !important; border: 2px outset #eee !important; background: #800000 !important; }

@media (max-width: 980px) {
  body.retro-home { padding-top: 35px; }
  .retro-home .desktop-icons { position: static; display: flex; flex-wrap: wrap; justify-content: center; width: auto; padding: 12px 13px 4px; }
  .retro-home .desktop-icon { width: 78px; }
  .retro-home .workspace { grid-template-areas: "journal" "about" "lower"; grid-template-columns: 1fr; width: min(800px, calc(100% - 26px)); margin-top: 16px; }
  .retro-home .about-window { max-width: none; }
  .retro-home .lower-windows { grid-template-columns: 1fr; }
  .retro-home .dock { padding-left: 6px; }
  .retro-home .dock::before { display: none; }
}

@media (max-width: 640px) {
  .retro-home .topbar nav,
  .retro-home .topbar-meta { display: none; }
  .retro-home .window-bar { min-height: 26px; }
  .retro-home .journal-content { grid-template-columns: 1fr; }
  .retro-home .journal-sidebar { display: flex; flex-wrap: wrap; gap: 4px; border-right: 0; border-bottom: 2px groove #eee; }
  .retro-home .filter-button { flex: 1 1 42%; }
  .retro-home .model-card { width: 124px; min-height: 175px; }
  .retro-home #profile-model { min-height: 159px; }
  .retro-home .workspace,
  .retro-archive main,
  .retro-post main,
  .retro-admin main { width: min(100% - 18px, 720px); }
  .retro-archive main,
  .retro-post main,
  .retro-admin main { margin-top: 18px; }
  .retro-archive .topbar-actions .compose-link { display: none; }
  .retro-post .photo-stage { column-count: 2; }
}