/* Application states and components that sit on top of the shared visual system. */
html, body.composer-page {min-width:0}
.filter-bar .region-filter {display:block;min-width:0}
.filter-bar .region-filter select {width:100%;height:100%;min-height:48px}
@media(min-width:601px){.filter-bar{grid-template-columns:minmax(0,1fr) minmax(185px,24%)}}
.filter-count {display:flex;justify-content:space-between;align-items:center;margin:0 0 14px;color:var(--muted);font-size:12px}
.filter-count .text-button {font-size:11px}
.selection-caption {display:block!important;font:500 11px/1.4 Poppins,sans-serif!important;color:var(--saffron)!important;margin-top:10px}
.added-badge {position:absolute;bottom:10px;left:10px;padding:3px 8px;background:var(--saffron);color:var(--ink);font-size:10px;font-weight:600}
.activity-feature-copy h2 {font-size:clamp(27px,2.6vw,42px);line-height:1.03}
.activity-feature {position:relative;text-align:left}
.activity-feature .select-indicator {top:12px;right:12px}
.activity-grid:has(.activity-photo-card) {gap:14px}
.activity-photo-card .card-image {aspect-ratio:1.55;overflow:hidden}
.activity-photo-card .card-image img {transition:transform .25s ease}
.activity-photo-card:hover .card-image img {transform:scale(1.025)}
.activity-photo-card .card-copy {padding:16px}
.activity-photo-card .card-copy h3 {font-size:clamp(25px,2vw,30px);line-height:1.04}
.activity-photo-card .card-copy .meta {display:block;margin-top:8px;font-size:10px;line-height:1.6}
@media(max-width:600px){.activity-grid:has(.activity-photo-card){gap:10px}.activity-photo-card .card-copy{padding:12px}.activity-photo-card .card-copy h3{font-size:24px}.activity-photo-card .card-copy .meta{font-size:9px}}
@media(prefers-reduced-motion:reduce){.activity-photo-card .card-image img{transition:none}.activity-photo-card:hover .card-image img{transform:none}}
.activity-feature-copy {padding-right:45px}
.notebook-summary .selection-list {max-height:240px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#8199a5 transparent;padding-right:2px}
.notebook-empty {max-width:30ch}
.places-summary {font-size:10px;line-height:1.6;color:#bdd0d9;margin-top:12px}
.places-summary strong {font-weight:400;color:#e9eeec}
.places-summary p {margin-top:4px}
.notebook-reset {display:block;margin:14px auto 0;font-size:9px;color:#bdd0d9;text-decoration:underline;text-underline-offset:3px;min-height:25px}
.notebook-reset:hover {color:white}
.selection-copy {min-width:0}
.selection-copy strong {overflow-wrap:anywhere}
.selection-row .remove-choice {align-self:center;min-width:28px;min-height:32px;font-size:22px;color:#d8e5e9}
.selection-row {grid-template-columns:67px minmax(0,1fr)32px}
.notebook-summary .selection-list {overflow-x:hidden}
.frame-intro {display:flex;gap:18px;align-items:center;padding:20px 0 24px;color:var(--muted)}
.frame-intro svg {width:46px;color:var(--navy)}
.frame-panel .month-select {display:block}
.frame-panel select {height:48px;min-width:220px;padding:0 14px;background:var(--paper);border:1px solid var(--line)}
.frame-panel>.primary-button {margin-top:25px}
.circuit-guidance {display:flex;justify-content:space-between;gap:15px;align-items:center;padding:5px 0 18px;color:var(--muted);font-size:12px}
.circuit-choice {display:block;margin-top:16px;color:var(--ink);font-weight:600;font-size:11px}
.circuit-card .card-copy .eyebrow {font-size:8px;color:var(--amber);margin-bottom:6px}
.empty-state svg {width:45px;height:45px;margin:0 auto 18px}
.share-field {display:grid;gap:10px;font-size:11px;margin:22px 0 15px}
.share-field input {width:100%;height:46px;border:1px solid var(--line);padding:10px;font-size:12px;background:white}
.share-feedback,.field-error {font-size:12px;color:#9b3125}
.micro {font-size:10px!important;line-height:1.6!important;color:var(--muted);margin-top:14px}
.plan-frame {color:var(--muted);font-size:12px;line-height:1.7;margin:12px 0 22px}
.duration-conflict {margin:24px 0;padding:14px 0;border-block:1px solid var(--line);font-size:12px;line-height:1.8;color:var(--amber)}
.duration-conflict .text-button {margin-left:10px}
.mobile-plan-map {display:none;margin:24px 0;border:1px solid var(--line)}
.mobile-plan-map>summary {display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px;cursor:pointer;list-style:none;font-size:12px}
.mobile-plan-map>summary::-webkit-details-marker {display:none}
.mobile-plan-map>summary span {color:var(--amber);font-size:20px;transition:transform .2s ease}
.mobile-plan-map[open]>summary span {transform:rotate(45deg)}
.mobile-plan-map .mobile-map-content {display:block;position:static;max-height:none;padding:22px}
.mobile-plan-map .route-map {max-width:340px;margin:auto}
.mobile-plan-map .micro {color:#bdd0d9}
.itinerary-disclaimer {font-size:11px;line-height:1.8;color:var(--muted);margin:24px 0}
.day-content h2 {font-size:clamp(29px,2.6vw,40px);line-height:1.05;margin:8px 0 12px}
.day-envies {font-size:11px!important;color:var(--amber)!important;border-top:1px solid var(--line);padding-top:12px;margin-top:14px}
.plan-places {display:grid;gap:14px;margin-top:18px;padding-top:18px;border-top:1px solid #e0eaed70}
.plan-places li {display:flex;gap:15px;font-size:12px;align-items:flex-start}
.plan-places li>span {color:var(--saffron);font-size:10px;margin-top:2px}
.plan-places strong,.plan-places small {display:block}
.plan-places small {font-size:9px;line-height:1.6;color:#bdd0d9;margin-top:2px}
.project-panel {scroll-margin-top:100px}
.project-panel .eyebrow {color:var(--amber)}
.field-wide {grid-column:1/-1}
.optional {font-weight:400;color:var(--muted);font-size:10px}
.project-panel .prototype-note {font-size:11px;line-height:1.7;max-width:60ch}
.project-confirmation {padding:20px 0}
.project-confirmation h3 {font-size:38px;margin-bottom:14px}
.project-confirmation>p {color:var(--muted);line-height:1.8;margin-bottom:20px}
.project-confirmation .plan-actions {flex-wrap:wrap}
.plan-bottom {display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:1px solid var(--line);margin:35px 0 15px;padding-top:20px;font-size:11px}
.composer-footer {display:flex;justify-content:space-between;align-items:flex-start;gap:25px;max-width:var(--max);margin:0 auto;padding:20px var(--gutter) 35px;border-top:1px solid var(--line);font-size:10px;color:var(--muted)}
.photo-credits {max-width:500px}.photo-credits summary{cursor:pointer;text-decoration:underline;text-underline-offset:4px;text-align:right}.photo-credits div{padding-top:18px;line-height:1.8}.photo-credits p+p{margin-top:10px}.photo-credits a{text-decoration:underline}
.new-point {transform-box:fill-box;transform-origin:center;animation:point-arrival .28s ease-out both}
.new-leg {animation:leg-arrival .35s ease-out both}
@keyframes point-arrival {from {opacity:0;transform:scale(.75)} to {opacity:1;transform:scale(1)}}
@keyframes leg-arrival {from {opacity:0} to {opacity:.9}}
@media(max-width:900px){.notebook-dialog .selection-list{max-height:none}.plan-map-panel .route-map{max-width:360px;margin:auto}.plan-map-panel .plan-places{grid-template-columns:repeat(2,minmax(0,1fr))}.plan-map-panel .notebook-heading h2{font-size:32px}.plan-map-panel .notebook-footer{display:none}.composer-layout{padding-bottom:100px}.plan-layout>.plan-map-panel{display:none}.mobile-plan-map{display:block}}
@media(max-width:600px){.filter-bar .region-filter select{height:44px;min-height:44px}.selection-caption{font-size:10px!important}.activity-feature-copy{padding-right:25px}.activity-feature-copy h2{font-size:35px}.circuit-guidance{align-items:flex-start;flex-direction:column}.notebook-dialog .places-summary{font-size:11px}.plan-places small{font-size:10px}.plan-map-panel .plan-places{grid-template-columns:1fr}.project-panel{scroll-margin-top:125px}.plan-bottom{align-items:flex-start;flex-direction:column}.frame-panel select{width:100%;min-width:0}}
@media(prefers-reduced-motion:reduce){.new-point,.new-leg{animation:none}}
@media(max-width:600px){.selection-row{grid-template-columns:56px minmax(0,1fr)32px}.selection-row>img{width:56px}.notebook-dialog .dialog-header{position:sticky;top:0;background:var(--navy);z-index:2}}
@media(max-width:900px){.composer-footer{padding-bottom:115px}.composer-footer{flex-wrap:wrap}.photo-credits summary{text-align:left}}
@media print{.plan-bottom{display:none}.day-photo{max-width:180px}.day-envies{color:#222!important}}

/* One continuous composition: every family is visible in the document. */
.composer-main > .filter-bar {margin-top:28px;margin-bottom:32px}
#category-content {display:block;min-width:0}
.composer-section {min-width:0;scroll-margin-top:100px}
.composer-section + .composer-section {margin-top:clamp(44px,5.2vw,78px);padding-top:clamp(29px,3.2vw,48px);border-top:1px solid var(--line)}
.composer-section-heading {margin-bottom:21px}
.composer-section-heading .eyebrow {margin-bottom:8px;font-size:9px;letter-spacing:.23em}
.composer-section-heading h2 {max-width:850px;font-size:clamp(35px,3.3vw,52px);line-height:1.01;letter-spacing:-.035em;text-wrap:balance}
.section-choices {min-width:0}
.section-choices > .section-heading:first-child {margin-top:0}
.section-choices > .frame-panel {padding-top:0}
.composer-section .more-button {display:none}
.composer-section .empty-state {padding-block:28px}
.composer-section .filter-count {margin-bottom:18px}
.composer-layout > .notebook {align-self:start}

/* Longer pépite collections use compact rows and one deliberate large opening. */
.composer-section .pepite-grid:has(> .pepite-card:nth-child(6)) {
  grid-template-columns:repeat(3,minmax(0,1fr));
  grid-auto-rows:clamp(185px,17vw,250px);
  grid-auto-flow:row;
  gap:12px;
}
.composer-section .pepite-grid:has(> .pepite-card:nth-child(6)) > .pepite-card {
  grid-column:auto;
  grid-row:auto;
  min-height:0;
  height:100%;
  aspect-ratio:auto;
}
.composer-section .pepite-grid:has(> .pepite-card:nth-child(6)) > .pepite-card:first-child {
  grid-column:span 2;
  grid-row:span 2;
}
.composer-section .pepite-grid:has(> .pepite-card:nth-child(6)) > .pepite-card:first-child .card-content {padding:90px 22px 22px}
.composer-section .pepite-grid:has(> .pepite-card:nth-child(6)) > .pepite-card:first-child .card-content h3 {font-size:clamp(34px,3vw,48px)}
.composer-section .pepite-grid:has(> .pepite-card:nth-child(6)) > .pepite-card:first-child .card-content p {max-width:38ch}

@media (max-width:1100px) and (min-width:901px) {
  .composer-section .pepite-grid:has(> .pepite-card:nth-child(6)) {grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:205px}
  .composer-section .pepite-grid:has(> .pepite-card:nth-child(6)) > .pepite-card:first-child {grid-column:span 2;grid-row:auto}
  .composer-section .pepite-grid:has(> .pepite-card:nth-child(6)) > .pepite-card:first-child .card-content {padding:50px 18px 17px}
  .composer-section .pepite-grid:has(> .pepite-card:nth-child(6)) > .pepite-card:last-child:nth-child(even) {grid-column:span 2}
}
@media (max-width:900px) {
  .composer-main > .filter-bar {margin-top:25px;margin-bottom:28px}
  .composer-section + .composer-section {margin-top:52px;padding-top:33px}
  .composer-section-heading {margin-bottom:18px}
  .composer-section-heading h2 {font-size:clamp(35px,5.1vw,47px)}
}
@media (max-width:640px) {
  .composer-main > .filter-bar {margin-top:23px;margin-bottom:29px}
  .composer-section {scroll-margin-top:125px}
  .composer-section + .composer-section {margin-top:39px;padding-top:27px}
  .composer-section-heading {margin-bottom:17px}
  .composer-section-heading .eyebrow {font-size:8px;letter-spacing:.21em;margin-bottom:7px}
  .composer-section-heading h2 {font-size:clamp(33px,7.8vw,41px);line-height:1.03}
  .composer-section .pepite-grid:has(> .pepite-card:nth-child(6)) {grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:220px;gap:10px}
  .composer-section .pepite-grid:has(> .pepite-card:nth-child(6)) > .pepite-card:first-child {grid-column:span 2;grid-row:auto}
  .composer-section .pepite-grid:has(> .pepite-card:nth-child(6)) > .pepite-card:first-child .card-content {padding:60px 17px 17px}
  .composer-section .pepite-grid:has(> .pepite-card:nth-child(6)) > .pepite-card:first-child .card-content h3 {font-size:35px}
  .composer-section .pepite-grid:has(> .pepite-card:nth-child(6)) > .pepite-card:last-child:nth-child(even) {grid-column:span 2}
  .composer-section .frame-panel {max-width:100%}
  .composer-section .option-list {gap:8px}
  .composer-section .option-button {max-width:100%;white-space:normal}
}
@media (max-width:370px) {
  .composer-section-heading h2 {font-size:33px}
  .composer-section .pepite-grid:has(> .pepite-card:nth-child(6)) {grid-auto-rows:205px;gap:8px}
  .composer-section .pepite-grid:has(> .pepite-card:nth-child(6)) > .pepite-card:first-child .card-content h3 {font-size:32px}
}
