/* H09 uses the shared brand tokens. These layout rules are scoped to the planner. */
.lp-head { padding-block: 1rem .75rem; }
.lp-planner { margin-block: .5rem 1.5rem; }
.lp-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:1rem; border:1px solid var(--edge); border-top:2px solid var(--accent); background:var(--bg-2); box-shadow:inset 0 0 0 1px var(--edge-inner); padding:.75rem; }
.lp-points { margin:0; font-family:var(--font-ui); }
.lp-points > b { font-family:var(--font-display); font-size:2rem; font-weight:400; color:var(--accent); }
.lp-points > span { display:block; color:var(--ink-2); }
.lp-actions { display:flex; flex-wrap:wrap; align-items:end; gap:.5rem; }
.lp-actions label, .lp-share label { display:grid; gap:.25rem; font-family:var(--font-ui); }
.lp-actions input { width:5rem; min-height:44px; }
.lp-page input { background:var(--bg-3); border:1px solid var(--line-control); color:var(--ink); border-radius:2px; padding:.5rem; font:inherit; min-width:0; }
.lp-coverage, .lp-status { font-family:var(--font-ui); color:var(--ink-2); margin:.5rem 0; }
.lp-status { min-height:2.5em; color:var(--ink); }
.lp-share { background:var(--bg-2); border:1px solid var(--edge-inner); padding:.75rem; margin-bottom:1rem; }
.lp-share input { width:100%; }
.lp-share p { margin:.5rem 0 0; }
.lp-layout, .lp-trees { display:grid; grid-template-columns:minmax(0,1fr); gap:1rem; }
.lp-tree { min-width:0; border:1px solid var(--edge); background:var(--bg-2); box-shadow:inset 0 0 0 1px var(--edge-inner); }
.lp-tree > h2 { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:.5rem; margin:0; padding:.65rem .75rem; background:var(--bg-3); font-size:1.5rem; }
.lp-tree h2 small { font:1rem var(--font-ui); color:var(--ink-2); }
.lp-tree > ul { padding:0; margin:0; list-style:none; }
.lp-perk { display:grid; grid-template-columns:minmax(0,1fr); padding:.75rem; gap:.5rem; border-top:1px solid var(--edge-inner); }
.lp-perk.is-selected { background:color-mix(in srgb,var(--accent) var(--mix-faint),var(--bg-2)); }
.lp-perk h3 { margin:0 0 .25rem; font-size:1.3rem; }
.lp-perk p { margin:0; font-size:.9375rem; line-height:1.45; color:var(--ink-2); }
.lp-perk p.lp-rule { font-family:var(--font-ui); margin-top:.35rem; }
.lp-rank { display:flex; align-items:center; gap:.5rem; }
.lp-rank output { min-width:3.5rem; text-align:center; font-family:var(--font-ui); }
.lp-rank-button { width:44px; min-height:44px; font:1.5rem var(--font-ui); border:1px solid var(--line-control); border-radius:2px; color:var(--ink); background:var(--bg-3); cursor:pointer; }
.lp-rank-button:hover:not(:disabled) { background:var(--edge-inner); }
.lp-rank-button:disabled { cursor:default; color:var(--ink-3); }
.lp-reason:empty { display:none; }
.lp-summary { align-self:start; padding:.75rem; background:var(--bg-2); border:1px solid var(--edge); box-shadow:inset 0 0 0 1px var(--edge-inner); }
.lp-summary h2 { margin:0 0 .5rem; font-size:1.5rem; }
.lp-summary p, .lp-summary li { color:var(--ink-2); font-size:.9375rem; }
.lp-summary ul { margin:0; padding-left:1.25rem; }
.lp-lower { margin-block:1.5rem 2rem; }
.lp-lower .prose { max-width:66ch; }
@media (min-width: 40rem) { @container page (width >= 39rem) {
  .lp-perk { grid-template-columns:minmax(0,1fr) auto; }
  .lp-reason { grid-column:1/-1; }
  .lp-rank { align-self:start; }
} }
@media (min-width: 72rem) { @container page (width >= 71rem) {
  .lp-layout { grid-template-columns:minmax(0,1fr) 20rem; }
  .lp-summary { position:sticky; top:1rem; }
} }
@container page (width < 20rem) { .lp-toolbar { padding:.5rem; } .lp-actions { display:grid; grid-template-columns:minmax(0,1fr); width:100%; } .lp-rank { flex-wrap:wrap; } }
.lp-page [hidden] { display:none !important; }
@media (prefers-reduced-motion:reduce) { .lp-page * { transition:none; } }
.lp-summary summary { cursor:pointer; min-height:44px; font:1.5rem var(--font-display); color:var(--ink); }
.lp-summary summary > span { font:1rem var(--font-ui); color:var(--ink-2); }
.lp-trees { grid-area:trees; }
.lp-summary { grid-area:summary; }
.lp-layout { grid-template-areas:'summary' 'trees'; }
@media (min-width: 72rem) { @container page (width >= 71rem) { .lp-layout { grid-template-areas:'trees summary'; } } }

.lp-head .affiliate-break { margin-block: .75rem; }
.lp-actions label { width:6rem; line-height:1.2; }
.lp-points > [data-point-unit] { display:inline; color:inherit; }