/* ===== 2026-09-18: new section pages (hero background, byline, sortable tables, limit planner) ===== */
@media (min-width:768px){.mainnav{flex-wrap:wrap;gap:.5rem 1.1rem;font-size:14px}}

.hero-gc>.hero-bg,.hero-sec>.hero-bg{pointer-events:none;position:absolute;inset:0;z-index:0;height:100%;width:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:78% center;object-position:78% center;opacity:.62;transform:scaleX(-1)}
.hero-sec>.hero-scrim{pointer-events:none;position:absolute;inset:0;z-index:0;background:rgba(18,15,40,.86)}
@media (min-width:768px){.hero-sec>.hero-scrim{background:linear-gradient(90deg,rgba(18,15,40,.95),rgba(18,15,40,.84) 52%,rgba(18,15,40,.62))}}
.hero-sec .hero-ctas .btn-brand,.hero-sec .hero-ctas .btn-anchor{box-shadow:0 8px 22px rgba(0,0,0,.45)}
.hero-sec .hero-ctas .btn-anchor{background-color:rgba(18,15,40,.72);border-color:oklch(var(--p)/.55);color:oklch(var(--bc)/.95)}

.byline{border-top:1px solid oklch(var(--b3))}
.byline>.wrap{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem .875rem;padding-top:14px;padding-bottom:14px}
.byline .ava{height:40px;width:40px;flex:0 0 auto;border-radius:9999px;display:block}
.byline .who{display:flex;flex-direction:column;min-width:0;line-height:1.3}
.byline .who .n{font-size:14px;font-weight:700;color:oklch(var(--bc)/.9)}
.byline .who .r{font-size:12px;color:oklch(var(--bc)/.6)}
.byline .dt{display:flex;flex-wrap:wrap;column-gap:.875rem;row-gap:.125rem;font-size:12px;color:oklch(var(--bc)/.55);margin-left:auto}
@media (max-width:599px){.byline .dt{margin-left:0;width:100%}}

.srt th button{display:inline-flex;align-items:center;gap:.25rem;width:100%;background:none;border:0;padding:0;font:inherit;color:inherit;cursor:pointer;text-align:left}
.srt th button .ico{height:.75rem;width:.75rem;opacity:.35;flex:0 0 auto}
.srt th[aria-sort] button .ico{opacity:1;color:oklch(var(--p))}
.srt th[aria-sort=descending] button .ico{transform:rotate(180deg)}
.srt-bar{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin-top:1.25rem;font-size:13px;color:oklch(var(--bc)/.6)}
.srt-bar .chip{border:1px solid oklch(var(--b3));background:oklch(var(--b2));border-radius:999px;padding:.3rem .7rem;font:inherit;color:oklch(var(--bc)/.75);cursor:pointer}
.srt-bar .chip[aria-pressed=true]{border-color:oklch(var(--p)/.6);color:oklch(var(--p));background:oklch(var(--p)/.1)}
.srt-empty{padding:.9rem 1rem;font-size:14px;color:oklch(var(--bc)/.6)}

.planner{border:1px solid oklch(var(--b3));background:oklch(var(--b2));border-radius:var(--rounded-box,.75rem);padding:1.1rem;margin-top:1.5rem}
.planner .row{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;margin-bottom:.9rem}
.planner label{font-size:14px;font-weight:600;color:oklch(var(--bc)/.85);flex:1 1 13rem;min-width:0}
.planner input,.planner select{background:oklch(var(--b1));border:1px solid oklch(var(--b3));border-radius:var(--rounded-btn,.5rem);color:oklch(var(--bc)/.95);padding:.5rem .65rem;font:inherit;font-size:15px;min-width:0;flex:0 1 11rem;width:100%;max-width:11rem}
.planner input:focus,.planner select:focus{outline:2px solid oklch(var(--p)/.6);outline-offset:1px}
.planner .out{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;margin-top:.25rem}
@media (max-width:479px){.planner .out{grid-template-columns:1fr}}
.planner .out div{min-width:0;border:1px solid oklch(var(--b3));background:oklch(var(--b1));border-radius:var(--rounded-box,.75rem);padding:.7rem}
.planner .out .l{font-size:12px;color:oklch(var(--bc)/.6)}
.planner .out .v{margin-top:.2rem;font-size:1rem;font-weight:700;line-height:1.35;color:oklch(var(--p));overflow-wrap:break-word}
.planner .hint{margin-top:.75rem;font-size:13px;line-height:1.55;color:oklch(var(--bc)/.6)}

.wbar{display:block;height:6px;border-radius:999px;background:oklch(var(--b3));overflow:hidden;min-width:70px}
.wbar>span{display:block;height:100%;border-radius:999px;background:oklch(var(--p)/.85)}