.blog-admin {
  min-height: 100svh;
  color: #e9f1eb;
  background: #070a08;
}

.blog-admin[hidden],
.blog-admin-login[hidden],
.blog-admin-shell[hidden],
.blog-admin-view[hidden],
.blog-admin-editor[hidden],
.blog-admin-empty[hidden] {
  display: none !important;
}

.blog-admin button,
.blog-admin input,
.blog-admin textarea,
.blog-admin select {
  font: inherit;
  letter-spacing: 0;
}

.blog-admin-login {
  position: relative;
  min-height: 100svh;
  display: grid;
  place-items: center;
  overflow: hidden;
  padding: 72px 24px;
  background:
    linear-gradient(rgba(83, 242, 169, 0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(83, 242, 169, 0.05) 1px, transparent 1px),
    #070a08;
  background-size: 32px 32px;
}

.blog-admin-back {
  position: absolute;
  top: 24px;
  left: 28px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #91a098;
  font: 650 10px/1 "Cascadia Code", Consolas, monospace;
  text-decoration: none;
}

.blog-admin-back:hover { color: #53f2a9; }
.blog-admin-back svg { width: 15px; height: 15px; }

.blog-login-panel {
  position: relative;
  z-index: 2;
  width: min(100%, 430px);
  padding: 38px;
  border: 1px solid #344039;
  background: rgba(9, 13, 10, 0.96);
  box-shadow: 12px 12px 0 rgba(83, 242, 169, 0.09);
}

.blog-login-mark {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 52px;
  color: #627068;
  font: 650 8px/1 "Cascadia Code", Consolas, monospace;
}

.blog-login-mark img { width: 44px; height: 44px; }
.blog-admin-eyebrow { color: #53f2a9; font: 700 9px/1 "Cascadia Code", Consolas, monospace; }
.blog-login-panel h1 { margin: 15px 0 12px; font-size: 34px; font-weight: 580; }
.blog-login-panel > p { margin: 0 0 32px; color: #839087; font-size: 13px; line-height: 1.7; }

.blog-login-panel label {
  display: grid;
  gap: 8px;
  margin-top: 18px;
  color: #a9b4ac;
  font: 650 9px/1 "Cascadia Code", Consolas, monospace;
}

.blog-login-panel input,
.blog-admin-field input,
.blog-admin-field textarea,
.blog-admin-field select,
.blog-admin-search input {
  width: 100%;
  border: 1px solid #344039;
  border-radius: 0;
  color: #e9f1eb;
  background: #0b100d;
  outline: 0;
}

.blog-login-panel input { height: 48px; padding: 0 13px; }
.blog-login-panel input:focus,
.blog-admin-field input:focus,
.blog-admin-field textarea:focus,
.blog-admin-field select:focus { border-color: #53f2a9; }

.blog-login-error { margin: 14px 0 0 !important; color: #ff8368 !important; font-size: 12px !important; }
.blog-login-panel .blog-admin-primary { width: 100%; height: 48px; margin-top: 26px; }

.blog-login-wordmark {
  position: absolute;
  bottom: -0.08em;
  left: 50%;
  max-width: 100%;
  color: rgba(83, 242, 169, 0.055);
  font: 900 min(17vw, 240px)/0.75 "Arial Black", Arial, sans-serif;
  white-space: nowrap;
  transform: translateX(-50%);
}

.blog-admin-shell { min-height: 100svh; }

.blog-admin-header {
  position: sticky;
  top: 0;
  z-index: 30;
  height: 68px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px;
  border-bottom: 1px solid #29342e;
  background: rgba(7, 10, 8, 0.95);
  backdrop-filter: blur(14px);
}

.blog-admin-brand { display: flex; align-items: center; gap: 11px; color: #edf4ef; text-decoration: none; }
.blog-admin-brand img { width: 38px; height: 38px; }
.blog-admin-brand span { display: grid; gap: 4px; }
.blog-admin-brand strong { font-size: 13px; font-weight: 680; }
.blog-admin-brand small { color: #647169; font: 650 7px/1 "Cascadia Code", Consolas, monospace; }
.blog-admin-header-actions { display: flex; align-items: center; gap: 8px; }
.blog-admin-saved { display: inline-flex; align-items: center; gap: 7px; margin-right: 8px; color: #839087; font: 600 9px/1 "Cascadia Code", Consolas, monospace; }
.blog-admin-saved i { width: 7px; height: 7px; background: #53f2a9; }
.blog-admin-saved.is-busy i { background: #ffbd59; }

.blog-admin-icon,
.blog-admin-primary,
.blog-admin-danger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: 0;
  cursor: pointer;
}

.blog-admin-icon { width: 38px; height: 38px; padding: 0; border: 1px solid #344039; color: #9eaaa2; background: transparent; }
.blog-admin-icon:hover { border-color: #53f2a9; color: #53f2a9; }
.blog-admin-icon svg { width: 15px; height: 15px; }
.blog-admin-primary { min-height: 40px; padding: 0 14px; border: 1px solid #53f2a9; color: #07100b; background: #53f2a9; font: 700 9px/1 "Cascadia Code", Consolas, monospace; }
.blog-admin-primary:hover { background: #ff6b4a; border-color: #ff6b4a; }
.blog-admin-primary svg, .blog-admin-danger svg { width: 15px; height: 15px; }
.blog-admin-primary:disabled { opacity: 0.55; cursor: wait; }
.blog-admin-danger { width: 40px; height: 40px; padding: 0; border: 1px solid #51352f; color: #ff8067; background: transparent; }
.blog-admin-danger:hover { color: #07100b; background: #ff8067; }

.blog-admin-layout { min-height: calc(100svh - 68px); display: grid; grid-template-columns: 220px minmax(0, 1fr); }
.blog-admin-nav { position: sticky; top: 68px; height: calc(100svh - 68px); display: flex; flex-direction: column; padding: 22px 14px; border-right: 1px solid #29342e; background: #080c09; }
.blog-admin-user { display: flex; align-items: center; gap: 11px; padding: 0 8px 22px; border-bottom: 1px solid #29342e; }
.blog-admin-user > span { width: 38px; height: 38px; display: grid; place-items: center; color: #07100b; background: #53f2a9; font: 800 16px/1 "Cascadia Code", Consolas, monospace; }
.blog-admin-user div { display: grid; gap: 5px; }
.blog-admin-user strong { font-size: 12px; }
.blog-admin-user small { color: #657169; font: 650 7px/1 "Cascadia Code", Consolas, monospace; }
.blog-admin-nav nav { display: grid; gap: 4px; margin-top: 20px; }
.blog-admin-nav nav button { height: 42px; display: grid; grid-template-columns: 20px minmax(0, 1fr) auto; align-items: center; gap: 9px; padding: 0 10px; border: 0; color: #89958d; background: transparent; text-align: left; cursor: pointer; }
.blog-admin-nav nav button:hover, .blog-admin-nav nav button.is-active { color: #07100b; background: #53f2a9; }
.blog-admin-nav nav svg { width: 15px; height: 15px; }
.blog-admin-nav nav span { font-size: 12px; }
.blog-admin-nav nav small { font: 700 8px/1 "Cascadia Code", Consolas, monospace; }
.blog-admin-nav-note { margin-top: auto; padding: 14px 9px; border-top: 1px solid #29342e; }
.blog-admin-nav-note span { color: #53f2a9; font: 700 8px/1 "Cascadia Code", Consolas, monospace; }
.blog-admin-nav-note p { margin: 10px 0 0; color: #5f6c64; font-size: 10px; line-height: 1.6; }

.blog-admin-main { min-width: 0; padding: 32px; }
.blog-admin-view { width: min(100%, 1500px); margin: 0 auto; }
.blog-admin-view-head { min-height: 76px; display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; margin-bottom: 28px; border-bottom: 1px solid #29342e; }
.blog-admin-view-head span, .blog-admin-recent header span { color: #53f2a9; font: 700 8px/1 "Cascadia Code", Consolas, monospace; }
.blog-admin-view-head h1 { margin: 10px 0 22px; font-size: 30px; font-weight: 570; }
.blog-admin-view-head time { color: #637068; font: 600 9px/1 "Cascadia Code", Consolas, monospace; }

.blog-admin-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid #344039; border-left: 1px solid #344039; }
.blog-admin-metrics button { position: relative; min-height: 178px; display: grid; align-content: space-between; justify-items: start; padding: 22px; border: 0; border-right: 1px solid #344039; border-bottom: 1px solid #344039; color: #e8f0ea; background: #0a0f0c; text-align: left; cursor: pointer; }
.blog-admin-metrics button:hover { color: #07100b; background: #53f2a9; }
.blog-admin-metrics span { color: #7c8981; font: 650 9px/1 "Cascadia Code", Consolas, monospace; }
.blog-admin-metrics strong { font: 750 42px/1 "Cascadia Code", Consolas, monospace; }
.blog-admin-metrics small { color: #78857d; font-size: 11px; }
.blog-admin-metrics svg { position: absolute; top: 20px; right: 20px; width: 18px; height: 18px; }
.blog-admin-metrics button:hover span, .blog-admin-metrics button:hover small { color: #294738; }

.blog-admin-recent { margin-top: 42px; }
.blog-admin-recent header { display: flex; align-items: end; justify-content: space-between; margin-bottom: 18px; }
.blog-admin-recent h2 { margin: 9px 0 0; font-size: 22px; font-weight: 560; }
.blog-admin-recent-row { min-height: 72px; display: grid; grid-template-columns: 42px minmax(0, 1fr) 100px 90px; align-items: center; gap: 16px; padding: 0 12px; border-top: 1px solid #29342e; }
.blog-admin-recent-row:last-child { border-bottom: 1px solid #29342e; }
.blog-admin-recent-row > span:first-child { color: #53f2a9; font: 700 9px/1 "Cascadia Code", Consolas, monospace; }
.blog-admin-recent-row strong { font-size: 14px; font-weight: 520; }
.blog-admin-recent-row small, .blog-admin-recent-row time { color: #657169; font: 600 8px/1.4 "Cascadia Code", Consolas, monospace; }

.blog-admin-content-layout { position: relative; min-height: calc(100svh - 205px); display: grid; grid-template-columns: 290px minmax(0, 1fr); border: 1px solid #29342e; background: #080c09; }
.blog-admin-content-list { min-width: 0; border-right: 1px solid #29342e; }
.blog-admin-search { height: 54px; display: flex; align-items: center; gap: 8px; padding: 0 12px; border-bottom: 1px solid #29342e; }
.blog-admin-search svg { width: 14px; height: 14px; color: #617067; }
.blog-admin-search input { height: 32px; padding: 0 8px; border: 0; background: transparent; font-size: 11px; }
.blog-admin-list-item { width: 100%; min-height: 80px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-content: center; gap: 7px 10px; padding: 13px 14px; border: 0; border-bottom: 1px solid #29342e; color: #dbe4de; background: transparent; text-align: left; cursor: pointer; }
.blog-admin-list-item:hover, .blog-admin-list-item.is-active { color: #07100b; background: #53f2a9; }
.blog-admin-list-item strong { overflow: hidden; font-size: 12px; font-weight: 560; text-overflow: ellipsis; white-space: nowrap; }
.blog-admin-list-item small, .blog-admin-list-item time { color: #68756d; font: 600 8px/1.3 "Cascadia Code", Consolas, monospace; }
.blog-admin-list-item:hover small, .blog-admin-list-item:hover time, .blog-admin-list-item.is-active small, .blog-admin-list-item.is-active time { color: #294738; }
.blog-admin-list-item .is-draft { color: #ff9c78; }

.blog-admin-editor { min-width: 0; }
.blog-admin-editor-head { min-height: 62px; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 10px 16px; border-bottom: 1px solid #29342e; }
.blog-admin-editor-head > div { min-width: 0; display: flex; align-items: center; gap: 10px; }
.blog-admin-editor-head > div:first-child { display: grid; gap: 5px; }
.blog-admin-editor-head span { color: #53f2a9; font: 650 7px/1 "Cascadia Code", Consolas, monospace; }
.blog-admin-editor-head strong { overflow: hidden; font-size: 12px; font-weight: 540; text-overflow: ellipsis; white-space: nowrap; }
.blog-admin-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; padding: 18px; border-bottom: 1px solid #29342e; }
.blog-admin-field { min-width: 0; display: grid; gap: 7px; color: #7f8c84; font: 650 8px/1 "Cascadia Code", Consolas, monospace; }
.blog-admin-field-wide { grid-column: 1 / -1; }
.blog-admin-field input, .blog-admin-field select { height: 38px; padding: 0 10px; font-size: 11px; }
.blog-admin-field textarea { min-height: 78px; padding: 10px; resize: vertical; font-size: 11px; line-height: 1.6; }
.blog-admin-cover-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; }
.blog-admin-cover-row button { height: 38px; display: inline-flex; align-items: center; gap: 6px; padding: 0 11px; border: 1px solid #344039; border-left: 0; color: #53f2a9; background: transparent; cursor: pointer; }
.blog-admin-cover-row svg { width: 14px; height: 14px; }

.blog-markdown-toolbar { min-height: 45px; display: flex; align-items: center; justify-content: space-between; padding: 0 14px; border-bottom: 1px solid #29342e; color: #617067; font: 650 8px/1 "Cascadia Code", Consolas, monospace; }
.blog-markdown-toolbar > div { display: flex; }
.blog-markdown-toolbar button { width: 34px; height: 30px; display: grid; place-items: center; padding: 0; border: 1px solid #29342e; border-left: 0; color: #9ba79f; background: transparent; cursor: pointer; }
.blog-markdown-toolbar button:first-child { border-left: 1px solid #29342e; }
.blog-markdown-toolbar button:hover { color: #07100b; background: #53f2a9; }
.blog-markdown-toolbar svg { width: 13px; height: 13px; }
.blog-markdown-toolbar label, .blog-project-options label { display: inline-flex; align-items: center; gap: 7px; color: #a3afa7; cursor: pointer; }
.blog-markdown-toolbar input, .blog-project-options input { accent-color: #53f2a9; }
.blog-markdown-editor { min-height: 470px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.blog-markdown-editor > textarea { width: 100%; min-height: 470px; padding: 20px; border: 0; border-right: 1px solid #29342e; color: #dce7df; background: #070a08; outline: 0; resize: vertical; font: 12px/1.75 "Cascadia Code", Consolas, monospace; }
.blog-markdown-preview { min-width: 0; padding: 20px 24px; overflow-wrap: anywhere; color: #b8c3bb; background: #0b100d; font-size: 13px; line-height: 1.8; }
.blog-markdown-preview > :first-child { margin-top: 0; }
.blog-markdown-preview h1, .blog-markdown-preview h2, .blog-markdown-preview h3 { color: #edf4ef; font-weight: 560; }
.blog-markdown-preview a { color: #53f2a9; }
.blog-markdown-preview code { padding: 2px 4px; color: #53f2a9; background: #111914; }
.blog-markdown-preview pre { overflow: auto; padding: 14px; background: #050806; }
.blog-project-options { display: flex; gap: 24px; padding: 18px; font: 650 9px/1 "Cascadia Code", Consolas, monospace; }

.blog-project-package { padding: 18px; border-bottom: 1px solid #29342e; background: #090d0a; }
.blog-project-package > header { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin-bottom: 13px; }
.blog-project-package > header > div { display: grid; gap: 5px; }
.blog-project-package > header span { color: #53f2a9; font: 650 7px/1 "Cascadia Code", Consolas, monospace; }
.blog-project-package > header strong { color: #d9e4dc; font-size: 12px; font-weight: 560; }
.blog-project-package > header small { color: #657269; font: 600 8px/1 "Cascadia Code", Consolas, monospace; }
.blog-package-actions { display: flex; gap: 8px; }
.blog-package-actions button { min-height: 38px; display: inline-flex; align-items: center; gap: 7px; padding: 0 12px; border: 1px solid #344039; color: #b9c6bd; background: #0d130f; cursor: pointer; }
.blog-package-actions button:hover:not(:disabled), .blog-package-actions button:focus-visible:not(:disabled) { border-color: #53f2a9; color: #07100b; background: #53f2a9; outline: 0; }
.blog-package-actions button:disabled { opacity: .38; cursor: not-allowed; }
.blog-package-actions svg { width: 14px; height: 14px; }
.blog-package-status { min-height: 58px; display: flex; align-items: center; gap: 12px; margin-top: 12px; padding: 11px 13px; border: 1px solid #29342e; color: #53f2a9; background: #070a08; }
.blog-package-status > svg { width: 20px; height: 20px; flex: 0 0 auto; }
.blog-package-status > div { min-width: 0; display: grid; gap: 6px; }
.blog-package-status strong { overflow: hidden; color: #cfdad2; font-size: 11px; font-weight: 560; text-overflow: ellipsis; white-space: nowrap; }
.blog-package-status span { color: #68766d; font: 600 8px/1.4 "Cascadia Code", Consolas, monospace; }
.blog-package-progress { display: grid; gap: 7px; margin-top: 12px; }
.blog-package-progress > span { height: 6px; overflow: hidden; background: #1a211c; }
.blog-package-progress > span i { width: 0; height: 100%; display: block; background: #53f2a9; transition: width 180ms ease; }
.blog-package-progress small { color: #839087; font: 600 8px/1 "Cascadia Code", Consolas, monospace; }
.blog-package-preview { min-height: 260px; display: grid; grid-template-columns: minmax(210px, .72fr) minmax(0, 1fr); margin-top: 14px; border: 1px solid #29342e; }
.blog-package-preview[hidden] { display: none; }
.blog-package-preview > div, .blog-package-preview > article { min-width: 0; max-height: 420px; overflow: auto; padding: 14px; }
.blog-package-preview > article { border-left: 1px solid #29342e; color: #aeb9b1; font-size: 11px; line-height: 1.7; }
.blog-package-preview h3 { display: flex; align-items: center; gap: 7px; margin: 0 0 12px; color: #d6e1d9; font-size: 10px; }
.blog-package-preview h3 svg { width: 14px; height: 14px; color: #53f2a9; }
.blog-package-tree { min-width: 0; color: #849187; font: 600 9px/1.4 "Cascadia Code", Consolas, monospace; }
.blog-package-tree-dir > summary, .blog-package-tree-file { min-height: 27px; display: grid; grid-template-columns: 16px minmax(0, 1fr) auto; align-items: center; gap: 6px; padding: 0 4px; list-style: none; }
.blog-package-tree-dir > summary { color: #b7c4ba; cursor: pointer; }
.blog-package-tree-dir > summary::-webkit-details-marker { display: none; }
.blog-package-tree-dir > summary svg, .blog-package-tree-file svg { width: 13px; height: 13px; color: #53f2a9; }
.blog-package-tree-dir > summary span, .blog-package-tree-file span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.blog-package-tree-dir small, .blog-package-tree-file small { color: #536158; font-size: 7px; }
.blog-package-tree-dir > div { padding-left: 16px; border-left: 1px solid #29342e; }
.blog-package-readme { overflow-wrap: anywhere; }
.blog-package-readme h1, .blog-package-readme h2, .blog-package-readme h3 { margin: 1em 0 .5em; color: #dce7df; }
.blog-package-readme h1 { font-size: 18px; } .blog-package-readme h2 { font-size: 15px; } .blog-package-readme h3 { font-size: 13px; }
.blog-package-readme img { max-width: 100%; } .blog-package-readme a { color: #53f2a9; }
.blog-package-readme pre { overflow: auto; padding: 12px; color: #dce7df; background: #050806; }

button.blog-admin-primary > span {
  color: inherit;
  font: inherit;
}

.blog-interaction-admin { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.blog-interaction-admin > section { min-width:0; border:1px solid #29342e; background:#0a0f0c; }
.blog-interaction-admin > section > header { padding:18px; border-bottom:1px solid #29342e; }
.blog-interaction-admin > section > header span { color:#53f2a9; font:700 7px/1 "Cascadia Code",Consolas,monospace; }
.blog-interaction-admin > section > header h2 { margin:7px 0 0; font-size:18px; font-weight:560; }
.blog-interaction-admin > section > div { max-height:68vh; overflow:auto; }
.blog-interaction-row { display:grid; grid-template-columns:minmax(0,1fr) 38px; gap:12px; padding:16px 18px; border-bottom:1px solid #29342e; }
.blog-interaction-row > div { min-width:0; display:grid; gap:6px; }
.blog-interaction-row span { color:#53f2a9; font:700 7px/1 "Cascadia Code",Consolas,monospace; }
.blog-interaction-row strong { color:#d9e4dc; font-size:12px; }
.blog-interaction-row small { overflow:hidden; color:#657269; font:600 8px/1.4 "Cascadia Code",Consolas,monospace; text-overflow:ellipsis; white-space:nowrap; }
.blog-interaction-row p { margin:4px 0 0; color:#aab6ae; font-size:11px; line-height:1.65; white-space:pre-wrap; overflow-wrap:anywhere; }
.blog-interaction-row button { width:36px; height:36px; display:grid; place-items:center; padding:0; border:1px solid #4b302c; color:#ff826c; background:transparent; cursor:pointer; }
.blog-interaction-row button:hover { color:#07100b; background:#ff6b4a; border-color:#ff6b4a; }
.blog-interaction-row svg { width:14px; height:14px; }

#blogTreeholeTitle,
#blogTreeholeContent,
.blog-interaction-row p {
  font-family: "LXGW WenKai Screen R", "Kaiti SC", KaiTi, STKaiti, "Microsoft YaHei", sans-serif;
}

#blogTreeholeTitle {
  font-size: 16px;
}

#blogTreeholeContent {
  min-height: 340px;
  color: #d7ddd8;
  background:
    repeating-linear-gradient(180deg, transparent 0 29px, rgba(83, 242, 169, .08) 29px 30px),
    #070a08;
  font-size: 17px;
  line-height: 30px;
}

.blog-admin-empty { position: absolute; inset: 0 0 0 290px; display: grid; place-content: center; justify-items: center; gap: 12px; color: #536158; text-align: center; pointer-events: none; }
.blog-admin-empty svg { width: 30px; height: 30px; }
.blog-admin-empty strong { color: #7d8981; font-size: 14px; font-weight: 540; }
.blog-admin-empty span { font-size: 11px; }

.blog-profile-form { display: grid; grid-template-columns: minmax(280px, 0.7fr) minmax(0, 1fr); gap: 32px; }
.blog-profile-preview { min-height: 440px; display: flex; flex-direction: column; justify-content: flex-start; padding: 28px; border: 1px solid #344039; background: #0b100d; }
.blog-profile-preview > span { margin-bottom: 22px; color: #53f2a9; font: 700 8px/1 "Cascadia Code", Consolas, monospace; }
.blog-profile-avatar-control { width: 136px; display: grid; margin-bottom: 24px; border: 1px solid #344039; background: #070a08; }
.blog-profile-avatar-control img { width: 134px; aspect-ratio: 1; display: block; object-fit: cover; }
.blog-profile-avatar-control button { min-height: 36px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 0 10px; border: 0; border-top: 1px solid #344039; color: #53f2a9; background: transparent; font: 700 8px/1 "Cascadia Code", Consolas, monospace; cursor: pointer; }
.blog-profile-avatar-control button:hover, .blog-profile-avatar-control button:focus-visible { color: #07100b; background: #53f2a9; outline: 0; }
.blog-profile-avatar-control button:disabled { opacity: .48; cursor: wait; }
.blog-profile-avatar-control svg { width: 14px; height: 14px; }
.blog-profile-preview strong { font-size: 30px; font-weight: 560; }
.blog-profile-preview small { margin-top: 8px; color: #53f2a9; font: 650 10px/1 "Cascadia Code", Consolas, monospace; }
.blog-profile-preview p { margin: 24px 0 0; color: #89958d; font-size: 12px; line-height: 1.7; }
.blog-profile-form > .blog-admin-fields { align-content: start; border: 1px solid #29342e; }

@media (max-width: 980px) {
  .blog-admin-layout { grid-template-columns: 74px minmax(0, 1fr); }
  .blog-admin-nav { padding-inline: 10px; }
  .blog-admin-user { justify-content: center; padding-inline: 0; }
  .blog-admin-user div, .blog-admin-nav nav span, .blog-admin-nav nav small, .blog-admin-nav-note { display: none; }
  .blog-admin-nav nav button { grid-template-columns: 1fr; justify-items: center; padding: 0; }
  .blog-admin-main { padding: 24px 18px; }
  .blog-admin-content-layout { grid-template-columns: 230px minmax(0, 1fr); }
  .blog-admin-empty { left: 230px; }
  .blog-markdown-editor { grid-template-columns: 1fr; }
  .blog-markdown-editor > textarea { border-right: 0; border-bottom: 1px solid #29342e; }
}

@media (max-width: 700px) {
  .blog-admin-header { height: 60px; padding: 0 10px; }
  .blog-admin-brand small, .blog-admin-saved { display: none; }
  .blog-admin-layout { min-height: calc(100svh - 60px); display: block; }
  .blog-admin-nav { position: sticky; top: 60px; z-index: 20; width: 100%; height: 54px; display: block; padding: 6px 8px; overflow-x: auto; border-right: 0; border-bottom: 1px solid #29342e; }
  .blog-admin-user { display: none; }
  .blog-admin-nav nav { min-width: 660px; grid-template-columns: repeat(6, 1fr); gap: 4px; margin: 0; }
  .blog-admin-nav nav button { height: 41px; grid-template-columns: 16px auto; gap: 5px; justify-content: center; }
  .blog-admin-nav nav span { display: block; font-size: 10px; }
  .blog-admin-main { padding: 20px 12px; }
  .blog-admin-view-head { align-items: center; }
  .blog-admin-view-head h1 { font-size: 24px; }
  .blog-admin-view-head time { display: none; }
  .blog-admin-metrics { grid-template-columns: 1fr; }
  .blog-admin-metrics button { min-height: 126px; }
  .blog-admin-content-layout { display: block; min-height: 0; border: 0; }
  .blog-admin-content-list { max-height: 320px; overflow: auto; border: 1px solid #29342e; }
  .blog-admin-editor { margin-top: 14px; border: 1px solid #29342e; }
  .blog-admin-empty { position: static; min-height: 220px; border: 1px solid #29342e; }
  .blog-admin-fields { grid-template-columns: 1fr; padding: 14px; }
  .blog-package-preview { grid-template-columns: 1fr; }
  .blog-package-preview > article { border-top: 1px solid #29342e; border-left: 0; }
  .blog-admin-field-wide { grid-column: auto; }
  .blog-markdown-toolbar > span { display: none; }
  .blog-markdown-editor { min-height: 0; }
  .blog-markdown-editor > textarea { min-height: 360px; }
  .blog-profile-form { grid-template-columns: 1fr; }
  .blog-interaction-admin { grid-template-columns:1fr; }
  .blog-login-panel { padding: 28px 22px; }
  .blog-login-wordmark { font-size: 20vw; }
  .blog-admin-recent-row { grid-template-columns: 32px minmax(0, 1fr) 70px; }
  .blog-admin-recent-row small { display: none; }
}