/* Operate surfaces extend the journal's existing paper, ink and sage tokens.
   Namespaced controls avoid changing editorial or contact-page behavior. */
.pet-tools { padding-block: 36px 64px; max-width: 1180px; }
.pet-page-head { max-width: 760px; margin-bottom: 24px; }
.pet-page-head > a { color: var(--orange-ink); font-size: .9rem; }
.pet-page-head h1 { font-family: var(--serif); font-size: 3rem; line-height: 1.08; margin: 18px 0 12px; }
.pet-page-head p { font-size: 1.08rem; line-height: 1.65; color: var(--ink-soft); }
.pet-nav { display:flex; gap:8px; flex-wrap:wrap; border-bottom:1px solid var(--line-strong); padding-bottom:12px; margin-bottom:16px; }
.pet-nav a { display:flex; align-items:center; min-height:44px; padding:9px 15px; border-radius:10px; color:var(--ink); text-decoration:none; }
.pet-nav a[aria-current],.pet-nav a:hover { background:var(--mint-panel); }
.pet-privacy { font-size:.88rem; line-height:1.6; max-width:75ch; color:var(--ink-soft); }
.pet-status { min-height:28px; margin:12px 0; padding:10px 12px; background:var(--mint-panel); border-radius:8px; line-height:1.6; overflow-wrap:anywhere; }
.pet-status:empty { padding:0; min-height:0; }
.pet-status.is-error { background:#f8e6da; color:#793819; }
.pet-picker { display:flex; align-items:center; gap:24px; margin:22px 0 32px; padding:18px 0; border-block:1px solid var(--line-strong); }
.pet-picker > label { flex:0 1 300px; }
.pet-picker > p { max-width:60ch; line-height:1.6; margin:0; font-size:.9rem; }
.desk-columns { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(280px,1fr); gap:36px; align-items:start; }
.pet-section { margin:0 0 32px; padding:24px 0; border-top:1px solid var(--line-strong); min-width:0; scroll-margin-top:112px; }
.desk-columns > aside > .pet-section,.result-panel { padding:24px; background:var(--mint-panel); border:0; border-radius:12px; }
.pet-section h2 { font-family:var(--serif); font-size:1.65rem; line-height:1.2; margin:0 0 12px; }
.pet-section h3 { font-size:1.1rem; margin:24px 0 10px; }
.pet-section p { margin:10px 0 18px; line-height:1.65; max-width:75ch; overflow-wrap:anywhere; }
.pet-section ul { padding-left:20px; }
.pet-section li { line-height:1.65; }
.pet-tools label { display:flex; flex-direction:column; gap:7px; font-size:.9rem; font-weight:600; }
.pet-tools input:not([type=checkbox]),.pet-tools select,.pet-tools textarea { display:block; width:100%; min-width:0; padding:11px 12px; min-height:46px; border:1px solid var(--line-strong); border-radius:8px; background:var(--cream-white); color:var(--ink); font:inherit; font-size:1rem; }
.pet-tools textarea { resize:vertical; }
.pet-tools input[type=checkbox] { width:20px; height:20px; flex:0 0 20px; margin-top:3px; accent-color:var(--orange-ink); }
.pet-tools input:focus-visible,.pet-tools select:focus-visible,.pet-tools textarea:focus-visible,.pet-tools button:focus-visible,.pet-tools summary:focus-visible { outline:3px solid var(--orange-ink); outline-offset:3px; }
.pet-tools button,.article-save-button { cursor:pointer; border:1px solid var(--forest-deep); border-radius:8px; background:var(--forest-deep); color:var(--cream-white); padding:11px 16px; min-height:44px; font:inherit; font-weight:600; line-height:1.35; }
.pet-tools button:hover,.article-save-button:hover { background:var(--forest-hover); }
.pet-tools button:disabled { opacity:.55; cursor:not-allowed; }
.pet-tools .pet-secondary { background:transparent; color:var(--ink); border-color:var(--line-strong); }
.pet-tools .pet-secondary:hover { background:var(--paper-deep); }
.pet-form { display:flex; flex-direction:column; gap:16px; margin:20px 0 24px; }
.pet-form > button { align-self:flex-start; }
.field-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.pet-actions { display:flex; gap:12px; flex-wrap:wrap; align-items:center; }
.pet-tools fieldset { min-width:0; border:0; border-top:1px solid var(--line-strong); padding:16px 0; margin:0; }
.pet-tools legend { font-weight:700; padding-right:10px; }
.pet-tools fieldset p { font-size:.88rem; color:var(--ink-soft); }
.pet-tools .record-list { padding:0; margin:16px 0; list-style:none; }
.record-list > li { display:flex; justify-content:space-between; align-items:start; gap:14px; padding:14px 0; border-bottom:1px solid var(--line); overflow-wrap:anywhere; }
.pet-tools .task-check { display:flex; flex-direction:row; align-items:start; gap:12px; cursor:pointer; flex:1; min-height:44px; }
.task-check small { display:block; font-weight:400; color:var(--ink-soft); margin-top:4px; }
.task-check:has(input:checked) > span { color:var(--ink-soft); text-decoration:line-through; }
.pet-tools .pet-text-button { background:transparent; color:var(--orange-ink); padding:6px 8px; border:0; font-size:.88rem; flex-shrink:0; }
.notes-list time { font-size:.85rem; color:var(--ink-soft); }
.notes-list p { white-space:pre-wrap; margin:6px 0; }
.pet-tools summary { cursor:pointer; min-height:44px; font-weight:600; padding:10px 0; }
.backup-section { margin-top:24px; }
.backup-section details { margin-top:20px; }
.backup-section input[type=file] { font-size:.88rem; }
#import-preview { margin:22px 0; padding:20px; background:var(--surface-warm); }
.file-label { max-width:380px; }
#clear-word { max-width:240px; margin-bottom:16px; }
.feeding-results { margin:0; }
.feeding-results > div { display:flex; justify-content:space-between; align-items:baseline; gap:16px; padding:16px 0; border-bottom:1px solid var(--line-strong); }
.feeding-results dt { font-size:.9rem; max-width:23ch; }
.feeding-results dd { margin:0; font-size:1.3rem; font-weight:600; font-variant-numeric:tabular-nums; text-align:right; }
.stage-links { display:flex; flex-wrap:wrap; gap:12px 24px; }
.stage-links a { padding-block:10px; }
.stage-title { display:flex; align-items:baseline; gap:15px; }
.stage-title > span { font-family:var(--serif); font-size:2rem; color:var(--orange-ink); }
.pet-tools .journey-list { list-style:none; padding:0; }
.journey-list li { padding:18px 0; border-bottom:1px solid var(--line); }
.pet-tools .journey-list label { flex-direction:row; gap:12px; align-items:start; cursor:pointer; font-weight:500; }
.journey-list li > a { display:inline-block; margin:8px 0 0 32px; }
.pet-tools [hidden] { display:none !important; }
/* Reuse the reading grid so article actions follow the正文 column.
   Auto margins retain the shared container alignment on wide screens. */
.article-layout.article-save { margin:16px auto 24px; }
.article-save-inner { grid-column:-2 / -1; min-width:0; }
.article-save-status { line-height:1.6; font-size:.9rem; }
.pet-home-entry { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(240px,1fr); gap:24px; margin-top:40px; padding:28px; background:var(--mint-panel); border-radius:12px; }
.pet-home-entry h2 { font-family:var(--serif); font-size:1.8rem; line-height:1.15; margin-bottom:12px; }
.pet-home-entry p { max-width:60ch; line-height:1.6; }
.pet-home-entry nav { display:flex; flex-direction:column; align-items:start; justify-content:center; gap:8px; }
.pet-home-entry a { padding:8px 0; }
@media(max-width:820px) {
  .desk-columns { grid-template-columns:1fr; gap:0; }
  /* First-time owners reach Add a pet before disabled record forms on phones. */
  .pet-empty[data-pet-app="desk"] .desk-columns > aside { order:-1; }
  .pet-home-entry { grid-template-columns:1fr; }
  .pet-picker { align-items:stretch; flex-direction:column; gap:12px; }
  .pet-picker > label { flex:auto; }
}
@media(max-width:520px) {
  .pet-tools { padding-top:24px; }
  .pet-page-head h1 { font-size:2.25rem; }
  .field-pair { grid-template-columns:1fr; }
  .pet-nav { gap:4px; }
  .pet-nav a { padding-inline:9px; font-size:.9rem; }
  .pet-home-entry { padding:22px; }
  .feeding-results > div { flex-wrap:wrap; }
}
