:root {
  --paper: #f6f3eb;
  --paper-deep: #ede8dd;
  --surface: #fffefa;
  --ink: #17231f;
  --muted: #68736d;
  --forest: #123d36;
  --forest-2: #1c584e;
  --mint: #dcece6;
  --teal: #287e70;
  --gold: #b8833e;
  --gold-soft: #f4e8d5;
  --clay: #a3523f;
  --danger: #9c3f35;
  --line: rgba(23, 35, 31, .12);
  --line-strong: rgba(23, 35, 31, .22);
  --shadow: 0 18px 50px rgba(18, 61, 54, .08), 0 3px 12px rgba(18, 61, 54, .04);
  --radius: 20px;
  --sans: Inter, "PingFang SC", "Microsoft YaHei", system-ui, -apple-system, sans-serif;
  --serif: "Songti SC", "STSong", "Noto Serif SC", Georgia, serif;
}

* { box-sizing: border-box; }
html { max-width: 100%; overflow-x: hidden; color: var(--ink); background: var(--paper); font-family: var(--sans); -webkit-text-size-adjust: 100%; }
body { margin: 0; min-height: 100vh; background: radial-gradient(circle at 82% 0%, rgba(184, 131, 62, .09), transparent 30%), linear-gradient(180deg, #faf8f2 0, var(--paper) 36%, #f1eee6 100%); }
button, input, select, textarea { font: inherit; }
button, select, input[type="checkbox"], input[type="radio"], input[type="file"] { cursor: pointer; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid rgba(40, 126, 112, .28); outline-offset: 2px; }
[hidden] { display: none !important; }

.checkin-header { width: min(1180px, calc(100% - 32px)); min-height: 82px; margin: auto; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--line); }
.checkin-brand { display: inline-flex; align-items: center; gap: 12px; color: var(--ink); text-decoration: none; }
.checkin-brand span:last-child { display: grid; gap: 2px; }
.checkin-brand strong { font-family: var(--serif); font-size: 17px; letter-spacing: .04em; }
.checkin-brand small { color: var(--muted); font-size: 9px; letter-spacing: .12em; text-transform: uppercase; }
.checkin-seal { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; color: #fff8e8; background: var(--forest); box-shadow: inset 0 0 0 1px rgba(255,255,255,.16); font-family: var(--serif); font-size: 21px; }
.quiet-button { min-height: 40px; border: 1px solid var(--line); border-radius: 10px; padding: 8px 14px; color: var(--muted); background: rgba(255,255,255,.58); font-weight: 700; }

.checkin-main { width: min(1080px, calc(100% - 32px)); margin: auto; padding: 46px 0 calc(110px + env(safe-area-inset-bottom)); }
.checkin-state { min-height: 420px; display: grid; place-items: center; align-content: center; text-align: center; }
.state-mark { width: 52px; height: 52px; display: grid; place-items: center; border: 1px solid var(--line-strong); border-radius: 50%; color: var(--teal); font-size: 28px; animation: breathe 1.8s infinite; }
.checkin-state h1 { margin: 22px 0 8px; font-family: var(--serif); font-size: 30px; }
.checkin-state p { margin: 0; color: var(--muted); font-size: 13px; }
@keyframes breathe { 50% { transform: scale(.9); opacity: .55; } }

.checkin-hero { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(250px, .55fr); gap: 26px; align-items: stretch; }
.hero-copy { padding: 24px 0; }
.checkin-kicker { margin: 0 0 10px; color: #85591f; font-size: 10px; font-weight: 900; letter-spacing: .18em; }
.checkin-hero h1, .admin-hero h1 { margin: 0; font-family: var(--serif); font-size: clamp(42px, 7vw, 68px); font-weight: 600; line-height: 1.08; letter-spacing: -.035em; }
.hero-copy > p:last-child { max-width: 650px; margin: 17px 0 0; color: var(--muted); font-size: 13px; line-height: 1.8; }
.streak-card { min-height: 235px; border-radius: var(--radius); padding: 27px; color: white; background: linear-gradient(145deg, #16483f, #0e302b); box-shadow: var(--shadow); display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; position: relative; }
.streak-card::after { content: ""; position: absolute; width: 150px; height: 150px; right: -50px; top: -50px; border: 1px solid rgba(255,255,255,.14); border-radius: 50%; box-shadow: 0 0 0 28px rgba(255,255,255,.025), 0 0 0 56px rgba(255,255,255,.018); }
.streak-card > span { color: #acd8cc; font-size: 11px; font-weight: 800; letter-spacing: .08em; }
.streak-card strong { font-family: var(--serif); font-size: 28px; font-weight: 500; }
.streak-card strong b { font-size: 72px; font-weight: 500; }
.streak-card p { margin: 0; color: rgba(255,255,255,.65); font-size: 11px; }
.streak-card > small { color: rgba(255,255,255,.52); font-size: 9px; line-height: 1.5; }

.checkin-tabs { margin-top: 34px; border-bottom: 1px solid var(--line); display: flex; gap: 28px; }
.checkin-tabs button { min-height: 52px; border: 0; border-bottom: 3px solid transparent; padding: 0 2px; color: var(--muted); background: transparent; font-size: 13px; font-weight: 800; }
.checkin-tabs button.active { color: var(--forest); border-bottom-color: var(--forest); }
.checkin-panel { display: none; }
.checkin-panel.active { display: block; }
.wechat-guide { margin-top: 16px; border: 1px solid var(--line); border-radius: 13px; padding: 12px 14px; color: var(--muted); background: rgba(255,255,255,.55); display: flex; align-items: center; gap: 11px; }
.wechat-guide > span { width: 31px; height: 31px; flex: none; border-radius: 10px; display: grid; place-items: center; color: white; background: var(--teal); font-family: var(--serif); font-size: 14px; }
.wechat-guide strong, .wechat-guide small { display: block; }
.wechat-guide strong { color: var(--ink); font-size: 10px; }
.wechat-guide small { margin-top: 3px; font-size: 9px; line-height: 1.5; }
.wechat-guide[data-wechat="false"] > span { color: #735227; background: var(--gold-soft); }
.profile-setup { margin-top: 16px; border: 1px solid rgba(184,131,62,.38); border-radius: var(--radius); padding: 23px; background: linear-gradient(145deg, #fffdf7, #f8efdf); box-shadow: var(--shadow); }
.profile-setup-head { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 14px; align-items: start; }
.profile-setup-head > span { width: 44px; height: 44px; border-radius: 13px; display: grid; place-items: center; color: #76501d; background: var(--gold-soft); font-family: var(--serif); font-size: 20px; }
.profile-setup-head h2 { margin: 0; font-family: var(--serif); font-size: 26px; }
.profile-setup-head div > p:last-child { margin: 6px 0 0; color: var(--muted); font-size: 10px; line-height: 1.6; }
.profile-setup-fields { margin-top: 20px; display: grid; grid-template-columns: 1fr 1fr; gap: 11px; }
.profile-setup .field { grid-column: auto; }
.profile-setup-actions { margin-top: 14px; display: flex; align-items: center; gap: 13px; }
.profile-setup-actions .primary-button { min-width: 150px; }
.profile-setup-actions span { color: var(--danger); font-size: 10px; line-height: 1.5; }
.profile-setup .privacy-note { margin-top: 14px; }

.today-status { margin-top: 26px; border: 1px solid var(--line); border-radius: 14px; padding: 15px 18px; background: rgba(255,255,255,.55); display: flex; align-items: center; gap: 13px; }
.status-dot { width: 10px; height: 10px; flex: none; border-radius: 50%; background: var(--gold); box-shadow: 0 0 0 5px var(--gold-soft); }
.today-status[data-complete="true"] .status-dot { background: var(--teal); box-shadow: 0 0 0 5px var(--mint); }
.today-status strong, .today-status small { display: block; }
.today-status strong { font-size: 12px; }
.today-status small { margin-top: 3px; color: var(--muted); font-size: 10px; }

.checkin-form { margin-top: 14px; display: grid; gap: 14px; }
.form-section { border: 1px solid var(--line); border-radius: var(--radius); padding: 26px; background: rgba(255,254,250,.92); box-shadow: 0 6px 25px rgba(23,35,31,.025); display: grid; grid-template-columns: 48px minmax(0, 1fr); column-gap: 18px; row-gap: 20px; }
.form-section.emphasis-section { border-color: rgba(184,131,62,.35); background: linear-gradient(180deg, #fffdf8, #fbf5e9); }
.section-number { grid-row: 1 / span 2; width: 43px; height: 43px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 13px; color: #175d52; background: var(--mint); font-family: var(--serif); font-size: 13px; font-weight: 700; }
.section-copy h2 { margin: 0; font-family: var(--serif); font-size: 25px; }
.section-copy p { margin: 6px 0 0; color: var(--muted); font-size: 11px; line-height: 1.6; }
.field, .technique-fieldset, .record-type-fieldset, .next-mode-fieldset, .body-region-fieldset, .optional-block, .image-picker, .image-preview-grid, .choice-card, .consent-check, .privacy-note { grid-column: 2; }
.field { display: grid; gap: 8px; }
.field > span, .technique-fieldset legend, .record-type-fieldset legend, .next-mode-fieldset legend, .body-region-fieldset legend { color: var(--ink); font-size: 11px; font-weight: 800; }
.field em { margin-left: 4px; color: var(--clay); font-size: 9px; font-style: normal; }
.field textarea, .field select, .field input, .admin-tools input, .admin-tools select, #share-text { width: 100%; border: 1px solid var(--line); border-radius: 12px; padding: 13px 14px; color: var(--ink); background: #fff; font-size: 13px; line-height: 1.65; transition: border-color .18s, box-shadow .18s; }
.field textarea { resize: vertical; min-height: 88px; }
.field textarea:focus, .field select:focus, .field input:focus, .admin-tools input:focus, .admin-tools select:focus { border-color: var(--teal); box-shadow: 0 0 0 4px rgba(40,126,112,.08); outline: 0; }
.field > small { justify-self: end; margin-top: -2px; color: var(--muted); font-size: 9px; }
.technique-fieldset, .record-type-fieldset, .next-mode-fieldset, .body-region-fieldset { margin: 0; border: 0; padding: 0; }
.technique-fieldset legend, .record-type-fieldset legend, .next-mode-fieldset legend, .body-region-fieldset legend { margin-bottom: 9px; }
.technique-grid { display: flex; flex-wrap: wrap; gap: 8px; }
.technique-chip { min-height: 38px; border: 1px solid var(--line); border-radius: 999px; padding: 8px 14px; color: var(--muted); background: #fff; font-size: 11px; font-weight: 700; }
.technique-chip.active { border-color: var(--forest); color: white; background: var(--forest); }
.record-type-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.record-type-card { min-height: 82px; border: 1px solid var(--line); border-radius: 14px; padding: 14px; background: #fff; display: flex; align-items: flex-start; gap: 10px; }
.record-type-card:has(input:checked) { border-color: var(--teal); background: #f3faf7; box-shadow: inset 0 0 0 1px rgba(40,126,112,.13); }
.record-type-card input, .next-mode-grid input { margin-top: 3px; accent-color: var(--teal); }
.record-type-card strong, .record-type-card small { display: block; }
.record-type-card strong { font-family: var(--serif); font-size: 17px; }
.record-type-card small { margin-top: 5px; color: var(--muted); font-size: 9px; line-height: 1.5; }
.template-fields { display: grid; gap: 14px; }
.next-mode-grid { display: flex; gap: 8px; }
.next-mode-grid label { min-height: 40px; flex: 1; border: 1px solid var(--line); border-radius: 10px; padding: 9px 12px; background: #fff; display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 10px; font-weight: 800; }
.next-mode-grid label:has(input:checked) { border-color: var(--teal); color: var(--forest); background: #f3faf7; }
.body-region-grid { display: flex; flex-wrap: wrap; gap: 7px; }
.body-region-chip { min-height: 38px; border: 1px solid var(--line); border-radius: 999px; padding: 8px 13px; color: var(--muted); background: white; font-size: 10px; font-weight: 750; }
.body-region-chip.active { border-color: var(--gold); color: #6d481b; background: var(--gold-soft); }
.optional-block { border: 1px dashed var(--line-strong); border-radius: 13px; padding: 0 14px; background: #fbfaf6; }
.optional-block summary { min-height: 48px; display: flex; align-items: center; color: var(--teal); font-size: 10px; font-weight: 850; cursor: pointer; }
.optional-block[open] { padding-bottom: 14px; }
.optional-block[open] summary { border-bottom: 1px solid var(--line); margin-bottom: 13px; }
.optional-block .field { grid-column: auto; }
.inline-fields { display: grid; grid-template-columns: .38fr .62fr; gap: 9px; }
.optional-section .image-picker { margin-top: 2px; }
.image-picker { min-height: 92px; border: 1px dashed var(--line-strong); border-radius: 14px; display: grid; place-items: center; align-content: center; gap: 4px; color: var(--teal); background: #fbfcf9; }
.image-picker input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.image-picker span { font-size: 13px; font-weight: 850; }
.image-picker small { color: var(--muted); font-size: 9px; }
.image-preview-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
.image-preview { aspect-ratio: 1; border-radius: 12px; overflow: hidden; position: relative; background: var(--paper-deep); }
.image-preview img { width: 100%; height: 100%; object-fit: cover; }
.image-preview button { position: absolute; right: 7px; top: 7px; width: 30px; height: 30px; border: 0; border-radius: 50%; color: white; background: rgba(23,35,31,.78); font-size: 17px; }
.choice-card { min-height: 76px; border: 1px solid var(--line); border-radius: 13px; padding: 14px; display: flex; align-items: flex-start; gap: 11px; background: #fff; }
.choice-card:has(input:checked) { border-color: var(--teal); background: #f4faf7; box-shadow: inset 0 0 0 1px rgba(40,126,112,.12); }
.choice-card input, .consent-check input { margin-top: 3px; accent-color: var(--teal); }
.choice-card strong, .choice-card small { display: block; }
.choice-card strong { font-size: 12px; }
.choice-card small { margin-top: 5px; color: var(--muted); font-size: 10px; line-height: 1.55; }
.consent-check { display: flex; align-items: flex-start; gap: 10px; color: var(--muted); font-size: 10px; line-height: 1.65; }
.consent-check strong { color: var(--ink); }
.privacy-note { margin: 0; border-left: 3px solid var(--gold); padding: 10px 12px; color: #735227; background: var(--gold-soft); font-size: 9px; line-height: 1.6; }
.form-message { min-height: 20px; padding: 0 4px; color: var(--danger); font-size: 11px; }
.form-message.success { color: var(--teal); }
.sticky-actions { position: sticky; bottom: calc(10px + env(safe-area-inset-bottom)); z-index: 4; border: 1px solid rgba(255,255,255,.55); border-radius: 16px; padding: 10px; background: rgba(250,248,242,.88); backdrop-filter: blur(14px); box-shadow: 0 12px 40px rgba(18,61,54,.14); display: grid; grid-template-columns: .45fr 1fr; gap: 9px; }
.primary-button, .secondary-button { min-height: 47px; border-radius: 11px; padding: 10px 16px; font-size: 12px; font-weight: 850; }
.primary-button { border: 1px solid var(--forest); color: white; background: var(--forest); }
.primary-button:hover { background: var(--forest-2); }
.primary-button:disabled { opacity: .5; cursor: wait; }
.secondary-button { border: 1px solid var(--line-strong); color: var(--forest); background: #fff; }

.history-heading { margin-top: 36px; display: flex; justify-content: space-between; align-items: end; }
.history-heading h2 { margin: 0; font-family: var(--serif); font-size: 34px; }
.history-heading > strong { color: var(--teal); font-family: var(--serif); font-size: 18px; font-weight: 500; }
.history-heading > strong b { font-size: 42px; font-weight: 500; }
.month-calendar { margin-top: 18px; border: 1px solid var(--line); border-radius: 16px; padding: 18px; background: var(--surface); display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 7px; }
.calendar-day { min-height: 48px; border-radius: 10px; display: grid; place-items: center; color: var(--muted); background: #f7f5ef; font-size: 10px; }
.calendar-day.done { color: white; background: var(--teal); font-weight: 850; }
.calendar-day.today { box-shadow: inset 0 0 0 2px var(--gold); }
.calendar-day.blank { background: transparent; }
.history-list { margin-top: 18px; display: grid; gap: 11px; }
.history-card { border: 1px solid var(--line); border-radius: 16px; padding: 19px; background: var(--surface); }
.history-card header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.history-card header strong { font-family: var(--serif); font-size: 18px; }
.history-card header span { color: var(--teal); font-size: 9px; font-weight: 850; }
.history-card p { margin: 11px 0 0; color: var(--muted); font-size: 11px; line-height: 1.65; white-space: pre-wrap; }
.history-tags { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 6px; }
.history-tags span { border-radius: 999px; padding: 4px 8px; color: #735227; background: var(--gold-soft); font-size: 8px; font-weight: 800; }
.history-live-link { display: inline-flex; min-height: 38px; align-items: center; border-radius: 999px; padding: 8px 13px; color: white; background: var(--forest); font-size: 9px; font-weight: 800; text-decoration: none; }
.history-empty { min-height: 180px; border: 1px dashed var(--line-strong); border-radius: 16px; display: grid; place-items: center; color: var(--muted); background: rgba(255,255,255,.5); font-size: 12px; }

.share-dialog, .review-dialog { width: min(560px, calc(100% - 24px)); max-height: 92vh; border: 0; border-radius: 22px; padding: 24px; color: var(--ink); background: var(--surface); box-shadow: 0 35px 100px rgba(4,28,24,.3); overflow: auto; }
.share-dialog::backdrop, .review-dialog::backdrop { background: rgba(5,32,28,.74); backdrop-filter: blur(5px); }
.dialog-close { float: right; width: 40px; height: 40px; border: 1px solid var(--line); border-radius: 50%; color: var(--muted); background: white; font-size: 22px; }
.share-dialog-copy h2, .review-dialog h2 { margin: 0; font-family: var(--serif); font-size: 28px; }
.share-dialog-copy > p:last-child { margin: 9px 0 18px; color: var(--muted); font-size: 11px; line-height: 1.6; }
#share-card-image { display: block; width: min(100%, 390px); margin: auto; border-radius: 14px; box-shadow: var(--shadow); }
#share-text { margin-top: 16px; resize: none; }
.share-actions { margin-top: 14px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; }
.share-actions a { display: flex; align-items: center; justify-content: center; text-decoration: none; }
.share-action-message { min-height: 18px; margin-top: 10px; color: var(--teal); font-size: 9px; line-height: 1.5; text-align: center; }
.share-secondary-actions { margin-top: 12px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.share-secondary-actions a, .share-secondary-actions button { border: 0; padding: 6px 0; color: var(--muted); background: transparent; font-size: 9px; font-weight: 750; text-decoration: underline; }
.share-image-overlay { position: fixed; inset: 0; z-index: 90; padding: max(16px, env(safe-area-inset-top)) 14px max(20px, env(safe-area-inset-bottom)); color: white; background: rgba(5,32,28,.96); overflow: auto; }
.share-image-overlay-head { width: min(560px, 100%); margin: 0 auto 14px; display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.share-image-overlay-head strong, .share-image-overlay-head small { display: block; }
.share-image-overlay-head strong { font-family: var(--serif); font-size: 22px; }
.share-image-overlay-head small { margin-top: 5px; color: rgba(255,255,255,.68); font-size: 10px; line-height: 1.55; }
.share-image-overlay-head button { width: 42px; height: 42px; flex: none; border: 1px solid rgba(255,255,255,.24); border-radius: 50%; color: white; background: rgba(255,255,255,.08); font-size: 23px; }
.share-image-overlay img { display: block; width: min(560px, 100%); margin: auto; border-radius: 16px; box-shadow: 0 20px 80px rgba(0,0,0,.34); -webkit-touch-callout: default; user-select: none; }
.share-image-overlay > p { width: min(560px, 100%); margin: 13px auto 0; color: rgba(255,255,255,.62); font-size: 9px; line-height: 1.55; text-align: center; }

.admin-header nav { display: flex; align-items: center; gap: 15px; }
.admin-header nav a { color: var(--muted); font-size: 11px; font-weight: 800; text-decoration: none; }
.admin-main { width: min(1440px, calc(100% - 36px)); margin: auto; padding: 50px 0 90px; }
.account-main { width: min(1400px, calc(100% - 36px)); }
.account-list { display: grid; gap: 12px; }
.account-card { display: grid; grid-template-columns: minmax(0, 1fr) 180px auto; gap: 18px; align-items: center; padding: 18px 20px; border: 1px solid var(--line); border-radius: 18px; background: rgba(255,255,255,.76); }
.account-card[data-active="false"] { opacity: .62; }
.account-card h3 { margin: 8px 0 4px; font-size: 20px; }
.account-card p, .account-card small { margin: 0; color: var(--muted); }
.account-role { display: flex; flex-direction: column; gap: 4px; }
.account-audit { display: grid; gap: 10px; }
.account-audit article { display: flex; justify-content: space-between; gap: 20px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.account-audit span { color: var(--muted); font-size: 13px; }
.draft-list { margin-top: 18px; display: grid; gap: 14px; }
.draft-card { border: 1px solid var(--line); border-radius: 18px; padding: 20px; background: var(--surface); }
.draft-card header { display: flex; justify-content: space-between; gap: 18px; }
.draft-card h3 { margin: 9px 0 4px; font-family: var(--serif); font-size: 22px; }
.draft-card header small, .draft-summary { color: var(--muted); }
.draft-card header > strong { color: var(--teal); font-family: var(--serif); font-size: 30px; }
.draft-summary { margin: 14px 0; font-size: 10px; line-height: 1.65; }
.draft-card footer { margin-top: 12px; display: flex; justify-content: flex-end; }
.mapping-events { margin-top: 18px; display: grid; gap: 14px; }
.mapping-event { border: 1px solid var(--line); border-radius: 18px; padding: 19px; background: var(--surface); }
.mapping-event h3 { margin: 8px 0 3px; font-family: var(--serif); font-size: 21px; }
.mapping-event header small, .mapping-event > p, .mapping-action small { color: var(--muted); font-size: 9px; }
.mapping-action { margin-top: 12px; display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: end; }
.mapping-action label { display: grid; gap: 6px; }
.mapping-action label > span { font-size: 9px; font-weight: 850; }
.mapping-action.unavailable { grid-template-columns: 1fr; padding: 10px; border-radius: 10px; background: var(--paper-deep); }
.mapping-event footer { margin-top: 13px; display: flex; flex-wrap: wrap; gap: 7px; }
.mapping-event footer span { border-radius: 999px; padding: 5px 8px; color: var(--teal); background: var(--mint); font-size: 8px; font-weight: 800; }
.mapping-registry { margin-top: 18px; display: grid; gap: 9px; }
.mapping-registry article { display: grid; grid-template-columns: 1fr minmax(140px,auto) auto; gap: 12px; align-items: center; padding: 14px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface); }
.mapping-registry strong, .mapping-registry small { display: block; }
.mapping-registry small, .mapping-audit small { margin-top: 3px; color: var(--muted); font-size: 8px; }
.mapping-audit p { border-bottom: 1px solid rgba(255,255,255,.16); padding-bottom: 9px; }
@media(max-width:560px){.mapping-action,.mapping-registry article{grid-template-columns:1fr}.mapping-action button,.mapping-registry button{width:100%}}
.admin-login { width: min(460px, 100%); margin: 70px auto; border: 1px solid var(--line); border-radius: 22px; padding: 32px; background: var(--surface); box-shadow: var(--shadow); }
.admin-login h1 { margin: 0; font-family: var(--serif); font-size: 34px; }
.admin-login > p:nth-of-type(2) { color: var(--muted); font-size: 11px; }
.admin-login form { margin-top: 22px; display: grid; gap: 14px; }
.admin-hero { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(260px, .55fr); gap: 26px; }
.admin-hero > div { padding: 20px 0; }
.admin-hero > div > p:last-child { color: var(--muted); font-size: 12px; }
.admin-hero aside { border-radius: var(--radius); padding: 25px; color: white; background: var(--forest); }
.admin-hero aside span { color: #add8cd; font-size: 10px; font-weight: 850; }
.admin-hero aside strong { display: block; margin-top: 24px; font-family: var(--serif); font-size: 54px; font-weight: 500; }
.admin-hero aside p { color: rgba(255,255,255,.65); font-size: 10px; }
.admin-metrics { margin-top: 24px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); overflow: hidden; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.admin-metric { min-height: 120px; padding: 20px; border-right: 1px solid var(--line); }
.admin-metric:last-child { border-right: 0; }
.admin-metric span { color: var(--muted); font-size: 9px; }
.admin-metric strong { display: block; margin-top: 18px; font-family: var(--serif); font-size: 31px; font-weight: 500; }
.operations-toolbar { margin-top: 26px; border: 1px solid var(--line); border-radius: 16px; padding: 13px; background: rgba(255,254,250,.9); box-shadow: var(--shadow); display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.range-buttons { display: flex; gap: 4px; padding: 4px; border-radius: 12px; background: var(--paper-deep); }
.range-buttons button { min-height: 36px; border: 0; border-radius: 9px; padding: 7px 13px; color: var(--muted); background: transparent; font-size: 10px; font-weight: 800; }
.range-buttons button:not(.active) { color: #44514b; }
.range-buttons button.active { color: white; background: var(--forest); }
.custom-range { display: flex; align-items: end; gap: 7px; }
.custom-range label { display: grid; gap: 4px; color: var(--muted); font-size: 8px; }
.custom-range input { min-height: 36px; border: 1px solid var(--line); border-radius: 9px; padding: 6px 9px; background: white; color: var(--ink); font-size: 10px; }
.custom-range .secondary-button, .operations-actions .secondary-button { min-height: 36px; padding: 7px 11px; font-size: 9px; }
.operations-actions { margin-left: auto; display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.operations-actions>span { margin-right: 3px; color: var(--muted); font-size: 8px; }
.operations-metrics { margin-top: 14px; display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 10px; }
.operations-metric { min-height: 120px; border: 1px solid var(--line); border-radius: 16px; padding: 18px; background: var(--surface); box-shadow: 0 7px 24px rgba(23,35,31,.035); }
.operations-metric span,.operations-metric small { display: block; color: var(--muted); }
.operations-metric span { font-size: 9px; font-weight: 750; }
.operations-metric strong { display: block; margin-top: 14px; font-family: var(--serif); font-size: 32px; font-weight: 500; }
.operations-metric small { margin-top: 7px; font-size: 8px; line-height: 1.45; }
.operations-two-column { margin-top: 18px; display: grid; grid-template-columns: minmax(0,1.55fr) minmax(320px,.65fr); gap: 18px; align-items: stretch; }
.operations-card { border: 1px solid var(--line); border-radius: 18px; padding: 20px; background: var(--surface); box-shadow: 0 7px 25px rgba(23,35,31,.03); }
.operations-card>header { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.operations-card h2 { margin: 0; font-family: var(--serif); font-size: 25px; }
.operations-card header small { display: block; margin-top: 5px; color: var(--muted); font-size: 8px; line-height: 1.5; }
.operations-card header>strong { color: var(--teal); font-family: var(--serif); font-size: 28px; font-weight: 500; }
.info-tip { width: 24px; height: 24px; border: 1px solid var(--line); border-radius: 50%; display: grid; place-items: center; color: var(--muted); font-size: 9px; }
.daily-trend { height: 210px; margin-top: 17px; border-bottom: 1px solid var(--line); display: grid; grid-auto-flow: column; grid-auto-columns: minmax(17px,1fr); align-items: end; gap: 3px; overflow-x: auto; overflow-y: hidden; padding-top: 10px; }
.trend-day { height: 100%; min-width: 17px; display: flex; flex-direction: column; justify-content: end; align-items: stretch; position: relative; }
.trend-day .trend-bar { min-height: 2px; border-radius: 5px 5px 0 0; background: var(--teal); position: relative; }
.trend-day[data-backfill="true"] .trend-bar::after { content:""; position:absolute; left:0; right:0; bottom:0; height:4px; background:var(--gold); }
.trend-day small { height: 25px; padding-top: 7px; color: var(--muted); font-size: 7px; text-align: center; white-space: nowrap; }
.trend-legend,.heatmap-legend { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 13px; color: var(--muted); font-size: 8px; }
.trend-legend span,.heatmap-legend span { display: inline-flex; align-items: center; gap: 5px; }
.trend-legend i,.heatmap-legend i { width: 9px; height: 9px; border-radius: 3px; display: inline-block; }
i.done { background: var(--teal); } i.backfill { background: var(--gold); } i.missing { background: #e5b9ad; } i.before { background: var(--paper-deep); border: 1px solid var(--line); }
.attention-list { margin-top: 12px; display: grid; gap: 7px; max-height: 250px; overflow: auto; }
.attention-item { border-top: 1px solid var(--line); padding: 10px 0 2px; display: grid; grid-template-columns: 1fr auto; gap: 4px 10px; }
.attention-item button { border: 0; padding: 0; color: var(--ink); background: transparent; font-size: 10px; font-weight: 800; text-align: left; }
.attention-item span { color: var(--danger); font-size: 9px; font-weight: 800; }
.attention-item small { grid-column: 1/-1; color: var(--muted); font-size: 8px; }
.attention-item[data-level="not-started"] span { color: #85591f; }
.attention-item[data-level="verification"] span { color: #7c3f8d; }
.heatmap-card { margin-top: 18px; padding: 20px 0 0; overflow: hidden; }
.heatmap-heading,.heatmap-legend { padding-left: 20px; padding-right: 20px; }
.heatmap-controls { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.heatmap-controls select,.heatmap-controls input { min-height: 36px; border: 1px solid var(--line); border-radius: 9px; padding: 7px 10px; background: white; color: var(--ink); font-size: 9px; }
.heatmap-controls span { color: var(--muted); font-size: 8px; }
.operations-heatmap-wrap { margin-top: 13px; max-height: 610px; overflow: auto; border-top: 1px solid var(--line); }
.operations-heatmap { border-collapse: separate; border-spacing: 3px; width: max-content; min-width: 100%; padding: 9px 12px 15px; }
.operations-heatmap th,.operations-heatmap td { min-width: 22px; height: 25px; padding: 0; text-align: center; font-size: 7px; }
.operations-heatmap thead th { position: sticky; top: 0; z-index: 2; color: var(--muted); background: var(--surface); font-weight: 700; writing-mode: vertical-rl; }
.operations-heatmap .learner-column { position: sticky; left: 0; z-index: 3; min-width: 150px; max-width: 150px; padding-right: 9px; background: var(--surface); text-align: left; writing-mode: horizontal-tb; }
.operations-heatmap tbody .learner-column { border-right: 1px solid var(--line); }
.operations-heatmap .learner-column button { width: 100%; border: 0; padding: 4px 6px; color: var(--ink); background: transparent; text-align: left; font-size: 9px; font-weight: 800; }
.operations-heatmap .learner-column small { display: block; margin-top: 2px; color: var(--muted); font-size: 7px; font-weight: 400; }
.heat-cell { width: 21px; height: 21px; border-radius: 5px; background: var(--paper-deep); }
.heat-cell.done { background: var(--teal); }.heat-cell.backfill { background: var(--gold); }.heat-cell.missing { background: #e5b9ad; }.heat-cell.before { border: 1px solid var(--line); background: #f4f1e9; }
.lower-grid { grid-template-columns: 1fr 1fr; }
.operations-ranking,.group-summary { margin-top: 12px; display: grid; gap: 7px; }
.ranking-item,.group-item { display: grid; grid-template-columns: 32px minmax(0,1fr) auto; gap: 9px; align-items: center; border-top: 1px solid var(--line); padding-top: 9px; }
.ranking-item>span { color: var(--gold); font-family: var(--serif); font-size: 17px; }
.ranking-item button { border: 0; padding: 0; background: transparent; color: var(--ink); font-size: 10px; font-weight: 800; text-align: left; }
.ranking-item small,.group-item small { display: block; margin-top: 2px; color: var(--muted); font-size: 7px; }
.ranking-item>strong,.group-item>strong { color: var(--teal); font-family: var(--serif); font-size: 20px; font-weight: 500; }
.group-item { grid-template-columns: minmax(0,1fr) auto; }
.group-item>div:first-child { min-width: 0; }
.group-progress { height: 5px; margin-top: 6px; border-radius: 99px; background: var(--paper-deep); overflow: hidden; }
.group-progress i { display: block; height: 100%; background: var(--teal); }
.onboarding-admin-card { margin-top: 18px; }
.onboarding-create { display: flex; align-items: center; gap: 8px; }
.onboarding-create select { min-height: 42px; border: 1px solid var(--line); border-radius: 10px; padding: 8px 11px; background: white; color: var(--ink); font-size: 10px; }
.onboarding-create .primary-button { min-height: 42px; padding: 8px 13px; font-size: 10px; }
.onboarding-link-result { margin-top: 13px; border-radius: 12px; padding: 12px 14px; background: var(--mint); color: var(--forest); font-size: 9px; line-height: 1.55; word-break: break-all; }
.onboarding-link-result:empty { display: none; }
.onboarding-link-result strong,.onboarding-link-result small { display: block; }
.onboarding-link-result button { margin-top: 8px; border: 1px solid rgba(18,61,54,.25); border-radius: 9px; padding: 7px 11px; color: var(--forest); background: white; font-size: 9px; font-weight: 800; }
.onboarding-metrics { margin-top: 14px; display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; }
.onboarding-metrics article { border-radius: 12px; padding: 13px; background: var(--paper); }
.onboarding-metrics span { color: #53605a; font-size: 8px; }
.onboarding-metrics strong { display: block; margin-top: 8px; font-family: var(--serif); font-size: 24px; font-weight: 500; }
.onboarding-group-status { margin-top: 13px; display: flex; flex-wrap: wrap; gap: 7px; }
.onboarding-group-chip { border: 1px solid var(--line); border-radius: 999px; padding: 7px 10px; color: var(--muted); background: white; font-size: 8px; }
.onboarding-group-chip strong { color: var(--ink); }
.onboarding-group-chip button { margin-left: 6px; border: 0; padding: 0; color: var(--danger); background: transparent; font-size: 8px; font-weight: 800; }
.onboarding-member-list { margin-top: 13px; max-height: 360px; overflow: auto; }
.onboarding-member { border-top: 1px solid var(--line); padding: 11px 0; display: grid; grid-template-columns: minmax(0,1fr) auto auto; gap: 8px; align-items: center; }
.onboarding-member strong,.onboarding-member small { display: block; }
.onboarding-member strong { font-size: 10px; }
.onboarding-member small { margin-top: 3px; color: var(--muted); font-size: 8px; }
.onboarding-member>span { border-radius: 999px; padding: 5px 8px; color: #85591f; background: var(--gold-soft); font-size: 8px; font-weight: 800; }
.onboarding-member[data-status="verified"]>span { color: var(--teal); background: var(--mint); }
.onboarding-member-actions { display: flex; gap: 6px; }
.onboarding-member-actions button { min-height: 32px; border: 1px solid var(--line); border-radius: 8px; padding: 6px 9px; background: white; color: var(--forest); font-size: 8px; font-weight: 800; }
.onboarding-member-actions button.reject { color: var(--danger); }
.content-metrics { margin-top: 16px; }
.learner-detail-dialog { width: min(760px,calc(100% - 24px)); max-height: 92vh; border: 0; border-radius: 22px; padding: 24px; background: var(--surface); color: var(--ink); box-shadow: 0 35px 100px rgba(4,28,24,.3); overflow: auto; }
.learner-detail-dialog::backdrop { background: rgba(5,32,28,.74); backdrop-filter: blur(5px); }
.learner-detail-head h2 { margin: 0; font-family: var(--serif); font-size: 31px; }
.learner-detail-head p { margin: 6px 0 0; color: var(--muted); font-size: 9px; }
.learner-detail-metrics { margin-top: 17px; display: grid; grid-template-columns: repeat(4,1fr); gap: 7px; }
.learner-detail-metrics article { border-radius: 12px; padding: 13px; background: var(--paper); }
.learner-detail-metrics span,.learner-detail-metrics small { display: block; color: var(--muted); font-size: 7px; }
.learner-detail-metrics strong { display: block; margin: 8px 0 3px; font-family: var(--serif); font-size: 23px; font-weight: 500; }
.learner-detail-days { margin-top: 18px; display: flex; flex-wrap: wrap; gap: 5px; }
.learner-detail-days span { border-radius: 7px; padding: 6px 8px; color: white; background: var(--teal); font-size: 8px; }
.learner-detail-days span.backfill { background: var(--gold); }.learner-detail-days span.missing { color: #7b3429; background: #f1d2ca; }.learner-detail-days span.before { color: var(--muted); background: var(--paper-deep); }
.learner-entry-detail { margin-top: 10px; border-top: 1px solid var(--line); padding-top: 12px; }
.learner-entry-detail header { display: flex; justify-content: space-between; gap: 10px; }
.learner-entry-detail h3 { margin: 0; font-family: var(--serif); font-size: 18px; }
.learner-entry-detail header span { color: var(--teal); font-size: 8px; }
.learner-entry-detail p { margin: 8px 0 0; color: var(--muted); white-space: pre-wrap; font-size: 9px; line-height: 1.6; }
.admin-layout { margin-top: 38px; display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(290px, .55fr); gap: 22px; align-items: start; }
.admin-section-heading { display: flex; align-items: stretch; flex-direction: column; gap: 16px; }
.admin-section-heading h2, .admin-side-card h2 { margin: 0; font-family: var(--serif); font-size: 27px; }
.admin-tools { width: 100%; display: grid; grid-template-columns: minmax(190px, 1.35fr) repeat(5, minmax(118px, .72fr)) auto; gap: 7px; }
.admin-tools input, .admin-tools select { width: auto; min-width: 0; }
.admin-tools .secondary-button { min-height: 44px; white-space: nowrap; }
.admin-entry-list { margin-top: 18px; display: grid; gap: 11px; }
.admin-entry-card { border: 1px solid var(--line); border-left: 4px solid var(--line-strong); border-radius: 15px; padding: 18px; background: var(--surface); }
.admin-entry-card[data-review="candidate"] { border-left-color: var(--gold); }
.admin-entry-card[data-review="selected"] { border-left-color: var(--teal); }
.admin-entry-footer>div { display: flex; align-items: center; gap: 8px; }
.admin-entry-footer a.review-trigger { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
.admin-entry-head { display: flex; justify-content: space-between; gap: 12px; }
.admin-entry-head strong { font-family: var(--serif); font-size: 18px; }
.admin-entry-head span { color: var(--muted); font-size: 9px; }
.admin-entry-meta { margin-top: 6px; color: var(--teal); font-size: 9px; font-weight: 800; }
.admin-entry-body { margin-top: 14px; display: grid; gap: 10px; }
.admin-entry-body div { border-top: 1px solid var(--line); padding-top: 9px; }
.admin-entry-body small { color: var(--muted); font-size: 8px; font-weight: 800; }
.admin-entry-body p { margin: 4px 0 0; color: #46514c; font-size: 10px; line-height: 1.6; white-space: pre-wrap; }
.admin-entry-images { margin-top: 12px; display: flex; gap: 7px; overflow-x: auto; }
.admin-entry-images img { width: 74px; height: 74px; flex: none; border-radius: 9px; object-fit: cover; }
.admin-entry-footer { margin-top: 14px; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.review-badge { border-radius: 999px; padding: 5px 9px; color: #48534d; background: var(--paper-deep); font-size: 8px; font-weight: 850; }
.review-badge[data-status="candidate"] { color: #735227; background: var(--gold-soft); }
.review-badge[data-status="selected"] { color: var(--teal); background: var(--mint); }
.review-trigger { min-height: 36px; border: 1px solid var(--line); border-radius: 9px; padding: 7px 11px; color: var(--forest); background: white; font-size: 9px; font-weight: 850; }
.admin-side { display: grid; gap: 13px; }
.admin-side-card { border: 1px solid var(--line); border-radius: 16px; padding: 19px; background: var(--surface); }
.admin-side-card > p:not(.checkin-kicker) { color: var(--muted); font-size: 10px; line-height: 1.6; }
.invite-card .field { margin-top: 16px; }
.invite-card .primary-button { width: 100%; margin-top: 11px; }
.invite-result { margin-top: 10px; color: var(--muted); font-size: 9px; line-height: 1.5; word-break: break-all; }
.invite-result button { width: 100%; margin-top: 8px; border: 1px solid var(--line); border-radius: 9px; padding: 8px; color: var(--forest); background: white; font-size: 9px; font-weight: 850; }
.learner-streak-list { margin-top: 14px; display: grid; gap: 9px; }
.learner-streak { border-top: 1px solid var(--line); padding-top: 10px; display: grid; grid-template-columns: 1fr auto; gap: 4px 10px; }
.learner-streak strong { font-size: 10px; }
.learner-streak span { color: var(--teal); font-family: var(--serif); font-size: 17px; }
.learner-streak small { grid-column: 1 / -1; color: var(--muted); font-size: 8px; }
.safety-card { color: white; background: var(--forest); }
.safety-card .checkin-kicker { color: #ebc88e; }
.safety-card h2 { color: white; }
.safety-card > p:not(.checkin-kicker) { color: rgba(255,255,255,.65); }
.review-dialog form { display: grid; gap: 14px; }
.review-dialog .dialog-close { justify-self: end; }

@media (max-width: 820px) {
  .checkin-hero, .admin-hero, .admin-layout { grid-template-columns: 1fr; }
  .streak-card { min-height: 190px; }
  .admin-tools { grid-template-columns: 1fr 1fr; }
  .admin-tools input { grid-column: 1 / -1; }
  .admin-section-heading { align-items: stretch; flex-direction: column; }
  .admin-metrics { grid-template-columns: repeat(2, 1fr); }
  .admin-metric:nth-child(2) { border-right: 0; }
  .admin-metric:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .operations-metrics { grid-template-columns: repeat(2,1fr); }
  .operations-two-column,.lower-grid { grid-template-columns: 1fr; }
  .operations-actions { margin-left: 0; width: 100%; }
}

@media (max-width: 560px) {
  .admin-body { max-width: 100%; overflow-x: hidden; }
  .checkin-header { width: calc(100% - 24px); min-height: 70px; }
  .checkin-brand strong { font-size: 14px; }
  .checkin-brand small { font-size: 7px; }
  .checkin-seal { width: 36px; height: 36px; border-radius: 10px; }
  .checkin-main, .admin-main { width: calc(100% - 24px); padding-top: 27px; }
  .hero-copy { padding-top: 12px; }
  .checkin-hero h1, .admin-hero h1 { font-size: 40px; line-height: 1.13; }
  .hero-copy > p:last-child { font-size: 12px; }
  .streak-card { min-height: 172px; padding: 22px; }
  .streak-card strong b { font-size: 58px; }
  .form-section { padding: 19px 16px; grid-template-columns: 36px minmax(0, 1fr); column-gap: 11px; row-gap: 16px; }
  .section-number { width: 34px; height: 34px; border-radius: 10px; font-size: 10px; }
  .section-copy h2 { font-size: 21px; }
  .field, .technique-fieldset, .record-type-fieldset, .next-mode-fieldset, .body-region-fieldset, .optional-block, .image-picker, .image-preview-grid, .choice-card, .consent-check, .privacy-note { grid-column: 1 / -1; }
  .section-number { grid-row: auto; }
  .section-copy { align-self: center; }
  .technique-grid { gap: 6px; }
  .technique-chip { min-height: 40px; padding: 8px 13px; }
  .image-preview-grid { grid-template-columns: repeat(2, 1fr); }
  .record-type-grid, .inline-fields { grid-template-columns: 1fr; }
  .profile-setup { padding: 18px 15px; }
  .profile-setup-fields { grid-template-columns: 1fr; }
  .profile-setup-actions { align-items: stretch; flex-direction: column; }
  .profile-setup-actions .primary-button { width: 100%; }
  .sticky-actions { grid-template-columns: .42fr 1fr; }
  .month-calendar { padding: 10px; gap: 4px; }
  .calendar-day { min-height: 40px; }
  .share-dialog, .review-dialog { padding: 18px; }
  .share-actions { grid-template-columns: 1fr; }
  .admin-header nav a { display: none; }
  .admin-login { margin-top: 30px; padding: 24px 19px; }
  .admin-metrics { grid-template-columns: 1fr 1fr; }
  .admin-metric { padding: 15px; min-height: 105px; }
  .admin-metric strong { font-size: 26px; }
  .admin-tools { grid-template-columns: 1fr; }
  .admin-tools input { grid-column: auto; }
  .admin-entry-head { flex-direction: column; }
  .operations-toolbar { align-items: stretch; }
  .range-buttons { width: 100%; overflow-x: auto; }
  .range-buttons button { flex: 1; min-width: 58px; }
  .custom-range { width: 100%; align-items: stretch; flex-direction: column; }
  .operations-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .operations-actions>span { grid-column: 1/-1; }
  .operations-metrics { grid-template-columns: 1fr 1fr; }
  .operations-metric { min-height: 105px; padding: 15px; }
  .operations-metric:last-child { grid-column: 1/-1; }
  .operations-card { padding: 17px 14px; }
  .heatmap-card { padding-left: 0; padding-right: 0; }
  .heatmap-heading { align-items: stretch; flex-direction: column; }
  .heatmap-controls { display: grid; grid-template-columns: 1fr 1fr; }
  .heatmap-controls span { grid-column: 1/-1; }
  .operations-heatmap .learner-column { min-width: 118px; max-width: 118px; }
  .learner-detail-dialog { padding: 18px 14px; }
  .learner-detail-metrics { grid-template-columns: 1fr 1fr; }
  .onboarding-admin-card>header { flex-direction: column; }
  .onboarding-create { width: 100%; display: grid; grid-template-columns: 1fr; }
  .onboarding-metrics { grid-template-columns: 1fr 1fr; }
  .onboarding-member { grid-template-columns: 1fr auto; }
  .onboarding-member-actions { grid-column: 1/-1; }
  .onboarding-member-actions button { flex: 1; }
}

@media (max-width: 720px) {
  .account-card { grid-template-columns: 1fr auto; }
  .account-role { grid-column: 1; }
  .account-card button { grid-column: 2; grid-row: 1 / span 2; }
  .account-audit article { flex-direction: column; gap: 4px; }
}

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; } }

/* Learning entry v1: retains the original check-in identity and history. */
.learning-entry-nav { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:24px 0 32px; }
.learning-entry-nav a { display:flex; flex-direction:column; gap:6px; padding:18px; border:1px solid #cbd6cd; border-radius:16px; background:#fffef9; color:#123d36; text-decoration:none; }
.learning-entry-nav a:first-child { background:#123d36; color:#fffef9; }
.learning-entry-nav strong { font-size:20px; }
.learning-entry-nav span { font-size:14px; line-height:1.5; }
.learning-entry-nav a:focus-visible,.entry-recovery a:focus-visible { outline:3px solid #997138; outline-offset:3px; }
.entry-recovery { max-width:560px; margin:20px auto; }
.entry-recovery a { display:inline-block; padding:12px; color:#123d36; text-decoration:underline; }
@media(max-width:600px) { .learning-entry-nav { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin:20px 0; } .learning-entry-nav a { padding:14px; } .learning-entry-nav a:first-child { grid-column:1/-1; } .learning-entry-nav strong { font-size:18px; } }