/* Twin Hills Halloween RC9 UX hardening layer.
   Extends the canonical Faithful design without replacing it. */

:root{
  --tap-min:40px;
  --tap-min-mobile:44px;
  --control-border:rgba(213,151,88,.28);
}

/* Prevent operational labels and generated preview copy from escaping surfaces. */
.print-sheet,
.print-sheet *{min-width:0;max-width:100%;}
.print-sheet{overflow:hidden;contain:paint;}
.print-sheet strong{
  display:block;
  font-size:clamp(16px,1.2vw,20px)!important;
  line-height:1.02!important;
  overflow-wrap:normal;
  word-break:normal;
  hyphens:none;
  text-wrap:balance;
  letter-spacing:-.015em;
}
.print-sheet small{overflow-wrap:anywhere;}

/* Compact controls should stay compact without becoming microscopic. */
.text-action,
.button-compact{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:34px;
  padding:7px 10px;
  border-radius:8px;
  line-height:1.1;
  font-size:12px;
  font-weight:750;
  letter-spacing:.015em;
  text-decoration:none;
  cursor:pointer;
}
button.text-action,
a.text-action{
  border:1px solid rgba(226,168,104,.24);
  background:rgba(255,255,255,.035);
}
button.text-action:hover,
a.text-action:hover,
button.text-action:focus-visible,
a.text-action:focus-visible{
  border-color:rgba(236,139,55,.65);
  background:rgba(236,139,55,.12);
}
.text-action.danger,
[data-status="removed"].text-action,
[data-hide].text-action{border-color:rgba(216,92,74,.3);color:#f2b0a5;}
.action-row{row-gap:8px;}

/* Live map: clearer toolbar and filters, still faithful to the original design. */
.quick-filters{gap:7px!important;}
.filter-button{
  min-height:36px!important;
  padding:8px 12px!important;
  font-size:11px!important;
  line-height:1.1!important;
  border-radius:999px!important;
  white-space:nowrap;
}
.advanced-filters select{min-height:42px;}
.map-toolbar{
  display:flex!important;
  flex-wrap:wrap;
  align-items:center;
  gap:7px!important;
  max-width:min(690px,calc(100% - 28px));
}
.map-toolbar>button,
.map-toolbar>a{
  min-height:40px!important;
  padding:8px 12px!important;
  font-size:10px!important;
  line-height:1.15!important;
  white-space:nowrap;
}
#my-night-count{
  display:inline-grid;
  place-items:center;
  min-width:20px;
  min-height:20px;
  padding-inline:5px;
  margin-left:3px;
  border-radius:999px;
  background:rgba(255,255,255,.13);
}
.directory-card-actions{display:flex;align-items:center;flex-wrap:wrap;gap:6px;}
.directory-card-actions .text-action{min-height:32px;padding:6px 9px;}
.directory-expand-toggle{
  display:none;
  width:100%;
  min-height:42px;
  margin:8px 0 12px;
  border:1px solid rgba(231,157,83,.34);
  border-radius:10px;
  background:rgba(234,133,42,.09);
  color:var(--cream);
  font-weight:750;
  cursor:pointer;
}

/* Live Walk is an outdoor, one-handed control surface. */
.live-walk-panel{max-width:min(470px,calc(100% - 24px));}
.live-walk-actions{gap:8px!important;}
.live-walk-actions>button{
  min-height:40px!important;
  padding:9px 12px!important;
  font-size:11px!important;
}
.live-walk-collapse{min-width:40px!important;min-height:40px!important;}
.live-walk-state,.live-walk-signal{font-size:11px!important;}

/* Registration selection cards should read clearly as controls. */
.select-card,
.participation-path,
.consent-row{position:relative;cursor:pointer;}
.select-card>input,
.participation-path>input{
  width:20px!important;
  height:20px!important;
  min-width:20px;
  accent-color:#e87e2c;
}
.select-card:has(input:focus-visible),
.participation-path:has(input:focus-visible){
  outline:3px solid rgba(242,153,69,.52);
  outline-offset:3px;
}
.select-card:has(input:checked){
  border-color:rgba(235,139,52,.75)!important;
  background:linear-gradient(135deg,rgba(234,126,37,.14),rgba(103,64,117,.10))!important;
  box-shadow:inset 0 0 0 1px rgba(255,195,127,.13);
}
.participation-path:has(input:checked) b{min-width:74px;text-align:center;}

/* Admin: dense workflows should stay skimmable and operationally efficient. */
.admin-page .button-quiet,
.admin-page .button-secondary,
.admin-page .button,
.admin-page .text-action{min-height:36px;}
.admin-page .data-table td,
.admin-page .data-table th{padding-block:12px!important;}
.admin-page .data-table .action-row{min-width:155px;}
.admin-page .data-table .text-action{font-size:11px;}
.admin-filter-bar{
  display:grid;
  grid-template-columns:minmax(180px,1.3fr) repeat(3,minmax(140px,.7fr));
  gap:10px;
  align-items:end;
  width:100%;
}
.admin-filter-bar .field{margin:0;}
.admin-filter-bar input,
.admin-filter-bar select{min-height:42px;width:100%;}
.admin-results-meta{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  padding:12px 0 10px;
  color:var(--muted);
  font-size:12px;
}
.admin-pagination{display:flex;align-items:center;gap:8px;}
.admin-pagination button{min-height:36px;min-width:76px;}
.admin-media-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}
.admin-media-grid .print-product{min-width:0;}
.admin-media-grid .print-thumb{aspect-ratio:4/3;}
.admin-media-grid .print-thumb button{display:block;width:100%;height:100%;border:0;padding:0;background:none;cursor:zoom-in;}
.admin-media-grid .print-thumb img{width:100%;height:100%;object-fit:cover;}
.admin-media-grid .copy{padding:15px 16px 17px;}
.admin-media-grid .copy h3{overflow-wrap:anywhere;}
.admin-media-grid .action-row{margin-top:12px;}
.admin-media-grid .text-action{flex:0 0 auto;}
.media-owner-line{margin-top:8px!important;}
.admin-registration-review{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(240px,.85fr);
  gap:22px;
}
.admin-registration-review dl{display:grid;grid-template-columns:150px 1fr;gap:8px 14px;margin:0;}
.admin-registration-review dt{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.09em;}
.admin-registration-review dd{margin:0;overflow-wrap:anywhere;}
.admin-registration-review .review-photos{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
.admin-registration-review .review-photos img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:8px;}
.admin-registration-review .review-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px;}
.review-activity-list{display:grid;gap:8px;padding:0;margin:0;list-style:none;}
.review-activity-list li{display:flex;justify-content:space-between;gap:12px;padding:9px 10px;border:1px solid rgba(225,161,91,.15);border-radius:8px;background:rgba(255,255,255,.025);}
.review-activity-list span{color:var(--muted);font-size:12px;text-align:right;}
.content-field-card .text-action,
[data-content-reset]{min-height:34px!important;padding:7px 10px!important;}

/* Residence codes should read as examples, not pre-filled credentials. */
.code-entry .code-example{margin:.8rem 0 0;color:var(--muted);font-size:12px;}

/* Stronger keyboard focus, including image/gallery controls. */
:where(button,a,input,select,textarea,[tabindex]):focus-visible{
  outline:3px solid rgba(243,158,75,.72);
  outline-offset:3px;
}

/* Better phone ergonomics and less opaque nested scrolling. */
@media (max-width:900px){
  .directory-expand-toggle{display:block;}
  .map-sidebar .directory-list{
    max-height:510px!important;
    overflow:hidden!important;
    padding-right:0!important;
    mask-image:linear-gradient(to bottom,#000 0,#000 calc(100% - 46px),transparent 100%);
  }
  .map-sidebar.directory-expanded .directory-list{
    max-height:none!important;
    overflow:visible!important;
    mask-image:none;
  }
  .map-toolbar{
    position:sticky!important;
    top:8px;
    width:calc(100% - 16px)!important;
    max-width:none!important;
    margin:8px!important;
    padding:7px!important;
    overflow-x:auto!important;
    flex-wrap:nowrap!important;
    scrollbar-width:thin;
    background:rgba(5,14,22,.94)!important;
    backdrop-filter:blur(14px);
  }
  .map-toolbar>button,
  .map-toolbar>a{
    min-height:var(--tap-min-mobile)!important;
    padding:10px 13px!important;
    font-size:10px!important;
    flex:0 0 auto;
  }
  .filter-button{min-height:40px!important;padding:9px 13px!important;font-size:11px!important;}
  .directory-card-actions .text-action{min-height:38px;padding:8px 11px;}
  .live-walk-panel{max-width:calc(100% - 16px);}
  .live-walk-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));}
  .live-walk-actions>button{min-height:var(--tap-min-mobile)!important;font-size:12px!important;}
  .admin-filter-bar{grid-template-columns:1fr 1fr;}
  .admin-filter-bar .field:first-child{grid-column:1/-1;}
  .admin-media-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .admin-registration-review{grid-template-columns:1fr;}
  .footer-links a,.footer-bottom a{display:inline-flex;align-items:center;min-height:38px;}
}

@media (max-width:620px){
  .admin-filter-bar{grid-template-columns:1fr;}
  .admin-filter-bar .field:first-child{grid-column:auto;}
  .admin-media-grid{grid-template-columns:1fr;}
  .admin-results-meta{align-items:flex-start;flex-direction:column;}
  .admin-registration-review dl{grid-template-columns:1fr;gap:3px;}
  .admin-registration-review dd{margin-bottom:9px;}
  .review-activity-list li{display:block;}
  .review-activity-list span{display:block;text-align:left;margin-top:4px;}
  .print-sheet strong{font-size:clamp(16px,5.4vw,20px)!important;}
}


.dialog.dialog-wide{width:min(1080px,calc(100vw - 40px));}
.dialog-registration-review .dialog-body{padding:24px;}
.dialog-registration-review .review-activity-list{display:grid;gap:8px;padding-left:18px;}
.dialog-registration-review .review-activity-list li{display:grid;gap:2px;}
.dialog-registration-review .review-activity-list span{color:var(--muted);font-size:12px;}
@media (max-width:760px){
  .dialog-backdrop{padding:8px;align-items:end;}
  .dialog{width:100%;max-height:94vh;}
  .dialog.dialog-wide{width:100%;}
  .dialog-registration-review .dialog-body{padding:18px;}
}

@media (prefers-reduced-motion:reduce){
  .js .reveal{opacity:1!important;transform:none!important;transition:none!important;}
}

/* The public layout is intentionally wide, but the viewport itself must never drift a few pixels wider on phones. */
@media (max-width:900px){
  html,body{max-width:100%;}
  body{overflow-x:clip;}
  .app-page,.site-header,.site-footer,.app-main,.map-layout,.map-stage,.map-sidebar{max-width:100%;}
}
.toast-repeated{animation:toast-repeat-pulse .42s ease;}
@keyframes toast-repeat-pulse{50%{transform:translateY(-2px);filter:brightness(1.18)}}
@media (prefers-reduced-motion:reduce){.toast-repeated{animation:none}}
@media (max-width:900px){
  .directory-card,.directory-card:hover,.directory-card.selected{transform:none!important;max-width:100%;box-sizing:border-box;}
}
.code-entry .code-example{
  color:#6a4b30!important;
  opacity:1!important;
  font-weight:700;
  line-height:1.4;
  margin:12px 0 14px!important;
}
.code-entry .code-example code{color:#a24c16;background:rgba(162,76,22,.08);padding:2px 5px;border-radius:4px;}
.admin-page .readiness-item>span:nth-child(2){display:grid;gap:3px;min-width:0;}
.admin-page .readiness-item>span:nth-child(2) small{display:block;overflow-wrap:anywhere;}
.admin-page .readiness-item>span:last-child{margin-left:auto;white-space:nowrap;}
/* Standalone text links should have a real hit area; inline prose links keep their natural text flow. */
.host-links a,
.print-links a,
.story-copy>.text-link,
.event-heading>.text-link,
.print-product .copy>a,
.content-editor-previews a,
.event-live-shell>a{
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding-block:6px;
}
@media (max-width:900px){
  .host-links a,
  .print-links a,
  .story-copy>.text-link,
  .event-heading>.text-link,
  .print-product .copy>a,
  .content-editor-previews a,
  .event-live-shell>a{min-height:40px;padding-block:9px;}
}

/* Mobile registration progress stays legible without forcing a long horizontal rail. */
.mobile-step-summary{
  display:none;
  align-items:baseline;
  justify-content:space-between;
  gap:14px;
  margin:-4px 0 22px;
  padding:11px 13px;
  border:1px solid rgba(227,157,87,.28);
  border-radius:10px;
  background:linear-gradient(135deg,rgba(220,116,32,.09),rgba(92,55,110,.08));
}
.mobile-step-summary span{
  color:var(--muted);
  font-size:10px;
  font-weight:850;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.mobile-step-summary strong{
  color:var(--cream);
  font:500 19px/1 var(--serif);
}
@media(max-width:620px){
  .form-stepper{
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    padding:0!important;
    margin:-1px!important;
    overflow:hidden!important;
    clip:rect(0,0,0,0)!important;
    white-space:nowrap!important;
    border:0!important;
  }
  .mobile-step-summary{display:flex;}
}