/* Migrated My Night legacy foundation, 2026-07-28. Current route-owner rules follow. */


.night-tab-panel{
  min-height:50vh;
}


.night-empty-state{
  display:grid;
  justify-items:center;
  gap:10px;
  padding:90px 20px;
  text-align:center;
  color:#777;
}

.night-empty-state span{
  font-size:34px;
}

.night-empty-state h2{
  margin:12px 0 4px;
  color:#222;
  font-size:22px;
}

.night-empty-state p{
  max-width:300px;
  margin:0;
  font-size:12px;
  line-height:1.5;
}


.night-sheet .night-checkin,
.night-sheet .night-create{
  display:block;
  padding:0;
  border:0;
}

.night-sheet .night-checkin{
  margin-bottom:25px;
}

.night-sheet .night-checkin form{
  display:grid;
  grid-template-columns:1fr auto;
}

.night-sheet .night-create form{
  display:grid;
  grid-template-columns:1fr;
}

.night-sheet .section-head{
  padding-top:0;
}

.night-sheet .section-head h2{
  color:#111;
}

.night-sheet-close{
  position:absolute;
  z-index:2;
  top:14px;
  right:18px;
  min-width:36px;
  border:0;
  background:transparent;
  color:inherit;
  font-size:28px;
  cursor:pointer;
}


.my-night-page{
  position:relative;
  min-height:100dvh;
  padding-bottom:110px;
  background:transparent;
  color:inherit;
}

body.my-night-route.my-night-tonight-active:not(.my-night-mine-active) .my-night-route-page .night-checkin-fab{
  display:none;
}

.night-loading{
  min-height:36vh;
}

.night-checkin,
.night-signin{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(300px,.72fr);
  gap:42px;
  align-items:end;
  max-width:none;
  margin:0;
  padding:66px 0;
  border-bottom:1px solid #242424;
}

.night-checkin h2,
.night-signin h2{
  margin:0;
  font-size:36px;
  line-height:1;
}

.night-checkin > div > p:last-child,
.night-signin > p{
  color:#979797;
}

.night-checkin form{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:end;
  gap:10px;
}

.night-checkin label,
.night-create label{
  display:grid;
  gap:7px;
  color:#aaa;
  font-size:11px;
  font-weight:750;
}

.night-checkin select,
.night-create input{
  min-height:48px;
  border:1px solid #333;
  border-radius:12px;
  padding:0 13px;
  background:#111;
  color:#fff;
  font:inherit;
}

.night-checkin .primary{
  min-height:48px;
  margin:0;
  border:0;
}

.night-checkin .form-note{
  grid-column:1/-1;
  margin:0;
}

.night-create{
  max-width:none;
  margin:0;
  padding:62px 0;
  border-bottom:1px solid #242424;
  color:var(--account-text);
}

.night-create form{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px 22px;
}

.night-auto-fields{
  grid-column:1/-1;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1px;
  overflow:hidden;
  border:1px solid var(--account-border);
  border-radius:18px;
  background:var(--account-border);
}

.night-auto-fields > div{
  display:grid;
  gap:5px;
  padding:18px;
  background:var(--account-raised);
  color:var(--account-text);
}

.night-auto-fields small{
  color:#00ff09;
  font-size:9px;
  font-weight:850;
  letter-spacing:.13em;
}

.night-auto-fields strong{
  font-size:20px;
}

.night-auto-fields span{
  color:var(--account-muted);
  font-size:11px;
}

.night-image-picker{
  grid-column:1/-1;
  min-height:120px;
  place-content:center;
  justify-items:center;
  border:1px dashed var(--account-border);
  border-radius:18px;
  background:var(--account-raised);
  cursor:pointer;
}

.night-image-picker span{
  color:var(--account-text);
  font-size:17px;
}

.night-image-picker small{
  color:var(--account-muted);
}

.night-image-picker input{
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
}

.night-image-preview{
  grid-column:1/-1;
  min-height:420px;
  border-radius:18px;
  background:center/cover;
}

.night-create fieldset{
  margin:0;
  border:0;
  padding:0;
}

.night-create legend{
  margin-bottom:9px;
  color:#aaa;
  font-size:11px;
  font-weight:750;
}

.night-create legend small,
.night-create label > small{
  color:var(--account-muted);
  font-weight:500;
}

.night-publish-choice{
  grid-column:1/-1;
  grid-template-columns:auto 1fr;
  align-items:center;
  border:1px solid var(--account-border);
  border-radius:14px;
  padding:14px;
  background:var(--account-raised);
}

.night-publish-choice input{
  width:18px;
  min-height:18px;
  accent-color:#00ff09;
}

.night-publish-choice small{
  grid-column:2;
}

.night-create .primary{
  justify-self:start;
  margin:0;
  border:0;
}

.night-create .form-note{
  align-self:center;
  margin:0;
}

.day-mode .night-checkin,
.day-mode .night-create{
  border-color:#ddd;
}

@media (max-width:719px){
.night-checkin,
.night-signin{
    grid-template-columns:1fr;
    gap:20px;
    padding:44px 0;
  }

.night-checkin h2,
.night-signin h2{
    font-size:30px;
  }

.night-checkin form,
.night-create form{
    grid-template-columns:1fr;
  }

.night-checkin .form-note,
.night-auto-fields,
.night-image-picker,
.night-image-preview,
.night-publish-choice{
    grid-column:1;
  }

.night-auto-fields{
    grid-template-columns:1fr;
  }

.night-create{
    padding:44px 0;
  }

.night-create .primary{
    width:100%;
  }

.night-image-preview{
    min-height:360px;
  }
}


.night-action-sheet{
  position:fixed;
  z-index:100;
  inset:0;
}

.night-action-sheet[hidden]{
  display:none;
}

.night-sheet-backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.52);
  backdrop-filter:blur(5px);
}

.night-sheet{
  position:absolute;
  right:0;
  bottom:0;
  left:0;
  max-height:88dvh;
  overflow:auto;
  padding:25px 24px 40px;
  border-radius:24px 24px 0 0;
  background:#eee;
  color:#111;
}

@media (max-width:719px){
.my-night-page{
    padding-bottom:96px;
  }


}

.night-checkin-sheet{
  background:var(--account-surface);
  color:var(--account-text);
}

.night-checkin-sheet [data-night-checkin-content]{
  min-height:210px;
}

.night-checkin-locating,
.night-checkin-error,
.night-checkin-found{
  display:grid;
  justify-items:start;
  gap:10px;
  padding:18px 0 6px;
}

.night-checkin-locating span{
  width:30px;
  height:30px;
  border:3px solid var(--account-border);
  border-top-color:#00ff09;
  border-radius:50%;
  animation:night-locate-spin .8s linear infinite;
}

.night-checkin-locating h2,
.night-checkin-found h2{
  margin:0;
  color:var(--account-text);
  font-size:30px;
  line-height:1;
}

.night-checkin-error h2{
  max-width:420px;
  margin:0;
  color:var(--my-night-purple);
  font-size:clamp(34px,5vw,52px);
  font-weight:950;
  line-height:.96;
  letter-spacing:-.045em;
}

.night-checkin-locating p,
.night-checkin-error p,
.night-checkin-found p{
  margin:0;
  color:var(--account-muted);
  font-size:13px;
}

.night-checkin-error button{
  min-width:132px;
  min-height:44px;
  margin-top:8px;
  border:0;
  border-radius:999px;
  padding:0 20px;
  background:var(--my-night-purple);
  color:#fff;
  font-size:12px;
  font-weight:900;
  cursor:pointer;
}

.night-checkin-found .primary{
  margin-top:10px;
  border:0;
  color:#000;
  cursor:pointer;
}

.night-checkin-found small{
  color:var(--account-muted);
  font-size:10px;
}

.night-checkin-place-card{
  width:100%;
  overflow:hidden;
  border:1px solid rgba(104,76,255,.16);
  border-radius:20px;
  background:var(--account-raised);
  color:var(--account-text);
}


.night-checkin-place-info{
  display:grid;
  gap:10px;
  padding:18px;
}


.night-checkin-place-info h2{
  margin:0;
  color:var(--account-text);
  font-size:34px;
  line-height:.92;
  letter-spacing:0;
}

.night-checkin-place-info p{
  color:var(--account-text);
  line-height:1.45;
}

.night-checkin-place-distance{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  color:var(--account-muted);
  font-size:11px;
}

.night-checkin-place-distance b{
  color:var(--radar-color);
}

.night-checkin-place-info .primary{
  width:100%;
  margin-top:4px;
}

@media (min-width:720px){
.night-checkin-sheet{
    width:min(calc(100% - 40px),520px);
    right:20px;
    bottom:20px;
    left:auto;
    border-radius:24px;
  }
}

@media (max-width:719px){
.night-checkin-sheet{
    max-height:calc(100dvh - 132px);
    padding-bottom:calc(28px + env(safe-area-inset-bottom));
  }

.night-checkin-place-info{
    padding:18px 16px;
  }

.night-checkin-place-info h2{
    font-size:30px;
  }
}

.night-checkin-success{
  position:fixed;
  z-index:140;
  inset:0;
  display:grid;
  place-content:center;
  justify-items:center;
  gap:6px;
  background:rgba(0,0,0,.72);
  color:#fff;
  backdrop-filter:blur(18px);
}

.night-checkin-success[hidden]{
  display:none;
}

.night-checkin-success strong{
  color:#fff;
  font-size:clamp(58px,10vw,96px);
  font-weight:950;
  line-height:.82;
  letter-spacing:0;
  animation:night-checkin-pop .5s cubic-bezier(.2,1.45,.5,1);
}

.night-checkin-success span{
  color:#00ff09;
  font-size:clamp(28px,5vw,44px);
  font-weight:900;
  line-height:1;
  animation:night-checkin-rise .6s ease both;
}

.night-checkin-success p{
  max-width:260px;
  margin:6px 0 0;
  color:#fff;
  font-size:14px;
  font-weight:700;
  line-height:1.35;
  text-align:center;
}

.night-checkin-success button,
body.day-mode .night-checkin-success button,
body.night-mode .night-checkin-success button{
  min-height:48px;
  margin-top:14px;
  border:0;
  border-radius:999px;
  padding:0 20px;
  background:#fff;
  color:#061006;
  -webkit-text-fill-color:#061006;
  font-size:14px;
  font-weight:950;
  box-shadow:0 12px 34px rgba(0,0,0,.32);
}

.night-filter-pills button[data-night-tab="mine"]{
  z-index:230;
  position:relative;
  overflow:visible;
}

.night-filter-pills button[data-night-tab="mine"]:has(.night-tab-hint) .night-tab-badge{
  top:-9px;
  right:-9px;
}

.night-tab-badge{
  position:absolute;
  top:-7px;
  right:-5px;
  border:2px solid currentColor;
}

.night-tab-hint{
  --ui-hint-arrow-size:8px;
  position:absolute;
  z-index:240;
  top:50%;
  left:calc(100% + 10px);
  width:176px;
  border-radius:13px;
  padding:9px 22px 9px 10px;
  color:#6f6f76;
  -webkit-text-fill-color:#6f6f76;
  box-shadow:0 10px 22px rgba(0,0,0,.08);
  font-size:10px;
  font-weight:650;
  line-height:1.3;
  text-transform:none;
  transform:translateY(-50%);
}

.night-tab-hint::before{
  top:50%;
  left:-5px;
  border-bottom:1px solid rgba(29,29,31,.12);
  border-left:1px solid rgba(29,29,31,.12);
  transform:translateY(-50%) rotate(45deg);
}

.my-night-page .night-filter-pills:has(.night-tab-hint){
  z-index:230;
  overflow:visible;
}

.night-tab-hint .ui-hint-close{
  top:-2px;
  right:-3px;
  transform:none;
}

.night-mode .night-tab-hint{
  border-color:rgba(29,29,31,.12);
  background:#fff;
  color:#4d4d52;
  -webkit-text-fill-color:#4d4d52;
  box-shadow:0 12px 28px rgba(0,0,0,.1);
}

.night-mode .night-tab-hint::before{
  border-color:rgba(29,29,31,.12);
  background:#fff;
}

.night-mode .night-tab-hint .ui-hint-close{
  border-color:transparent;
  background:transparent;
  color:#4d4d52;
  -webkit-text-fill-color:#4d4d52;
}


.night-create .section-head h2,
.night-create label,
.night-create legend{
  color:var(--account-text);
}

.night-create input:not([type="radio"]):not([type="checkbox"]):not([type="file"]){
  border-color:var(--account-border);
  background:var(--account-field);
  color:var(--account-text);
  caret-color:var(--account-text);
}

.night-create input::placeholder{
  color:var(--account-muted);
  opacity:1;
}

.night-create input:focus{
  outline:2px solid #00a808;
  outline-offset:1px;
}

.night-card-edit-form .night-edit-image{
  border:1px dashed var(--account-border);
  border-radius:14px;
  padding:14px;
  background:var(--account-surface);
}

.night-card-edit-form .night-edit-image small{
  color:var(--account-muted);
}


.night-image-visibility{
  grid-column:1/-1;
  margin:0;
  border:0;
  padding:0;
}

.night-image-visibility legend{
  margin-bottom:9px;
  color:var(--account-text);
  font-size:11px;
  font-weight:800;
}

.night-image-visibility > div{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}

.night-image-visibility label{
  display:block;
}

.night-image-visibility input{
  position:absolute;
  opacity:0;
}

.night-image-visibility span{
  display:grid;
  place-items:center;
  min-height:48px;
  border:1px solid var(--account-border);
  border-radius:14px;
  background:var(--account-raised);
  color:var(--account-text);
  font-size:12px;
  font-weight:800;
  cursor:pointer;
}

.night-image-visibility input:checked + span{
  border-color:#00ff09;
  box-shadow:inset 0 0 0 2px #00ff09;
}


.my-night-route #app > .topbar-fade,
.my-night-route #app > .topbar,
.my-night-route #app > .topbar-overlay{
  background:var(--account-surface);
  color:var(--account-text);
  box-shadow:0 1px 0 var(--account-border);
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
}


.day-mode .my-night-page{
  --ink:var(--luca-day-ink);
  --paper:var(--luca-day-paper);
  --card:var(--luca-day-card);
  --muted:var(--luca-day-muted);
  --accent:var(--luca-green-ink);
  --line:var(--luca-day-line);
  --account-surface:var(--luca-day-card);
  --account-raised:var(--luca-day-paper);
  --account-text:var(--luca-day-ink);
  --account-muted:var(--luca-day-muted);
  --account-border:rgba(25,25,25,.13);
  background:var(--luca-day-paper);
  color:var(--luca-day-ink);
}

.my-night-page .night-loading,
.day-mode .my-night-page .night-loading,
.night-mode .my-night-page .night-loading{
  display:flex;
  min-height:calc(100dvh - 150px);
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:14px;
  border:0;
  border-radius:0;
  padding:24px;
  background:transparent;
  box-shadow:none;
}

.my-night-page .night-loading::before{
  content:none;
}

.my-night-page .night-loading span{
  display:block;
  width:min(82%,560px);
  height:18px;
  border-radius:9px;
  background:color-mix(in srgb,currentColor 9%,transparent);
}

.my-night-page .night-loading span:first-child{
  width:min(38%,260px);
  height:34px;
}

.my-night-page .night-loading span:last-child{
  width:min(62%,420px);
}

@media (max-width:719px){
.my-night-page .night-loading{
    min-height:calc(100dvh - 128px - env(safe-area-inset-top));
  }
}

@media (prefers-reduced-motion:reduce){
.my-night-page .night-loading::before{
    animation-duration:1.8s;
  }
}


@media (max-width:719px){


.my-night-page .night-card-photo{
    aspect-ratio:4 / 5;
    min-height:0;
    overflow:hidden;
    border-radius:15px;
    transform:translateZ(0);
  }

.my-night-page .night-card-visual{
    inset:0;
    border-radius:inherit;
    transform:scale(1.04);
  }

.my-night-page .night-card-overlay{
    padding:14px;
    background:linear-gradient(180deg,rgba(0,0,0,.06) 24%,rgba(0,0,0,.8) 100%);
  }

.my-night-page .night-card-count{
    top:14px;
    right:auto;
    bottom:auto;
    left:14px;
    width:auto;
    max-width:calc(100% - 88px);
    justify-content:flex-start;
    transform:none;
  }

.my-night-page .night-card-count strong{
    font-size:30px;
    line-height:.8;
    letter-spacing:0;
  }

.my-night-page .night-card-count i{
    font-size:18px;
    letter-spacing:0;
  }


.my-night-page .night-card-author{
    top:auto;
    right:46px;
    bottom:14px;
    left:14px;
    gap:8px;
  }

.my-night-page .night-card-author img,
.my-night-page .night-card-author > span{
    width:28px;
    height:28px;
    flex-basis:28px;
  }

.my-night-page .night-card-author b{
    font-size:9px;
  }

.my-night-page .night-card-author small{
    font-size:7px;
  }

.my-night-page .night-card-edit-chip{
    top:12px;
    right:12px;
  }


}


@media (max-width:719px){


.my-night-route .my-night-page .night-filter-pills:has(.night-tab-hint),
body.day-mode.my-night-route .my-night-page .night-filter-pills:has(.night-tab-hint),
body.night-mode.my-night-route .my-night-page .night-filter-pills:has(.night-tab-hint){
    position:relative;
    z-index:230;
  }


.my-night-route .night-filter-pills button[data-night-tab="mine"] .night-tab-hint{
    top:calc(100% + 8px);
    right:0;
    left:auto;
    width:min(222px,calc(100vw - 32px));
    transform:none;
    z-index:4;
  }

.my-night-route .night-filter-pills button[data-night-tab="mine"] .night-tab-hint::before{
    top:-5px;
    right:22px;
    left:auto;
    border-top:1px solid rgba(29,29,31,.12);
    border-right:1px solid rgba(29,29,31,.12);
    border-bottom:0;
    border-left:0;
    transform:rotate(-45deg);
  }


.my-night-route .night-filter-pills:has(.night-tab-hint) + [data-my-night-content]{
    padding-top:48px;
  }
}


@media (max-width:719px){
.night-action-sheet .night-sheet{
    width:100%;
    max-height:92dvh;
    padding:22px 16px calc(28px + env(safe-area-inset-bottom));
    border-radius:22px 22px 0 0;
  }

.night-action-sheet .night-checkin-sheet{
    right:0;
    bottom:0;
    left:0;
  }

.night-action-sheet .night-sheet-close{
    top:10px;
    right:12px;
    display:grid;
    place-items:center;
    width:44px;
    min-width:44px;
    height:44px;
    padding:0;
    line-height:1;
  }

.night-action-sheet .night-create{
    padding:0;
  }

.night-action-sheet .night-create .section-head{
    margin:0 48px 14px 0;
  }

.night-action-sheet .night-create .section-head h2{
    font-size:22px;
    line-height:1.05;
  }

.night-action-sheet .night-create form{
    gap:12px;
  }

.night-action-sheet .night-create label,
.night-action-sheet .night-create legend,
.night-action-sheet .night-card-edit-form label,
.night-action-sheet .night-card-edit-form legend{
    gap:6px;
    font-size:12px;
    line-height:1.2;
  }

.night-action-sheet .night-create label > small,
.night-action-sheet .night-create legend small,
.night-action-sheet .night-card-edit-form label > small,
.night-action-sheet .night-card-edit-form legend small{
    font-size:11px;
    line-height:1.25;
  }

.night-action-sheet [data-night-card-form] input:not([type="radio"]):not([type="checkbox"]):not([type="file"]),
.night-action-sheet [data-night-card-form] textarea,
.night-action-sheet [data-night-card-form] select,
.night-action-sheet [data-night-card-edit-form] input:not([type="radio"]):not([type="checkbox"]):not([type="file"]),
.night-action-sheet [data-night-card-edit-form] textarea,
.night-action-sheet [data-night-card-edit-form] select{
    width:100%;
    min-height:48px;
    padding:0 14px;
    font-size:16px;
    line-height:1.25;
  }

.night-action-sheet [data-night-card-form] input[type="file"],
.night-action-sheet [data-night-card-edit-form] input[type="file"]{
    font-size:16px;
  }

.night-action-sheet .night-auto-fields{
    grid-template-columns:1fr;
    border-radius:16px;
  }

.night-action-sheet .night-auto-fields > div{
    padding:13px 14px;
  }

.night-action-sheet .night-auto-fields strong{
    font-size:16px;
    line-height:1.15;
  }

.night-action-sheet .night-auto-fields span{
    font-size:12px;
    line-height:1.25;
  }

.night-action-sheet .night-image-picker{
    min-height:96px;
    padding:16px;
    border-radius:16px;
  }

.night-action-sheet .night-image-picker span{
    font-size:16px;
    line-height:1.2;
  }

.night-action-sheet .night-image-picker small{
    max-width:260px;
    font-size:11px;
    line-height:1.3;
    text-align:center;
  }

.night-action-sheet .tonight-count-picker > div{
    grid-template-columns:1fr 1fr minmax(86px,1fr);
    gap:8px;
  }

.night-action-sheet .tonight-count-picker label > span{
    min-width:0;
    min-height:50px;
    font-size:24px;
  }

.night-action-sheet .tonight-count-picker .tonight-count-number{
    grid-column:auto;
  }

.night-action-sheet .tonight-count-picker .tonight-count-number > span{
    padding-left:10px;
    font-size:18px;
  }

.night-action-sheet .tonight-count-picker .tonight-count-number input{
    min-height:50px;
    padding:0 8px;
    font-size:20px;
  }

.night-action-sheet .night-publish-choice{
    grid-template-columns:24px minmax(0,1fr);
    gap:8px 10px;
    padding:12px;
    border-radius:15px;
  }

.night-action-sheet .night-publish-choice input{
    width:22px;
    height:22px;
    min-height:22px;
  }

.night-action-sheet .night-publish-choice span{
    font-size:14px;
    line-height:1.2;
  }

.night-action-sheet .night-publish-choice small{
    grid-column:2;
    font-size:11px;
    line-height:1.3;
  }

.night-action-sheet .night-create .primary,
.night-action-sheet .night-card-edit-form .primary{
    width:100%;
    min-height:52px;
    border-radius:15px;
    font-size:15px;
    line-height:1;
  }
}


.night-checkin-success,
body.day-mode .night-checkin-success,
body.night-mode .night-checkin-success{
  z-index:240;
  background:rgba(0,0,0,.86);
  color:#fff;
  -webkit-text-fill-color:#fff;
}

.night-checkin-success strong,
body.day-mode .night-checkin-success strong,
body.night-mode .night-checkin-success strong{
  color:#fff;
  -webkit-text-fill-color:#fff;
  text-shadow:0 8px 34px rgba(0,0,0,.65);
}

.night-checkin-success span,
body.day-mode .night-checkin-success span,
body.night-mode .night-checkin-success span{
  color:#00ff09;
  -webkit-text-fill-color:#00ff09;
  text-shadow:0 4px 22px rgba(0,255,9,.28);
}


.night-empty-state .primary,
.night-empty-state .secondary{
  min-height:42px;
  padding:12px 16px;
  border-radius:999px;
  text-decoration:none;
}


.night-tab-panel.is-active{
  animation:luca-panel-enter .2s ease-out both;
}

@media (prefers-reduced-motion:reduce){
.night-tab-panel.is-active{
    animation:none;
  }


}


@media (min-width:720px){
.my-night-route .my-night-page,
body.day-mode.my-night-route .my-night-page,
body.night-mode.my-night-route .my-night-page{
    position:relative;
  }


.my-night-route .my-night-page .night-filter-pills:has(.night-tab-hint),
body.day-mode.my-night-route .my-night-page .night-filter-pills:has(.night-tab-hint),
body.night-mode.my-night-route .my-night-page .night-filter-pills:has(.night-tab-hint){
    z-index:230;
    overflow:visible;
  }


}


.my-night-route .night-action-sheet,
body.day-mode.my-night-route .night-action-sheet,
body.night-mode.my-night-route .night-action-sheet{
  z-index:240;
  display:grid;
  place-items:center;
  padding:24px;
  box-sizing:border-box;
}

.my-night-route .night-action-sheet[hidden],
body.day-mode.my-night-route .night-action-sheet[hidden],
body.night-mode.my-night-route .night-action-sheet[hidden]{
  display:none;
}

.my-night-route .night-action-sheet .night-sheet-backdrop,
body.day-mode.my-night-route .night-action-sheet .night-sheet-backdrop,
body.night-mode.my-night-route .night-action-sheet .night-sheet-backdrop{
  z-index:0;
}

.my-night-route .night-action-sheet .night-sheet,
body.day-mode.my-night-route .night-action-sheet .night-sheet,
body.night-mode.my-night-route .night-action-sheet .night-sheet,
.my-night-route .night-action-sheet .night-checkin-sheet,
body.day-mode.my-night-route .night-action-sheet .night-checkin-sheet,
body.night-mode.my-night-route .night-action-sheet .night-checkin-sheet{
  position:relative;
  inset:auto;
  z-index:1;
  width:min(100%,560px);
  max-height:min(86dvh,720px);
  margin:auto;
  overflow:auto;
  border-radius:24px;
  box-shadow:0 28px 80px rgba(0,0,0,.28);
}


body.my-night-route:has(.night-action-sheet:not([hidden])) .my-night-page .night-filter-pills,
body.my-night-route:has(.night-action-sheet:not([hidden])) .my-night-page .night-checkin-fab{
  pointer-events:none;
  visibility:hidden;
  opacity:0;
}


@media (max-width:719px){
.my-night-route .night-action-sheet,
body.day-mode.my-night-route .night-action-sheet,
body.night-mode.my-night-route .night-action-sheet{
    padding:18px;
  }

.my-night-route .night-action-sheet .night-sheet,
body.day-mode.my-night-route .night-action-sheet .night-sheet,
body.night-mode.my-night-route .night-action-sheet .night-sheet,
.my-night-route .night-action-sheet .night-checkin-sheet,
body.day-mode.my-night-route .night-action-sheet .night-checkin-sheet,
body.night-mode.my-night-route .night-action-sheet .night-checkin-sheet{
    width:min(100%,420px);
    max-height:88dvh;
    border-radius:24px;
  }
}

@media (max-width:719px){
body.night-card-route main.night-card-detail-page .night-card-edit-form .night-image-visibility > div,
body.day-mode.night-card-route main.night-card-detail-page .night-card-edit-form .night-image-visibility > div,
body.night-mode.night-card-route main.night-card-detail-page .night-card-edit-form .night-image-visibility > div{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
  }
}


.night-tab-hint.is-auto-hiding{
  opacity:0;
  transform:translateY(-4px) scale(.98);
  transition:opacity .24s ease, transform .24s ease;
}


.night-checkin-hint{
  position:fixed;
  z-index:135;
  width:188px;
  border-radius:15px;
  padding:10px 24px 10px 12px;
  color:#5f5b6c;
  -webkit-text-fill-color:#5f5b6c;
  box-shadow:0 12px 28px rgba(0,0,0,.12);
  font-size:11px;
  font-weight:700;
  line-height:1.28;
}

.night-checkin-hint::before{
  border-right:1px solid rgba(29,29,31,.12);
  border-bottom:1px solid rgba(29,29,31,.12);
}

.night-checkin-hint .ui-hint-close{
  top:-2px;
  right:-3px;
  transform:none;
}

.night-mode .night-checkin-hint{
  background:#fff;
  color:#4d4d52;
  -webkit-text-fill-color:#4d4d52;
}

.night-mode .night-checkin-hint::before{
  background:#fff;
}

@media (max-width:719px){
.night-checkin-hint{
    right:16px;
    bottom:max(176px, calc(env(safe-area-inset-bottom) + 172px));
    width:min(220px, calc(100vw - 42px));
  }

.night-checkin-hint::before{
    right:28px;
    bottom:-6px;
    transform:rotate(45deg);
  }
}

@media (min-width:720px){
.night-checkin-hint{
    top:calc(96px + 206px + 42px);
    left:calc(var(--my-night-side-left, 24px) + 124px);
  }

.night-checkin-hint::before{
    left:-6px;
    top:20px;
    transform:rotate(135deg);
  }
}

body.my-night-checkin-active .night-checkin-hint,
body.my-night-route:has(.night-action-sheet:not([hidden])) .night-checkin-hint{
  display:none;
}

.my-night-page .night-tab-panel[data-night-tab-panel="plaza"] .night-card.is-locked .night-card-author,
.my-night-page .night-tab-panel[data-night-tab-panel="plaza"] .night-card.is-locked .night-card-quick-actions{
  display:none;
}

.my-night-page .night-tab-panel[data-night-tab-panel="plaza"] .night-card.is-locked{
  cursor:default;
}

.my-night-page .night-tab-panel[data-night-tab-panel="plaza"] .night-card.is-locked .night-card-visual{
  filter:blur(18px) brightness(.56) saturate(.72);
  transform:scale(1.16);
}

.my-night-page .night-tab-panel[data-night-tab-panel="plaza"] .night-card.is-locked .night-card-overlay{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:18px;
  background:rgba(18,14,32,.28);
}

.my-night-page .night-tab-panel[data-night-tab-panel="plaza"] .night-card.is-locked .night-card-count{
  position:static;
  top:auto;
  right:auto;
  bottom:auto;
  left:auto;
  width:max-content;
  max-width:100%;
  justify-content:center;
  transform:none;
}


@media (min-width:720px){
body.my-night-route .my-night-page,
body.day-mode.my-night-route .my-night-page,
body.night-mode.my-night-route .my-night-page{
    --my-night-side-top:96px;
    --my-night-content-top-offset:var(--my-night-side-top);
  }


body.my-night-route .my-night-page .night-tab-panel.is-active,
body.day-mode.my-night-route .my-night-page .night-tab-panel.is-active,
body.night-mode.my-night-route .my-night-page .night-tab-panel.is-active{
    margin-top:0;
    padding-top:0;
    overflow:visible;
  }

body.my-night-route .my-night-page .night-tab-panel.is-active > :first-child,
body.day-mode.my-night-route .my-night-page .night-tab-panel.is-active > :first-child,
body.night-mode.my-night-route .my-night-page .night-tab-panel.is-active > :first-child{
    margin-top:0;
  }

}


/* My Night route owner: #my-night/*. */
body.my-night-route .my-night-route-page {
  --my-night-purple: #6d4cff;
  --my-night-purple-soft: #eee9ff;
  --my-night-surface: #f7f7f8;
  --my-night-text: #171719;
  --my-night-muted: #777481;
  --my-night-line: #e5e2ee;
  position: relative;
  width: 100%;
  min-height: 100dvh;
  padding-bottom: 110px;
  background: var(--my-night-surface);
  color: var(--my-night-text);
}

.night-vibe-field {
  display: grid;
  gap: 7px;
}

.night-vibe-field select {
  width: 100%;
  min-height: 48px;
  padding: 0 14px;
  border: 1px solid var(--my-night-line, #e5e2ee);
  border-radius: 14px;
  background: var(--my-night-surface, #fff);
  color: var(--my-night-text, #171719);
  font: inherit;
}

.night-vibe-field small {
  color: var(--my-night-muted, #777481);
}

.night-vibe-badge {
  display: inline-flex;
  margin-right: 8px;
  padding: 4px 8px;
  border-radius: 999px;
  background: #ececef;
  color: #55545d;
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  vertical-align: middle;
}

body.night-mode .night-vibe-badge {
  background: #2a2a2f;
  color: #d2d0d8;
}

.night-internal-test-banner {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 18px;
  padding: 12px 16px;
  border: 1px solid #6d4cff;
  border-radius: 14px;
  background: #eee9ff;
  color: #3923a8;
}

.night-internal-test-banner strong {
  flex: 0 0 auto;
  font-size: 11px;
  letter-spacing: .08em;
}

.night-internal-test-banner span {
  font-size: 12px;
}

body.night-mode .night-internal-test-banner {
  background: #171128;
  color: #cfc4ff;
}

body.night-mode.my-night-route .my-night-route-page {
  --my-night-surface: #050505;
  --my-night-text: #f7f5fb;
  --my-night-muted: #aaa5b7;
  --my-night-line: #2b2931;
}

body.my-night-route .my-night-route-page .night-filter-pills {
  font-family: inherit;
}

body.my-night-route .my-night-route-page .night-filter-pills > button {
  position: relative;
  display: grid;
  width: 100%;
  min-width: 0;
  min-height: 44px;
  place-items: center;
  padding: 0 10px;
  overflow: visible;
  border: 0;
  border-radius: 999px;
  background: #f3f2f5;
  color: #a594ef;
  -webkit-text-fill-color: currentColor;
  font: inherit;
  font-size: 11px;
  font-weight: 850;
  line-height: 1;
  cursor: pointer;
  box-shadow: none;
  transition: transform .18s ease, background-color .18s ease, color .18s ease;
}

body.night-mode.my-night-route .my-night-route-page .night-filter-pills > button {
  background: #17171b;
  color: #b7a8f8;
}

body.my-night-route .my-night-route-page .night-filter-pills > button.is-active {
  border-color: transparent;
  background: #fff;
  color: var(--my-night-purple);
  box-shadow: none;
}

body.night-mode.my-night-route .my-night-route-page .night-filter-pills > button.is-active {
  background: #684cff;
  color: #fff;
}

body.my-night-route .my-night-route-page .night-filter-pills > button:not(.is-active):hover,
body.my-night-route .my-night-route-page .night-filter-pills > button:not(.is-active):focus-visible {
  border-color: transparent;
  background: var(--my-night-purple-soft);
  color: var(--my-night-purple);
}

body.night-mode.my-night-route .my-night-route-page .night-filter-pills > button:not(.is-active):hover,
body.night-mode.my-night-route .my-night-route-page .night-filter-pills > button:not(.is-active):focus-visible {
  background: #28223e;
  color: #d5cdff;
}

body.my-night-route .my-night-route-page .night-filter-pills > button:active {
  transform: scale(.97);
}

body.my-night-route .my-night-route-page .night-checkin-fab {
  font-family: inherit;
  cursor: pointer;
  transition: transform .18s ease, background-color .18s ease, opacity .18s ease;
}

body.my-night-route .my-night-route-page .night-checkin-fab img {
  display: block;
  width: 38px;
  height: 38px;
  object-fit: contain;
  pointer-events: none;
}

body.my-night-route .my-night-route-page .night-checkin-fab span {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border-radius: 50%;
  background: var(--my-night-purple);
  color: #fff;
  -webkit-text-fill-color: #fff;
  font-size: 23px;
  font-weight: 900;
  line-height: 1;
}

body.my-night-route .my-night-route-page .night-checkin-fab:hover,
body.my-night-route .my-night-route-page .night-checkin-fab:focus-visible {
  background: #f7f5ff;
}

body.my-night-route .my-night-route-page .night-checkin-fab:active {
  transform: scale(.97);
}

body.my-night-checkin-active.my-night-route .my-night-route-page .night-filter-pills,
body.my-night-checkin-active.my-night-route .my-night-route-page .night-checkin-fab,
body.my-night-route:has(.night-action-sheet:not([hidden])) .my-night-route-page .night-filter-pills,
body.my-night-route:has(.night-action-sheet:not([hidden])) .my-night-route-page .night-checkin-fab {
  visibility: hidden;
  pointer-events: none;
  opacity: 0;
}

body.my-night-route .my-night-route-page > [data-my-night-content] {
  position: relative;
  z-index: 1;
  box-sizing: border-box;
}


body.my-night-route .my-night-route-page .night-tab-panel[data-night-tab-panel="plaza"] .night-masonry > .night-empty-state {
  grid-column: 1 / -1;
  width: 100%;
}

body.my-night-route .my-night-route-page .night-plaza-empty {
  gap: 7px;
  padding: 48px 20px;
  color: #98969e;
}

body.my-night-route .my-night-route-page .night-plaza-empty span {
  color: #aaa8af;
  font-size: 24px;
}

body.my-night-route .my-night-route-page .night-plaza-empty h2 {
  margin: 6px 0 0;
  color: #77747d;
  font-size: 16px;
  font-weight: 750;
}

body.my-night-route .my-night-route-page .night-plaza-empty p {
  color: #a09da5;
  font-size: 11px;
}

body.night-mode.my-night-route .my-night-route-page .night-plaza-empty {
  color: #77747d;
}

body.night-mode.my-night-route .my-night-route-page .night-plaza-empty span,
body.night-mode.my-night-route .my-night-route-page .night-plaza-empty h2 {
  color: #8c8992;
}

body.night-mode.my-night-route .my-night-route-page .night-plaza-empty p {
  color: #68656d;
}

@media (max-width: 719px) {
  body.my-night-route .my-night-route-page .night-plaza-empty {
    padding: 34px 16px 54px;
  }
}

body.my-night-route .my-night-route-page .night-tab-panel[data-night-tab-panel="mine"] .night-mine-panel > .night-empty-state {
  grid-column: 1 / -1;
  width: 100%;
}

/* Plaza and Nearby owners. */
body.my-night-route .my-night-route-page .night-plaza-rule {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 16px;
  width: 100%;
  margin: 0 0 16px;
  padding: 15px 16px;
  border: 0;
  border-radius: 20px;
  background: #f7f7f8;
  color: var(--my-night-text);
  box-shadow: 0 12px 30px rgba(35, 27, 61, .09);
}

body.night-mode.my-night-route .my-night-route-page .night-plaza-rule {
  border: 0;
  background: #171719;
  color: #f4f4f6;
  box-shadow: 0 14px 34px rgba(0, 0, 0, .42);
}

body.my-night-route .my-night-route-page .night-plaza-rule header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 32px;
  align-items: center;
  gap: 4px;
  min-width: 176px;
}

body.my-night-route .my-night-route-page .night-plaza-rule header > span,
body.my-night-route .my-night-route-page .night-plaza-rule > div,
body.my-night-route .my-night-route-page .night-plaza-rule > div > span {
  display: grid;
  min-width: 0;
}

body.my-night-route .my-night-route-page .night-plaza-rule header > span {
  gap: 2px;
}

body.my-night-route .my-night-route-page .night-plaza-rule > div {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

body.my-night-route .my-night-route-page .night-plaza-rule > div > span {
  gap: 2px;
}

body.my-night-route .my-night-route-page .night-plaza-rule small,
body.my-night-route .my-night-route-page .night-plaza-rule b {
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
  letter-spacing: .06em;
  line-height: 1;
}

body.my-night-route .my-night-route-page .night-plaza-rule small {
  color: #7e7a8c;
}

body.my-night-route .my-night-route-page .night-plaza-rule b {
  color: #171719;
}

body.my-night-route .my-night-route-page .night-plaza-rule strong {
  color: #6d4cff;
  font-size: 21px;
  font-weight: 950;
  line-height: 1;
  letter-spacing: -.03em;
}

body.my-night-route .my-night-route-page .night-plaza-rule em {
  color: #858194;
  font-size: 9.5px;
  font-style: normal;
  font-weight: 700;
  line-height: 1.18;
}

body.night-mode.my-night-route .my-night-route-page .night-plaza-rule small {
  color: #9b98a8;
}

body.night-mode.my-night-route .my-night-route-page .night-plaza-rule strong {
  color: #8f78ff;
}

body.night-mode.my-night-route .my-night-route-page .night-plaza-rule b {
  color: #f4f4f6;
}

body.night-mode.my-night-route .my-night-route-page .night-plaza-rule em {
  color: #b8b4c8;
}

body.my-night-route .my-night-route-page .night-plaza-rule [data-night-plaza-refresh] {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: var(--my-night-purple-soft);
  color: var(--my-night-purple);
  font-size: 18px;
  cursor: pointer;
}

body.night-mode.my-night-route .my-night-route-page .night-plaza-rule [data-night-plaza-refresh] {
  border: 1px solid rgba(143,120,255,.2);
  background: #24202f;
  color: #8f78ff;
  box-shadow: none;
}

body.my-night-route .my-night-route-page .night-masonry {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  width: 100%;
  margin: 0;
  padding: 0;
}

body.my-night-route .my-night-route-page .night-masonry > .night-card {
  display: grid;
  width: 100%;
  min-width: 0;
  margin: 0;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  break-inside: auto;
}

body.night-mode.my-night-route .my-night-route-page .night-masonry > .night-card{
  isolation:isolate;
  overflow:visible;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  transform:translateZ(0);
}

body.night-mode.my-night-route .my-night-route-page .night-masonry > .night-card .night-card-photo,
body.night-mode.my-night-route .my-night-route-page .night-masonry > .night-card .night-card-visual,
body.night-mode.my-night-route .my-night-route-page .night-masonry > .night-card .night-card-overlay{
  border-radius:inherit;
}

body.night-mode.my-night-route .my-night-route-page .night-masonry > .night-card .night-card-photo{
  overflow:hidden;
  background:#050505;
}

body.night-mode.my-night-route .my-night-route-page .night-masonry > .night-card .night-card-visual{
  inset:0;
  background-color:#050505;
  transform:none;
}

body.my-night-route .my-night-route-page .night-nearby-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 14px;
  color: var(--my-night-text);
}

body.my-night-route .my-night-route-page .night-nearby-heading strong {
  font-size: 16px;
}

body.my-night-route .my-night-route-page .night-nearby-heading span {
  color: var(--my-night-muted);
  font-size: 11px;
  font-weight: 700;
}

body.my-night-route .my-night-route-page .night-nearby-spinner {
  display: block;
  width: 24px;
  height: 24px;
  border: 3px solid color-mix(in srgb, var(--my-night-purple) 18%, transparent);
  border-top-color: var(--my-night-purple);
  border-radius: 50%;
  animation: night-nearby-spin .8s linear infinite;
}

@keyframes night-nearby-spin {
  to { transform: rotate(360deg); }
}

/* My Cards owners. */
body.my-night-route .my-night-route-page .night-mine-panel {
  color: var(--my-night-text);
}

body.my-night-route .my-night-route-page .night-deadline-nav {
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 14px;
  overflow: hidden;
  border: 0;
  border-radius: 20px;
  background: #fff;
  color: var(--my-night-text);
  box-shadow: 0 6px 18px rgba(25, 25, 35, .05);
  transition: box-shadow .5s ease;
  box-sizing: border-box;
}

body.night-mode.my-night-route .my-night-route-page .night-deadline-nav {
  background: #17171b;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .24);
}

body.my-night-route .my-night-route-page .night-deadline-nav::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(circle at var(--deadline-elapsed, 0%) 105%, color-mix(in srgb, var(--deadline-color, var(--my-night-purple)) 12%, transparent), transparent 36%);
  content: "";
  pointer-events: none;
  transition: background .6s ease;
}

body.my-night-route .my-night-route-page .night-deadline-nav::after {
  content:none;
}

body.my-night-route .my-night-route-page .night-deadline-nav[data-deadline-active="true"] {
  box-shadow: 0 10px 28px color-mix(in srgb, var(--deadline-color) 18%, transparent);
}

body.my-night-route .my-night-route-page .night-deadline-head {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
}

body.my-night-route .my-night-route-page .night-deadline-head small {
  color: var(--deadline-color, var(--my-night-purple));
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .08em;
}

body.my-night-route .my-night-route-page .night-deadline-head span,
body.my-night-route .my-night-route-page .night-deadline-main p {
  margin: 0;
  color: var(--my-night-muted);
  font-size: 10px;
  font-weight: 700;
  line-height: 1.3;
}

body.my-night-route .my-night-route-page .night-deadline-main p {
  display: flex;
  align-items: center;
  gap: 6px;
}

body.my-night-route .my-night-route-page .night-deadline-main p strong {
  color: var(--deadline-color, var(--my-night-purple));
  font-size: inherit;
  font-weight: 900;
  white-space: nowrap;
}

body.my-night-route .my-night-route-page .night-deadline-head b {
  color: #77727f;
}

body.my-night-route .my-night-route-page .night-deadline-main {
  display: block;
  width: 100%;
  max-width: none;
  margin: auto 0;
  padding: 0;
}

body.my-night-route .my-night-route-page .night-deadline-main time {
  color: #77727f;
  font-size: 48px;
  font-weight: 900;
  line-height: .9;
  letter-spacing: -.05em;
  transition: color .5s ease;
}

body.my-night-route .my-night-route-page .night-deadline-nav[data-deadline-active="true"] .night-deadline-head b,
body.my-night-route .my-night-route-page .night-deadline-nav[data-deadline-active="true"] .night-deadline-main time {
  color: var(--deadline-color);
}

body.my-night-route .my-night-route-page .night-deadline-track {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 7px;
}

body.my-night-route .my-night-route-page .night-deadline-track span {
  color: var(--my-night-muted);
  font-size: 8px;
  font-weight: 800;
}

body.my-night-route .my-night-route-page .night-deadline-track i {
  position: relative;
  height: 3px;
  overflow: visible;
  border-radius: 999px;
  background: color-mix(in srgb, var(--my-night-line) 82%, transparent);
}

body.my-night-route .my-night-route-page .night-deadline-track i::before {
  position: absolute;
  inset: 0 auto 0 0;
  width: var(--deadline-elapsed, 0%);
  border-radius: inherit;
  background: var(--deadline-color, var(--my-night-purple));
  content: "";
  transition: width .6s ease;
}

body.my-night-route .my-night-route-page .night-deadline-track i::after {
  position: absolute;
  top: 50%;
  left: var(--deadline-elapsed, 0%);
  width: 8px;
  height: 8px;
  border: 2px solid #fff;
  border-radius: 50%;
  background: var(--deadline-color, var(--my-night-purple));
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--deadline-color, var(--my-night-purple)) 14%, transparent), 0 0 14px color-mix(in srgb, var(--deadline-color, var(--my-night-purple)) 42%, transparent);
  content: "";
  transform: translate(-50%, -50%);
  transition: left .6s ease, background-color .5s ease;
  animation: night-deadline-dot-pulse 2.4s ease-in-out infinite;
}

body.night-mode.my-night-route .my-night-route-page .night-deadline-track i::after {
  border-color: #17171b;
}

@keyframes night-deadline-dot-pulse {
  50% { box-shadow: 0 0 0 7px color-mix(in srgb, var(--deadline-color, var(--my-night-purple)) 7%, transparent), 0 0 18px color-mix(in srgb, var(--deadline-color, var(--my-night-purple)) 55%, transparent); }
}

@media (prefers-reduced-motion: reduce) {
  body.my-night-route .my-night-route-page .night-deadline-track i::after {
    animation: none;
  }
}

body.my-night-route .my-night-route-page .night-pending-checkout {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 10px;
  border: 0;
  border-radius: 18px;
  background: #f6f5fa;
  color: var(--my-night-text);
  box-shadow: 0 8px 24px rgba(37, 31, 55, .06);
  box-sizing: border-box;
}

body.night-mode.my-night-route .my-night-route-page .night-pending-checkout {
  background: #17171b;
  box-shadow: 0 10px 28px rgba(0, 0, 0, .2);
}

body.my-night-route .my-night-route-page .night-pending-checkout > header {
  display: flex;
  min-width: 0;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
}

body.my-night-route .my-night-route-page .night-pending-checkout > header small {
  display: block;
  margin: 0 0 5px;
  color: #77727f;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .08em;
}

body.my-night-route .my-night-route-page .night-pending-checkout > header h2 {
  margin: 0;
  color: inherit;
  font-size: 14px;
  line-height: 1.1;
}

body.my-night-route .my-night-route-page .night-pending-checkout > header h2 b {
  color: var(--my-night-purple);
  margin-right:3px;
  font-size:32px;
  line-height:.8;
  vertical-align:-3px;
}

body.my-night-route .my-night-route-page .night-pending-stack {
  display: flex;
  min-width: 0;
  gap: 12px;
  padding: 0 2px 8px;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
}

body.my-night-route .my-night-route-page .night-pending-stack::-webkit-scrollbar {
  display: none;
}

body.my-night-route .my-night-route-page .night-pending-card {
  position: relative;
  display: flex;
  width: 148px;
  min-width: 148px;
  min-height: 104px;
  flex-direction: column;
  justify-content: space-between;
  gap: 10px;
  padding: 12px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .5);
  border-radius: 15px;
  background:
    linear-gradient(180deg, rgba(13, 12, 18, .12), rgba(13, 12, 18, .05) 42%, rgba(13, 12, 18, .68)),
    var(--pending-cover) center / cover,
    #202025;
  color: #fff;
  box-shadow: 0 5px 14px rgba(29, 25, 42, .12);
}

body.my-night-route .my-night-route-page .night-ready-action {
  display: flex;
  min-height: 42px;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
  padding: 2px 0 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

body.my-night-route .my-night-route-page .night-ready-action > span {
  display: block;
  width: auto;
  height: auto;
  flex: 0 0 auto;
  border-radius: 0;
  background: transparent;
  color: var(--my-night-purple);
  font-size: 19px;
  font-weight: 500;
  line-height: 1;
}

body.my-night-route .my-night-route-page .night-ready-action > div {
  display:grid;
  min-width:0;
  gap:3px;
}

body.my-night-route .my-night-route-page .night-ready-action strong {
  color:var(--my-night-text);
  font-size:13px;
}

body.my-night-route .my-night-route-page .night-ready-action small {
  color:var(--my-night-muted);
  font-size:9px;
}

body.my-night-route .my-night-route-page .night-ready-action button {
  min-width: 82px;
  height: 34px;
  margin-left: auto;
  border: 0;
  border-radius: 999px;
  background: var(--my-night-purple);
  color: #fff;
  font-size: 10px;
  font-weight: 900;
}

body.night-mode.my-night-route .my-night-route-page .night-ready-action {
  background: transparent;
}

body.my-night-route .my-night-route-page .night-pending-card > div {
  display: flex;
  min-height: 0;
  flex-direction: column;
  justify-content: flex-start;
  gap: 10px;
  overflow: visible;
  min-width: 0;
}

body.my-night-route .my-night-route-page .night-pending-card strong,
body.my-night-route .my-night-route-page .night-pending-card span {
  overflow: hidden;
  color: #fff;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.my-night-route .my-night-route-page .night-pending-card strong {
  display: block;
  font-size: 17px;
  font-weight: 950;
  line-height: 1.05;
  text-shadow: 0 2px 10px rgba(0, 0, 0, .45);
}

body.my-night-route .my-night-route-page .night-pending-card span {
  display: block;
  color: #fff;
  font-size: 18px;
  font-weight: 850;
  line-height: 1.05;
  text-shadow: 0 2px 10px rgba(0, 0, 0, .4);
}

body.my-night-route .my-night-route-page .night-pending-card > button {
  height: 32px;
  min-height: 32px;
  flex: 0 0 32px;
  margin-top: 8px;
  padding: 0 12px;
  border: 1px solid rgba(255, 255, 255, .74);
  border-radius: 999px;
  background: rgba(255, 255, 255, .92);
  color: #5f45d8;
  box-shadow: 0 3px 10px rgba(16, 12, 28, .12);
  font-size: 10px;
  font-weight: 900;
  cursor: pointer;
}

/* My Cards checkout editor owner. */
body.my-night-route .night-pending-editor-root,
body.my-night-route .night-pending-editor-root .night-pending-editor {
  position: static;
  width: 0;
  height: 0;
  margin: 0;
  padding: 0;
  overflow: visible;
}

body.my-night-route .night-pending-editor-root [data-night-checkout-card][hidden] {
  display: none;
}

body.my-night-route .night-pending-editor-root [data-night-checkout-card]:not([hidden]) {
  position: fixed;
  z-index: 500;
  inset: 0;
  display: flex;
  width: 100dvw;
  height: 100dvh;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 24px;
  overflow: hidden;
  background: rgba(8, 8, 10, .56);
  box-sizing: border-box;
}

body.my-night-route .night-pending-editor-root .night-pending-editor-card {
  position: relative;
  display: flex;
  width: min(560px, calc(100dvw - 32px));
  max-width: min(560px, calc(100dvw - 32px));
  max-height: calc(100dvh - 48px);
  flex-direction: column;
  padding: 24px;
  overflow-x: hidden;
  overflow-y: auto;
  border: 1px solid rgba(109, 76, 255, .18);
  border-radius: 24px;
  background: #fff;
  color: #171719;
  opacity: 1;
  box-shadow: 0 28px 90px rgba(0, 0, 0, .28);
  overscroll-behavior: contain;
  box-sizing: border-box;
}

body.night-mode.my-night-route .night-pending-editor-root .night-pending-editor-card {
  border-color: rgba(255, 255, 255, .12);
  background: #171719;
  color: #f7f5fb;
  box-shadow: 0 28px 90px rgba(0, 0, 0, .55);
}

body.my-night-route .night-pending-editor-root .night-pending-editor-close {
  position: sticky;
  z-index: 20;
  top: 0;
  right: 0;
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  align-self: flex-end;
  flex: 0 0 auto;
  margin: -10px -10px 6px auto;
  border: 0;
  border-radius: 999px;
  background: #6d4cff;
  color: #fff;
  -webkit-text-fill-color: #fff;
  box-shadow: 0 12px 28px rgba(109, 76, 255, .32);
  font-size: 22px;
  font-weight: 900;
  line-height: 1;
  cursor: pointer;
}

body.my-night-route .night-pending-editor-root .night-create {
  width: 100%;
  max-width: 100%;
  min-height: 0;
  flex: 1 1 auto;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.my-night-route .night-pending-editor-root .night-create .section-head {
  padding-right: 48px;
}

body.my-night-route .night-pending-editor-root .night-create .night-auto-fields strong {
  color: #6d4cff;
  font-size: 24px;
  line-height: 1.08;
  letter-spacing: 0;
}

body.my-night-route .night-pending-editor-root .night-create form {
  padding-bottom: max(18px, env(safe-area-inset-bottom));
}

body.my-night-route .night-pending-editor-root .night-create button.primary {
  position: sticky;
  z-index: 12;
  bottom: 0;
  margin-top: 16px;
  box-shadow: 0 -10px 22px rgba(255, 255, 255, .92), 0 12px 30px rgba(109, 76, 255, .24);
}

body.night-mode.my-night-route .night-pending-editor-root .night-create button.primary {
  box-shadow: 0 -10px 22px rgba(23, 23, 25, .92), 0 12px 30px rgba(109, 76, 255, .32);
}

body.my-night-route .my-night-route-page .night-mine-cards-title {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  justify-content: flex-start;
  gap: 5px;
  margin: 10px 0 2px;
}

body.my-night-route .my-night-route-page .night-mine-cards-title h2 {
  margin: 0;
  color: var(--my-night-text);
  font-size: 17px;
  font-weight: 950;
  line-height: 1;
  letter-spacing: 0;
}

body.my-night-route .my-night-route-page .night-mine-cards-title p {
  margin: 0;
  color: var(--my-night-muted);
  font-size: 9px;
  font-weight: 650;
  line-height: 1.3;
}

body.my-night-route .my-night-route-page .night-mine-grid {
  display: grid;
  width: 100%;
  min-width: 0;
}

body.my-night-route .my-night-route-page .night-card.is-own-card {
  border: 0;
  box-shadow: 0 6px 18px rgba(34, 28, 58, .12);
}

body.night-mode.my-night-route .my-night-route-page .night-card.is-own-card {
  box-shadow: 0 6px 20px rgba(0, 0, 0, .34);
}

body.my-night-route .my-night-route-page .night-card.is-own-card .night-card-overlay {
  background: linear-gradient(180deg, rgba(0, 0, 0, .46), transparent 34%, transparent 58%, rgba(0, 0, 0, .7));
}

body.my-night-route .my-night-route-page .night-own-card-actions {
  position: absolute;
  right: 12px;
  bottom: 12px;
  left: 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

body.my-night-route .my-night-route-page .night-own-card-actions > .night-own-card-like,
body.my-night-route .my-night-route-page .night-own-card-actions > .night-own-card-views {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  color: #fff;
}

body.my-night-route .my-night-route-page .night-own-card-actions > .night-own-card-like {
  width:auto;
  min-width:0;
  height:28px;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
}

body.my-night-route .my-night-route-page .night-own-card-actions > .night-own-card-views {
  min-width: 0;
  height: 28px;
  text-shadow: 0 1px 5px rgba(0, 0, 0, .8);
}

body.my-night-route .my-night-route-page .night-own-card-actions > .night-own-card-views svg {
  stroke: #fff;
  filter: drop-shadow(0 1px 3px rgba(0, 0, 0, .75));
}

body.my-night-route .my-night-route-page .night-own-card-actions svg,
body.my-night-route .my-night-route-page .night-card-overlay > .night-own-card-edit svg {
  width: 15px;
  height: 15px;
  flex:0 0 15px;
  align-self:center;
}

body.my-night-route .my-night-route-page .night-card-overlay > .night-own-card-edit svg {
  fill: none;
  stroke: #fff;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

body.my-night-route .my-night-route-page .night-own-card-actions b,
body.my-night-route .my-night-route-page .night-own-card-actions span {
  display:inline-flex;
  align-items:center;
  margin:0;
  color: inherit;
  font-size: 10px;
  font-style: normal;
  font-weight: 850;
  line-height:1;
}

body.my-night-route .my-night-route-page .night-card-overlay > .night-own-card-edit {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  width: auto;
  min-width:42px;
  height:34px;
  padding:0 11px;
  border:0;
  border-radius:999px;
  background:var(--my-night-purple);
  color:#fff;
  box-shadow:none;
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
}

body.my-night-route .my-night-route-page .night-card-overlay > .night-own-card-edit span {
  color: inherit;
  font-size: 10px;
  font-weight: 850;
  line-height: 1;
}

body.my-night-route .my-night-route-page .night-card-overlay > .night-own-card-edit:disabled {
  background: #777780;
  opacity: .58;
}

@media (hover: hover) and (pointer: fine) and (min-width: 1025px) {
  body.my-night-route .my-night-route-page .night-card.is-own-card .night-own-card-edit {
    opacity: 0;
    pointer-events: none;
    transform: translateY(-4px);
    transition: opacity .18s ease, transform .18s ease;
  }

  body.my-night-route .my-night-route-page .night-card.is-own-card:hover .night-own-card-edit,
  body.my-night-route .my-night-route-page .night-card.is-own-card:focus-within .night-own-card-edit {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
  }

  body.my-night-route .my-night-route-page .night-card.is-own-card .night-own-card-edit:disabled {
    opacity: 0;
  }

  body.my-night-route .my-night-route-page .night-card.is-own-card:hover .night-own-card-edit:disabled,
  body.my-night-route .my-night-route-page .night-card.is-own-card:focus-within .night-own-card-edit:disabled {
    opacity: .58;
  }
}

@media (max-width: 1024px) {
  body.my-night-route .my-night-route-page .night-card-overlay > .night-own-card-edit {
    top: 8px;
    right: 8px;
    min-width: 0;
    height: 26px;
    gap: 3px;
    padding: 0 8px;
  }

  body.my-night-route .my-night-route-page .night-card-overlay > .night-own-card-edit svg {
    width: 11px;
    height: 11px;
    flex-basis: 11px;
  }

  body.my-night-route .my-night-route-page .night-card-overlay > .night-own-card-edit span {
    font-size: 8px;
  }
}

body.my-night-route .my-night-route-page .night-card-opportunity {
  display: grid;
  min-height: 100%;
  place-items: center;
  align-content: center;
  gap: 10px;
  padding: 18px;
  overflow: hidden;
  border: 1px dashed var(--my-night-line);
  border-radius: 15px;
  background: #fff;
  color: var(--my-night-text);
  text-align: center;
}

body.night-mode.my-night-route .my-night-route-page .night-card-opportunity {
  background: #171719;
}

body.my-night-route .my-night-route-page .night-card-opportunity span {
  color: var(--my-night-purple);
  font-size: 34px;
  line-height: 1;
}

body.my-night-route .my-night-route-page .night-card-opportunity strong {
  max-width: 180px;
  color: inherit;
  font-size: 12px;
  line-height: 1.3;
}

body.my-night-route .my-night-route-page .night-expired-entry {
  display: inline-flex;
  width: max-content;
  max-width: 100%;
  align-items: center;
  gap: 7px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #302d38;
  text-decoration: none;
}

body.my-night-route .my-night-route-page .night-expired-entry span {
  font-size: 13px;
  font-weight: 850;
}

body.my-night-route .my-night-route-page .night-expired-entry small {
  color: #8b8798;
  font-size: 10px;
  font-weight: 700;
}

body.my-night-route .my-night-route-page .night-expired-entry small span {
  font-size: inherit;
  font-weight: inherit;
}

body.my-night-route .my-night-route-page .night-expired-label-compact {
  display: none;
}

body.my-night-route .my-night-route-page .night-expired-entry b {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  flex: 0 0 28px;
  border-radius: 50%;
  background: #eee9ff;
  color: #6d4cff;
  -webkit-text-fill-color: #6d4cff;
  font-size: 16px;
  line-height: 1;
}

body.my-night-route .my-night-route-page .night-expired-entry:hover span,
body.my-night-route .my-night-route-page .night-expired-entry:focus-visible span {
  color: #6d4cff;
}

body.night-mode.my-night-route .my-night-route-page .night-expired-entry {
  border-color: transparent;
  background: transparent;
  color: #f7f5fb;
}

body.my-night-route .my-night-route-page .night-expired-page {
  display: grid;
  width: 100%;
  gap: 20px;
}

body.my-night-route .my-night-route-page .night-expired-page > header {
  display: grid;
  max-width: 680px;
  gap: 6px;
}

body.my-night-route .my-night-route-page .night-expired-page > header > a {
  width: max-content;
  margin-bottom: 12px;
  color: #6d4cff;
  font-size: 12px;
  font-weight: 850;
  text-decoration: none;
}

body.my-night-route .my-night-route-page .night-expired-page h1,
body.my-night-route .my-night-route-page .night-expired-page p {
  margin: 0;
}

body.my-night-route .my-night-route-page .night-expired-page .night-expired-checkouts {
  width: 100%;
  max-width: 100%;
  height: auto;
  min-height: 260px;
  max-height: none;
  padding: 16px;
  overflow: hidden;
  border: 1px solid #e5e2ee;
  border-radius: 18px;
  background: #f6f5fa;
  box-sizing: border-box;
}

body.night-mode.my-night-route .my-night-route-page .night-expired-page .night-expired-checkouts {
  border-color: #34313d;
  background: #17171b;
}

/* Full My Night card: signal, caption, venue/time and like action. */
body.my-night-route .my-night-route-page .night-card:not(.is-profile-card) .night-card-photo {
  position: relative;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  border-radius: 15px;
}

body.my-night-route .my-night-route-page .night-card:not(.is-profile-card) .night-card-overlay {
  position: absolute;
  inset: 0;
  display: block;
  padding: 12px;
  border-radius: inherit;
  background: linear-gradient(180deg, rgba(7, 5, 16, .3), transparent 38%);
  color: #fff;
}

body.my-night-route .my-night-route-page .night-card:not(.is-profile-card) .night-card-count {
  position: absolute;
  top: 12px;
  right: 12px;
  left: auto;
  display: flex;
  width: max-content;
  max-width: calc(100% - 24px);
  align-items: center;
  justify-content: center;
  gap: 5px;
  color: #fff;
  text-shadow: 0 2px 14px rgba(0, 0, 0, .9);
  transform: none;
}

body.my-night-route .my-night-route-page .night-card:not(.is-profile-card) .night-card-count strong {
  margin: 0;
  color: #fff;
  font-size: clamp(25px, 2.4vw, 32px);
  font-style: normal;
  line-height: .86;
  letter-spacing: 0;
}

body.my-night-route .my-night-route-page .night-card:not(.is-profile-card) .night-card-count i {
  color: #fff;
  font-size: clamp(14px, 1.5vw, 18px);
  font-style: normal;
  font-weight: 900;
  line-height: .9;
  letter-spacing: -.04em;
}

body.my-night-route .my-night-route-page .night-card-public-meta {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 9px 1px 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.my-night-route .my-night-route-page .night-card-public-meta .night-card-author {
  position: static;
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 7px;
  color: var(--my-night-text);
}

body.my-night-route .my-night-route-page .night-card-public-meta .night-card-author img,
body.my-night-route .my-night-route-page .night-card-public-meta .night-card-author > span {
  display: grid;
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  place-items: center;
  overflow: hidden;
  border: 1px solid var(--my-night-line);
  border-radius: 50%;
  background: var(--my-night-surface);
  font-size: 9px;
  object-fit: cover;
}

body.my-night-route .my-night-route-page .night-card-public-meta .night-card-author div {
  display: grid;
  min-width: 0;
  gap: 2px;
  text-shadow: none;
}

body.my-night-route .my-night-route-page .night-card-public-meta .night-card-author b,
body.my-night-route .my-night-route-page .night-card-public-meta .night-card-author small {
  display: block;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  color: var(--my-night-text);
  font-style: normal;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.my-night-route .my-night-route-page .night-card-public-meta .night-card-author b {
  font-size: 11px;
  font-weight: 850;
}

body.my-night-route .my-night-route-page .night-card-public-meta .night-card-author small {
  margin: 0;
  color: var(--my-night-muted);
  font-size: 9px;
  font-weight: 700;
}

body.my-night-route .my-night-route-page .night-card-public-meta .night-card-quick-actions {
  position: static;
  display: flex;
  align-items: center;
}

body.my-night-route .my-night-route-page .night-card-public-meta .night-card-quick-actions button[data-night-like] {
  color: var(--my-night-muted);
  text-shadow: none;
}

body.my-night-route .my-night-route-page .night-card-public-meta .night-card-quick-actions button[data-night-like].active {
  color: #f24b8f;
}

/* Bangkok ranking member row: rank, member identity and two scores. */


body.my-night-route .my-night-route-page .night-mine-route-panel .night-mine-panel {
  display: grid;
  width: 100%;
  max-width: none;
  min-width: 0;
  margin: 0;
  padding: 0;
}


body.my-night-route .my-night-route-page .night-mine-route-panel .night-mine-cards-title,
body.my-night-route .my-night-route-page .night-mine-route-panel .night-mine-grid {
  grid-column: 1 / -1;
  margin-right: 0;
  margin-left: 0;
}


@media (max-width: 719px) {
  body.my-night-route .night-pending-editor-root [data-night-checkout-card]:not([hidden]) {
    align-items: flex-end;
    padding: 0;
  }

  body.my-night-route .night-pending-editor-root .night-pending-editor-card {
    width: 100dvw;
    max-width: 100dvw;
    max-height: calc(100dvh - 12px);
    padding: 18px 16px max(18px, env(safe-area-inset-bottom));
    border-radius: 24px 24px 0 0;
  }

  body.my-night-route .night-pending-editor-root .night-pending-editor-close {
    margin: -4px -2px 4px auto;
  }

  body.my-night-route .my-night-route-page .night-pending-checkout > header {
    align-items: flex-start;
    flex-direction: column;
    gap: 5px;
  }

  body.my-night-route .my-night-route-page .night-plaza-rule {
    grid-template-columns: minmax(0, 1fr);
    border-radius: 18px;
  }

  body.my-night-route .my-night-route-page .night-plaza-rule > div {
    grid-template-columns: minmax(0, 1fr);
    gap: 6px;
  }

  body.my-night-route .my-night-route-page .night-plaza-rule > div > span {
    grid-template-columns: 64px minmax(0, 1fr);
    align-items: baseline;
    gap: 8px;
  }

  body.my-night-route .my-night-route-page .night-masonry {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
  }

  

  

  

  

  

  

  

  

  body.my-night-route .my-night-route-page .night-card:not(.is-profile-card) .night-card-overlay {
    padding: 10px;
  }

  body.my-night-route .my-night-route-page .night-card:not(.is-profile-card) .night-card-count {
    top: 10px;
    right: 10px;
    max-width: calc(100% - 20px);
  }

  body.my-night-route .my-night-route-page .night-card:not(.is-profile-card) .night-card-count strong {
    font-size: 24px;
  }

  body.my-night-route .my-night-route-page .night-card:not(.is-profile-card) .night-card-count i {
    font-size: 14px;
  }

  body.my-night-route .my-night-route-page .night-card-public-meta .night-card-author {
    gap: 5px;
  }

  body.my-night-route .my-night-route-page .night-card-public-meta .night-card-author b {
    font-size: 9px;
  }

  body.my-night-route .my-night-route-page .night-card-public-meta .night-card-author small {
    font-size: 8px;
  }

  body.my-night-route .my-night-route-page .night-card-public-meta {
    padding-top: 8px;
  }

  body.my-night-route .my-night-route-page {
    width: 100%;
    max-width: none;
    overflow-x: hidden;
    padding-bottom: 96px;
  }

  body.my-night-route .my-night-route-page .night-filter-pills {
    position: static;
    inset: auto;
    z-index: auto;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 4px;
    width: min(calc(100% - 28px), 420px);
    max-width: 420px;
    min-height: 0;
    margin: calc(74px + env(safe-area-inset-top)) auto 12px;
    padding: 0;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }

  body.my-night-route .my-night-route-page .night-filter-pills > button {
    min-height: 36px;
    padding-right: 8px;
    padding-left: 8px;
    font-size: 10px;
  }

  body.my-night-route .my-night-route-page > [data-my-night-content] {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0 16px calc(150px + env(safe-area-inset-bottom));
  }

  body.my-night-route .my-night-route-page .night-tab-panel,
  body.my-night-route .my-night-route-page .night-mine-panel,
  body.my-night-route .my-night-route-page .night-mine-grid {
    width: 100%;
    max-width: none;
    margin-right: 0;
    margin-left: 0;
  }

  body:not(.my-night-mine-active).my-night-route .my-night-route-page .night-checkin-fab {
    position: fixed;
    top: auto;
    right: auto;
    bottom: calc(max(16px, env(safe-area-inset-bottom)) + 66px);
    left: 50%;
    z-index: 130;
    display: grid;
    width: 54px;
    height: 54px;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #6d4cff;
    color: #fff;
    -webkit-text-fill-color: #fff;
    box-shadow: 0 14px 34px rgba(109, 76, 255, .34), 0 8px 22px rgba(0, 0, 0, .2);
    transform: translateX(-50%);
  }

  body.my-night-mine-active .my-night-route-page .night-checkin-fab {
    display: none;
  }

  body.my-night-route .my-night-route-page .night-checkin-fab img {
    display: none;
  }

  body.my-night-route .my-night-route-page .night-checkin-fab span {
    width: 100%;
    height: 100%;
    background: transparent;
    font-size: 34px;
  }

  body.my-night-route .my-night-route-page .night-mine-route-panel .night-mine-panel {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }

  body.my-night-route .my-night-route-page .night-mine-route-panel .night-deadline-nav {
    width: 100%;
    min-height: 96px;
    height: 96px;
    margin: 0 0 14px;
    padding: 9px 14px;
    gap: 3px;
    overflow: hidden;
  }

  body.my-night-route .my-night-route-page .night-mine-route-panel .night-deadline-track {
    grid-template-columns: minmax(0, 1fr);
    padding: 0 3px;
  }

  body.my-night-route .my-night-route-page .night-mine-route-panel .night-deadline-track span {
    display: none;
  }

  body.my-night-route .my-night-route-page .night-mine-route-panel .night-pending-checkout {
    grid-column: auto;
    width: 100%;
    min-height: 158px;
    margin: 0 0 18px;
    padding: 14px;
  }

  body.my-night-route .my-night-route-page .night-mine-route-panel .night-pending-checkout.night-ready-checkout {
    min-height: 112px;
    margin-bottom: 14px;
    padding: 12px 14px;
    gap: 5px;
  }

  body.my-night-route .my-night-route-page .night-ready-checkout > header {
    align-items: flex-end;
    flex-direction: row;
    gap: 10px;
  }

  body.my-night-route .my-night-route-page .night-ready-checkout .night-pending-header-side {
    width: auto;
    min-width: 0;
    flex: 0 0 auto;
    justify-items: end;
  }

  body.my-night-route .my-night-route-page .night-expired-label-full {
    display: none;
  }

  body.my-night-route .my-night-route-page .night-expired-label-compact {
    display: inline;
  }

  body.my-night-route .my-night-route-page .night-mine-route-panel .night-mine-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
  }

  body.my-night-route .my-night-route-page .night-mine-grid .night-card.is-own-card {
    border-radius: 8px;
  }

  body.my-night-route .my-night-route-page .night-mine-grid .night-card.is-own-card .night-card-photo {
    border-radius: inherit;
  }

  

  

  

  

  
}

@media (min-width: 720px) {
  body.my-night-route .my-night-route-page {
    --my-night-side-top: 96px;
    --my-night-side-tabs-height: 206px;
    --my-night-side-action-gap: 8px;
    --my-night-side-width: 112px;
    --my-night-side-left: 24px;
    --my-night-content-left: 156px;
    --my-night-content-right: 32px;
    --my-night-content-width: calc(100vw - 188px);
  }

  body.my-night-route .my-night-route-page .night-filter-pills {
    position: fixed;
    inset: var(--my-night-side-top) auto auto var(--my-night-side-left);
    z-index: 65;
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    width: var(--my-night-side-width);
    max-width: var(--my-night-side-width);
    min-height: 0;
    margin: 0;
    padding: 0;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  body.my-night-route .my-night-route-page > [data-my-night-content] {
    width: var(--my-night-content-width);
    max-width: var(--my-night-content-width);
    margin-right: var(--my-night-content-right);
    margin-left: var(--my-night-content-left);
    padding: var(--my-night-side-top) 0 30px;
  }

  body.my-night-route .my-night-route-page .night-plaza-rule {
    width: 100%;
    max-width: none;
  }

  body.my-night-route .my-night-route-page .night-checkin-fab {
    position: fixed;
    top: calc(var(--my-night-side-top) + var(--my-night-side-tabs-height) + var(--my-night-side-action-gap));
    right: auto;
    bottom: auto;
    left: var(--my-night-side-left);
    z-index: 66;
    display: flex;
    width: var(--my-night-side-width);
    height: 56px;
    align-items: center;
    justify-content: space-between;
    padding: 0 9px 0 11px;
    border: 3px solid #6d4cff;
    border-radius: 999px;
    background: #fff;
    color: #6d4cff;
    box-shadow: none;
    transform: none;
  }

  body.my-night-route .my-night-route-page .night-mine-route-panel .night-mine-panel {
    grid-template-columns: minmax(220px, 33%) minmax(0, 1fr);
    gap: 18px;
  }

  body.my-night-route .my-night-route-page .night-mine-route-panel .night-deadline-nav {
    grid-column: 1;
    min-height: 168px;
    height: 168px;
    margin: 0;
    padding: 14px 18px;
    overflow: hidden;
  }

  body.my-night-route .my-night-route-page .night-mine-route-panel .night-pending-checkout {
    grid-column: 2;
    min-height: 168px;
    height: 168px;
    margin: 0;
    padding: 13px 14px;
    overflow: hidden;
  }

  body.my-night-route .my-night-route-page .night-ready-checkout .night-ready-action {
    width:50%;
  }

  body.my-night-route .my-night-route-page .night-tab-panel[data-night-tab-panel="mine"].night-mine-route-panel .night-mine-panel > .night-pending-checkout.night-expired-checkouts {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  body.my-night-route .my-night-route-page .night-mine-route-panel .night-mine-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
  }

  

  

  

  

  
}

@media (min-width: 720px) and (max-width: 1023.98px) {
  body.my-night-route .my-night-route-page .night-tab-panel[data-night-tab-panel="mine"] .night-mine-panel {
    display: block;
  }

  body.my-night-route .my-night-route-page .night-tab-panel[data-night-tab-panel="mine"] .night-deadline-nav {
    width: 100%;
    min-height: 142px;
    height: auto;
    margin-bottom: 16px;
  }

  body.my-night-route .my-night-route-page .night-tab-panel[data-night-tab-panel="mine"] .night-pending-checkout {
    width: 100%;
    min-height: 158px;
    height: auto;
    margin-bottom: 24px;
  }

  body.my-night-route .my-night-route-page .night-tab-panel[data-night-tab-panel="mine"] .night-mine-cards-title {
    margin-bottom: 14px;
  }
}

@media (min-width: 1024px) and (max-width: 1199px) {
  body.my-night-route .my-night-route-page {
    --my-night-rail-left: 24px;
    --my-night-rail: calc(100vw - 48px);
    --my-night-side-left: 24px;
    --my-night-content-left: 156px;
    --my-night-content-right: auto;
    --my-night-content-width: calc(100vw - 180px);
  }
}

@media (min-width: 1024px) {
  body.my-night-route .my-night-route-page .night-mine-route-panel .night-deadline-nav,
  body.my-night-route .my-night-route-page .night-mine-route-panel .night-pending-checkout {
    height:168px;
    min-height:168px;
    max-height:168px;
  }

  body.my-night-route .my-night-route-page .night-mine-route-panel .night-deadline-nav {
    overflow: hidden;
  }

  body.my-night-route .my-night-route-page .night-mine-route-panel .night-pending-checkout {
    overflow: visible;
  }

}

@media (min-width: 1200px) and (max-width: 1640px) {
  body.my-night-route .my-night-route-page {
    --my-night-rail-left: 160px;
    --my-night-rail: calc(100vw - 192px);
    --my-night-side-left: 24px;
    --my-night-content-left: 160px;
    --my-night-content-right: 32px;
    --my-night-content-width: calc(100vw - 192px);
  }
}

@media (min-width: 1641px) {
  body.my-night-route .my-night-route-page {
    --my-night-rail: min(1360px, calc(100vw - 64px));
    --my-night-rail-left: calc((100vw - var(--my-night-rail)) / 2);
    --my-night-side-left: calc(var(--my-night-rail-left) - var(--my-night-side-width) - 24px);
    --my-night-content-left: var(--my-night-rail-left);
    --my-night-content-right: auto;
    --my-night-content-width: var(--my-night-rail);
  }
}

@media (min-width: 1200px) {
  body.my-night-route .my-night-route-page .night-mine-route-panel .night-mine-grid {
    gap: 14px;
  }

  

  

  

  

  
}


body.my-night-route .my-night-route-page .night-expired-page .night-pending-stack {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  height: 160px;
  min-height: 160px;
  max-height: none;
  overflow-x: auto;
  overflow-y: hidden;
  box-sizing: border-box;
}

body.my-night-route .my-night-route-page .night-expired-page .night-pending-card {
  flex: 0 0 190px;
  width: 190px;
  min-width: 190px;
  max-width: 190px;
  height: 150px;
  min-height: 150px;
  max-height: 150px;
  background-image:
    linear-gradient(180deg, rgba(13, 12, 18, .22), rgba(13, 12, 18, .12) 42%, rgba(13, 12, 18, .78)),
    var(--pending-cover);
  background-position: center;
  background-size: cover;
}

body.my-night-route .my-night-route-page .night-expired-page .night-pending-card strong,
body.my-night-route .my-night-route-page .night-expired-page .night-pending-card span {
  color: #fff;
  -webkit-text-fill-color: #fff;
}

/* Route panels must shrink with their content area; carousels scroll inside them. */


/* Keep the expired Check-ins shortcut with the unfinished-moments summary. */
body.my-night-route .my-night-route-page .night-pending-header-side {
  display: grid;
  justify-items: end;
  align-self: start;
  gap: 6px;
}

body.my-night-route .my-night-route-page .night-pending-header-side .night-expired-entry {
  justify-content: flex-end;
}

.night-tonight-hero {
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:24px;
  padding:42px 0 28px;
  border-bottom:0;
}

.night-tonight-hero small,
.night-tonight-section > header small{
  color:#00ff09;
  font-size:9px;
  font-weight:900;
  letter-spacing:.14em;
}

.night-tonight-hero h1 {
  margin:6px 0;
  font-size:clamp(38px,6vw,68px);
  line-height:.95;
}

.night-tonight-hero p { margin:0; color:var(--account-muted); }
.night-tonight-hero label { position:relative; min-width:150px; border:1px solid var(--account-border); border-radius:999px; padding:12px 34px 12px 16px; font-size:13px; font-weight:800; }
.night-tonight-hero select { position:absolute; inset:0; width:100%; opacity:0; cursor:pointer; }

.night-tonight-entry-cards,
body.day-mode .night-tonight-entry-cards,
body.night-mode .night-tonight-entry-cards{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  width:min(100%,860px);
  margin:18px 0 30px;
}

.night-tonight-entry-cards .home-entry-card,
body.day-mode .night-tonight-entry-cards .home-entry-card,
body.night-mode .night-tonight-entry-cards .home-entry-card{
  min-height:108px;
  padding:14px 16px;
  border-radius:14px;
  box-shadow:0 8px 20px rgba(0,0,0,.18);
}

.night-tonight-entry-cards .home-entry-card small{ font-size:8px; }
.night-tonight-entry-cards .home-entry-card b{ font-size:clamp(24px,3vw,34px); line-height:1; }
.night-tonight-entry-cards .home-entry-card strong{ font-size:12px; line-height:1.1; }

.night-tonight-section { padding:34px 0; border-top:0; }
.night-tonight-section > header { margin-bottom:16px; }
.night-tonight-section > header h2 { margin:5px 0 0; font-size:clamp(24px,3vw,38px); }
.night-tonight-list { overflow:hidden; border:1px solid var(--account-border); border-radius:16px; background:var(--account-raised); }
.night-tonight-list > a { display:flex; align-items:center; justify-content:space-between; gap:14px; min-height:70px; padding:13px 16px; color:var(--account-text); }
.night-tonight-list > a + a { border-top:1px solid var(--account-border); }
.night-tonight-list span { display:grid; gap:4px; }
.night-tonight-list small { color:var(--account-muted); font-size:10px; }
.night-tonight-list time,
.night-tonight-list b { color:#00ff09; font-size:12px; }
.night-tonight-more { display:inline-block; margin-top:14px; color:var(--account-text); font-size:12px; font-weight:850; }
.night-tonight-ranking .night-city-ranking-page { padding-top:0; }
.night-tonight-ranking .night-city-ranking-page > header { display:none; }
.night-tonight-guides > div { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.night-tonight-guides a { display:grid; gap:7px; color:var(--account-text); }
.night-tonight-guides a > span { aspect-ratio:4/3; border-radius:12px; background:#1d1d1d center/cover; }
.night-tonight-guides a small { color:var(--account-muted); }

body.my-night-route .my-night-route-page .night-plaza-rule .night-plaza-rule-ticker {
  display:block;
  height:22px;
  overflow:hidden;
}

body.my-night-route .my-night-route-page .night-plaza-rule .night-plaza-rule-ticker > div {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:0;
  animation:night-plaza-rule-cycle 10.5s ease-in-out infinite;
}

body.my-night-route .my-night-route-page .night-plaza-rule .night-plaza-rule-ticker span {
  display:grid;
  grid-template-columns:70px minmax(0,1fr);
  align-items:center;
  gap:8px;
  height:22px;
}

@keyframes night-plaza-rule-cycle {
  0%,27% { transform:translateY(0); }
  33%,60% { transform:translateY(-22px); }
  66%,93% { transform:translateY(-44px); }
  100% { transform:translateY(0); }
}

@media (max-width: 719px) {
  .night-tonight-hero { align-items:start; padding-top:26px; }
  .night-tonight-hero h1 { font-size:38px; }
  .night-tonight-hero label { min-width:112px; padding:10px 28px 10px 13px; }
  .night-tonight-entry-cards,
  body.day-mode .night-tonight-entry-cards,
  body.night-mode .night-tonight-entry-cards{
    grid-template-columns:none;
    grid-auto-flow:column;
    grid-auto-columns:minmax(152px,64%);
    gap:8px;
    width:100%;
    margin:14px 0 26px;
    padding:0 0 3px;
    overflow-x:auto;
    scrollbar-width:none;
  }
  .night-tonight-entry-cards::-webkit-scrollbar{ display:none; }
  .night-tonight-entry-cards .home-entry-card,
  body.day-mode .night-tonight-entry-cards .home-entry-card,
  body.night-mode .night-tonight-entry-cards .home-entry-card{
    min-height:98px;
    padding:12px 14px;
  }
  .night-tonight-guides > div { grid-template-columns:repeat(2,minmax(0,1fr)); }

  body.my-night-route .my-night-route-page .night-plaza-rule {
    gap:7px;
    padding:12px 14px;
  }

  body.my-night-route .my-night-route-page .night-plaza-rule .night-plaza-rule-ticker span {
    grid-template-columns:62px minmax(0,1fr);
    gap:6px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.my-night-route .my-night-route-page .night-plaza-rule .night-plaza-rule-ticker {
    height:auto;
  }
  body.my-night-route .my-night-route-page .night-plaza-rule .night-plaza-rule-ticker > div {
    animation:none;
  }
  body.my-night-route .my-night-route-page .night-plaza-rule .night-plaza-rule-ticker span:not(:first-child) {
    display:none;
  }
}

@media (max-width: 719px) {
  body.my-night-route .my-night-route-page .night-pending-header-side {
    width: 100%;
    justify-items: start;
  }

  body.my-night-route .my-night-route-page .night-pending-header-side .night-expired-entry {
    justify-content: flex-start;
  }
}