/* LIFE-136 Palace Planner. Like today.css, served on every page by `:app`,
   so every rule is scoped to .p-* classes; tokens come from .t-body. */

/* Planner tabs: one line under the GNB, scrolling sideways on a phone. */
.p-lnb {
  display: flex; gap: .15rem; overflow-x: auto; white-space: nowrap; scrollbar-width: none;
  padding: .3rem 1rem; border-bottom: 1px solid var(--t-line); background: var(--t-bg);
}
.p-lnb::-webkit-scrollbar { display: none; }
.p-lnb__tab {
  flex: none; padding: .2rem .65rem; border-radius: 6px; font-size: .8rem; line-height: 1.5;
  color: var(--t-dim); text-decoration: none;
}
.p-lnb__tab:hover { color: #fff; background: var(--t-panel-2); }
.p-lnb__tab[aria-current="page"] { color: #fafafa; background: var(--t-panel-2); font-weight: 600; }

.p-range { color: var(--t-dim); font-size: .85rem; margin-left: .25rem; }
/* Section titles and header links keep one line next to many count chips. */
.p-app .t-section__title, .p-app .t-header__right a { white-space: nowrap; }
.p-strong { color: var(--t-accent); }

.p-layout {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 1.25rem;
  max-width: 82rem; margin: 0 auto; padding: 1rem;
}
@media (max-width: 1000px) {
  .p-layout { grid-template-columns: minmax(0, 1fr); }
}
.p-col { min-width: 0; display: flex; flex-direction: column; gap: .9rem; }

.p-week__theme { margin: .1rem 0 0; font-style: italic; }
.p-week__guideline { margin: .35rem 0 0; color: var(--t-dim); font-size: .85rem; white-space: pre-line; }

.p-objs { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .6rem; }
.p-obj__head { display: flex; align-items: center; gap: .4rem; font-size: .9rem; }
.p-obj__title { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.p-obj--closed .p-obj__title { color: var(--t-faint); }
.p-obj__meta { margin: .15rem 0 0 .9rem; font-size: .8rem; color: var(--t-dim); white-space: pre-line; }
.p-obj__meta b { color: var(--t-faint); font-weight: 500; margin-right: .25rem; }

.p-note__form { display: flex; flex-direction: column; gap: .6rem; }
.p-note__text {
  width: 100%; resize: vertical; min-height: 4.5rem; line-height: 1.45; padding: .45rem .55rem;
  background: var(--t-panel-2); border: 1px solid var(--t-line); border-radius: 7px;
}
.p-note__actions { display: flex; justify-content: flex-end; }

.p-day { border-top: 1px solid var(--t-line); padding: .55rem 0; }
.p-day:first-of-type { border-top: 0; padding-top: 0; }
.p-day__head { display: flex; align-items: center; justify-content: space-between; gap: .5rem; flex-wrap: wrap; }
.p-day__date { font-weight: 600; color: #f4f4f5; }
.p-day--today .p-day__date { color: var(--t-accent); }
.p-day__note { margin: .2rem 0 0; color: var(--t-faint); font-size: .78rem; }
.p-counts { display: flex; gap: .3rem; flex-wrap: wrap; }
.p-rows, .p-events { list-style: none; margin: .3rem 0 0; padding: 0; }
.p-row { display: flex; align-items: center; gap: .4rem; font-size: .86rem; padding: .1rem 0; }
.p-row__title { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.p-row--closed .p-row__title { color: var(--t-faint); }

.p-phase { max-width: 40rem; margin: 2rem auto; }
.p-phase__title { margin: 0 0 .4rem; font-size: 1.15rem; color: #fafafa; }

/* LIFE-136 Phase 2a: Goals / Metrics lists, detail forms, observations. */
.p-title { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.p-cards { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .5rem; }
.p-card {
  display: flex; flex-direction: column; gap: .2rem; padding: .55rem .7rem;
  border: 1px solid var(--t-line); border-radius: 8px; background: var(--t-panel-2);
}
.p-card__head { display: flex; align-items: center; gap: .45rem; flex-wrap: wrap; }
.p-card__title { font-weight: 600; color: #f4f4f5; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.p-card--closed .p-card__title { color: var(--t-faint); font-weight: 500; }
.p-card__latest { margin-left: auto; font-size: .85rem; white-space: nowrap; }
.p-card__latest b { color: #f4f4f5; font-weight: 650; }
.p-card__meta { display: flex; gap: .6rem; flex-wrap: wrap; color: var(--t-dim); font-size: .8rem; }
.p-card__text { margin: .1rem 0 0; font-size: .82rem; color: var(--t-dim); white-space: pre-line; }
.p-card__text b { color: var(--t-faint); font-weight: 500; margin-right: .25rem; }
.p-group .t-section__title .t-dot { margin-right: .1rem; }

.p-form { display: flex; flex-direction: column; gap: .6rem; }
.p-form__row { display: flex; gap: .6rem; flex-wrap: wrap; }
.p-form__row .t-field { flex: 1 1 8rem; }
.p-form__actions { display: flex; justify-content: flex-end; gap: .4rem; }
.p-form .t-select { padding: .4rem .5rem; font-size: .88rem; }
.p-checks { border: 0; margin: 0; padding: 0; }
.p-checks label { display: flex; align-items: center; gap: .4rem; color: var(--t-text); font-size: .85rem; }

.p-obs__form .p-form__row { align-items: flex-end; }
.p-obs__notefield { flex: 2 1 10rem; }
.p-obs__actions { flex: 0 0 auto; }
.p-spark { display: block; width: 100%; max-width: 22rem; height: 2.6rem; color: var(--t-accent); margin: .5rem 0 .2rem; }
.p-obs { list-style: none; margin: .3rem 0 0; padding: 0; font-size: .85rem; }
.p-obs li { display: flex; gap: .6rem; align-items: baseline; padding: .18rem 0; border-top: 1px solid var(--t-line); }
.p-obs__date { color: var(--t-dim); min-width: 6.2rem; font-variant-numeric: tabular-nums; }
.p-obs__value { color: #f4f4f5; font-weight: 600; }
.p-obs__note { color: var(--t-dim); min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.p-placeholder { margin: 0; padding: .6rem .7rem; border: 1px dashed var(--t-line); border-radius: 8px; color: var(--t-faint); font-size: .82rem; }
/* Detail headers carry a full title: wrap the header instead of overflowing
   the viewport on a phone (the right-side link moves under the title). */
.p-app .t-header { flex-wrap: wrap; }
.p-app .t-datenav { min-width: 0; flex: 1 1 auto; }
.p-title { white-space: normal; overflow-wrap: anywhere; }
/* Metrics gone from Notion whose observations remain: a folded group. */
.p-group--removed > summary { cursor: pointer; list-style: none; }
.p-group--removed > summary::-webkit-details-marker { display: none; }
.p-group--removed[open] > summary { margin-bottom: .5rem; }
.p-title--removed { color: var(--t-faint); }