/* Selected field-guide direction. Uses the existing light/dark tokens and assets. */
:root{--page-gutter:clamp(1rem,4.5vw,5rem);color-scheme:light}
@media(prefers-color-scheme:dark){:root{color-scheme:dark}}
main,header.site,footer.site{max-width:96rem;padding-left:var(--page-gutter);padding-right:var(--page-gutter)}
header.site{min-height:96px;padding-top:1.1rem;padding-bottom:1.1rem;gap:1.2rem}
header.site .brand-logo{height:auto;width:10.7rem;max-width:100%}
header.site .brand-sub{font-size:.75rem;margin-top:.25rem}
header.site nav{gap:1.4rem;align-items:center}
.navlink{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:.6rem .1rem;border:0;border-bottom:2px solid transparent;border-radius:0;background:transparent;color:var(--fg);font-size:1rem}
.navlink:hover{background:transparent;border-bottom-color:var(--link)}
.navlink[aria-current="page"]{background:transparent;color:var(--fg);font-weight:700;border-bottom-color:var(--link);box-shadow:none}
.navlink[aria-current="page"]:hover{background:transparent}
.navlink.nav-price-search{padding:.75rem 1.2rem;background:var(--nav-bg-current);color:var(--nav-fg-current);border:1px solid var(--nav-bg-current);border-radius:7px;font-weight:650}
.navlink.nav-price-search:hover{text-decoration:underline;text-underline-offset:4px}
.navlink.nav-price-search[aria-current="page"]{font-weight:750;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:2px}
.navlink.nav-price-search[aria-current="page"]:hover{background:var(--nav-bg-current)}
main{padding-top:2rem}
.crumb{margin:0 0 1.5rem}
.crumb ol{font-size:.95rem}
.eyebrow{font-size:.85rem;letter-spacing:.09em}
.resort-heading h1{font-size:clamp(2.4rem,4.5vw,4.4rem);line-height:1.1;margin:.5rem 0 1rem}
.resort-heading .note{font-size:1rem}

/* Plain homepage introduction; typography and theme colors come from style.css. */
body[data-page="home"] main{padding-top:0}
.home-regions .section-heading{margin:2rem 0 1rem}
.home-regions h2,.home-stories h2{font-size:1.1rem}
.home-regions .region-links{display:flex;flex-wrap:wrap;gap:.6rem 3rem}
.home-regions .region-links a{display:flex;flex-direction:row;align-items:center;gap:.6rem;min-height:44px;padding:.35rem 0;border:0;border-radius:0;background:transparent;text-decoration:underline;font-weight:500}
.home-regions .region-links a:hover{background:transparent}
.home-regions .region-links .quiet{font-size:.75rem;text-decoration:none}
.home-stories{border-top:1px solid var(--line);margin-top:1.25rem}
.home-stories .section-heading{margin:1.6rem 0 .65rem}
.story-links{list-style:none;display:flex;flex-wrap:wrap;gap:.3rem 2.5rem;margin:0;padding:0}
.story-links a{display:inline-flex;align-items:center;min-height:44px;font-size:.95rem;max-width:35rem}
body[data-page="home"] .entry-list{gap:2.5rem}
body[data-page="home"] .entry-card{background:transparent;border:0;border-top:1px solid var(--line);border-radius:0;padding:1.2rem 0}
.home-purpose{max-width:51rem;color:var(--muted);margin:2.5rem 0 1.2rem}
body[data-page="home"] .trust-strip{margin-bottom:1.3rem;border-bottom:0;gap:2rem}

/* The date finder comes before the archive; all matching figures keep their evidence. */
.coverage-summary{font-size:1.1rem;max-width:66rem;margin:.5rem 0 1.8rem}
.subject-date-search{margin:2rem 0 1.5rem}
.subject-date-search h2{border:0;padding:0;margin:0 0 .85rem;font-size:1.5rem}
.subject-date-fields{display:flex;align-items:end;flex-wrap:wrap;gap:1.2rem;padding:1.2rem;background:var(--panel);border:1px solid var(--line);border-radius:8px}
.subject-date-fields label{display:flex;flex-direction:column;gap:.35rem;flex:1 1 12rem;min-width:0;font-size:1rem}
.subject-date-fields input,.subject-date-fields select{width:100%;min-height:52px;padding:.8rem 1rem}
.subject-date-fields button{flex:1 1 12rem;min-height:52px}
.subject-date-fields .note{flex-basis:100%;margin:0;font-size:.95rem}
.subject-date-results{border-top:1px solid var(--line);padding-top:.5rem;margin:1.5rem 0 2rem;scroll-margin-top:1rem}
.subject-date-results h2{font-size:1.5rem;border:0;margin:1rem 0;padding:0}
.subject-date-results h3{font-size:1.05rem;margin:1rem 0 .5rem}
.subject-date-results>.lede{font-size:1rem;max-width:58rem}
.subject-date-results>.lines>.price{background:transparent;border:0;border-top:1px solid var(--line);border-radius:0;padding:1.5rem 0;margin:0}
.subject-date-results .price .figure{font-size:clamp(2.5rem,4.2vw,4.5rem);font-weight:700;line-height:1.15;overflow-wrap:anywhere}
.subject-date-results .distinguishers li{background:transparent;border:0;padding:0 .7rem 0 0;font-size:1rem}
.subject-date-results .price-meta{font-size:.95rem}
.subject-date-results .src,.subject-date-results .tax,.subject-date-results .dates{font-size:1rem}
.subject-date-results .product{font-size:.95rem;line-height:1.5}
.record-notes{margin:1.2rem 0;padding:.35rem 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.record-notes>summary{font-weight:650;font-size:1rem}
.record-notes .evidence-summary{border:0;background:transparent;padding:0;margin:1rem 0}
.planning-notes{margin:1.5rem 0 2rem;max-width:64rem;scroll-margin-top:1rem}
.planning-notes h2{font-size:1.5rem;margin:0 0 .5rem}
.planning-notes details{border-bottom:1px solid var(--line);padding:.25rem 0}
.planning-notes summary{font-weight:650}
.planning-notes details p{max-width:55rem;margin:.5rem 0 1rem}
.planning-notes .planning-scope{color:var(--muted);font-weight:650}
body[data-page="resort"] .card{background:transparent;border-left:0;border-right:0;border-radius:0;padding:1.2rem 0}
body[data-page="resort"] .historical-card,body[data-page="resort"] .retrieval-details{background:transparent;border-left:0;border-right:0;border-radius:0}
body[data-page="resort"] .historical-card .card{padding:0}
body[data-page="resort"] .section-nav{margin-top:1.5rem}
/* Ski courses on a resort page: app/templates/_course_counts.html, one section after the About
   block. EVERY NUMERAL IN IT IS THE RESORT'S: the template renders printed literals, reading
   dates, evidence URLs and registered sentences, and tests/test_resort_courses.py removes the
   first three from every rendered section (one per reading or checked absence, eight today;
   unread rows render none) and fails on any digit left. So nothing here may draw a quantity,
   and three ways of drawing one were rejected on 2026-09-16:
   1. A bar per level. No template carries an inline style attribute (zero across app/templates,
      now asserted), so a width needs a hundred and one width classes or an SVG width filled from
      the integer companion -- and app/validation.py says numeric tokens are "never used for
      rendering". Happo-one prints コースレベル比率 30/50/20 beside 16コース, and 30% of 16 is 4.8,
      so a bar under a count pictures a relation the page does not make; Kusatsu prints its
      percentages after コース全長 with no stated basis, so there is no whole to draw against.
      <meter> was rejected too: its UA fill turns green, amber or red with low/high/optimum and
      would grade 初級 and 上級 by hue. The owner decided on 2026-09-16 that nothing is drawn;
      reversing that is a template, stylesheet and test change, never a data change.
   2. A hue per level. Green/blue/red/black is not what these pages print, and the categorical
      hues are already spent on region groupings in style.css.
   3. A tinted panel for an absence. forced-colors:active drops author backgrounds (handled in
      style.css, shortlist.css and price-clarity.css), so a background that meant "nothing is
      shown here, and why" would vanish for the readers who asked for contrast.
   WHAT CARRIES EACH DISTINCTION, none of it hue: a resort's literal against a sentence of this
   site is weight 700 against 400 in the same --fg, plus lang="ja"; "nothing is shown, and why"
   is a 3px solid left rule in --muted, 5.52:1 on the light page (#526777 on #f5f8fa) and 9.34:1
   on the dark one (#b0c1cc on #101c25), where --line would give 1.33:1 and 2.15:1, under the
   3:1 non-text minimum; CanvasText under forced colours. tests/check_course_counts.py measures
   both in Chromium -- the two weights, and the rule's width and its contrast against whatever
   is behind it, in light, dark and forced colours -- and fails any background on an absence or
   on the section. Nothing in a stylesheet tells --muted from --line, so tests/
   test_resort_courses.py pins the declaration itself and refuses a colour literal or background
   in any rule, in any sheet, whose selector names a course element.
   PHONES. Shiga Kogen's English evidence URL is fifty characters and Niseko United lists five
   URLs; /s/naeba once pinned scrollWidth at 380px with a 53-character URL (tests/
   check_map_renders.py, section 4b). Every link here may break anywhere, and the two-column
   list stacks below 34rem, the breakpoint price-clarity.css uses. */
.course-counts{margin:1.5rem 0 2rem;max-width:64rem;scroll-margin-top:1rem}
.course-facts{display:grid;grid-template-columns:minmax(8rem,max-content) minmax(0,1fr);gap:.55rem 1.25rem;margin:.9rem 0}
.course-facts dt{color:var(--muted);font-weight:600}
.course-facts dd{margin:0;min-width:0}
.course-facts dd p{margin:0 0 .35rem}
.course-count,.course-split,.course-season{font-weight:700;color:var(--fg)}
.course-count,.course-split{font-size:1.15rem;line-height:1.45}
.course-part-label{font-weight:600;margin-right:.5rem}
.course-basis{font-weight:400;color:var(--fg)}
.course-parts{list-style:none;margin:0;padding:0;display:grid;gap:.2rem}
.course-slot-absence,.course-absence-reason{font-weight:400;color:var(--fg);border-left:3px solid var(--muted);padding-left:.7rem}
.course-absence-reason{margin:.6rem 0}
.course-counts a{overflow-wrap:anywhere}
.course-evidence{list-style:none;margin:.3rem 0 0;padding:0}
.course-evidence li{display:flex;align-items:center;min-height:44px;min-width:0}
@media(max-width:34rem){.course-facts{grid-template-columns:minmax(0,1fr);gap:.15rem 0}.course-facts dd{margin-bottom:.7rem}}
@media(forced-colors:active){.course-slot-absence,.course-absence-reason{border-left-color:CanvasText}}
@media(min-width:52rem){
  .subject-date-results>.lines>.price{display:grid;grid-template-columns:minmax(12rem,24%) minmax(0,1fr);column-gap:2rem;align-items:start}
  .subject-date-results>.lines>.price>.price-head{grid-column:1;grid-row:1 / span 15;display:flex;flex-direction:column;align-items:flex-start;gap:.7rem}
  .subject-date-results>.lines>.price>*:not(.price-head){grid-column:2}
  .subject-date-results>.lines>.price>.price-meta{margin-top:0}
}
@media(max-width:64rem){
  header.site nav{gap:.8rem}
  .home-regions .region-links{gap:.5rem 1.8rem}
}
@media(max-width:48rem){
  header.site{padding-top:1rem;padding-bottom:.7rem;gap:.8rem}
  header.site nav{width:100%;margin-left:0;justify-content:space-between;gap:.3rem}
  .navlink{font-size:.88rem}
  .navlink.nav-price-search{padding:.65rem .7rem}
  .story-links{display:block}
  .story-links li{margin:.2rem 0}
  .home-regions .region-links .quiet{display:none}
  .subject-date-fields{gap:.9rem;padding:1rem}
  .subject-date-results .price .figure{font-size:2.6rem}
}
@media(max-width:34rem){
  header.site .brand-logo{width:8.5rem}
  header.site .brand-sub{font-size:.7rem}
  /* One menu row on a phone, so the first prices start higher up (review finding P2-27):
     the logo already links home, "Saved plans" shows as "Saved" (its aria-label keeps
     the full name for screen readers), and the spacing between items is a little
     tighter so the row still fits in the wider letters of an iPhone's own font. */
  header.site nav{gap:.1rem;justify-content:flex-start}
  .navlink{font-size:.81rem;padding:.6rem .25rem}
  .navlink.nav-price-search{margin-left:auto;font-size:.8rem;padding:.6rem .45rem}
  .navlink.nav-home,.navlink .nav-long{display:none}
  .home-regions .region-links{gap:.25rem 1.5rem}
  .subject-date-fields label{flex-basis:100%}
  .subject-date-fields button{flex-basis:100%}
  /* A resort page's heading is the resort's name and "lift pass prices" (review finding
     P1-8), two lines on a phone. A slightly smaller heading and less space under the
     coverage line keep the first At a glance price on an iPhone SE's first screen
     (review finding P2-27). */
  .resort-heading h1{font-size:2rem}
  .coverage-summary{font-size:1rem;margin-bottom:1.2rem}
}

/* Date-result summaries share one layout on the finder and resort pages.
   Archive figures use the original renderer unless a separate reviewed summary exists. */
.ticket-summary{min-width:0;overflow-wrap:anywhere}
.subject-date-results>.lines>.price:has(>.ticket-summary){display:block}
.ticket-top{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:2rem;padding:.5rem 0 1.25rem;border-bottom:1px solid var(--line)}
.ticket-price{min-width:0}
.ticket-price .product{display:block;margin:0 0 .45rem;font-size:1rem}
.ticket-summary .ticket-price .figure{display:block;font-size:clamp(2.1rem,4.2vw,3.1rem);font-weight:650;line-height:1.15;letter-spacing:-.025em;overflow-wrap:anywhere}
.ticket-unit{font-size:.9rem;color:var(--muted);margin:.35rem 0 .7rem}
.ticket-facts{display:grid;gap:1rem;margin:0}
.ticket-facts>div{min-width:0}
.ticket-facts dt{font-size:.87rem;color:var(--muted);margin-bottom:.2rem}
.ticket-facts dd{margin:0}
.ticket-duration,.ticket-age{font-size:1.2rem;font-weight:600;line-height:1.35}
.ticket-facts .ticket-use-rule,.ticket-facts .ticket-age-definition{font-size:.95rem;margin-top:.25rem}
.ticket-summary .price-meta{font-size:.87rem;margin:.8rem 0}
.ticket-date{margin:1rem 0;padding:.8rem 1rem;border-left:3px solid var(--line);background:var(--panel);font-size:.95rem}
.ticket-date.warnbox{border-left-color:var(--warn);background:var(--warn-bg)}
.ticket-date p{margin:0}
.ticket-date p:first-child{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.3rem 1.2rem}
.ticket-date p+p{margin-top:.45rem}
.ticket-date strong{font-weight:650}
.ticket-date.warnbox strong{color:var(--warn)}
.ticket-summary h4{font-size:1rem;line-height:1.4;font-weight:600;margin:1.2rem 0 .5rem}
.ticket-conditions{font-size:.95rem}
.ticket-summary .distinguishers{gap:.2rem 1rem;margin:.5rem 0 .8rem}
.ticket-summary .distinguishers li{font-size:.95rem;background:transparent;border:0;border-radius:0;padding:0}
.ticket-important{padding-left:1.25rem;margin:.6rem 0 1rem;display:grid;gap:.5rem}
.ticket-source-warnings ul{margin:.4rem 0 0;padding-left:1.2rem}
.ticket-source-warnings li+li{margin-top:.4rem}
.ticket-summary .note,.ticket-summary .dates,.ticket-summary .tax{font-size:.9rem;line-height:1.6;overflow-wrap:anywhere}
.ticket-conditions .tax{margin-top:.8rem}
.ticket-capture{display:flex;align-items:flex-start;justify-content:space-between;gap:.6rem 1.5rem;margin-top:1.25rem;padding:1rem 0;border-top:1px solid var(--line);font-size:.87rem}
.ticket-capture .ticket-capture-date{margin:0;flex:1 1 40%}
.ticket-capture-help{display:block;color:var(--muted)}
.ticket-capture .src{margin:0;flex:1 1 55%;font-size:.87rem}
.ticket-capture a{overflow-wrap:anywhere;word-break:normal}
.ticket-evidence{border-top:1px solid var(--line)}
.ticket-evidence>summary{font-size:.95rem;font-weight:600;padding:.8rem 0;min-height:48px}
.ticket-evidence-content{padding:0 0 .5rem;min-width:0;font-size:.9rem}
.ticket-evidence-content .ticket-evidence-note{white-space:normal;overflow:visible;max-height:none;overflow-wrap:anywhere}
.ticket-evidence-content ul{padding-left:1.25rem}
@media(max-width:34rem){
  .ticket-top{grid-template-columns:1fr;gap:1.4rem;padding-top:.3rem}
  .ticket-facts{gap:1rem}
  .ticket-date{padding:.7rem .8rem}
  .ticket-capture{flex-direction:column;gap:.75rem}
  .ticket-capture .src,.ticket-capture .ticket-capture-date{flex:auto;width:100%}
}

/* Approved Karuizawa afternoon archive summaries; original renderer is the fallback. */
.card .price:has(>.afternoon-record){display:block}
.afternoon-record{display:grid;grid-template-columns:minmax(10rem,19%) minmax(0,1fr);gap:1.6rem;padding:0;align-items:start}
.afternoon-price,.afternoon-body{min-width:0}.afternoon-product{font-size:1rem;font-weight:600;margin:0 0 .6rem}.afternoon-product span{font-size:.85rem;font-weight:400;color:var(--muted)}
.afternoon-price .figure{display:block;font-size:2rem;font-weight:650;line-height:1.2;letter-spacing:-.02em;margin:0 0 .7rem;overflow-wrap:anywhere}
.afternoon-price .price-meta{margin-top:.65rem;font-size:.8rem}.afternoon-facts{display:grid;grid-template-columns:1fr 1.2fr 1.1fr;gap:1rem;margin:0 0 1rem}.afternoon-facts div{min-width:0}.afternoon-facts dt{font-size:.75rem;color:var(--muted);margin-bottom:.2rem}.afternoon-facts dd{margin:0;font-size:.95rem;font-weight:600;line-height:1.4}.afternoon-facts .fact-help{font-size:.78rem;color:var(--muted);font-weight:400;margin-top:.15rem}
.afternoon-period{font-size:.9rem;border-top:1px solid var(--line);padding-top:.8rem;margin:.4rem 0 .7rem}.afternoon-period p{margin:.2rem 0}.afternoon-period strong{font-weight:600}.period-dates{font-size:.85rem;margin-top:.35rem}.period-dates summary{color:var(--link);cursor:pointer}.period-dates ul{padding-left:1.2rem;margin:.5rem 0}
.afternoon-warnings{background:var(--warn-bg);border-left:3px solid var(--warn);border-radius:0 4px 4px 0;padding:.65rem .8rem;margin:.7rem 0;font-size:.85rem;line-height:1.5}.afternoon-warnings>strong{font-weight:600}.afternoon-warnings ul{padding-left:1.05rem;margin:.35rem 0 0}.afternoon-warnings li+li{margin-top:.25rem}
.afternoon-conditions{font-size:.87rem;line-height:1.55;padding-left:1.1rem;margin:.8rem 0}.afternoon-conditions li+li{margin-top:.4rem}.afternoon-source{font-size:.8rem;margin:.75rem 0}
.afternoon-evidence{border-top:1px solid var(--line);padding-top:.75rem;margin-top:.8rem}.afternoon-evidence>summary{font-size:.87rem;font-weight:600;cursor:pointer;color:var(--link);padding:.15rem 0;min-height:28px}.afternoon-evidence[open]>summary{margin-bottom:1rem}.afternoon-evidence .evidence-content{font-size:.87rem;line-height:1.65;overflow-wrap:anywhere;color:var(--muted)}.afternoon-evidence .evidence-content h4{color:var(--fg);margin:1.2rem 0 .3rem}.afternoon-evidence .evidence-content p{margin:.3rem 0 .7rem}.afternoon-evidence .evidence-content ul{padding-left:1.2rem}.evidence-identity{overflow-wrap:anywhere}
.afternoon-evidence>summary:focus-visible,.period-dates>summary:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
@media(max-width:640px){.afternoon-record{display:block}.afternoon-price{display:flex;align-items:center;flex-wrap:wrap;column-gap:.65rem}.afternoon-product{width:100%;margin:0 0 .4rem}.afternoon-price .figure{font-size:1.8rem;margin:0}.afternoon-price .price-meta{width:100%;margin:.4rem 0 1rem}.afternoon-facts{grid-template-columns:1fr 1fr;gap:.75rem}.afternoon-facts>div:last-child{grid-column:1/-1;display:flex;gap:.4rem;align-items:baseline;flex-wrap:wrap}.afternoon-facts>div:last-child dt{margin-right:.2rem}.afternoon-warnings{padding:.6rem .65rem}.afternoon-evidence>summary{padding:.35rem 0}}
